#game_container{position:absolute;width:100%;height:100%;z-index:300}#progress_bar{position:absolute;top:0;left:0;width:100%;background-color:#fff;height:4px;z-index:2}#pause_btn{position:absolute;top:4px;right:0;padding:5px;background-color:transparent;border:0;z-index:20}#mobile_controls{top:0;height:100%;z-index:1;display:grid;grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr}#mobile_controls,#stats_div{position:absolute;left:0;width:100%}#stats_div{top:4px;z-index:2}#score_text{padding-left:5px}#combo_text{text-align:center;animation:fade_in_animation .5s ease 1}@keyframes fade_in_animation{0%{opacity:0}to{opacity:1}}.flow_eye{animation:flow_animation 1s linear infinite}@keyframes flow_animation{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}#lane_container{position:absolute;height:calc(100% - 4px - 60px - 100px);max-height:600px;top:64px;width:calc(100% - 15%);background:linear-gradient(to right,var(--greyTransparent),80%,transparent);display:flex;flex-direction:column;z-index:0;transition:transform .5s ease}#lil_game_guy{position:absolute;content:"";top:25%;right:calc(100% + 7%);z-index:400;transform:translateY(-50%) translateX(-200%);opacity:0;height:clamp(20px,100%,50px);aspect-ratio:10/6;border:1px solid #eaeaea}.flipped{transform:scaleX(-1);right:15%}.unflipped{left:15%}@media screen and (max-width:1000px){.unflipped{left:calc(30%)}.flipped,.unflipped{width:calc(100% - 30%)!important}.flipped{right:calc(30%)}#lil_game_guy{right:calc(100% + 15%)}}@media screen and (min-width:1800px){.flipped{transform:translate(-50%) scaleX(-1)}.flipped,.unflipped{width:1300px!important;left:calc(50%)}.unflipped{transform:translate(-50%)}}.lane_section{height:45%;border-left:5px solid var(--gameWhite);margin:auto 0;display:flex;flex-direction:column}#text_wrapper{width:100%;height:100%}#text_wrapper,.hit_text{position:absolute;z-index:1}.hit_text{top:50%;left:50%;opacity:0;transform:translate(-50%,-50%)}#okay_text{color:#257eda}#perfect_text{color:#36c963}#miss_text{color:#db2e24}.lane{position:relative;width:100%;height:50%}.lane-one,.lane-three{border-bottom:1px solid #eaeaea15}.bar{position:absolute;height:100%;background-color:var(--gameWhite);width:12px;animation-fill-mode:forwards}@keyframes barAnime{0%{left:100%}to{left:0}}.left{background:repeating-linear-gradient(45deg,var(--gameWhite) 0,var(--gameWhite) 10%,#000 10%,#000 20%),repeating-linear-gradient(-45deg,var(--gameWhite) 0,var(--gameWhite) 10%,#000 10%,#000 20%);background-size:50% 150%,50% 150%;background-position:100% 0,0 0;background-repeat:no-repeat;height:200%}@keyframes leftAnimation{0%{top:100%;background-position:100% 0,0 0}20%{top:0}to{background-position:100% 90%,0 90%}}.right{background:repeating-linear-gradient(135deg,var(--gameWhite) 0,var(--gameWhite) 10%,#000 10%,#000 20%),repeating-linear-gradient(-135deg,var(--gameWhite) 0,var(--gameWhite) 10%,#000 10%,#000 20%);background-size:50% 150%,50% 150%;background-position:100% 130%,0 130%;background-repeat:no-repeat;height:200%}@keyframes rightAnimation{0%{bottom:100%;background-position:100% 130%,0 130%}20%{bottom:-100%}to{background-position:100% 40%,0 40%}}.lane_circle{position:absolute;content:"";height:25%;aspect-ratio:1;border-radius:50%;border:5px solid var(--gameWhite);background-color:#000;top:35%;right:calc(100% + 20px)}.lane_circle_teeth{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:105%;aspect-ratio:9/1;background:linear-gradient(to right,var(--gameWhite) 15%,transparent 15%,transparent 85%,var(--gameWhite) 85%);&:nth-of-type(2){transform:translate(-50%,-50%) rotate(60deg)}&:nth-of-type(3){transform:translate(-50%,-50%) rotate(-60deg)}}.lane_circle_tape{position:absolute;background-color:var(--gameWhite);width:5px;right:100%;height:calc(50% + 20px)}.lct_left{top:0;transform-origin:top right;transform:rotate(34deg)}.lct_right{bottom:0;transform-origin:bottom right;transform:rotate(-29deg)}@media screen and (min-height:1150px){.lct_left{transform:rotate(30deg)}.lct_right{transform:rotate(-25deg)}}@media screen and (max-height:800px){.lct_left{transform:rotate(38deg)}.lct_left,.lct_right{height:calc(50% + 10px)}.lct_right{transform:rotate(-33deg)}}@media screen and (max-height:400px){.lct_left{transform:rotate(50deg)}.lct_left,.lct_right{height:calc(50% + 15px)}.lct_right{transform:rotate(-45deg)}}#game_left_eye{top:30%;left:15%;transform:scaleY(0);width:20%;background-color:#eaeaea}#game_right_eye{top:20%;transform:scaleY(0);width:30%;border:3px solid #eaeaea}#boombox{width:50%;max-width:500px;height:30%;max-height:95px;background-color:var(--greyTransparent2);border:5px solid var(--white);position:absolute;bottom:0;transform:translateX(-50%);left:50%}#flow_container,#hp_container{position:absolute;top:0;height:100%;width:100%}#hp_container{left:0;-webkit-clip-path:polygon(0 0,15% 0,20% 50%,80% 50%,85% 100%,0 100%);clip-path:polygon(0 0,15% 0,20% 50%,80% 50%,85% 100%,0 100%)}#hp_bar{position:absolute;content:"";height:100%;background:var(--green);z-index:10;top:0;left:0;transition:width 1s ease}#flow_container{right:0;-webkit-clip-path:polygon(15% 0,100% 0,100% 100%,85% 100%,80% 50%,20% 50%);clip-path:polygon(15% 0,100% 0,100% 100%,85% 100%,80% 50%,20% 50%)}#flow_bar{background:var(--white);z-index:10;transition:width 1s ease}#flow_bar,#flow_bar_cover{position:absolute;content:"";height:100%;top:0;left:0}#flow_bar_cover{width:100%;background-color:var(--white)}#flow_count,#hp_count{position:absolute;transform:translateX(-50%);left:50%;z-index:40}#hp_count{bottom:0}#flow_count{top:0;position:absolute;bottom:0;transform:translateX(-50%);left:50%;z-index:40}#flow{right:0}.boombox_circle{background-color:transparent;height:80%;top:10%;background-color:#000;z-index:200}.boombox_circle,.boombox_circle:before{border:5px solid var(--black);aspect-ratio:1;border-radius:50%;content:"";position:absolute}.boombox_circle:before{height:100%;background:repeating-linear-gradient(var(--white),0,transparent 2px,transparent 6px,var(--white) 8px),repeating-linear-gradient(to right,var(--white),0,transparent 2px,transparent 6px,var(--white) 8px);z-index:10;top:-5px;left:-5px}#bc_left{left:1%}#bc_right{right:1%}#video_background{position:absolute;width:100%;height:100%}#video_visible{position:absolute;pointer-events:none;z-index:200;transition:opacity .5s ease}.showBackground{width:100vw;height:120vh;transform:translate(0);top:-10vh}.hideBackground{width:300px;height:120vh}@media screen and (max-width:1000px){.showBackground{width:249vh;transform:translate(calc(50vw - 124.5vh))}}#bg_label{font-size:1.5rem}.slider-dim{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:100%;max-width:900px;border-radius:10px;height:15px;background:var(--green);outline:none;opacity:.7;transition:opacity .2s}.slider-dim:hover{opacity:1}.slider-dim::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:25px;border-radius:50%;border:3px solid var(--white);background-color:var(--screenBlack);aspect-ratio:1;cursor:pointer}.slider-dim::-moz-range-thumb{width:25px;border-radius:50%;border:3px solid var(--white);background-color:var(--screenBlack);aspect-ratio:1;cursor:pointer}#end_screen_wrapper,#game_over_screen_wrapper{position:absolute;display:flex;flex-direction:column;align-items:center;gap:20px;padding-top:5vh;width:100%;height:100%;z-index:2;background-color:rgba(0,0,0,.767);animation:initiateEndScreen .5s ease 1}#end_screen_wrapper,#pause_wrapper{overflow:auto}#game_over_screen_wrapper{padding-top:0;justify-content:center}@keyframes initiateEndScreen{0%{opacity:0}to{opacity:1}}#pause_wrapper,#waiting_wrapper{position:absolute;top:0;width:100%;height:100%;z-index:200;background-color:rgba(0,0,0,.301)}#waiting_wrapper{justify-content:center}#pause_wrapper,#waiting_wrapper{display:flex;align-items:center}@media screen and (max-height:330px){#pause_wrapper{align-items:flex-start}}#game_over_screen,#pause_screen{height:-moz-fit-content;height:fit-content;width:50%;max-width:200px;padding:10px;margin:0 auto;display:flex;flex-direction:column;align-items:center;justify-content:center;border-radius:5px;gap:20px;background-color:rgba(0,0,0,.75);button{width:100%;padding:10px;font-weight:bolder;letter-spacing:1px;background-color:var(--white);color:#232323;transition:backgroundColor .2s ease}button:hover{background-color:var(--whiteLight)}}.pause_active{visibility:visible}.pause_unactive{visibility:hidden}#waiting_wrapper span{font-size:4rem;color:var(--white);top:calc(50% - 5vh);transform:translate(-50%,-50%);opacity:0;animation:countdown 3s linear}#waiting_wrapper span,#yt_info{text-align:center;position:absolute;left:50%}#yt_info{bottom:0;width:100%;transform:translateX(-50%);padding:10px 0;background-color:rgba(0,0,0,.767);color:#fff}@keyframes countdown{0%{opacity:1}25%{opacity:0}to{opacity:0}}#waiting_wrapper span:first-child{animation-delay:0s}#waiting_wrapper span:nth-child(2){animation-delay:1s}#waiting_wrapper span:nth-child(3){animation-delay:2s}#waiting_wrapper span:nth-child(4){animation-delay:3s}#score_div{flex-direction:column;text-align:center;justify-content:center;align-items:center;gap:20px;width:100%}#hit_stats,#score_div{position:relative;display:flex}#hit_stats{width:60%;max-width:320px;div{flex:1 1}}#lil_guy_container{position:absolute;top:0;left:0;width:100%;height:100%;animation:lil_guy_Y 1s ease-in-out 1s 1 forwards}@keyframes lil_guy_Y{50%{transform:translateY(60%)}to{transform:translateY(0)}}#lil_guy{position:absolute;content:"";z-index:400;width:20%;max-width:80px;aspect-ratio:10/6;border:1px solid #eaeaea;animation:lil_guy_A1,lil_guy_X,lil_guy_rotate;animation-duration:1s,1s,1s;animation-delay:0s,1s,2s;animation-fill-mode:forwards,forwards,forwards;animation-timing-function:ease,ease-in-out,ease;&.sad{animation:lil_guy_A1,lil_guy_X,lil_guy_rotate,lil_guy_sad;animation-duration:0s,0s,0s,1s;animation-delay:0s,0s,0s,0s;animation-iteration-count:1,1,1,infinite;animation-fill-mode:forwards,forwards,forwards,forwards;animation-timing-function:ease,ease-in-out,ease,ease}&.happy{animation:lil_guy_A1,lil_guy_X,lil_guy_rotate,lil_guy_happy;animation-duration:0s,0s,0s,1s;animation-delay:0s,0s,0s,0s;animation-iteration-count:1,1,1,infinite;animation-fill-mode:forwards,forwards,forwards,forwards;animation-timing-function:ease,ease-in-out,ease,ease}}@keyframes lil_guy_sad{0%{transform:translate(-10%)}50%{transform:translate(10%)}to{transform:translate(-10%)}}@keyframes lil_guy_happy{0%{transform:translateY(-10%)}50%{transform:translateY(10%)}to{transform:translateY(-10%)}}@keyframes lil_guy_A1{0%{top:0;left:0}33%{top:20%;left:-25%}66%{transform:rotateY(60deg);top:20%;left:-25%}to{transform:rotateY(30deg);top:20%;left:-25%}}@keyframes lil_guy_X{to{transform:rotateY(0deg);left:105%}}@keyframes lil_guy_rotate{0%{transform:rotateY(0deg)}50%{transform:rotateY(-60deg)}to{transform:rotateY(0deg)}}#flow_crown{transform:rotate(-25deg);bottom:90%;height:30%;width:50%;background-color:#fff;left:-10px;-webkit-clip-path:polygon(2% 100%,0 0,25% 50%,50% 0,75% 50%,100% 0,100% 100%);clip-path:polygon(2% 100%,0 0,25% 50%,50% 0,75% 50%,100% 0,100% 100%);transition:opacity .2s ease}#flow_crown,#left_eye{position:absolute;content:""}#left_eye{top:30%;left:15%;width:20%;aspect-ratio:1;border-radius:50%;background-color:#eaeaea;border:0 solid #eaeaea;animation:leftEyeAnimation1,leftEyeAnimation2;animation-duration:1.2s,.9s;animation-delay:0s,2s;animation-timing-function:ease;animation-fill-mode:forwards,forwards}@keyframes leftEyeAnimation1{0%{transform:translate(0)}50%{transform:translate(30%,-30%)}to{transform:translate(0)}}@keyframes leftEyeAnimation2{0%{transform:translate(0)}50%{transform:translate(-30%,-40%)}to{transform:translate(0)}}#right_eye{position:absolute;content:"";top:13%;right:10%;width:40%;aspect-ratio:1;border-radius:50%;background-color:transparent;border:2px solid #eaeaea;animation:rightEyeAnimation1,rightEyeAnimation2;animation-duration:1.2s,.9s;animation-delay:0s,2s;animation-timing-function:ease;animation-fill-mode:forwards,forwards}#gear_container{position:absolute;width:100%;height:100%}@keyframes rightEyeAnimation1{0%{transform:translate(0)}50%{transform:translate(15%,-15%)}to{transform:translate(0)}}@keyframes rightEyeAnimation2{0%{transform:translate(0)}50%{transform:translate(-30%,-15%)}to{transform:translate(0)}}#cassette-tape{position:relative;content:"";width:60%;max-width:320px;aspect-ratio:10/6;border:1px solid #eaeaea}#cassette-tape:after{right:10%}#cassette-tape:after,#cassette-tape:before{position:absolute;top:25%;width:25%;aspect-ratio:1;border-radius:50%;border:1px solid #eaeaea;content:""}#cassette-tape:before{left:10%}#inner-cassette{position:absolute;left:7.5%;top:17.5%;width:85%;aspect-ratio:2.5/1;border-radius:5%;border:1px solid #eaeaea;content:""}#scoreUpload_menu{transform:translateY(20px);animation:menuAnimation 3s linear .5s 1 forwards;display:flex;flex-direction:column;align-items:center;opacity:0;width:100%;gap:50px;h2{text-align:center}button{font-weight:700}}#menu_div{display:grid;width:60%;max-width:320px;grid-template-columns:1fr 1fr}@keyframes menuAnimation{0%{opacity:0;transform:translateY(20px)}66%{opacity:0;transform:translateY(20px)}73%{opacity:1;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.gameBtns{text-decoration:none;width:-moz-fit-content;width:fit-content;margin:0 auto;padding:0;text-align:center;background-color:transparent;color:#eaeaea;border:0;font-size:1.8rem}#yt_embed{position:absolute;top:0;z-index:10}@media screen and (min-height:800px){#end_screen_wrapper{padding-top:10vh}}