#timer{display:flex;align-items:center;justify-content:center;width:100vw;height:100vh;background:var(--base-color);position:absolute;z-index:7}#timer .timerText{color:#fefefe;font:400 14rem "Paytone One",sans-serif}.modal-background{margin:0;position:absolute;z-index:5;width:100vw;height:100vh;background:#343434;opacity:.8}#tutorial-modal.in-game{height:605px}#tutorial-modal{margin:0;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);z-index:6;display:flex;flex-direction:column;align-items:center;justify-content:center;width:500px;height:658px;border-radius:15px;background:var(--base-color);font-size:1rem}#tutorial-modal h2{font:400 6.4em "VT323",sans-serif;color:#fefefe;margin-top:13px}#tutorial-modal .keys{display:flex;align-items:center;justify-content:space-between;margin:30px 50px;grid-gap:37px;gap:37px}#tutorial-modal .key-instruction{display:flex;flex-direction:column;align-items:center;text-align:center;grid-gap:5px;gap:5px;width:115px}#tutorial-modal .key-instruction p{font:400 1.4em "Paytone One",sans-serif}#tutorial-modal .start-race{border-radius:25px;border:2px solid #000;height:50px;width:50%;text-align:center;font:400 2.8em "VT323",sans-serif;background:#fff;cursor:pointer;transition:-webkit-filter .2s;transition:filter .2s;transition:filter .2s,-webkit-filter .2s}#tutorial-modal .start-race:hover{-webkit-filter:brightness(.8);filter:brightness(.8)}#tutorial-modal>img{width:100%;border-radius:15px;margin-bottom:-2px}#tutorial-modal .close-modal{width:30px;height:20px;position:absolute;top:15px;right:10px;z-index:4;border:none;background:none;cursor:pointer}#tutorial-modal .close-modal .one,#tutorial-modal .close-modal .two{background-color:#fff;height:5px;width:100%;margin:-5px}#tutorial-modal .close-modal .one{transform:rotate(45deg)}#tutorial-modal .close-modal .two{transform:rotate(-45deg)}@media (max-height:700px){#tutorial-modal.in-game{height:505px}#tutorial-modal{width:350px;height:560px;font-size:.8rem}#tutorial-modal .letter-keys{margin:21px 0;grid-gap:30px;gap:30px}#tutorial-modal .arrow-keys{margin-bottom:21px;display:flex;align-items:center;grid-gap:40px;gap:40px}#tutorial-modal .key-instruction{grid-gap:5px;gap:5px;width:85px}#tutorial-modal .close-modal{width:20px;height:15px}}#home-page{display:flex;align-items:stretch;height:100vh}#home-page aside{flex:10 1;background-color:var(--base-color);color:#fff;display:flex;flex-direction:column;justify-content:center}#home-page aside img{max-width:85%}#home-page aside h1{margin-top:80px;align-self:center;font:400 7.2rem "Paytone One",sans-serif}#home-page main{flex:7 1;display:flex;align-items:center;justify-content:center}#home-page main .main-content{display:flex;flex-direction:column;width:100%;max-width:320px;align-items:stretch;text-align:center}#home-page main .main-content h2{font:400 4.8rem "VT323",sans-serif;margin-bottom:42px}#home-page main .main-content form{display:flex;flex-direction:column}#home-page main .main-content form input{padding:13px 16px;margin-bottom:42px;background:#fff;border:2px solid var(--base-color);border-radius:8px;font:400 1.8rem "VT323",sans-serif}#home-page main .main-content form .pixel-button{align-items:center;justify-content:center;display:flex;position:relative}#home-page main .main-content form .pixel-button svg path{fill:var(--base-color);transition:fill .2s}#home-page main .main-content form .pixel-button button{background:none;color:#fefefe;width:100%;height:100%;position:absolute;border:none;font:400 3.2rem "VT323",sans-serif;z-index:2;cursor:pointer;transition:-webkit-filter .2s;transition:filter .2s;transition:filter .2s,-webkit-filter .2s}#home-page main .main-content form .pixel-button:hover svg path{fill:var(--base-hover-color)}#home-page main .main-content form .pixel-button:hover button{-webkit-filter:brightness(.9);filter:brightness(.9)}#pixel-button{align-items:center;justify-content:center;display:flex;position:relative}#pixel-button svg path{transition:fill .2s}#pixel-button button{background:none;color:#fefefe;width:100%;height:100%;position:absolute;border:none;font:400 3.2rem "VT323",sans-serif;z-index:2;cursor:pointer;transition:-webkit-filter .2s;transition:filter .2s;transition:filter .2s,-webkit-filter .2s}#pixel-button:hover svg path{fill:var(--base-hover-color)}#pixel-button:hover button{-webkit-filter:brightness(.9);filter:brightness(.9)}#race{position:absolute;display:flex;align-items:center;justify-content:center}#race .race-header{position:fixed;z-index:3;top:10px;display:flex;grid-gap:100px;gap:100px}#race .race-header .race-information{padding:10px;width:150px;text-align:center;border:2px solid #000;background:#fefefe;font:400 1rem "VT323",sans-serif;font-style:normal;border-radius:10px}#race .race-header .race-information p{font-size:3em}#race .track{margin:0;padding:0;width:100vw;height:100vh;z-index:1}#race .track .gif{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:1002px;height:1002px;background:url(/static/media/spriteTrackGiff.d2088a16.png);animation:animate .5s steps(2) infinite}@keyframes animate{0%{background-position:0}to{background-position:2004px}}#race .track .gif.pause{animation-play-state:paused}#race .car{position:absolute;height:auto}#race .bottom-center,#race .bottom-left,#race .bottom-right{width:15vw;bottom:0;z-index:4}#race .bottom-center{left:40vw}#race .bottom-left{left:5vw}#race .bottom-right{left:75vw}#race .mid-center,#race .mid-left,#race .mid-right{width:10vw;bottom:25vh;z-index:3}#race .mid-center{left:42.6vw}#race .mid-left{left:22vw}#race .mid-right{left:63vw}#race .top-center,#race .top-left,#race .top-right{width:5vw;bottom:40vh;z-index:2}#race .top-center{left:45.2vw}#race .top-left{left:36vw}#race .top-right{left:55vw}#game-over.win{background:#e5e5e5;color:#000}#game-over.win h2{color:green}#game-over.loose{background:#000;color:#fefefe}#game-over.loose h2{color:red}#game-over{display:flex;flex-direction:column;align-items:center;justify-content:center;width:100vw;height:100vh;position:absolute;z-index:7;font-weight:400;text-align:center}#game-over,#game-over h2{font-family:"Open sans",sans-serif}#game-over h2{font-size:15rem;margin-bottom:30px}#game-over p{font-size:3rem;line-height:1.5;margin-bottom:45px}#game-over #pixel-button{margin-bottom:30px}*{margin:0;padding:0;box-sizing:border-box;z-index:1}html{font-size:62.5%}body{font-size:1.6rem;background:#fefefe;color:#29292e;overflow:hidden}:root{--hue:212;--base-color:hsl(var(--hue) 100% 59%);--base-hover-color:hsl(var(--hue) 100% 30%)}
/*# sourceMappingURL=main.19588558.chunk.css.map */