@import url(https://fonts.googleapis.com/css2?family=Lato&family=ZCOOL+XiaoWei&display=swap);@import url(https://fonts.googleapis.com/css?family=Great+Vibes);*{background-color:smokewhite;color:#fff;font-family:Lato,"sans-serif";font-family:ZCOOL XiaoWei,sans-serif;justify-content:center}#body{background-color:#000;height:100%;width:100%}.formobile{display:none}.Appnav{-webkit-animation:load-anim-main 1s linear;animation:load-anim-main 1s linear;transition:1s ease-in-out}.Appnav nav{align-items:center;justify-content:center;text-align:center}.Appnav h1{border-radius:10px;color:#fff;font-family:Great Vibes;font-size:40px;margin-top:10px;padding:0 10px;text-align:center;transition:.5s ease-in-out}.Appnav h1:hover{background-color:#fff;color:#000;cursor:pointer}.Appnav hr{background-color:#fff;height:1px;margin-top:-30px}.grid{-webkit-animation:load-anim-grid 1s linear;animation:load-anim-grid 1s linear;margin-top:30px;transition:.3s ease-in-out;width:100%}.row{display:flex;flex-direction:row;justify-content:center;margin:5px}.letter{border:2px solid #fff;border-radius:80px;color:#fff;font-size:20px;font-weight:700;margin:5px;padding:11px 3px;text-align:center;transition:.3s ease-in-out;width:50px}.keyboard{-webkit-animation:load-anim-keyboard 1s linear;animation:load-anim-keyboard 1s linear;margin-top:25px}.key{align-items:center;background-color:gray;border-color:#fff;border-radius:3px;color:#000;font-size:25px;font-weight:700;height:30px;margin:5px;padding:5px;text-align:center;transition:.2s ease-in-out;width:30px}#bigkeys{width:100px}.bottomrow,.midrow,.toprow{display:flex;flex-direction:row;justify-content:center}#correctpos{background-color:green}#incorrectpos{background-color:#ff0;color:#000}#incorrect{background-color:#333}.gameover{-webkit-animation:reveal-gameover 1.5s linear forwards;animation:reveal-gameover 1.5s linear forwards;color:#fff;font-size:20px;margin-top:30px;opacity:0;text-align:center;transition:.4s ease-in-out}.gameover h2,h2 a{color:#fff;transition:.5s ease-in-out}.gameover h2 a:hover{color:cyan;-webkit-transform:translateX(10px);transform:translateX(10px)}#notusable{background-color:#af5454}#usable{background-color:gray}#usable:hover{background-color:#fff}.reset{-webkit-animation:play-again 1.5s infinite alternate;animation:play-again 1.5s infinite alternate;background-color:#000;border:transparent;border-radius:6px;color:#000;font-size:30px;font-weight:700;margin-top:3px;padding:10px;transition:.3s ease-in-out}.reset:hover{color:smokewhite}.footer{-webkit-animation:reveal-gameover 1.5s linear;animation:reveal-gameover 1.5s linear;bottom:0;color:#fff;font-family:Great Vibes;font-size:40px;font-weight:700;position:absolute;text-align:center;transition:.5s ease;width:100%}.footer:hover{background-color:#fff;color:#000}#deletekey,#enterkey{width:110px}#enterkey:hover{background-color:#e6ffff}#deletekey:hover{background-color:#fcc}@media (max-width:593px){#enterkey{-webkit-transform:translate(180px,51px);transform:translate(180px,51px)}#deletekey{-webkit-transform:translate(-175px,51px);transform:translate(-175px,51px)}}@media (max-width:499px){.key{padding:1px}#enterkey{display:block;margin-right:11px;-webkit-transform:translate(150px,45px);transform:translate(150px,45px)}#deletekey{display:block;margin-left:7px;-webkit-transform:translate(-151px,45px);transform:translate(-151px,45px)}}@media (max-width:420px){#root{display:none}.formobile{-webkit-animation-duration:.8s;animation-duration:.8s;-webkit-animation-name:smallsizeanimation;animation-name:smallsizeanimation;-webkit-animation-timing-function:linear;animation-timing-function:linear;display:block;font-family:Great Vibes;font-size:40px;position:relative;text-align:center;top:50vh}}@-webkit-keyframes smallsizeanimation{0%{color:#000}to{color:#fff}}@keyframes smallsizeanimation{0%{color:#000}to{color:#fff}}@-webkit-keyframes load-anim-main{0%{display:none;-webkit-transform:translateY(-1000px);transform:translateY(-1000px)}to{display:block;-webkit-transform:translateY(0);transform:translateY(0)}}@keyframes load-anim-main{0%{display:none;-webkit-transform:translateY(-1000px);transform:translateY(-1000px)}to{display:block;-webkit-transform:translateY(0);transform:translateY(0)}}@-webkit-keyframes load-anim-grid{0%{-webkit-transform:translateY(2600px);transform:translateY(2600px)}to{-webkit-transform:translateY(35.2px);transform:translateY(35.2px)}}@keyframes load-anim-grid{0%{-webkit-transform:translateY(2600px);transform:translateY(2600px)}to{-webkit-transform:translateY(35.2px);transform:translateY(35.2px)}}@-webkit-keyframes load-anim-keyboard{0%{-webkit-transform:translateY(2600px);transform:translateY(2600px)}to{-webkit-transform:translateY(50px);transform:translateY(50px)}}@keyframes load-anim-keyboard{0%{-webkit-transform:translateY(2600px);transform:translateY(2600px)}to{-webkit-transform:translateY(50px);transform:translateY(50px)}}@-webkit-keyframes flip-letter{0%{-webkit-transform:scaleY(1);transform:scaleY(1)}50%{fill-mode:linear;background-color:gray;background-size:cover;-webkit-transform:scaleY(0);transform:scaleY(0)}to{-webkit-transform:scaleY(1);transform:scaleY(1)}}@keyframes flip-letter{0%{-webkit-transform:scaleY(1);transform:scaleY(1)}50%{fill-mode:linear;background-color:gray;background-size:cover;-webkit-transform:scaleY(0);transform:scaleY(0)}to{-webkit-transform:scaleY(1);transform:scaleY(1)}}@-webkit-keyframes reveal-gameover{0%{opacity:0}to{opacity:1}}@keyframes reveal-gameover{0%{opacity:0}to{opacity:1}}@-webkit-keyframes play-again{to{background-color:#fff}}@keyframes play-again{to{background-color:#fff}}
/*# sourceMappingURL=main.693161de.css.map*/