@import url(https://fonts.googleapis.com/css?family=Open+Sans:400,700&subset=vietnamese);#app-burger{position:absolute;width:18rem;right:7.14vw;top:1rem}#app-burger .app-options-panel{top:0;left:0;position:absolute}#app-burger .app-options-choice .user-info{display:grid;grid-template-rows:1fr 2fr;grid-template-columns:1fr;grid-gap:.5rem;align-content:center;justify-content:center;align-items:center;justify-items:center}#app-burger .app-options-choice .name{align-self:start;justify-self:start;max-width:12rem;overflow:hidden;text-overflow:ellipsis}#app-burger .app-options-choice .user-btns{margin-top:.5rem;display:grid;grid-template-rows:1fr;grid-template-columns:1fr 1fr;grid-gap:.5rem;align-content:center;justify-content:center;align-items:center;justify-items:center}#app-burger .app-options-choice .user-btn{height:2.5rem;width:6rem;padding:0 .5rem;font-size:1rem;background:none;vertical-align:middle;text-align:center;margin:0;cursor:pointer;border-width:1px}.app-notification[data-v-6ff72bfc]{opacity:1;display:block;position:fixed;bottom:0;left:50%;-webkit-transform:translateX(-50%);transform:translateX(-50%);padding:3rem 2rem;border-radius:5px 5px 0 0;height:auto;width:80vw;pointer-events:none;font-size:1.5rem}.notification-enter-active[data-v-6ff72bfc],.notification-leave-active[data-v-6ff72bfc]{transition:all .3s ease}.notification-enter[data-v-6ff72bfc],.notification-leave-to[data-v-6ff72bfc]{-webkit-transform:translate(-50%,100%);transform:translate(-50%,100%)}.app-loading[data-v-df492100]{display:block;height:100vh;width:100vw;position:fixed;top:0;left:0;pointer-events:none}.app-loading .loading-content[data-v-df492100]{font-size:5rem;position:absolute;top:50%;left:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%)}.app-tips{position:absolute;border-radius:10px;height:auto;width:20rem;padding:20px;box-shadow:1px 3px 10px rgba(0,0,0,.16);text-align:left}.app-tips .bulb{height:1.5rem;width:auto;display:inline-block;vertical-align:top}.app-tips .tip-icon span{color:#ffa845;font-weight:700;margin-left:1rem}.app-tips .tip-content{margin:20px 0;margin-left:20px}.app-tips .bulb-icon{fill:#ffa845}*{box-sizing:border-box;margin:0;padding:0;font-family:Open Sans,Helvatica,Arial,sans-serif}button{outline:none;border:none;padding:10px 15px;border-radius:999px;cursor:pointer}button.disabled{color:#8a8a8a;border-color:#cacaca;cursor:not-allowed}ul{list-style-type:none}a{text-decoration:none;position:relative;color:#00afd7;cursor:pointer}textarea{font-family:Open Sans,Helvatica,Arial,sans-serif}::-webkit-scrollbar{width:5px}::-webkit-scrollbar:horizontal{height:5px}::-webkit-scrollbar-track{background:rgba(90,90,90,.5)}::-webkit-scrollbar-thumb{background:hsla(0,0%,54.1%,.5);border-radius:10px}::-webkit-scrollbar-thumb:hover{background:#8a8a8a}.light ::-webkit-scrollbar-track{background:hsla(0,0%,98%,.5)}.light ::-webkit-scrollbar-thumb{background:hsla(0,0%,79.2%,.5)}.light ::-webkit-scrollbar-thumb:hover{background:#cacaca}.screen-children-size{width:54vw;min-width:36rem;height:18vw;min-height:12rem}.exit-icon{display:block;position:absolute;height:1rem;width:1rem;top:10px;right:10px;z-index:inherit;border-radius:50%;border:1px solid #ff5f5f;cursor:pointer}.exit-icon:after,.exit-icon:before{content:"";display:block;height:1px;width:60%;position:absolute;top:50%;left:50%;background-color:#ff5f5f;-webkit-transform-origin:center center;transform-origin:center center;-webkit-transform:translate(-50%,-50%) rotate(45deg);transform:translate(-50%,-50%) rotate(45deg)}.exit-icon:after{-webkit-transform:translate(-50%,-50%) rotate(-45deg);transform:translate(-50%,-50%) rotate(-45deg)}.time-progress-bar{position:absolute;display:block;width:100%;height:3px;top:0;left:0}.time-progress-bar-inner{position:absolute;height:100%;width:100%;top:0;left:0;background-color:#9bf0e1;-webkit-transform:scaleX(0);transform:scaleX(0);-webkit-transform-origin:left;transform-origin:left;transition:-webkit-transform 1s linear;transition:transform 1s linear;transition:transform 1s linear,-webkit-transform 1s linear}.time-progress-bar{background-color:#5a5a5a}.light .time-progress-bar{background-color:#fafafa}label.custom-input{position:relative;height:auto;width:auto;padding-left:20px}label.custom-input input{position:absolute;cursor:pointer;display:none}label.custom-input .checkmark{position:absolute;top:50%;left:0;-webkit-transform:translateY(-50%);transform:translateY(-50%);height:.75rem;width:.75rem;background-color:hsla(0,0%,80%,.5);transition:background-color .1s ease}label.custom-input input:hover~.checkmark{background-color:#ccc}label.custom-input input:checked~.checkmark{background-color:#40ff40}label.custom-input input:checked~.checkmark.not-used{background-color:#e0e0e0;color:#e0e0e0}label.custom-input input:checked:hover~.checkmark{background-color:rgba(64,255,64,.5)}.custom-select{height:auto;cursor:pointer;position:relative;font-size:1rem;color:inherit}.custom-select.not-used{color:#e0e0e0}.select-options-panel{position:absolute;font-size:1rem;padding:1rem 0;margin:0;right:-15px;top:0;z-index:99;height:auto;width:auto;border-radius:5px;text-align:left;opacity:1}.select-option{height:auto;width:auto;padding:.5rem 2rem;cursor:pointer;position:relative;display:block;white-space:nowrap}.select-option.selected:before{content:"";display:block;height:.5rem;width:.5rem;border-radius:50%;background-color:currentColor;position:absolute;left:1rem;top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%)}.arrow{padding-right:15px}.arrow:after{position:absolute;content:"";top:50%;right:0;width:0;height:0;border:5px solid transparent;border-color:currentColor transparent transparent transparent}.select-options-enter-active,.select-options-leave-active{transition:all .2s ease}.select-options-enter,.select-options-leave-to{-webkit-transform:translateY(-40px);transform:translateY(-40px);opacity:0}.select-options-panel .select-option.selected{color:#40ff40}.light .select-options-panel .select-option.selected{color:#26d226}.app-options-panel{grid-template-rows:2fr 1fr}.app-options-panel .app-options-choice{margin:0}.app-options-panel .app-options-choice.theme-choice{border-width:0;border-top-width:1px}.app-options-panel ul li{text-align:left;display:inline-block;width:auto;position:relative;padding-left:20px;cursor:pointer}.app-options-panel ul li:after{content:"";height:.5rem;width:.5rem;background-color:#ececec;position:absolute;top:50%;left:0;-webkit-transform:translateY(-50%);transform:translateY(-50%);border-radius:50%}.app-options{font-size:1rem;height:auto;width:auto;white-space:nowrap;position:relative;transition:color .2s ease}.app-options-panel{display:grid;position:absolute;top:0;left:0;z-index:99;border-radius:5px;grid-template-columns:1fr;grid-template-rows:1fr;grid-auto-rows:2.5rem;grid-row-gap:1rem;width:18rem;text-align:left;padding:2rem;padding-bottom:2.5rem}.app-options-panel .label{text-transform:uppercase;font-size:.5rem}.app-options-panel ul{width:100%;white-space:nowrap;display:grid;grid-template-rows:1fr;grid-template-columns:1fr 1fr;grid-column-gap:20px;padding:0;margin:0}.app-options-panel li{text-align:left;display:inline-block;width:auto;position:relative;padding-left:20px;cursor:pointer}.app-options-panel li:after{content:"";height:.5rem;width:.5rem;background-color:#cacaca;position:absolute;top:50%;left:0;-webkit-transform:translateY(-50%);transform:translateY(-50%);border-radius:50%}.tooltip{position:relative}.tooltip:hover .tooltip-text{opacity:1}.tooltip-text{pointer-events:none;width:auto;text-align:center;padding:.5rem;border-radius:5px;position:absolute;z-index:inherit;font-size:1rem;text-transform:lowercase;bottom:calc(100% + 1rem);left:50%;-webkit-transform:translateX(-50%);transform:translateX(-50%);opacity:0;transition:opacity .2s ease}.tooltip-text:after{content:"";position:absolute;top:100%;left:50%;margin-left:-.5rem;border-width:.5rem;border-style:solid;border-color:transparent}.tooltip-text{color:#dadada;background-color:#222}.tooltip-text:after{border-top-color:#222}.light .tooltip-text{color:#000;background-color:#fff}.light .tooltip-text:after{border-top-color:#fff}.blue{color:#00afd7}.red{color:#ff5f5f}.green{color:#40ff40}.orange{color:#ffa845}.green-text{color:#26d226}.guide:before{background-color:#40ff40}.gray-border{border-color:#cacaca}.blue-border{border-color:#00afd7}.green-border{border-color:#40ff40}.red-border{border-color:#ff5f5f}.orange-border{border-color:#ffa845}.dotted-border{border-style:dotted}.solid-border{border-style:solid}.bold{font-weight:700}.underline{text-decoration:underline}.warning{color:#ffa845}.error{color:#ff5f5f}.success{color:#40ff40}.primary{color:#cacaca}.required{font-style:italic;color:#ff5f5f}@-webkit-keyframes blink{0%{opacity:0}50%{opacity:1}to{opacity:0}}@keyframes blink{0%{opacity:0}50%{opacity:1}to{opacity:0}}.stats{color:#dadada}.stats button{color:#dadada;background-color:#222}.light .stats{color:#000}.light .stats button{color:#000;background-color:#fff}#test .cheer{color:#dadada}.light #test .cheer{color:#000}#app-burger .app-options-panel{color:#dadada;background-color:#222;border:1px solid #5a5a5a}#app-burger .app-options-choice .selected{color:#40ff40}#app-burger .app-options-choice .selected:after{background-color:#40ff40}#app-burger .signup-btn{color:#dadada}.light #app-burger .app-options-panel{color:#000;background-color:#fff;border-color:#fafafa;box-shadow:3px 5px 20px rgba(0,0,0,.15)}.light #app-burger .app-options-choice .selected{color:#26d226}.light #app-burger .app-options-choice .selected:after{background-color:#26d226}.light #app-burger .signup-btn{color:#000}.app-notification{background-color:#222}.light .app-notification{background-color:#fff}.light .app-notification.success{color:#26d226}.app-tips{background-color:#222;color:#dadada}.light .app-tips{background-color:#fff;color:#000}#app-text-display h1{color:#dadada}#app-text-display h1 .gray{color:#8a8a8a}#app-text-display .guide{color:#000}#app-text-display .guide:before{background-color:#40ff40}#app-text-display .guide.wrong-char{color:#000}#app-text-display .guide.wrong-char:before{background-color:#ff5f5f}#app-text-display .blinking{color:#fff!important}.light #app-text-display h1{color:#000}.light #app-text-display h1 .gray{color:#cacaca}.light #app-text-display .guide{color:#fff}.light #app-text-display .guide:before{background-color:#40ff40}.light #app-text-display .guide.wrong-char{color:#fff}.light #app-text-display .guide.wrong-char:before{background-color:#ff5f5f}.light #app-text-display .blinking{color:#000!important}#app-text-display.test-mode{border:none;background-color:#222;box-shadow:none}.light #app-text-display.test-mode{border-color:#cacaca;background-color:#fff;box-shadow:0 3px 10px rgba(0,0,0,.15)}#typing-mode,#typing-mode .byCustom textarea{color:#dadada;background-color:#222}#typing-mode input:checked~.samples{color:#40ff40}.light #typing-mode,.light #typing-mode .byCustom textarea{color:#000;background-color:#fff}.light #typing-mode input:checked~.samples{color:#26d226}#control-panel .time-input{color:#dadada}#control-panel .app-options{color:#40ff40}#control-panel .app-options.gray{color:#8a8a8a}#control-panel .app-options.gray svg{fill:#8a8a8a}#control-panel .app-options svg{fill:#40ff40}#control-panel .speed{color:#40ff40}#control-panel .error,#control-panel .speed,#control-panel .time{transition:color .2s ease,background-color .2s ease;background-color:#222}#control-panel .app-options-panel,#control-panel .select-options-panel{color:#dadada;background-color:#222;border:1px solid #5a5a5a}#control-panel .app-options .selected{color:#40ff40}#control-panel .app-options .selected:after{background-color:#40ff40}.light #control-panel .time-input{color:#000}.light #control-panel .app-options{color:#26d226}.light #control-panel .app-options.gray{color:#cacaca}.light #control-panel .app-options.gray svg{fill:#cacaca}.light #control-panel .app-options svg{fill:#26d226}.light #control-panel .speed{color:#26d226}.light #control-panel .error,.light #control-panel .speed,.light #control-panel .time{background-color:#fff}.light #control-panel .app-options-panel,.light #control-panel .select-options-panel{color:#000;background-color:#fff;border-color:#fafafa;box-shadow:3px 5px 20px rgba(0,0,0,.15)}.light #control-panel .app-options .selected{color:#26d226}.light #control-panel .app-options .selected:after{background-color:#26d226}#typing-mode-control .custom-select{color:#40ff40}#typing-mode-control .custom-select.gray{color:#8a8a8a}#typing-mode-control .select-options-panel{color:#dadada;background-color:#222;border:1px solid #5a5a5a}#typing-mode-control .select-option{color:#dadada}#typing-mode-control .select-option.selected{color:#40ff40}.light #typing-mode-control .custom-select{color:#26d226}.light #typing-mode-control .custom-select.gray{color:#cacaca}.light #typing-mode-control .select-options-panel{color:#000;border-color:#fafafa;background-color:#fff;box-shadow:3px 5px 20px rgba(0,0,0,.15)}.light #typing-mode-control .select-option{color:#000}.light #typing-mode-control .select-option.selected{color:#26d226}#pauseIcon{fill:#ff5f5f}#resetIcon{fill:#00afd7}#playIcon{fill:#40ff40}#app-control-buttons button{background-color:#222;border:1px solid #5a5a5a;box-shadow:0 0 20px hsla(0,0%,100%,.5)}#app-control-buttons #pauseIcon.gray,#app-control-buttons #playIcon.gray,#app-control-buttons #resetIcon.gray{fill:#8a8a8a}.light #app-control-buttons button{border-color:#fafafa;background-color:#fff;box-shadow:1px 3px 10px rgba(0,0,0,.2)}.light #app-control-buttons #pauseIcon.gray,.light #app-control-buttons #playIcon.gray,.light #app-control-buttons #resetIcon.gray{fill:#e0e0e0}.light #playIcon{fill:#40ff40}#app-keyboard{border:1px solid #5a5a5a;background-color:#222}#app-keyboard.gray{border-color:#5a5a5a}.light #app-keyboard{border-color:#fafafa;background-color:#fff;box-shadow:3px 5px 20px rgba(0,0,0,.15)}.light #app-keyboard.gray{border-color:#fafafa}.result-display{background-color:#222}.result-display .col-label,.result-display .result-date{color:#dadada}.result-display .result-row{border-bottom:1px solid #5a5a5a}.result-display .current.red-border{border:3px dotted #ff5f5f}.result-display .current.green-border{border:3px dotted #40ff40}.light .result-display{border:1px solid #fafafa;background-color:#fff;box-shadow:3px 5px 20px rgba(0,0,0,.15)}.light .result-display .col-label,.light .result-display .result-date{color:#000}.light .result-display .result-row{border-bottom-color:#e0e0e0}.light .result-display .current.red-border{border:3px dotted #ff5f5f}.light .result-display .current.green-border{border:3px dotted #40ff40}.app-user-form .app-user-inputs{border:1px solid #5a5a5a;color:#dadada;background-color:#222;box-shadow:1px 3px 20px hsla(0,0%,100%,.5)}.app-user-form .app-user-inputs input{color:#dadada}.light .app-user-form .app-user-inputs{border:1px solid #fafafa;color:#000;background-color:#fff;box-shadow:1px 3px 20px rgba(0,0,0,.15)}.light .app-user-form .app-user-inputs input{color:#000}.app-loading{color:#dadada;background-color:rgba(34,34,34,.5)}.light .app-loading{color:#000;background-color:hsla(0,0%,100%,.5)}.about{color:#dadada}.about figure{background-color:#222}.light .about{color:#000}.light .about figure{background-color:#fff}.fasterer{background-color:#222}.fasterer .text{color:#dadada}.light .fasterer{background-color:#fff}.light .fasterer .text{color:#000}#app.mobile .screen-children-size{width:80vw;min-width:0;height:40vh;min-height:0}#app.mobile .screen-children-size#app-text-display{height:30vh}#app.mobile .app-tip-main{top:50%;left:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%)}#app.mobile #home{grid-template-rows:1fr 2fr 1fr 2fr 3fr;grid-template-areas:"header" "display" "panel" "btns" "mode"}#app.mobile #home .app-keyboard,#app.mobile #home .result-display,#app.mobile #home .typing-mode{grid-area:display}#app.mobile #test{grid-template-rows:1fr 2fr 1fr 2fr 3fr;grid-template-areas:"header" "display" "panel" "btns" "mode"}#app.mobile #app-text-display{min-width:0;min-height:0;width:90vw;height:30vh}#app.mobile #control-panel{min-width:0}#app.mobile #control-panel>div{margin:0 .5rem}#app.mobile #logo{display:none}#app.mobile #typing-mode-control .select-options-panel{-webkit-transform:translateX(-50%);transform:translateX(-50%);top:-10rem;bottom:auto;left:50%;right:auto;padding:.5rem 2rem}#app.mobile #typing-mode{width:100vw;height:30vh;padding:0}#app.mobile #typing-mode .set-text{right:auto;left:50%;bottom:.5rem;-webkit-transform:translate(-50%);transform:translate(-50%)}#app.mobile #typing-mode .byCustom textarea{width:80vw}#app.mobile .stats .result{width:100vw;grid-gap:0}#app.mobile .stats .result .value{font-size:2.5rem}#app.mobile #app-burger{right:auto;left:50%;top:1rem;-webkit-transform:translate(-50%);transform:translate(-50%)}#app.mobile .app-user-inputs{width:90vw}#app.mobile .app-user-inputs #email,#app.mobile .app-user-inputs #password,#app.mobile .app-user-inputs .more-info,#app.mobile .app-user-inputs .title{width:70vw}#app{height:100vh;width:100vw;font-family:Open Sans,Helvatica,Arial,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-align:center;margin:0;padding:0;overflow-x:hidden}.app-tip-main{position:absolute;top:30%;left:55%;z-index:99}#logo{left:7.14vw;font-family:Open Sans,Helvatica,Arial,sans-serif;font-weight:700;font-size:1.2rem}#logo,#menu-ham{position:absolute;top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%);cursor:pointer}#menu-ham{display:block;width:15px;height:12px;right:7.14vw}#menu-ham .bar{position:absolute;height:4px;right:0}#menu-ham .bar:first-child{top:0;width:10px}#menu-ham .bar:last-child{bottom:0;width:15px}#nav{padding:0;margin:0;position:fixed;width:100%;top:0;z-index:99}#nav a{padding:15px 10px;margin:0 10px;display:inline-block}#nav a.router-link-exact-active{font-weight:700}#nav a.router-link-exact-active:after{content:"";position:absolute;display:block;height:5px;width:100%;background-color:#40ff40;top:0;left:0}#app{transition:background-color .2s ease;background-color:#000}#app.light{background-color:#f0f0f0}#logo{color:#dadada}#menu-ham .bar{background-color:#dadada}#nav{background-color:transparent;background-image:linear-gradient(180deg,#000,transparent)}#nav a{color:#dadada}#nav a.router-link-exact-active{color:#26d226}.light #logo{color:#000}.light #menu-ham .bar{background-color:#000}.light #nav{background-image:linear-gradient(180deg,#f0f0f0,transparent)}.light #nav a{color:#000}.light #nav a.router-link-exact-active{color:#26d226}#app-text-display h1{font-size:2rem}#app-text-display .guide.space:before{width:.7rem}#app-text-display .wrong-char{color:#ff5f5f}#app-text-display .wrong-char.space:not(.guide):after{width:.7rem;background-color:#ff5f5f}#app-text-display.test-mode h1{font-size:1.5rem}#app-text-display.test-mode .guide.space:before,#app-text-display.test-mode .wrong-char.space:after{width:.45rem}#app-text-display{margin:0;position:relative;z-index:0;display:grid;align-content:center;justify-content:center;height:5.8rem;width:48vw;min-width:36rem;border-radius:10px}#app-text-display h1{word-break:break-all;font-weight:400;text-align:left;overflow-y:auto;margin:1.5rem}#app-text-display h1 .bold{font-weight:700}#app-text-display .thin{font-weight:400}#app-text-display .guide{position:relative;display:inline-block}#app-text-display .guide:before{content:"";display:block;position:absolute;z-index:-1;height:100%;width:100%;top:0;left:0;border-radius:3px}#app-text-display .blinking:before{-webkit-animation:blink 1s ease infinite;animation:blink 1s ease infinite}#app-text-display .wrong-char{position:relative}#app-text-display .wrong-char.space:not(.guide):after{content:"";display:block;position:absolute;height:2px;bottom:0;left:0}#app-text-display.test-mode{border-radius:5px;text-align:left;padding:0;box-sizing:border-box}#app-text-display.test-mode h1{height:auto;text-align:left;font-weight:400;overflow-y:auto;margin:1.5rem}#typing-mode-control{position:relative;width:auto;text-align:center;white-space:nowrap}#typing-mode-control .custom-select{transition:color .2s ease;width:6rem}#typing-mode-control .custom-select .select-options-panel{right:-150%}#control-panel{width:auto;text-align:center;min-width:30rem;white-space:nowrap}#control-panel>div{display:inline-block;margin:0 1rem}#control-panel .time-input{display:block;text-align:center;margin:auto;height:2rem;width:5rem;border-radius:5px;background:none}#control-panel .app-options .app-options-choice{margin:0}#control-panel .app-options .app-options-choice .show-result-btn{background:none;margin:auto;margin-top:1rem;display:block}#control-panel .app-options svg{position:absolute;left:0;top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%);height:1rem;width:1rem;transition:fill .2s ease}#control-panel .app-options .custom-select{padding-left:20px;display:inline-block}#control-panel .error,#control-panel .speed,#control-panel .time{text-transform:uppercase;font-size:1.5rem;width:6rem;text-align:center;border-radius:5px;border:3px dotted currentColor}#control-panel .error.arrow:after,#control-panel .speed.arrow:after,#control-panel .time.arrow:after{right:7.5px}#control-panel .error .select-options-panel,#control-panel .speed .select-options-panel,#control-panel .time .select-options-panel{text-transform:lowercase}#control-panel .error,#control-panel .speed{cursor:default}#app-control-buttons{white-space:nowrap;position:relative}#app-control-buttons #mobile-input{position:fixed;height:0;width:0;opacity:0;top:20vh;left:50%;-webkit-transform:translate(-50%);transform:translate(-50%);-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;pointer-events:none}#app-control-buttons button{height:3.5rem;width:3.5rem;border:none;border-radius:50%;position:relative;margin:.5rem;cursor:pointer;transition:background-color .2s ease}#app-control-buttons button.pauseBtn,#app-control-buttons button.resetBtn{-webkit-transform:scale(.8);transform:scale(.8)}#app-control-buttons button svg{position:absolute;top:50%;left:50%;height:55%;width:55%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%)}#app-control-buttons button.startBtn svg{left:55%}#pauseIcon,#playIcon,#resetIcon{transition:fill .2s ease}.app-keyboard-key{display:grid;position:relative;text-align:center;font-size:.8rem;width:100%;height:100%;margin:auto;border-radius:5px;box-shadow:3px 3px 10px rgba(0,0,0,.15);transition:all .3s ease}.app-keyboard-key span{color:inherit;position:relative;display:block;margin:auto;z-index:1}.app-keyboard-key.fin-baby{border-color:#40ff40;box-shadow:0 0 10px rgba(64,255,64,.3)}.app-keyboard-key.fin-baby.active,.app-keyboard-key.fin-baby.shift-active{color:#40ff40}.app-keyboard-key.fin-ring{border-color:#ffa845;box-shadow:0 0 10px rgba(255,168,69,.3)}.app-keyboard-key.fin-ring.active{color:#ffa845}.app-keyboard-key.fin-middle{border-color:#f573a0;box-shadow:0 0 10px rgba(245,115,160,.3)}.app-keyboard-key.fin-middle.active{color:#f573a0}.app-keyboard-key.fin-index-left{border-color:#9bf0e1;box-shadow:0 0 10px rgba(155,240,225,.3)}.app-keyboard-key.fin-index-left.active{color:#9bf0e1}.app-keyboard-key.fin-index-right{border-color:#00afd7;box-shadow:0 0 10px rgba(0,175,215,.3)}.app-keyboard-key.fin-index-right.active{color:#00afd7}.app-keyboard-key.fin-thumb{border-color:#ff5;box-shadow:0 0 10px rgba(255,255,85,.3)}.app-keyboard-key.fin-thumb.active{color:#ff5}.app-keyboard-key.active,.app-keyboard-key.shift-active{background-color:currentColor}.app-keyboard-key.active span,.app-keyboard-key.shift-active span{color:#000}.pressed{transition:all .1s ease;opacity:.3}.app-keyboard-key{border:1px solid #8a8a8a;background-color:#000;color:#fff}.gray .app-keyboard-key.active:after,.gray .app-keyboard-key.shift-active:after,.light .gray .app-keyboard-key.active:after,.light .gray .app-keyboard-key.shift-active:after{content:"";display:block;position:absolute;height:100%;width:100%;top:50%;left:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);border:2px solid #40ff40;border-radius:5px;background:none;color:#26d226}.gray .app-keyboard-key{border-color:#8a8a8a;box-shadow:3px 3px 10px rgba(0,0,0,.15)}.gray .app-keyboard-key.active,.gray .app-keyboard-key.shift-active{border-color:#40ff40;color:#fff;background-color:#000}.gray .app-keyboard-key.active span,.gray .app-keyboard-key.shift-active span{color:#26d226}.light .app-keyboard-key{background-color:#fff;color:#000}.light .app-keyboard-key.active,.light .app-keyboard-key.shift-active{background-color:currentColor}.light .gray .app-keyboard-key{border-color:#fafafa}.light .gray .app-keyboard-key.active,.light .gray .app-keyboard-key.shift-active{color:#26d226;background-color:#fff}.align-left>span{text-align:left;margin-left:10px}.align-right>span{text-align:right;margin-right:10px}.uppercase{text-transform:uppercase}.app-keyboard-key.fin-thumb.active-finger span{color:#26d226;font-weight:700}#app-keyboard{font-family:Open Sans,sans-serif;padding:10px;margin:auto;border-radius:0 0 5px 5px;transition:background-color .2s ease;position:relative}#app-keyboard.test-mode{display:none}.keyboard__rows{height:100%;width:100%;margin-bottom:10px;display:grid;grid-template-rows:repeat(5,1fr);grid-template-columns:1fr;grid-gap:3.2%;min-height:0;align-items:stretch;align-content:stretch;justify-items:stretch}.keyboard__rows>div{display:grid;grid-template-rows:1fr;grid-gap:1.1%}.keyboard__NUMBER_ROW{grid-template-columns:repeat(13,1fr) 2fr}.keyboard__TOP_ROW{grid-template-columns:1.8fr repeat(12,1fr) 1.2fr}.keyboard__HOME_ROW{grid-template-columns:2.2fr repeat(11,1fr) 1.8fr}.keyboard__BOTTOM_ROW{grid-template-columns:2.5fr repeat(10,1fr) 2.5fr}.keyboard__SPACE_ROW{grid-template-columns:1.5fr 1fr 1.5fr 7fr 1.5fr 1fr 1.5fr}#result-confetti{height:100vh;width:100vw;position:fixed;top:0;left:0;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;pointer-events:none}#result-confetti .confetti__bit{top:50%;left:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);position:absolute;height:1rem;border-radius:50%}.result-display{position:relative;padding:10px;margin:auto;border-radius:0 0 5px 5px;grid-template-rows:2.5rem auto;grid-row-gap:.5rem}.result-display,.result-display .results-wrapper{display:grid;grid-template-columns:1fr;justify-content:center;align-content:start;justify-items:stretch}.result-display .results-wrapper{grid-auto-rows:3rem;overflow-y:scroll}.result-display .result-row{display:grid;grid-template-columns:repeat(4,1fr);grid-template-rows:1fr;place-content:center;place-items:center}.result-display .col-label{font-weight:700;border-bottom:none}.result-display .current{font-weight:700}#typing-mode{border-radius:5px;padding:20px;align-content:stretch;position:relative}#typing-mode,#typing-mode>div{margin:auto;display:grid;justify-content:center}#typing-mode>div{align-content:center}.byKeyboard{grid-template-columns:1fr;grid-template-rows:repeat(5,1fr);grid-gap:.5rem;width:20rem;min-width:20rem}.byKeyboard label{padding:0;display:grid;grid-template-columns:1fr 3fr 6fr;grid-template-rows:1fr;grid-template-areas:". sample samplespacing";justify-items:start}.byKeyboard label>.samples{grid-area:sample}.byKeyboard label .samples.spacing{grid-area:samplespacing}.byWords{grid-gap:.5rem}.byWords .words{width:auto;text-align:left}.byHand{grid-template-columns:1fr 1fr;grid-template-rows:1fr;grid-gap:0 2rem;width:20rem}.byHand .hand{display:grid;grid-gap:0 2rem;grid-template-columns:1fr;grid-template-rows:2fr repeat(5,1fr);align-content:center;justify-content:center;align-items:center}.checkmark.radio{border-radius:50%}.required{width:auto;white-space:nowrap;position:absolute;top:.5rem;left:50%;-webkit-transform:translate(-50%);transform:translate(-50%)}.byCustom{width:20rem}.byCustom textarea{padding:10px;border-radius:5px;border:1px dotted #ccc;font-size:1rem;height:8rem;width:25rem}.set-text{display:block;cursor:pointer;position:absolute;bottom:0;right:0;background:none;-webkit-transform:translate(-1rem,-1rem);transform:translate(-1rem,-1rem)}.samples,.set-text{transition:color .2s ease}.samples.spacing{letter-spacing:.3rem}#home{height:100vh;width:100vw;margin:0;padding:0;display:grid;align-content:center;justify-content:center;grid-template-rows:2fr 3fr 1fr 5fr 3fr;grid-template-columns:1fr;grid-template-areas:"header" "display" "panel" "screen" "btns";grid-gap:1rem}#home .app-text-display{grid-area:display;align-self:center;justify-self:center}#home .control-panel{grid-area:panel;justify-self:center;align-self:end;justify-content:center;align-content:center}#home .app-keyboard,#home .result-display,#home .typing-mode{grid-area:screen}#home .app-control-buttons{grid-area:btns}#home .typing-mode-control{grid-area:mode;align-self:start;justify-self:center}#test{height:100vh;width:100vw;margin:0;padding:0;display:grid;grid-template-rows:2fr 3fr 1fr 5fr 3fr;grid-template-columns:1fr;grid-template-areas:"header" "cheer" "panel" "display" "btns";grid-gap:1rem;align-content:center;justify-content:center}#test .cheer{grid-area:cheer;font-size:1.75rem;align-self:center;justify-self:center}#test .control-panel{grid-area:panel;align-self:end;justify-self:center}#test .app-text-display{grid-area:display;justify-self:center;align-self:center}#test .result-display{grid-area:display;justify-self:center;align-self:end}#test .app-control-buttons{grid-area:btns}#test .typing-mode-control{grid-area:mode;align-self:start;justify-self:center}#graph{position:fixed;height:40vh;width:100vw;bottom:0;left:0;display:grid;grid-template-rows:1fr;grid-template-columns:2rem auto;grid-template-areas:". chart"}#graph sup{font-size:.5rem}#graph .result-lines{position:absolute;width:100vw;height:64%;bottom:16%;left:0}#graph .result-lines:after{content:"";display:block;position:absolute;height:2px;width:100%;left:0;bottom:0}#graph .result-lines>div{opacity:1;position:absolute;left:0;bottom:0;height:0;width:100%;border:1px dashed transparent;border-bottom-color:currentColor}#graph .result-lines>div:after{content:attr(data-content);position:absolute;bottom:0;left:.5rem;font-size:.75rem;display:block;color:currentColor}#graph .result-lines>div:first-child{color:#00afd7}#graph .result-lines>div:nth-child(2){color:#26d226;border-bottom-color:#40ff40}#graph .result-lines>div:nth-child(3){color:#ff5f5f}#graph .result-cell{position:relative;height:80%;display:grid;grid-template-columns:1fr 1fr 1fr;grid-template-rows:4fr 1fr;grid-template-areas:"time speed error" "date date date";justify-content:center;align-content:end;justify-items:center}#graph .result-cell:hover>.result-label{-webkit-transform:translateY(0);transform:translateY(0);opacity:1}#graph .result-cell .result-col{opacity:1;width:.5rem;-webkit-transform-origin:bottom;transform-origin:bottom}#graph .result-cell .date-row{grid-area:date}#graph .result-cell .time-col{grid-area:time;background-color:#00afd7}#graph .result-cell .speed-col{grid-area:speed;background-color:#40ff40}#graph .result-cell .error-col{grid-area:error;background-color:#ff5f5f}.result-label{position:absolute;height:3rem;width:auto;border-radius:5px;display:grid;grid-template-rows:1fr;grid-template-columns:repeat(3,1fr);grid-gap:1rem;place-content:center;place-items:center;font-size:1rem;bottom:100%;padding:0 .5rem;z-index:10;opacity:0;-webkit-transform:translateY(100%);transform:translateY(100%);transition:opacity .2s ease .1s,-webkit-transform .2s ease .1s;transition:opacity .2s ease .1s,transform .2s ease .1s;transition:opacity .2s ease .1s,transform .2s ease .1s,-webkit-transform .2s ease .1s;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;pointer-events:none}.result-label>div:first-child{color:#00afd7}.result-label>div:nth-child(2){color:#26d226}.result-label>div:nth-child(3){color:#ff5f5f}.result-label:after,.result-label:before{content:"";position:absolute;display:block;height:0;width:0;left:50%;top:100%}.result-label:after{z-index:11;-webkit-transform:translate(-50%,-1px);transform:translate(-50%,-1px);border:.5rem solid transparent}.result-label:before{z-index:9;-webkit-transform:translate(-50%);transform:translate(-50%);border:calc(.5rem + 1px) solid transparent}.result-cells-container{padding-left:4rem;grid-area:chart;height:100%;width:auto;display:grid;grid-template-rows:1fr;grid-auto-columns:2rem;grid-auto-flow:column;grid-gap:2rem;align-items:end;overflow-x:auto}#graph .result-lines:after{z-index:10;background-color:#8a8a8a}#graph .result-cell .date-row{color:#dadada}.light #graph .result-lines:after{background-color:#cacaca}.light #graph .result-cell .date-row{color:#000}.result-label{background-color:#222;border:1px solid #5a5a5a;color:#dadada}.result-label:after{border-top-color:#222}.result-label:before{border-top-color:#5a5a5a}.light .result-label{background-color:#fff;border:1px solid #fafafa;color:#000}.light .result-label:after{border-top-color:#fff}.light .result-label:before{border-top-color:#fafafa}.stats{display:grid;height:100vh;width:100vw;grid-template-rows:3fr 3fr 6fr;grid-template-columns:1fr;grid-gap:2rem;align-content:center;justify-content:center}.stats .switch{align-self:end}.stats .switch button{border-width:1px;margin:0 .5rem}.stats .switch button.green{color:#26d226}.result{align-self:end;justify-self:center;display:grid;grid-template-rows:1fr;grid-template-columns:1fr 1fr 1fr;align-content:center;align-items:center;justify-content:center;grid-gap:2rem;position:relative}.result .value{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;font-size:3rem;font-weight:700}.result .value .tooltip-text{font-weight:400;width:7.5rem;padding:.5rem}.result .label{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-transform-origin:left center;transform-origin:left center;text-align:left;-webkit-transform:translate(50%,-1rem) rotate(90deg);transform:translate(50%,-1rem) rotate(90deg)}.total-time sup{font-size:1rem}.about{position:relative}.about main{margin:2rem auto;text-align:left;display:grid;grid-auto-rows:90vh;grid-template-columns:1fr;grid-gap:2rem;align-content:center;justify-content:center;align-items:center;justify-items:center}.about section{position:relative;width:100%;max-width:50rem}.about h1{font-size:2rem}.about h2{font-weight:400;font-size:1.25rem}.about figure{width:100%;max-width:40rem;height:auto;padding:1rem;display:grid;align-content:center}.about figure img{display:block;width:100%;height:auto}.about .grid-2{display:grid;height:100%;grid-template-columns:1fr;grid-template-rows:1fr 1fr;grid-row-gap:2rem;align-content:center;justify-content:center;align-items:center;grid-template-areas:"div-2" "fig-2";text-align:center}.about .grid-2 figure{justify-self:center;align-self:start;grid-area:fig-2}.about .grid-2 div{width:100%;justify-self:center;align-self:end;grid-area:div-2}.about .grid-2 h1{margin:1rem 0}.about .grid-2 p{position:relative}.about .grid-2 p:after{content:"";display:block;position:absolute;height:0;width:0;top:50%;left:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);border:.5rem solid transparent;border-left-color:#cecece}.about .about-num{font-size:2.5rem;font-weight:700;position:relative;margin:0 3rem}.about .about-num span{position:relative;font-weight:400;font-size:1rem;text-align:left;display:inline-block;margin-left:1rem}.about .grid-3{height:auto;display:grid;grid-template-columns:1fr;grid-template-rows:1fr 2fr 4fr;grid-gap:1rem;align-content:center;justify-content:center;align-items:center;justify-items:center;grid-template-areas:"h1-3" "h2-3" "fasterer-3";text-align:center}.about .grid-3 h1{grid-area:h1-3}.about .grid-3 h2{grid-area:h2-3}.about .grid-3 .cat{margin:1rem auto;display:block}.about .grid-3 .fasterer{display:grid;align-content:center;justify-content:center;grid-area:fasterer-3;position:relative;height:100%;width:100%}.about .grid-3 .fasterer .text{position:relative;font-size:3rem;font-weight:700}.about .grid-3 .fasterer .guide{position:relative}.about .grid-3 .fasterer .guide:before{content:"";display:block;position:absolute;z-index:0;height:100%;width:100%;top:0;left:0;border-radius:3px}.about .grid-3 .fasterer .blinking:before{-webkit-animation:blink 1s ease infinite;animation:blink 1s ease infinite}.about footer{width:100%;text-align:center;position:absolute;bottom:0}.app-user-form[data-v-fa8531c8]{position:fixed;height:100vh;width:100vw;top:0;left:0}.app-user-form .app-user-inputs[data-v-fa8531c8]{position:absolute;top:50%;left:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);width:28rem;height:auto;display:grid;align-content:center;justify-content:center;align-items:center;justify-items:center;padding:2rem 1rem;grid-gap:1rem;grid-template-columns:1fr;grid-template-rows:1fr 2fr 2fr 1fr 1fr;border-radius:10px}.app-user-form .app-user-inputs .more-info[data-v-fa8531c8]{width:20rem;text-align:left;font-size:.75rem}.app-user-form .app-user-inputs .more-info span[data-v-fa8531c8]{margin-left:5px;cursor:pointer}.app-user-form .app-user-inputs .title[data-v-fa8531c8]{width:20rem;font-size:1.5rem;text-align:left}.app-user-form .app-user-inputs .user-input[data-v-fa8531c8]{text-align:left}.app-user-form .app-user-inputs .user-input label[data-v-fa8531c8]{padding:0;text-transform:uppercase;font-size:.75rem}.app-user-form .app-user-inputs .user-input input[data-v-fa8531c8]{background:transparent}.app-user-form .app-user-inputs button[data-v-fa8531c8]{width:auto;border-width:1px;margin:auto;display:block;background:none;font-size:1rem;cursor:pointer}#email[data-v-fa8531c8],#password[data-v-fa8531c8]{display:block;background:none;border-radius:5px;height:2.5rem;padding:0 1rem;width:20rem;border-width:1px;margin-top:.5rem}