.l-finger-pos{--top-finger1: 0;--left-finger1: 17px;--top-finger2: -5px;--left-finger2: 24px;--top-finger3: -7px;--left-finger3: 31px;--top-finger4: -6px;--left-finger4: 41px;--top-finger5: 8px;--left-finger5: 49px}.r-finger-pos{--top-finger1: 0;--left-finger1: 49px;--top-finger2: -4px;--left-finger2: 44px;--top-finger3: -7px;--left-finger3: 34px;--top-finger4: -6px;--left-finger4: 26px;--top-finger5: 8px;--left-finger5: 19px}.hand{text-align:center;width:10%}.open-hand{width:30px}.left-hand{transform:rotateY(180deg)}.change-png-color{filter:invert(100%)}.finger-1:after{position:absolute;content:"";width:5px;background-color:#04f104;height:5px;border-radius:100%;top:var(--top-finger1);left:var(--left-finger1)}.finger-2:after{position:absolute;content:"";width:5px;background-color:#04f104;height:5px;border-radius:100%;top:var(--top-finger2);left:var(--left-finger2)}.finger-3:after{position:absolute;content:"";width:5px;background-color:#04f104;height:5px;border-radius:100%;top:var(--top-finger3);left:var(--left-finger3)}.finger-4:after{position:absolute;content:"";width:5px;background-color:#04f104;height:5px;border-radius:100%;top:var(--top-finger4);left:var(--left-finger4)}.finger-5:after{position:absolute;content:"";width:5px;background-color:#04f104;height:5px;border-radius:100%;top:var(--top-finger5);left:var(--left-finger5)}.Keyboard-section{display:flex;position:relative;flex-direction:column;justify-content:center;align-items:center;min-width:760px}.Keyboard-section .keyboard-row{display:flex;margin-bottom:10px}.Keyboard-section div{align-self:flex-start}.Keyboard-section button{position:relative;outline:none;background-color:#271c19;font-size:1em;line-height:35px;width:40px;margin:0 5px;border-radius:15%;font-weight:500;box-shadow:0 0 5px 2px #333;cursor:pointer;border:none;color:#fafaff}.Keyboard-section .key-capslock{width:90px}.Keyboard-section .key-tab{width:60px}.Keyboard-section .key-l-shift{width:75px}.Keyboard-section .key-l-ctrl{width:89px}.Keyboard-section .key-alt{width:85px}.Keyboard-section .key-space{width:315px}.Keyboard-section .key-altgr{width:109px}.Keyboard-section .key-r-ctrl{width:112px}.Keyboard-section .key-enter{width:100px;border-radius:2px 2px 0 8px;box-shadow:0 0 5px 2px #333}.Keyboard-section .key-enter:after{content:"";position:absolute;top:29px;right:0px;height:50px;width:51px;border-radius:0 2px 2px;box-shadow:0 3px 5px 1px #333;background-color:#271c19}.Keyboard-section .key-backspace{width:100px}.Keyboard-section .key-r-shift{width:115px}.active-key{border-bottom:2px solid black!important;border-left:1px solid black!important;line-height:30px!important}button.key-enter:active:after{border-bottom:2px solid black;border-right:2px solid black;border-left:2px solid black;right:-2px}button.key-enter:active{border-top:2px solid black;border-right:2px solid black;border-left:2px solid black;line-height:32px}.button-disabled{cursor:not-allowed;pointer-events:none;opacity:.5}.letter-board{display:flex;justify-content:center;align-items:center;background-color:#271c19;color:#fff;font-size:20px;min-width:760px}.letter-board .letter-row{padding:5px 15px}.letter-board .letter{position:relative;padding:0 2px}.active-letter:after{position:absolute;display:inline-block;content:"";border-bottom:2px solid white;width:10px;top:22px;left:2px}.hit{color:#32e132}.navigation-phase{display:flex;justify-content:center;align-items:center;border:2px solid white;color:#fff;margin-bottom:20px;min-width:760px}.navigation-phase .repeat-button{margin:0 20px;font-size:35px;cursor:pointer}.navigation-phase .arrow-button{font-size:18px;cursor:pointer}.status-typing{display:flex;justify-content:space-around;color:#fff;padding:10px;margin-bottom:10px;min-width:760px}.status-typing .status{position:relative;border-left:1px solid white;border-right:1px solid white;padding:0 5px}.status-typing .metrics{display:flex;justify-content:space-around;width:30%}.status-typing .tpm{width:10%;color:#ffffff8e}.status-typing .level{width:25%}.status-typing .status-item{display:flex;flex-direction:column;justify-content:center;align-items:center}*{padding:0;margin:0;box-sizing:border-box}body{background-color:#55423d;font-family:sans-serif;user-select:none}header{color:#fff;text-align:center}.main-content{display:flex;flex-direction:column;align-items:center;justify-content:space-evenly;width:60%;margin:0 auto;padding:10px}.main-content section{width:96%}.instruction-container{display:none;position:absolute;color:#fff;background-color:#271c19;top:100px;left:50%;padding:40px;transform:translate(-50%);text-align:center;box-shadow:1px 1px 6px 500px #000000b3}.instruction-container p{line-height:30px}.hand-pos-initial{width:550px}.hand-pos-complete{height:324px}.instruction-title{margin-bottom:20px}.btn-instruction-next,.btn-instruction-close{margin:20px auto auto;display:block;cursor:pointer;width:100px}.instruction-article2{display:none}.instruction-alert-section{text-align:center;border:2px solid #e78fb3;color:#e78fb3;padding:5px 0;margin-bottom:10px;min-width:760px;font-size:25px}.instruction-alert-section .repeat-button{margin:0 20px;cursor:pointer}.instruction-alert-section .arrow-button,.instruction-alert-section #instrucao{cursor:pointer}.letter-board,.Keyboard-section{pointer-events:none}.porpouse-section{color:#fafaff;display:none;margin-top:40px}.porpouse-article{width:45%;text-align:justify;line-height:25px;margin-left:20px}.porpouse-article h2{margin-bottom:20px}.porpouse-article p{margin-bottom:10px;margin-left:10px}.footer{text-align:center}.footer p{color:#fff;margin-bottom:5px}.footer p a{color:#fff;text-decoration:none}