@import"https://fonts.googleapis.com/css2?family=Cabin:wght@700&family=Oswald&display=swap";@import"https://fonts.googleapis.com/css2?family=Bebas+Neue&family=Jersey+15&family=Josefin+Sans:ital,wght@0,100..700;1,100..700&family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&family=Teko:wght@300..700&display=swap";#root{width:100%;margin:0;text-align:center}.app{display:flex;flex-direction:column;align-items:center}.Title{font-family:Oswald,sans-serif;font-weight:700;margin-bottom:2rem;align-items:center}.video{display:flex;flex-direction:column;align-items:center}.date{position:relative;display:inline-block;margin-bottom:1.2rem;width:12vw;height:4vw}.date p{font-family:Cabin,sans-serif;font-weight:700;font-size:1.2vw;text-align:center}.date:before{content:"";position:absolute;top:-2px;right:-2px;bottom:-2px;left:-2px;background:linear-gradient(to right,#f67280,#c06c84,#355c7d);z-index:-1;border-radius:10px}.level-indicator{display:flex;flex-direction:row;align-items:center;justify-content:space-between;margin:0 auto;margin-bottom:1.2rem;width:30vw}.circle{width:20px;height:20px;border-radius:50%;background-color:gray}.circle.active{background-color:green}.info-box{font-family:Cabin,sans-serif;font-weight:700;font-size:1.2vw;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);z-index:1000;background:#242424;padding:2vw;border-radius:2vw;width:80%;max-width:35vw;box-shadow:0 0 .2vw #f67280 inset,0 0 1vw #c06c84bf}.info-box ul{position:relative}.info-box ul li{font-family:Cabin,sans-serif;font-weight:700;font-size:1.2vw;position:relative;left:0;color:#d6d6d6;list-style:none;margin:.4rem 0;border-left:.2rem solid rgb(246,114,128);transition:.5s;text-align:left;padding-left:1rem}.info-box ul li:hover{left:1rem}.dimmed-background{position:fixed;top:0;left:0;width:100%;height:100%;background:#00000080;z-index:999}.switch-container{margin-bottom:1.2rem}.switch{position:relative;display:inline-block;width:5vw;height:2.8vw}.switch input{opacity:0;width:0;height:0}.slider{position:absolute;cursor:pointer;top:0;left:0;right:0;bottom:0;background-color:#ccc;transition:.4s;border-radius:2.8vw}.slider:before{position:absolute;content:"";height:2.2vw;width:2.2vw;left:.3vw;bottom:.3vw;background-color:#fff;transition:.4s;border-radius:50%}input:checked+.slider{background:linear-gradient(to right,#f67280,#c06c84,#355c7d)}input:checked+.slider:before{transform:translate(2.2vw)}.total-score{position:relative;display:inline-block;margin-bottom:1.2rem;width:12vw;height:7vw;background:linear-gradient(to right,#f67280,#c06c84,#355c7d);z-index:-1;border-radius:10px}.total-score p{font-family:Cabin,sans-serif;font-weight:700;font-size:1.5vw;text-align:center;transform:translateY(-40%)}.scoreboard{width:45%;margin:auto}.scoreboard button{margin-bottom:1.2rem}.score-box{display:inline-flex;justify-content:center;align-items:center;padding:0 2rem;transform:translateY(-100%);background:linear-gradient(to right,#f67280,#c06c84,#355c7d);box-shadow:0 0 .6vw #f67280;border-radius:1vw}.score-box.lower{transform:translateY(-50%)}.score-box p{font-family:Cabin,sans-serif;font-size:1.2vw}.score-text{display:inline-block;justify-content:center;align-items:center;padding:0 4rem;margin-left:3.5rem;border-left:.2rem solid #4e4e4e}.score-text p{font-family:Cabin,sans-serif;font-size:1.2vw;display:block}.round-score{display:flex;justify-content:center;align-items:center;gap:2rem;background:linear-gradient(to right,#f67280,#c06c84,#355c7d);z-index:-1;border-radius:10px;margin-bottom:1rem}.round-info{display:flex;align-items:center;gap:1rem}.round-info p{font-family:Cabin,sans-serif;font-weight:700;font-size:1.2vw;text-align:center;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);padding:.5rem;border-radius:10px}.round-info img{width:12vw;height:7vw}.round-score-value p{font-family:Cabin,sans-serif;font-weight:700;font-size:1.5vw;text-align:center;transform:translateY(-40%)}.buttons-container{display:flex;align-items:center;justify-content:space-between;padding:0 2rem}.scoreboard-buttons{display:flex;align-items:center;justify-content:space-between;padding:0 10rem}.credits{color:gray;font-size:1vw;transform:translateY(150%)}.credits a{color:#f67280;text-decoration:none}.copied-message{position:fixed;background-color:#f67280;color:#fff;font-size:.75rem;padding:0 .5em;border-radius:3px;animation:fadeOut 1.5s forwards}@keyframes fadeOut{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(-40px)}}.transition-container{position:fixed;top:0;left:0;width:100%;height:100%;z-index:-1;pointer-events:none}.falling-image{position:absolute;width:150px;height:auto;pointer-events:none}.small-box{position:absolute;display:flex;left:22vw;top:50%;transform:translateY(-50%);z-index:10;background:#242424;border-radius:.5vw;width:10%;padding-left:1vw;box-shadow:0 0 .2vw #d7ebe2 inset,0 0 1vw #abebd6c5;animation:popUp .5s forwards}.small-box p{font-family:Cabin,sans-serif;font-weight:700;font-size:1.2vw;text-align:center;display:inline-block;white-space:nowrap;transform:translateY(.1vw)}.small-box img{width:3vw;height:3vw;display:inline-block;transform:translateY(.5vw)}.small-box:hover{animation:popupmore .5s forwards;cursor:pointer}@keyframes popUp{0%{opacity:0;transform:translate(100%)}to{opacity:1;transform:translate(-12%)}}@keyframes popupmore{0%{transform:translate(-20%);padding-right:0}to{transform:translate(-58%);padding-right:7.5vw}}@media (max-width: 600px){.falling-image{width:50px}.date{width:40vw;height:10vw}.date p{font-size:2.5vw}.level-indicator{width:60vw}.info-box{max-width:75vw;min-height:55vh}.info-box ul li{font-size:.8rem}.info-box p{font-size:.6rem}.info-box h2{font-size:1.2rem}.info-box h3,.info-box button{font-size:1rem}.info-box .switch-container{margin-bottom:3.5rem}.info-box .switch-container .switch{width:25vw;height:14vw}.info-box .switch-container .slider{border-radius:14vw}.info-box .switch-container .slider:before{height:11vw;width:11vw;left:1.5vw;bottom:1.5vw;border-radius:50%}.info-box .switch-container input:checked+.slider:before{transform:translate(11vw)}.info-box .credits{font-size:1vw;transform:translateY(100%)}.total-score{width:40vw;height:20vw}.total-score p{font-size:3vw}.scoreboard{width:100%}.scoreboard p{font-size:2vw}.scoreboard .total-score{width:40vw;height:20vw}.scoreboard .total-score p{font-size:3vw}.score-box{padding:0 1rem}.score-box p{font-size:2.5vw}.score-text{padding:0 2rem;margin-left:1.5rem}.score-text p{font-size:3vw}.round-score{width:100%}.round-info{gap:1rem}.round-info img{width:40vw;height:20vw}.round-score-value p{font-size:3vw}.buttons-container{padding:0 1rem}.scoreboard .scoreboard-buttons{padding:0 5rem}.copied-message{font-size:.5rem}}input[type=range]{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:40vw;background-color:transparent}input[type=range]:focus{outline-color:#f8b195}input[type=range]::-webkit-slider-runnable-track{-webkit-appearance:none;-moz-appearance:none;appearance:none;height:3px;background:#f67280;background:linear-gradient(to right,#f67280,#c06c84,#355c7d);filter:progid:DXImageTransform.Microsoft.gradient(startColorstr="#f67280",endColorstr="#355c7d",GradientType=1)}input[type=range]::-moz-range-track{-moz-appearance:none;-webkit-appearance:none;appearance:none;height:3px;background:#f67280;background:linear-gradient(to right,#f67280,#c06c84,#355c7d);filter:progid:DXImageTransform.Microsoft.gradient(startColorstr="#f67280",endColorstr="#355c7d",GradientType=1)}input[type=range]::-ms-track{-webkit-appearance:none;-moz-appearance:none;appearance:none;height:3px;background:#f67280;background:linear-gradient(to right,#f67280,#c06c84,#355c7d);filter:progid:DXImageTransform.Microsoft.gradient(startColorstr="#f67280",endColorstr="#355c7d",GradientType=1)}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:2px solid #f8b195;border-radius:50%;height:20px;width:20px;position:relative;bottom:8px;background:#222 url(http://codemenatalie.com/wp-content/uploads/2019/09/slider-thumb.png) center no-repeat;background-size:50%;box-shadow:0 3px 5px #0006;cursor:grab}input[type=range]::-webkit-slider-thumb:active{cursor:grabbing}input[type=range]::-moz-range-thumb{-moz-appearance:none;-webkit-appearance:none;appearance:none;border:2px solid #f8b195;border-radius:50%;height:20px;width:20px;position:relative;bottom:8px;background:#222 url(http://codemenatalie.com/wp-content/uploads/2019/09/slider-thumb.png) center no-repeat;background-size:50%;box-shadow:0 3px 5px #0006;cursor:grab}input[type=range]::-moz-range-thumb:active{cursor:grabbing}input[type=range]::-ms-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:2px solid #f8b195;border-radius:50%;height:20px;width:20px;position:relative;bottom:8px;background:#222 url(http://codemenatalie.com/wp-content/uploads/2019/09/slider-thumb.png) center no-repeat;background-size:50%;box-shadow:0 3px 5px #0006;cursor:grab}input[type=range]::-ms-thumb:active{cursor:grabbing}:root{--text: #090801;--background: #fffce5;--primary: #ebd024;--secondary: #9ada95;--accent: #6ccb82;--element-gradient: linear-gradient( 45deg, var(--primary), var(--secondary) 30%, white 60% )}.modal{background:linear-gradient(var(--primary),var(--secondary));padding:.25vw;border-radius:.5vw;box-shadow:0 0 .5vw .25vw var(--text);overflow:hidden}.modal-inline{padding:.5vw .5vw 2vw;border-radius:.25vw;background:var(--background);color:var(--text);text-decoration:none;font-size:1vw;outline:none;display:flex;flex-direction:column;justify-content:space-between;height:100%}.modal .button{background-color:var(--primary);color:var(--text);display:block;margin-top:1vw;text-align:center;margin-bottom:1vw;font-weight:600}.buttons-container{display:flex;justify-content:center;gap:1vw}.modal .close{color:var(--text)}.header-text{font-family:Bebas Neue,sans-serif;text-align:center;padding-top:1vw;font-size:4em;font-weight:700;background:linear-gradient(45deg,var(--secondary),var(--primary));-webkit-background-clip:text;-webkit-text-fill-color:transparent}:root{font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color:#ffffffde;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}body{margin:0;display:flex;justify-content:center;align-items:center;min-width:320px;min-height:100vh}h1{font-size:3.2em;line-height:1.1}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;color:#fff;background-color:#1a1a1a;cursor:pointer;transition:border-color .25s}button:hover{border-color:#f67280}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}