@import url(https://fonts.googleapis.com/css?family=Oxanium|PT+Mono&display=swap);
*{box-sizing:border-box}:root{--primary-color: dodgerblue;--select-color: dodgerblue;--success: rgb(15, 158, 2);--danger: rgb(214, 23, 23)}body{margin:0;font-family:PT Mono,sans-serif;overflow:hidden;display:flex;justify-content:center;height:100vh;background:#e8e8e8;background-image:url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 width=%2780%27 height=%2780%27 viewBox=%270 0 80 80%27%3E%3Cg fill=%27%23161616%27 fill-opacity=%270.1%27%3E%3Cpath fill-rule=%27evenodd%27 d=%27M11 0l5 20H6l5-20zm42 31a3 3 0 1 0 0-6 3 3 0 0 0 0 6zM0 72h40v4H0v-4zm0-8h31v4H0v-4zm20-16h20v4H20v-4zM0 56h40v4H0v-4zm63-25a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm10 0a3 3 0 1 0 0-6 3 3 0 0 0 0 6zM53 41a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm10 0a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm10 0a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm-30 0a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm-28-8a5 5 0 0 0-10 0h10zm10 0a5 5 0 0 1-10 0h10zM56 5a5 5 0 0 0-10 0h10zm10 0a5 5 0 0 1-10 0h10zm-3 46a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm10 0a3 3 0 1 0 0-6 3 3 0 0 0 0 6zM21 0l5 20H16l5-20zm43 64v-4h-4v4h-4v4h4v4h4v-4h4v-4h-4zM36 13h4v4h-4v-4zm4 4h4v4h-4v-4zm-4 4h4v4h-4v-4zm8-8h4v4h-4v-4z%27/%3E%3C/g%3E%3C/svg%3E")}.game-container{border:1px solid #000;box-shadow:0 10px 20px -5px rgba(0,0,0,.5);width:530px;height:750px;position:relative;background:hsla(0,0%,100%,.5);user-select:none;margin-top:100px}.header{background:var(--primary-color);color:#fff;font-family:Oxanium,sans-serif;font-size:24px;text-shadow:1px 2px 2px #000;letter-spacing:2px;height:100px;display:flex;justify-content:center;align-items:center}.card{margin:5px auto 10px;height:600px}input[type=radio]{opacity:0;width:100%;height:75px;position:relative;top:-40px;cursor:pointer;z-index:2}.selection-container{position:relative;top:65px}.radio-container{width:90%;height:75px;margin:25px;cursor:pointer;border:2px solid #000;border-radius:5px}label{position:relative;top:20px;left:20px;font-size:30px}.selected-label{background:var(--select-color);color:#fff}.best-score{position:relative;top:-100px;left:330px;display:flex;flex-direction:column;justify-content:center;text-align:center;font-size:18px;max-width:fit-content}.best-score span{margin:0}.best-score span:last-child{font-size:24px}.selection-footer{top:134px}.height-240{height:240px;width:100%}.height-500{height:500px;width:100%}.item-container{height:552px;overflow-y:scroll;position:relative;-ms-overflow-style:none}.item-container::-webkit-scrollbar{display:none}.item{display:flex;align-items:baseline;justify-content:space-between;height:80px;margin:0 50px;user-select:none}.finished>h1{opacity:.5}.selected-item{background:var(--select-color);position:fixed;top:443px;z-index:-1;width:529px;height:80px}.item-footer,.selection-footer{width:100%;height:90px;background:#000;display:flex;justify-content:center;align-items:center;position:relative}.item-footer{top:1px}button{cursor:pointer;height:50px;border-radius:5px;font-size:25px;font-family:Oxanium,sans-serif;color:#fff;border:none;outline:none}button:hover{filter:brightness(110%)}button:active{transform:scale(0.99)}.wrong,.right{width:40%}.wrong{background:var(--danger);margin-right:25px}.right{background:var(--success)}.start,.play-again{width:90%;background:var(--primary-color)}.countdown{margin-top:45%;font-size:100px;text-align:center;user-select:none;cursor:pointer}.score-container{height:600px;display:flex;flex-direction:column;justify-content:center;align-items:center}.score-footer{width:100%;height:90px;display:flex;justify-content:center;position:relative;top:-30px}.title{font-size:45px}.final-time{font-size:100px;margin:0;color:var(--success)}.base-time{margin-top:100px;margin-bottom:0}.penalty-time{color:var(--danger)}@media screen and (max-width: 1800px){.game-container{margin-top:35px}.selected-item{top:380px}}@media screen and (max-width: 500px){.game-container{width:100%;margin-top:0;border:none}.selected-item{top:345px}.header{font-size:1.2rem}.countdown{margin-top:60%}.selection-container{top:100px}.radio-container{width:93%;margin:15px}label{font-size:1.7rem}.best-score{font-size:1rem;left:245px}.selection-footer{top:183px}}@media screen and (max-width: 376px){.best-score{left:232px}}
