:root{--primary-color: #42b1b9;--secondary-color: #35495e;--font-size-base: 16px;--size-text-game: 3em}*{margin:0;padding:0;box-sizing:border-box;font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Open Sans,Helvetica Neue,sans-serif}html,body{overflow-x:hidden;margin:0;padding:0;width:100%}.vertical{display:flex;flex-direction:column;align-items:center;justify-content:center}.horizontal{display:flex;flex-direction:row;align-items:center}button{cursor:pointer;border-radius:50px;color:#fff;background-color:#744b76;border:none;font-size:1.25rem;width:5rem;height:3rem;transition-duration:.2s}button:hover{filter:brightness(150%)}h1,h2,h3{margin:0;color:#fff;font-size:calc(var(--font-size-base) * 2)}body{font-family:Arial,sans-serif;background-color:#282727;color:#333}.center{display:flex;flex-direction:column;align-items:center;position:absolute;top:45%;left:50%;transform:translate(-50%,-50%)}@keyframes slideFadeIn{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}@keyframes blink{0%{opacity:1}40%{opacity:1}60%{opacity:0}to{opacity:0}}.input-cursor{animation:blink .6s linear infinite alternate}.input-cursor{display:inline-block;width:2px;height:8vh;margin-left:1vmin;margin-right:1vmin;background-color:#fff}.game-page{display:flex;flex-direction:column;justify-content:center;align-items:center}.game-header{display:flex;justify-content:center;align-items:center;gap:2vw;font-size:25px;color:#fff;letter-spacing:1px;margin-top:1.5rem}.timer{margin:10px;gap:10px;display:flex;align-items:center;justify-content:center;font-size:25px;color:#fff;letter-spacing:2px}.timer p{font-style:italic;color:gray;font-size:20px}.input-div-typing{margin-top:23vmin;font-size:11vh;font-weight:700;color:#fff;max-width:100vw;word-wrap:break-word}.input-left{margin-right:14px}.input-right{margin-left:20px}.text-typing{display:flex;flex-direction:row;align-items:center;justify-content:center;word-break:break-word;overflow-wrap:break-word;display:inline-block}.text-typing-div{display:flex;flex-direction:column;justify-content:center;align-items:center;margin:22vmin;color:#fff;font-size:11vmin;font-weight:700;word-break:break-word;overflow-wrap:break-word;display:inline-block;max-width:100vw}.vertical.typing{align-items:center;justify-content:center}.red-button{background-color:#cc334c}.hidden-input{position:absolute;top:-100px;opacity:0}.choosen-letter{color:#744b76}.indication{display:flex;flex-direction:column;align-items:center;justify-content:center}.indication h1{font-size:4vh}.letter-left{font-size:2.5vh;display:flex;flex-direction:column;align-items:center;color:#fff}@media screen and (max-width:426px){.game-header{flex-direction:column}.input-div-typing{margin-top:5vmin}}.homepage{display:flex;flex-direction:column;justify-content:center;align-items:center}.settings-header{display:flex;flex-direction:column;justify-content:center;align-items:center;margin-top:.5rem;padding:1.5vh;gap:1rem}.input-gap-right{margin-left:-5px}.input-gap-left{margin-left:50px}.horizontal.header{display:flex;gap:15px}.horizontal.letter{display:flex;gap:1rem}.horizontal.settings{gap:5px}.horizontal.range-bar{display:flex;gap:5px}.horizontal.range-bar-example{margin-left:58vmin;gap:10px}.horizontal.cooldown{display:flex;gap:10px}.horizontal.cooldown_choice{gap:5px}.title{gap:1rem;width:90vw;margin:20vmin;display:flex;flex-direction:column;justify-content:center;align-items:center}.title h1{animation:slideFadeIn .2s ease-out forwards;transition:color .3s linear;font-size:11vh;word-break:break-word;overflow-wrap:break-word;display:inline-block;max-width:100%;margin-left:3.1vmin}.title span{margin-top:.5vh}.placeholder{letter-spacing:7px;transition:color .3s linear}.appear{animation:slideFadeIn .6s ease-out forwards}.success{animation:successEffect .6s ease-in-out;color:#2bca30;transform:scale(1.1)}.settings-header h3{font-size:20px}.settings-header span{color:#fff}.clicable{color:gray;display:inline-flex;align-items:center;gap:5px;padding:5px 10px;cursor:pointer;border:1px solid;border-radius:10px;text-decoration:none;transition:background-color .2s ease,color .2s ease}.clicable.clicked{background-color:#4d764b;color:#fff}.clicable.clicked.time{background-color:#744b76}.clicable.red:hover{background-color:#cc334c;color:#fff}.clicable.green:hover{background-color:#4d764b;color:#fff}.clicable:hover{filter:brightness(150%)}.letter-click{display:flex;flex-wrap:wrap;gap:5px;justify-content:center}.range_max{cursor:pointer}.input_value{font-weight:1000}.error{margin-top:-30px;color:#cc334c}.svg_sound{margin-left:5px;cursor:pointer;transition:.3s}.svg_sound:hover{transform:scale(1.2);transition:.3s}.letter_exemple{display:none;color:gray!important;font-style:italic;opacity:0;transform:translateY(-10px);transition:opacity .3s ease-out,transform .3s ease-out;display:inline-block;width:55vmin;white-space:nowrap;overflow:hidden}.letter_exemple.show{display:block;opacity:1;transform:translateY(0);max-height:50px}@keyframes successEffect{0%{transform:scale(1);color:#fff}50%{transform:scale(1.2) rotate(2deg);color:#2bca30}to{transform:scale(1.1);color:#2bca30}}@media screen and (max-width:1000px){.horizontal.range-bar-example{flex-direction:column;margin-left:0}.letter_exemple{max-height:0}}@media screen and (max-width:1186px){.horizontal.letter,.horizontal.header{flex-direction:column}.svg_sound{margin-left:5px}}@media screen and (max-width:726px){.horizontal.header,.horizontal.letter{flex-direction:column}.horizontal.cooldown{flex-direction:column;gap:7px}.settings-header{gap:10px}}.failur-body{display:flex;flex-direction:column;align-items:center;justify-content:center}.loose-header{display:flex;justify-content:center;align-items:center;height:75px;margin-top:75px;font-size:200px}.center.lost-game{max-width:90%}.center.lost-game h1{text-align:center}.loose-header h3{font-size:120px;color:#cc334c}.lost-game{width:100vw}.red-score{color:#cc334c}.lost-game h1{font-weight:650;font-size:75px;margin-bottom:15px;margin-top:.7vh}.span-score{color:#4d764b}.retry{color:#dadada;font-size:2vh;font-style:italic;margin-bottom:-3px;margin-left:10px}.lost-game h2{font-size:50px;font-weight:560;color:#acacac}.lost-game h3{color:#cc334c}.lost-game button{margin-top:.5vh}.button-gap{gap:10px}.lost-game button.no{background-color:#cc334c}.replay-button{background-color:#4d764b}.score-div{color:gray;display:flex;flex-direction:row;gap:10px;font-size:3vh;margin-bottom:-1vh}.sep-fail{display:block}@media screen and (max-width:580px){.score-div{flex-direction:column;align-items:center}.sep-fail{display:none}}.div-count{width:200vw}.text-count{font-size:100px;transform-origin:center}.text-count.animate{animation:countEffect .6s ease-in-out}@keyframes countEffect{0%{transform:scale(1)}50%{transform:scale(1.3) rotate(2deg)}to{transform:scale(1)}}