body {
            background-color: #f7f7f7;
            font-family: 'Quattrocento Sans', sans-serif;
            /*overflow-x: hidden;*/
        }
        header {
            padding-top: 1em;
            text-align: center;
            max-width: 800px;
            margin: auto
        }

        header p {
            line-height: 1.75em;
            font-size: 1em;
            padding: 0 0.8em;
        }
        header p a {
            text-decoration: underline !important
        }
        #hint {
            position: relative;
            top: 0;
            display: none
        }
        #hintc {
            width: 300px
        }
        .icon {
            -webkit-user-select: none;
            user-select: none;
            display: inline-block;
        }
        .icon-offline {
            content: -webkit-image-set(url(../img/100-error-offline.png) 1x, url(../img/200-error-offline.png) 2x);
            position: relative;
        }
        .hidden {
            display: none;
        }
        #offline-resources {
            display: none
        }
        .interstitial-wrapper {
            color: #2b2b2b;
            font-size: 1em;
            line-height: 1.55;
            margin: 0 auto;
            max-width: 600px;
            padding-top: 100px;
            width: 100%
        }
        .runner-container {
            direction: ltr;
            height: 150px;
            max-width: 600px;
            overflow: hidden;
            position: absolute;
            top: 220px;
            width: 44px
        }
        .runner-canvas {
            height: 150px;
            max-width: 600px;
            opacity: 1;
            overflow: hidden;
            position: absolute;
            top: 0;
            z-index: 2
        }
        .controller {
            background: rgba(247, 247, 247, .1);
            height: 70vh;
            left: 0;
            position: absolute;
            bottom: 0;
            width: 100vw;
        }
        
        #offline-resources {
            display: none
        }
        @media (max-height:350px) {
            .interstitial-wrapper {
                margin-top: 5%
            }
        }
        @media (min-width:420px) and (max-width:736px) and (min-height:240px) and (max-height:420px) and (orientation:landscape) {
            .ep-sidetools {
                top: 20%
            }
            .interstitial-wrapper {
                margin-bottom: 100px
            }
        }
        @media (max-width:360px) and (max-height:480px) {
            .ep-sidetools {
                top: 75%
            }
            .interstitial-wrapper {
                padding-top: 60px
            }
            .runner-container {
                top: 8px
            }
        }
        @media (min-height:240px) and (orientation:landscape) {
            .interstitial-wrapper {
                margin-bottom: 90px
            }
        }
        @media (max-height:320px) and (orientation:landscape) {
            .runner-container {
                top: 10px
            }
        }
        @media (max-width:240px) {
            .interstitial-wrapper {
                overflow: inherit;
                padding: 0 8px
            }
        }
        .arcade-mode,
        .arcade-mode .runner-container,
        .arcade-mode .runner-canvas {
            image-rendering: pixelated;
            max-width: 100%;
            overflow: hidden;
        }
        .arcade-mode #buttons,
        .arcade-mode #main-content {
            opacity: 0;
            overflow: hidden;
        }
        .arcade-mode .interstitial-wrapper {
            height: 100vh;
            max-width: 100%;
            overflow: hidden;
        }
        .arcade-mode .runner-container {
            left: 0;
            margin: auto;
            right: 0;
            transform-origin: top center;
            transition: transform 250ms cubic-bezier(0.4, 0.0, 1, 1) .4s;
            z-index: 2;
        }
        #options {
            max-width: 140px;
            width: fit-content;
            width: -moz-fit-content;
            margin: 2em auto 0 auto
        }
        #options span {
            margin-left: 25px;
            font-weight: bold
        }
        .ep-sidetools {
            top: 60%
        }
        @media(max-width:416px) {
            h1 {
                font-size: 1.5em
            }
            #options {
                margin-top: 1em;
            }
        }
       
        @media(max-width:768px) {

        }