@import"https://fonts.googleapis.com/css2?family=Kaushan+Script&family=Monsieur+La+Doulaise&family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap";*{margin:0;padding:0;box-sizing:border-box}:root{--bg-color: #f8e147;--font-heading: "Kaushan Script", serif;--font-basic: "Poppins", serif;--primary-color: #2d2d2d}body{background-color:var(--bg-color);font-family:var(--font-basic);font-size:62.5%;width:100%;height:100vh;overflow-x:hidden}.container{padding:5% 10% 0%}.heading{display:flex;align-items:center}.heading p{color:#fff;font-family:var(--font-heading);font-size:2rem;letter-spacing:2px;font-weight:600}.heading img{mix-blend-mode:multiply;width:60px}.settings{background-color:#b8a001;border-radius:4rem;width:450px;justify-content:space-between;align-self:center;padding:10px 30px;margin:2rem auto 0;color:var(--primary-color);position:relative;z-index:2}.settings,.settings ul{display:flex;text-decoration:none;list-style-type:none;font-size:.8rem}.settings ul li{margin:0 7px;cursor:pointer;transition:all .3s}.settings li i{margin-right:7px;font-size:14px}.settings li:hover,.btn-lang a:hover,.reset i:hover{color:#fff}.setting-display:after{content:"";background-color:var(--primary-color);width:5px;border-radius:3px;margin-left:1.4rem}.btn-lang a{text-decoration:none;color:var(--primary-color)}.btn-lang{text-align:center;margin-top:1rem;font-size:.8rem}.btn-lang i{margin-right:5px}#typing-test{font-family:var(--font-basic);margin:30px 20px 0;position:relative;cursor:default}.target-text{font-size:1.5rem;line-height:2;letter-spacing:.1rem;color:#1109097a;font-weight:600;margin:0 10px}.correct{color:#fff}.incorrect{color:red}.cursor{background-color:#7c7b7b74;border-radius:3px;animation:blink .8s steps(1) infinite}@keyframes blink{50%{background-color:transparent}}input{font-size:1rem;padding:10px;width:100%;height:100%;box-sizing:border-box;opacity:0;cursor:default;position:absolute;top:0%;left:0%;z-index:20}.reset{margin-top:.8rem;text-align:center;font-size:1.3rem;color:#1109097a;font-weight:700;transition:all .3s}footer{display:flex;align-items:center;justify-content:center;margin-top:4rem}footer p span{font-size:10px;margin-left:2px}.overlay{width:100%;height:100%;position:absolute;top:0;left:0;background-color:#f8e0478f;z-index:10;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);display:flex;align-items:center;justify-content:center;opacity:1;transition:opacity 2s ease-out 1s}.overlay-text{font-size:.8rem;color:var(--primary-color);cursor:default}.overlay-text i{margin-right:3px}.hidden{visibility:hidden;opacity:0}.active{color:#fff}.content-layout{min-height:250px;width:auto;position:relative}.result{width:100%;height:100%;position:absolute;top:0;left:0;z-index:10;background-color:#b8a001;border-radius:2rem;display:flex;flex-direction:column;justify-content:center;align-items:center;padding:3%;margin:0 auto;color:#fff}.result h1{text-align:center;font-size:2rem}.result-category{margin:1rem auto;display:grid;grid-template-columns:2fr 3fr 2fr;grid-row:3;gap:0}.result-category h3{font-size:1rem;margin-bottom:1rem}.result-category p{font-size:1rem;margin-left:2rem;font-weight:600}.timer-text{margin:0 10px;font-size:1.4rem;font-weight:600;color:red;visibility:hidden}
