.mobile #gameboy-a {
    box-sizing: border-box;
}

.mobile #gameboy-b {
    box-sizing: border-box;
}

.desktop #gameboy {
    height: 100vh;
}

.desktop #gameboy-screenpad {
    height: 100%;
}

.mobile div {
    -webkit-touch-callout: none; /* iOS Safari */
      -webkit-user-select: none; /* Safari */
       -khtml-user-select: none; /* Konqueror HTML */
         -moz-user-select: none; /* Old versions of Firefox */
          -ms-user-select: none; /* Internet Explorer/Edge */
              user-select: none; /* Non-prefixed version, currently
                                    supported by Chrome, Edge, Opera and Firefox */
}

/*
@media only screen and (max-width: 592px) {
    .mobile #gameboy {
        touch-action: none;
        background: rgba(136, 192, 112, 255);
        width: 296px;
        height: 464px;
        position: relative;
        border: 4px solid black;
        border-radius: 8px 8px 60px 8px;
        box-sizing: border-box;
        margin: 0 auto;
        padding: 24px;
    }

    .mobile #gameboy-screenpad {
        background: rgba(52, 104, 86, 255);
        border-radius: 4px 4px 28px 4px;
        width: 160px;
        height: 144px;
        margin: 0 auto;
        padding: 24px 44px;
        margin-bottom: 76px;
    }

    .mobile #gameboy-controls {
        position: relative;
        width: 100%;
        height: 108px;
        left: 0;
        top: 0;
    }

    .mobile #gameboy-dpad {
        width: 60px;
        height: 60px;
        position: absolute;
        top: 0;
        left: 0;
    }

    .mobile #gameboy-left {
        position: absolute;
        width: 24px;
        height: 20px;
        top: 20px;
        left: 0;
        background-color: rgba(8, 24, 32, 255);
    }

    .mobile #gameboy-right {
        position: absolute;
        width: 24px;
        height: 20px;
        top: 20px;
        right: 0;
        background-color: rgba(8, 24, 32, 255);
    }

    .mobile #gameboy-up {
        position: absolute;
        width: 20px;
        height: 24px;
        left: 20px;
        top: 0;
        background-color: rgba(8, 24, 32, 255);
    }

    .mobile #gameboy-down {
        position: absolute;
        width: 20px;
        height: 24px;
        left: 20px;
        bottom: 0;
        background-color: rgba(8, 24, 32, 255);
    }

    .mobile #gameboy-a {
        font-family: 'VT323';
        font-size: 24px;
        line-height: 1.2;
        width: 30px;
        height: 30px;
        position: absolute;
        top: 0;
        right: 0;
        background-color: rgba(8, 24, 32, 255);
        color: rgba(224, 248, 208, 255);
        border-radius: 15px;
    }

    .mobile #gameboy-b {
        font-family: 'VT323';
        font-size: 24px;
        line-height: 1.2;
        width: 30px;
        height: 30px;
        position: absolute;
        top: 20px;
        right: 44px;
        background-color: rgba(8, 24, 32, 255);
        color: rgba(224, 248, 208, 255);
        border-radius: 15px;
    }

    .mobile #gameboy-start {
        position: absolute;
        bottom: 0;
        left: 74px;
        height: 12px;
        width: 40px;
        background-color: rgba(8, 24, 32, 255);
        border-radius: 10px;
        transform: rotate(-45deg);
        -webkit-transform: rotate(-45deg);
    }

    .mobile #gameboy-select {
        position: absolute;
        bottom: 0;
        left: 124px;
        height: 12px;
        width: 40px;
        background-color: rgba(8, 24, 32, 255);
        border-radius: 10px;
        transform: rotate(-45deg);
        -webkit-transform: rotate(-45deg);
    }
}

@media only screen and (max-width: 1184px) {
    .mobile #gameboy {
        touch-action: none;
        background: rgba(136, 192, 112, 255);
        width: 592px;
        height: 928px;
        position: relative;
        border: 8px solid black;
        border-radius: 16px 16px 120px 16px;
        box-sizing: border-box;
        margin: 0 auto;
        padding: 48px;
    }

    .mobile #gameboy-screenpad {
        background: rgba(52, 104, 86, 255);
        border-radius: 8px 8px 56px 8px;
        width: 320px;
        height: 288px;
        margin: 0 auto;
        padding: 48px 88px;
        margin-bottom: 152px;
    }

    .mobile #gameboy-controls {
        position: relative;
        width: 100%;
        height: 216px;
        left: 0;
        top: 0;
    }

    .mobile #gameboy-dpad {
        width: 120px;
        height: 120px;
        position: absolute;
        top: 0;
        left: 0;
    }

    .mobile #gameboy-left {
        position: absolute;
        width: 48px;
        height: 40px;
        top: 40px;
        left: 0;
        background-color: rgba(8, 24, 32, 255);
    }

    .mobile #gameboy-right {
        position: absolute;
        width: 48px;
        height: 40px;
        top: 40px;
        right: 0;
        background-color: rgba(8, 24, 32, 255);
    }

    .mobile #gameboy-up {
        position: absolute;
        width: 40px;
        height: 48px;
        left: 40px;
        top: 0;
        background-color: rgba(8, 24, 32, 255);
    }

    .mobile #gameboy-down {
        position: absolute;
        width: 40px;
        height: 48px;
        left: 40px;
        bottom: 0;
        background-color: rgba(8, 24, 32, 255);
    }

    .mobile #gameboy-a {
        font-family: 'VT323';
        font-size: 48px;
        line-height: 1.2;
        width: 60px;
        height: 60px;
        position: absolute;
        top: 0;
        right: 0;
        background-color: rgba(8, 24, 32, 255);
        color: rgba(224, 248, 208, 255);
        border-radius: 30px;
    }

    .mobile #gameboy-b {
        font-family: 'VT323';
        font-size: 48px;
        line-height: 1.2;
        width: 60px;
        height: 60px;
        position: absolute;
        top: 40px;
        right: 88px;
        background-color: rgba(8, 24, 32, 255);
        color: rgba(224, 248, 208, 255);
        border-radius: 30px;
    }

    .mobile #gameboy-start {
        position: absolute;
        bottom: 0;
        left: 148px;
        height: 24px;
        width: 80px;
        background-color: rgba(8, 24, 32, 255);
        border-radius: 10px;
        transform: rotate(-45deg);
        -webkit-transform: rotate(-45deg);
    }

    .mobile #gameboy-select {
        position: absolute;
        bottom: 0;
        left: 248px;
        height: 24px;
        width: 80px;
        background-color: rgba(8, 24, 32, 255);
        border-radius: 10px;
        transform: rotate(-45deg);
        -webkit-transform: rotate(-45deg);
    }
}
*/

@media only screen and (max-width: 1776px) {
    .mobile #gameboy {
        touch-action: none;
        background: rgba(136, 192, 112, 255);
        width: 888px;
        height: 1392px;
        position: relative;
        border: 12px solid black;
        border-radius: 24px 24px 180px 24px;
        box-sizing: border-box;
        margin: 0 auto;
        padding: 72px;
    }

    .mobile #gameboy-screenpad {
        background: rgba(52, 104, 86, 255);
        border-radius: 12px 12px 84px 12px;
        width: 450px;
        height: 402px;
        margin: 0 auto;
        padding: 72px 132px;
        margin-bottom: 228px;
    }

    .mobile #gameboy-controls {
        position: relative;
        width: 100%;
        height: 324px;
        left: 0;
        top: 0;
    }

    .mobile #gameboy-dpad {
        width: 212px;
        height: 212px;
        position: absolute;
        top: 0;
        left: 0;
    }

    .mobile #gameboy-left {
        padding: 8px;
        position: absolute;
        width: 84px;
        height: 76px;
        top: 68px;
        left: 0;
        border: none;
        background: none;
    }

    .mobile #gameboy-right {
        padding: 8px;
        position: absolute;
        width: 84px;
        height: 76px;
        top: 68px;
        right: 0;
        border: none;
        background: none;
    }

    .mobile #gameboy-up {
        padding: 8px;
        position: absolute;
        width: 76px;
        height: 84px;
        left: 68px;
        top: 0;
        border: none;
        background: none;
    }

    .mobile #gameboy-down {
        padding: 8px;
        position: absolute;
        width: 76px;
        height: 84px;
        left: 68px;
        bottom: 0;
        border: none;
        background: none;
    }

    .mobile #gameboy-left .inner {
        width: 100%;
        height: 100%;
        background-color: rgba(8, 24, 32, 255);
        border-width: 5px;
        border-color: rgba(8, 24, 32, 255);
        border-style: solid;
        box-sizing: border-box;
    }

    .mobile #gameboy-right .inner {
        width: 100%;
        height: 100%;
        background-color: rgba(8, 24, 32, 255);
        border-width: 5px;
        border-color: rgba(8, 24, 32, 255);
        border-style: solid;
        box-sizing: border-box;
    }

    .mobile #gameboy-up .inner {
        width: 100%;
        height: 100%;
        background-color: rgba(8, 24, 32, 255);
        border-width: 5px;
        border-color: rgba(8, 24, 32, 255);
        border-style: solid;
        box-sizing: border-box;
    }

    .mobile #gameboy-down .inner {
        width: 100%;
        height: 100%;
        background-color: rgba(8, 24, 32, 255);
        border-width: 5px;
        border-color: rgba(8, 24, 32, 255);
        border-style: solid;
        box-sizing: border-box;
    }

    .mobile #gameboy-a {
        width: 120px;
        height: 120px;
        padding: 15px;
        position: absolute;
        top: -15px;
        right: -15px;
        border: none;
        background: none;
        box-sizing: border-box;
    }

    .mobile #gameboy-a .inner {
        font-family: 'VT323';
        font-size: 72px;
        line-height: 1;
        width: 90px;
        height: 90px;
        background-color: rgba(8, 24, 32, 255);
        color: rgba(224, 248, 208, 255);
        border-radius: 45px;
        border-width: 5px;
        border-color: rgba(8, 24, 32, 255);
        border-style: solid;
        box-sizing: border-box;
    }

    .mobile #gameboy-b {
        width: 120px;
        height: 120px;
        padding: 15px;
        position: absolute;
        top: 45px;
        right: 117px;
        border: none;
        background: none;
        box-sizing: border-box;
    }

    .mobile #gameboy-b .inner {
        font-family: 'VT323';
        font-size: 72px;
        line-height: 1;
        width: 90px;
        height: 90px;
        background-color: rgba(8, 24, 32, 255);
        color: rgba(224, 248, 208, 255);
        border-radius: 45px;
        border-width: 5px;
        border-color: rgba(8, 24, 32, 255);
        border-style: solid;
        box-sizing: border-box;
    }

    .mobile #gameboy-start {
        position: absolute;
        bottom: 0;
        left: 224px;
        height: 36px;
        width: 120px;
        background-color: rgba(8, 24, 32, 255);
        border-radius: 30px;
        transform: rotate(-45deg);
        -webkit-transform: rotate(-45deg);
    }

    .mobile #gameboy-select {
        position: absolute;
        bottom: 0;
        left: 372px;
        height: 36px;
        width: 120px;
        background-color: rgba(8, 24, 32, 255);
        border-radius: 30px;
        transform: rotate(-45deg);
        -webkit-transform: rotate(-45deg);
    }
}

.desktop #gameboy {
    touch-action: none;
    width: 100%;
    height: 100%;
}
.desktop #gameboy-screenpad {
    width: 100%;
    height: 100%;
}
.desktop #gameboy-controls { display: none; }
.desktop #gameboy-dpad { display: none; }
.desktop #gameboy-left { display: none; }
.desktop #gameboy-right { display: none; }
.desktop #gameboy-up { display: none; }
.desktop #gameboy-down { display: none; }
.desktop #gameboy-a { display: none; }
.desktop #gameboy-b { display: none; }
.desktop #gameboy-start { display: none; }
.desktop #gameboy-select { display: none; }