html {
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
    position: fixed;
    overflow: hidden;
}
body {
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
    position: fixed;
    overflow: hidden;
    font-family: 'Space Mono';
    font-size: 1.7vw;
}
.cobaltjs-game-container.cobaltjs-portrait {
    font-size: 3vw;
}
.cobaltjs-game-container {
    position: relative;
    height: 100vh;
    width: 100vw;
    box-sizing: border-box;
    border: 2px solid black;
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
    background-color: darkgray;
    -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
    -moz-user-select: none; /* Firefox */
    -ms-user-select: none; /* IE / Edge */
    user-select: none;
    touch-action: pan-y;
    -ms-touch-action: pan-y;
}
.cobaltjs-game-dpad {
    position: absolute;
    top: 0px;
    left: 0px;
    width: calc(22.5% - 10px);
    height: calc(100% - 10px);
    box-sizing: border-box;
    border: 2px solid black;
    margin: 5px 5px 5px 5px;
    padding: 0px 0px 0px 0px;
}
.cobaltjs-game-container.cobaltjs-portrait .cobaltjs-game-dpad {
    top: 78.4727vw;
    width: calc(50% - 2vw);
    height: calc(100vh - 71vw);
}
.cobaltjs-game-button-container {
    position: absolute;
    top: 0px;
    right: 0px;
    width: calc(22.5% - 15px);
    height: calc(100% - 10px);
    box-sizing: border-box;
    border: 2px solid black;
    margin: 5px 5px 5px 5px;
    padding: 0px 0px 0px 0px;
}
.cobaltjs-game-container.cobaltjs-portrait .cobaltjs-game-button-container {
    top: 78.4727vw;
    width: calc(50% - 10px);
    height: calc(100vh - 71vw);
}
.cobaltjs-game-board {
    position: absolute;
    top: calc(50vh - 15.90625vw);
    left: 22.5vw;
    height: 37.8125vw;
    width: 55vw;
    box-sizing: border-box;
    border: 2px solid black;
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
    background-color: #FCD7A3;
    background-repeat: no-repeat;
    background-size: cover;
    overflow: hidden;
}
.cobaltjs-game-container.cobaltjs-portrait .cobaltjs-game-board {
    top: calc(12.4727vw - 2px);
    left: calc(2vw - 2px);
    width: 96vw;
    height: 66vw;
}
.cobaltjs-game-info-bar {
    position: absolute;
    top: calc(50vh - 21.90625vw);
    left: 22.5vw;
    height: 6vw;
    width: 55vw;
    box-sizing: border-box;
    border: 2px solid black;
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
    background-color: #000000;
}
.cobaltjs-game-container.cobaltjs-portrait .cobaltjs-game-info-bar {
    top: calc(2vw - 2px);
    left: calc(2vw - 2px);
    width: 96vw;
    height: 10.4727vw;
}
.cobaltjs-game-fullscreen-overlay {
    position: absolute;
    top: calc(50vh - 21.90625vw);
    left: 22.5vw;
    height: 43.8125vw;
    width: 55vw;
    box-sizing: border-box;
    border: 2px solid black;
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
    background-color: #000000;
    z-index: 5;
}
.cobaltjs-game-container.cobaltjs-portrait .cobaltjs-game-fullscreen-overlay {
    top: calc(2vw - 2px);
    left: calc(2vw - 2px);
    width: 96vw;
    height: 76.4727vw;
}

.cobaltjs-pos-1-3-x {
    background-position-x: 0%;
}
.cobaltjs-pos-2-3-x {
    background-position-x: 50%;
}
.cobaltjs-pos-3-3-x {
    background-position-x: 100%;
}

.cobaltjs-pos-1-4 {
    background-position-y: 0%;
}
.cobaltjs-pos-2-4 {
    background-position-y: 33.3333%;
}
.cobaltjs-pos-3-4 {
    background-position-y: 66.6667%;
}
.cobaltjs-pos-4-4 {
    background-position-y: 101%;
}

.cobaltjs-pos-1-4-x {
    background-position-x: 0%;
}
.cobaltjs-pos-2-4-x {
    background-position-x: 33.3333%;
}
.cobaltjs-pos-3-4-x {
    background-position-x: 66.6667%;
}
.cobaltjs-pos-4-4-x {
    background-position-x: 100%;
}

.cobaltjs-pos-1-5-x {
    background-position-x: 0%;
}
.cobaltjs-pos-2-5-x {
    background-position-x: 25%;
}
.cobaltjs-pos-3-5-x {
    background-position-x: 50%;
}
.cobaltjs-pos-4-5-x {
    background-position-x: 75%;
}
.cobaltjs-pos-5-5-x {
    background-position-x: 100%;
}

.cobaltjs-pos-1-5-y {
    background-position-y: 0%;
}
.cobaltjs-pos-2-5-y {
    background-position-y: 25%;
}
.cobaltjs-pos-3-5-y {
    background-position-y: 50%;
}
.cobaltjs-pos-4-5-y {
    background-position-y: 75%;
}
.cobaltjs-pos-5-5-y {
    background-position-y: 100%;
}

.cobaltjs-pos-1-6-y {
    background-position-y: 0%;
}
.cobaltjs-pos-2-6-y {
    background-position-y: 20%;
}
.cobaltjs-pos-3-6-y {
    background-position-y: 40%;
}
.cobaltjs-pos-4-6-y {
    background-position-y: 60%;
}
.cobaltjs-pos-5-6-y {
    background-position-y: 80%;
}
.cobaltjs-pos-6-6-y {
    background-position-y: 100%;
}

.cobaltjs-pos-1-8, .cobaltjs-pos-1-8-y {
    background-position-y: 0%;
}
.cobaltjs-pos-2-8, .cobaltjs-pos-2-8-y {
    background-position-y: 14.2857%;
}
.cobaltjs-pos-3-8, .cobaltjs-pos-3-8-y {
    background-position-y: 28.5714%;
}
.cobaltjs-pos-4-8, .cobaltjs-pos-4-8-y {
    background-position-y: 42.8571%;
}
.cobaltjs-pos-5-8, .cobaltjs-pos-5-8-y {
    background-position-y: 57.1429%;
}
.cobaltjs-pos-6-8, .cobaltjs-pos-6-8-y {
    background-position-y: 71.4286%;
}
.cobaltjs-pos-7-8, .cobaltjs-pos-7-8-y {
    background-position-y: 85.7143%;
}
.cobaltjs-pos-8-8, .cobaltjs-pos-8-8-y {
    background-position-y: 100%;
}

.cobaltjs-pos-1-8-x {
    background-position-x: 0%;
}
.cobaltjs-pos-2-8-x {
    background-position-x: 14.2%;
}
.cobaltjs-pos-3-8-x {
    background-position-x: 28.3%;
}
.cobaltjs-pos-4-8-x {
    background-position-x: 42.6%;
}
.cobaltjs-pos-5-8-x {
    background-position-x: 57.14%;
}
.cobaltjs-pos-6-8-x {
    background-position-x: 71.35%;
}
.cobaltjs-pos-7-8-x {
    background-position-x: 85.6%;
}
.cobaltjs-pos-8-8-x {
    background-position-x: 99.87%;
}

.cobaltjs-pos-1-10-x {
    background-position-x: 0%;
}
.cobaltjs-pos-2-10-x {
    background-position-x: 11.1111%;
}
.cobaltjs-pos-3-10-x {
    background-position-x: 22.2222%;
}
.cobaltjs-pos-4-10-x {
    background-position-x: 33.3333%;
}
.cobaltjs-pos-5-10-x {
    background-position-x: 44.4444%;
}
.cobaltjs-pos-6-10-x {
    background-position-x: 55.5556%;
}
.cobaltjs-pos-7-10-x {
    background-position-x: 66.6667%;
}
.cobaltjs-pos-8-10-x {
    background-position-x: 77.7778%;
}
.cobaltjs-pos-9-10-x {
    background-position-x: 88.8889%;
}
.cobaltjs-pos-10-10-x {
    background-position-x: 100%;
}

.cobaltjs-pos-1-14-x {
    background-position-x: 0%;
}
.cobaltjs-pos-2-14-x {
    background-position-x: 7.6923%;
}
.cobaltjs-pos-3-14-x {
    background-position-x: 15.3846%;
}
.cobaltjs-pos-4-14-x {
    background-position-x: 23.0769%;
}
.cobaltjs-pos-5-14-x {
    background-position-x: 30.7692%;
}
.cobaltjs-pos-6-14-x {
    background-position-x: 38.4615%;
}
.cobaltjs-pos-7-14-x {
    background-position-x: 46.1538%;
}
.cobaltjs-pos-8-14-x {
    background-position-x: 53.8462%;
}
.cobaltjs-pos-9-14-x {
    background-position-x: 61.5385%;
}
.cobaltjs-pos-10-14-x {
    background-position-x: 69.2308%;
}
.cobaltjs-pos-11-14-x {
    background-position-x: 76.9231%;
}
.cobaltjs-pos-12-14-x {
    background-position-x: 84.6154%;
}
.cobaltjs-pos-13-14-x {
    background-position-x: 92.3077%;
}
.cobaltjs-pos-14-14-x {
    background-position-x: 100%;
}

.cobaltjs-pos-1-16 {
    background-position-x: 0%;
    background-position-y: 0%;
}
.cobaltjs-pos-2-16 {
    background-position-x: 33.3333%;
    background-position-y: 0%;
}
.cobaltjs-pos-3-16 {
    background-position-x: 66.6667%;
    background-position-y: 0%;
}
.cobaltjs-pos-4-16 {
    background-position-x: 100%;
    background-position-y: 0%;
}
.cobaltjs-pos-5-16 {
    background-position-x: 0%;
    background-position-y: 33.3333%;
}
.cobaltjs-pos-6-16 {
    background-position-x: 33.3333%;
    background-position-y: 33.3333%;
}
.cobaltjs-pos-7-16 {
    background-position-x: 66.6667%;
    background-position-y: 33.3333%;
}
.cobaltjs-pos-8-16 {
    background-position-x: 100%;
    background-position-y: 33.3333%;
}
.cobaltjs-pos-9-16 {
    background-position-x: 0%;
    background-position-y: 66.6667%;
}
.cobaltjs-pos-10-16 {
    background-position-x: 33.3333%;
    background-position-y: 66.6667%;
}
.cobaltjs-pos-11-16 {
    background-position-x: 66.6667%;
    background-position-y: 66.6667%;
}
.cobaltjs-pos-12-16 {
    background-position-x: 100%;
    background-position-y: 66.6667%;
}
.cobaltjs-pos-13-16 {
    background-position-x: 0%;
    background-position-y: 100%;
}
.cobaltjs-pos-14-16 {
    background-position-x: 33.3333%;
    background-position-y: 100%;
}
.cobaltjs-pos-15-16 {
    background-position-x: 66.6667%;
    background-position-y: 100%;
}
.cobaltjs-pos-16-16 {
    background-position-x: 100%;
    background-position-y: 100%;
}

.cobaltjs-pos-1-16-y {
    background-position-y: 0%;
}
.cobaltjs-pos-2-16-y {
    background-position-y: 6.6667%;
}
.cobaltjs-pos-3-16-y {
    background-position-y: 13.3333%;
}
.cobaltjs-pos-4-16-y {
    background-position-y: 20%;
}
.cobaltjs-pos-5-16-y {
    background-position-y: 26.6667%;
}
.cobaltjs-pos-6-16-y {
    background-position-y: 33.3333%;
}
.cobaltjs-pos-7-16-y {
    background-position-y: 40%;
}
.cobaltjs-pos-8-16-y {
    background-position-y: 46.6667%;
}
.cobaltjs-pos-9-16-y {
    background-position-y: 53.3333%;
}
.cobaltjs-pos-10-16-y {
    background-position-y: 60%;
}
.cobaltjs-pos-11-16-y {
    background-position-y: 66.6667%;
}
.cobaltjs-pos-12-16-y {
    background-position-y: 73.3333%;
}
.cobaltjs-pos-13-16-y {
    background-position-y: 80%;
}
.cobaltjs-pos-14-16-y {
    background-position-y: 86.6667%;
}
.cobaltjs-pos-15-16-y {
    background-position-y: 93.3333%;
}
.cobaltjs-pos-16-16-y {
    background-position-y: 100%;
}

.cobaltjs-pos-1-24-y {
    background-position-y: 0%;
}
.cobaltjs-pos-2-24-y {
    background-position-y: 4.3478%;
}
.cobaltjs-pos-3-24-y {
    background-position-y: 8.6957%;
}
.cobaltjs-pos-4-24-y {
    background-position-y: 13.0434%;
}
.cobaltjs-pos-5-24-y {
    background-position-y: 17.3913%;
}
.cobaltjs-pos-6-24-y {
    background-position-y: 21.7391%;
}
.cobaltjs-pos-7-24-y {
    background-position-y: 26.0870%;
}
.cobaltjs-pos-8-24-y {
    background-position-y: 30.4348%;
}
.cobaltjs-pos-9-24-y {
    background-position-y: 34.7826%;
}
.cobaltjs-pos-10-24-y {
    background-position-y: 39.1304%;
}
.cobaltjs-pos-11-24-y {
    background-position-y: 43.4783%;
}
.cobaltjs-pos-12-24-y {
    background-position-y: 47.8261%;
}
.cobaltjs-pos-13-24-y {
    background-position-y: 52.1739%;
}
.cobaltjs-pos-14-24-y {
    background-position-y: 56.5217%;
}
.cobaltjs-pos-15-24-y {
    background-position-y: 60.8696%;
}
.cobaltjs-pos-16-24-y {
    background-position-y: 65.2174%;
}
.cobaltjs-pos-17-24-y {
    background-position-y: 69.5652%;
}
.cobaltjs-pos-18-24-y {
    background-position-y: 73.9130%;
}
.cobaltjs-pos-19-24-y {
    background-position-y: 78.2609%;
}
.cobaltjs-pos-20-24-y {
    background-position-y: 82.6087%;
}
.cobaltjs-pos-21-24-y {
    background-position-y: 86.9565%;
}
.cobaltjs-pos-22-24-y {
    background-position-y: 91.3043%;
}
.cobaltjs-pos-23-24-y {
    background-position-y: 95.6522%;
}
.cobaltjs-pos-24-24-y {
    background-position-y: 100%;
}

.cobaltjs-pos-1-32 {
    background-position-y: 0%;
}
.cobaltjs-pos-2-32 {
    background-position-y: 3.2258%;
}
.cobaltjs-pos-3-32 {
    background-position-y: 6.4516%;
}
.cobaltjs-pos-4-32 {
    background-position-y: 9.6774%;
}
.cobaltjs-pos-5-32 {
    background-position-y: 12.9032%;
}
.cobaltjs-pos-6-32 {
    background-position-y: 16.1290%;
}
.cobaltjs-pos-7-32 {
    background-position-y: 19.3548%;
}
.cobaltjs-pos-8-32 {
    background-position-y: 22.5806%;
}
.cobaltjs-pos-9-32 {
    background-position-y: 25.8065%;
}
.cobaltjs-pos-10-32 {
    background-position-y: 29.0323%;
}
.cobaltjs-pos-11-32 {
    background-position-y: 32.2581%;
}
.cobaltjs-pos-12-32 {
    background-position-y: 35.4839%;
}
.cobaltjs-pos-13-32 {
    background-position-y: 38.7097%;
}
.cobaltjs-pos-14-32 {
    background-position-y: 41.9355%;
}
.cobaltjs-pos-15-32 {
    background-position-y: 45.1613%;
}
.cobaltjs-pos-16-32 {
    background-position-y: 48.3871%;
}
.cobaltjs-pos-17-32 {
    background-position-y: 51.6129%;
}
.cobaltjs-pos-18-32 {
    background-position-y: 54.8387%;
}
.cobaltjs-pos-19-32 {
    background-position-y: 58.0645%;
}
.cobaltjs-pos-20-32 {
    background-position-y: 61.2903%;
}
.cobaltjs-pos-21-32 {
    background-position-y: 64.5161%;
}
.cobaltjs-pos-22-32 {
    background-position-y: 67.7419%;
}
.cobaltjs-pos-23-32 {
    background-position-y: 70.9677%;
}
.cobaltjs-pos-24-32 {
    background-position-y: 74.1935%;
}
.cobaltjs-pos-25-32 {
    background-position-y: 77.4194%;
}
.cobaltjs-pos-26-32 {
    background-position-y: 80.6452%;
}
.cobaltjs-pos-27-32 {
    background-position-y: 83.8710%;
}
.cobaltjs-pos-28-32 {
    background-position-y: 87.0968%;
}
.cobaltjs-pos-29-32 {
    background-position-y: 90.3226%;
}
.cobaltjs-pos-30-32 {
    background-position-y: 93.5484%;
}
.cobaltjs-pos-31-32 {
    background-position-y: 96.7742%;
}
.cobaltjs-pos-32-32 {
    background-position-y: 100%;
}



.cobaltjs-game-controller {
    position: relative;
    width: calc(100% - 10px);
    height: calc(40% - 20px);
    box-sizing: border-box;
    border: 2px solid black;
    margin: 5px 5px 5px 5px;
    padding: 0px 0px 0px 0px;
}
.cobaltjs-game-button {
    position: absolute;
    width: 6vw;
    height: 6vw;
    box-sizing: border-box;
    border: 2px solid black;
    background-color: #555;
    background-repeat: no-repeat;
    background-size: contain;
}
.cobaltjs-game-container.cobaltjs-portrait .cobaltjs-game-button {
    width: 6vh;
    height: 6vh;
}

.cobaltjs-game-button span {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.cobaltjs-game-button-pressed {
    background-color: green;
}

.cobaltjs-game-button-disabled, .cobaltjs-game-button-disabled.cobaltjs-game-button-pressed {
    border-color: #888;
    background-color: #aaa;
}

/* Up and O */
.cobaltjs-game-button-up, .cobaltjs-game-button-d {
    top: calc(50% - 9.25vw);
    left: calc(50% - 3vw);
}
.cobaltjs-game-button-up {
    background-image: url(../img/up.png);
    border: 0px none;
}
.cobaltjs-game-container.cobaltjs-portrait .cobaltjs-game-button-up,
.cobaltjs-game-container.cobaltjs-portrait .cobaltjs-game-button-d {
    top : calc(50% - 9.25vh);
    left: calc(50% - 3vh);
}

/* Right and L */
.cobaltjs-game-button-right, .cobaltjs-game-button-b {
    top: calc(50% - 3vw);
    left: calc(50% + 3.25vw);
}
.cobaltjs-game-button-right {
    background-image: url(../img/right.png);
    border: 0px none;
}
.cobaltjs-game-container.cobaltjs-portrait .cobaltjs-game-button-right,
.cobaltjs-game-container.cobaltjs-portrait .cobaltjs-game-button-b {
    top: calc(50% - 3vh);
    left: calc(50% + 3.25vh);
}

/* Down and K */
.cobaltjs-game-button-down, .cobaltjs-game-button-a {
    top: calc(50% + 3.25vw);
    left: calc(50% - 3vw);
}
.cobaltjs-game-button-down {
    background-image: url(../img/down.png);
    border: 0px none;
}
.cobaltjs-game-container.cobaltjs-portrait .cobaltjs-game-button-down,
.cobaltjs-game-container.cobaltjs-portrait .cobaltjs-game-button-a {
    top: calc(50% + 3.25vh);
    left: calc(50% - 3vh);
}

/* Left and I */
.cobaltjs-game-button-left, .cobaltjs-game-button-c {
    top: calc(50% - 3vw);
    left: calc(50% - 9.25vw);
}
.cobaltjs-game-button-left {
    background-image: url(../img/left.png);
    border: 0px none;
}
.cobaltjs-game-container.cobaltjs-portrait .cobaltjs-game-button-left,
.cobaltjs-game-container.cobaltjs-portrait .cobaltjs-game-button-c {
    top: calc(50% - 3vh);
    left: calc(50% - 9.25vh);
}

.cobaltjs-game-button-fullscreen {
    top: 1%;
    right: 1%;
    background-image: url(../img/enterFullscreen.png);
    border: 0px none;
    background-color: transparent;
    width: 3vw;
    height: 3vw;
}
.cobaltjs-game-container.cobaltjs-portrait .cobaltjs-game-button-fullscreen {
    width: 3vh;
    height: 3vh;
}
.cobaltjs-game-button-fullscreen.cobaltjs-fullscreen {
    background-image: url(../img/exitFullscreen.png);
}

.cobaltjs-game-button-select, .cobaltjs-game-button-start {
    top: 1vw;
    height: 3vw;
    width: 9vw;
}
.cobaltjs-game-container.cobaltjs-portrait .cobaltjs-game-button-select,
.cobaltjs-game-container.cobaltjs-portrait .cobaltjs-game-button-start {
    top: 1vh;
    height: 3vh;
    width: 9vh;
}
.cobaltjs-game-button-select {
    left: auto;
    right: 1vw;
}
.cobaltjs-game-container.cobaltjs-portrait .cobaltjs-game-button-select {
    right: 1vh;
}
.cobaltjs-game-button-start {
    left: 1vw;
    right: auto;
}
.cobaltjs-game-container.cobaltjs-portrait .cobaltjs-game-button-start {
    left: 1vh;
}

.cobaltjs-game-menu {
    height: calc(100% - 6vw);
    width: calc(100% - 6vw);
    position: absolute;
    top: 0px;
    left: 0px;
    background-color: lavender;
    color: black;
    text-align: center;
    padding: 3vw;
    opacity: 0.9;
    font-size: 1.7vw;
    z-index: 10;
}
.cobaltjs-game-container.cobaltjs-portrait .cobaltjs-game-menu {
    height: calc(100% - 6vw);
    width: calc(100% - 6vw);
    padding: 3vw;
    font-size: 3.4vw;
}
.cobaltjs-game-board h1 {
    margin-bottom: 0px;
}
.cobaltjs-game-board a {
    box-sizing: border-box;
    border: 0.6vw solid transparent;
    margin: 0.1vw;
    display: inline-block;
    padding: 0.2vw 2vw 0.2vw 2vw;
    text-decoration: none;
}
.cobaltjs-game-container.cobaltjs-portrait .cobaltjs-game-board a {
    margin: 0.15vw;
    padding: 0.3vw 3vw 0.3vw 3vw;
}
.cobaltjs-game-board a.cobaltjs-game-menu-selected {
    border-color: green;
}
.cobaltjs-game-menu h1 {
    margin-top: 0px;
}