body{background-color:#f5f8fa;font-family:Montserrat;counter-reset:grade-number}
a{line-height:inherit;color:#333;text-decoration:none;cursor:pointer}
a:hover,a:focus{color:#333}
.top-header{background:#303032}
.second-nav{text-align:right;margin:15px}
.second-nav a{color:#f5f8fa;font-weight:600;padding:0 6px;text-decoration:none;font-size:15px;font-family:Open Sans}
.second-nav a:hover{text-decoration:underline;transition:all .3s ease-in-out 0}

.menu-hover-lines{font-weight:500}
.menu-hover-lines li a{color:#444;position:relative}
.menu-hover-lines li.active > a{background-color:transparent}
.menu-hover-lines a::after{height:3px;position:absolute;content:'';transition:all .35s ease;background-color:#1779ba;width:100%;bottom:0;left:0;background-color:#000;visibility:hidden;-webkit-transform:scaleX(0);transform:scaleX(0);-webkit-transition:all .3s ease-in-out 0;transition:all .3s ease-in-out 0}
.menu-hover-lines a:hover,.menu-hover-lines li.active > a{color:#0a0a0a;transition:all .35s ease}
.menu-hover-lines a:hover::after,.menu-hover-lines .active a::after{visibility:visible;-webkit-transform:scaleX(1);transform:scaleX(1)}

@media (max-width: 1279px) {
.navbar-brand{position:relative;height:unset;width:unset;box-shadow:none;top:38px;background:none}
.top-header{display:none}
.navbar-brand img{height:70px;width:auto;top:0}
.navbar-brand-inner{margin:10px;position:absolute}
.header{height:80px;box-shadow:1px 1px 4px 0 rgba(0,0,0,.1);background:#f4d032;position:relative}
.header li a{padding:10px}
}
@media (min-width: 75em) {
.header li{float:left}
}
.btn-nav{font-size:18px;letter-spacing:.5px;font-weight:600;border:2px solid #000;border-radius:3px;padding:5px 25px;color:#000;transition:all .3s ease-in-out 0;display:inline-block;vertical-align:middle;margin:0 0 1rem;-webkit-appearance:none;line-height:2;text-align:center;cursor:pointer;background:transparent;margin-top:15px;margin-right:10px;float:right;margin-left:20px}
.btn-nav:hover{border:2px solid #000;border-radius:3px;background-color:#000;color:#f4d032}
.index-section-1{margin:0 auto;padding-top:80px;background:  url("../img/typing-bg.png")no-repeat center;height:400px;margin-top:0;webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;}
.section-1-btn{font-size:24px;letter-spacing:.5px;font-weight:600;border:2px solid #000;border-radius:3px;padding:15px 30px;color:#272727;-webkit-appearance:none;line-height:36px;text-align:center;cursor:pointer;background-color:#F4D032;border:2px solid #F4D032;font-family:Poppins;text-transform:capitalize;display:inline-block;width:300px;margin-right:30px;transition:.3s ease-out;margin-top:40px}
.section-1-btn:hover{background-color:rgba(0,0,0,0.151);border:2px solid #F4D032;color:#F4D032}
.section-1-btn-wrap{width:290px;float:left}
.banner-text{color:#f5d033;font-size:46px;line-height:68px;font-weight:600;letter-spacing:1px;font-family:Poppins}
.banner-text span{color:#fff}
.index-section-2{margin:0 auto;padding:80px 0;background-color:#262626;}
.index-stats-box{background-color:#272727;border-radius:5px;width:100%;text-align:center;padding:28px 0;transition:all .3s ease-in-out 0;margin:0 0 1rem}
.index-stats-box-heading-text{font-size:35px;color:#fff;font-weight:700;font-family:Montserrat}
.index-stats-box-sub-heading-text{font-size:23px;color:#fff;font-weight:400;letter-spacing:1px;font-family:Open Sans;font-weight:400}
.index-section-3{margin:0 auto;background-color:#F4D032;padding:90px 0}
.about-heading-text{font-size:36px;color:#000;font-weight:600;font-family:Poppins;padding: 0px 50px;
text-align: justify;}
.about-normal-text{font-size:18px;color:#000;font-family:Open Sans;font-weight:400;margin-top:15px;padding: 0px 50px;
text-align: justify;}
.index-section-4{background-color:#f8f8f8;padding:50px 0 60px}
.content-heading-text{font-size:36px;font-weight:700;color:#000;text-align:center;font-family:Montserrat;margin-bottom:10px}
.content-box-bg{background-color:#fff;box-shadow:0 0 14px #0000001a;padding:0;margin-top:20px}
.why-love-box-Htext{font-size:22px;color:#000;font-weight:700;font-family:Montserrat;margin-bottom:10px}
.why-love-box-Ntext{font-size:16px;color:#000;font-family:Open Sans;font-weight:400}
.box-cont-row{border-bottom:1px solid #c3c3c3;padding:35px 45px 20px;cursor:pointer;transition:all .4s ease-in-out 0;position:relative}
.box-cont-row:hover{border-bottom:1px solid #c3c3c3;background-color:#272727}
.box-cont-row:hover .why-love-box-Htext,.box-cont-row:hover .why-love-box-Ntext{color:#fff;transition:all .3s ease-in-out 0}
.box-cont-row.last{border-bottom:0 solid #c3c3c3;padding:35px 45px 18px;cursor:pointer}
.game-hover{position:absolute;z-index:10;top:0;left:0;opacity:0}
.box-cont-row:hover .game-hover{position:absolute;z-index:10;top:0;left:0;-webkit-transition:opacity .3s ease-in-out;-moz-transition:opacity .3s ease-in-out;-o-transition:opacity .3s ease-in-out;transition:opacity .3s ease-in-out;opacity:10}
.lessons-hover{position:absolute;z-index:10;top:0;left:0;opacity:0}
.box-cont-row:hover .lessons-hover{position:absolute;z-index:10;top:0;left:0;-webkit-transition:opacity .3s ease-in-out;-moz-transition:opacity .3s ease-in-out;-o-transition:opacity .3s ease-in-out;transition:opacity .3s ease-in-out;opacity:10}
.tests-hover{position:absolute;z-index:10;top:0;left:0;opacity:0}
.box-cont-row:hover .tests-hover{position:absolute;z-index:10;top:0;left:0;-webkit-transition:opacity .3s ease-in-out;-moz-transition:opacity .3s ease-in-out;-o-transition:opacity .3s ease-in-out;transition:opacity .3s ease-in-out;opacity:10}
.typing-chart-hover{position:absolute;z-index:10;top:0;left:0;opacity:0}
.box-cont-row:hover .typing-chart-hover{position:absolute;z-index:10;top:0;left:0;-webkit-transition:opacity .3s ease-in-out;-moz-transition:opacity .3s ease-in-out;-o-transition:opacity .3s ease-in-out;transition:opacity .3s ease-in-out;opacity:10}
.box-cont-icon-margin-top{margin-top:8px;position:relative}
.index-section-5{background-color:#fff;padding-bottom:105px}
.started-today-image-block{position:relative;top:-50px;height:225px;left:58px}
.started-today-heading-text{color:#000;font-family:Poppins;font-weight:600;font-size:30px;margin-top:38px}
.started-today-genaral-text{font-size:18px;color:#000;font-family:Open Sans;font-weight:400;margin-top:12px;margin-bottom:30px}
.index-section-6{background-color:#272727;padding:90px 0;margin-top:60px;margin-bottom:60px}
.free-for-student-heading-text{font-size:40px;color:#fff;text-align:center;font-family:Poppins;font-weight:600;margin-bottom:20px}
.btn-section-6{font-size:24px;letter-spacing:.5px;font-weight:600;border:2px solid #000;border-radius:3px;padding:15px 30px;color:#fff;-webkit-appearance:none;line-height:36px;text-align:center;cursor:pointer;background:transparent;border:2px solid #fff;font-family:Poppins;margin-top:20px;margin-right:20px;display:inline-block}
.btn-section-6:hover{border:2px solid #f4d032;border-radius:3px;background-color:#f4d032;color:#272727}
.teacher-signup-button-wrap{float:right;margin-right:15px}
.student-signup-button-wrap{float:left;margin-left:15px}
.footer-block-1{background-color:#272727;margin:0 auto}
.footer-nav{background-color:rgba(38,38,38,1.0);text-align:center;padding:30px 0 0px 0px;}
.footer-nav a{color:#fff;padding:0 6px;text-decoration:none}
.footer-nav a:hover{text-decoration:underline;color:#f4d032;transition:all .3s ease-in-out 0}
.footer-block-2{margin:0 auto;padding:20px 0}
.copyright-text{font-size:18px;font-family:Open Sans;color:#272727;font-weight:400}
.footer-nav-2{text-align:center}
.footer-nav-2 a{color:#272727;font-weight:600;font-family:Open Sans;padding:0 6px;text-decoration:none}
.footer-nav-2 a:hover{text-decoration:underline;color:#111;transition:all .3s ease-in-out 0}
.category-page{margin:0 auto;max-width:80rem}
.main-container{display:flex;padding-top: 20px;margin:auto}
.left-content{width:60rem;margin:0 auto;margin-top:10px;margin-bottom:30px;padding-right:.9375rem;padding-left:.9375rem}
.ads-label{text-align: center;padding: 0 10px 10px 10px;font-weight: 600;}
@media (min-width: 1400px) {
.left-content{width:65rem}
.category-page{max-width:85rem}
}
@media (max-width: 1200px) {
.left-content{width:100%}
}
.sidebar{max-width: 20rem;min-width: 20rem;margin-top: 10px;margin-bottom: 20px;}
@media (max-width: 1280px) {
.sidebar{width:15rem}
}
@media (max-width: 1270px) {
.sidebar{display:none}
}
.category-block{margin-top:10px;text-align:center}
.header-ads{padding:10px 0;background:#fff;text-align:center;}
.sidebar-ads{background: #fff;padding: 10px;margin-bottom: 10px;}
@media (max-width: 1280px) {
.sidebar-ads{display:none}
}
@media (max-width: 1279px) {
.sidebar-180{display:none}
}
@media (min-width: 1281px) {
.sidebar-180{display:none}
}
@media (min-width: 1280px) and (max-width: 1280px) {
.sidebar-180{display:block;padding:2px;min-width:180px;min-height:600px;margin-top:10px;text-align:center;}
}
.test-cards{background:#FFF;padding:20px;border-radius:5px;margin:auto;text-align:center;margin-bottom:30px}
.test-certi{border-radius:5px;margin:auto;text-align:justify;font-size:20px;line-height:1.6;margin-bottom:30px;background:#FFF;padding:20px;border-radius:5px}
@media (max-width: 900px) {
.test-certi{padding:10px;font-size:16px}
}
.test-link{background:#F4D032;font-size:24px;padding:20px 35px;color:#333;border-radius:5px;display:inline-block;width:100%;text-align:center;font-weight:500;font-family:Poppins;transition:.3s ease-out;background-color:#F4D032;border:2px solid #F4D032;font-size:24px;letter-spacing:.5px}
.test-link:hover{background-color:#272727;border:2px solid #262626;color:#FFF}
@media (max-width: 900px) {
.test-link{margin-bottom:10px;font-size:18px}
}
.lesson-cards{-webkit-box-flex:1;-webkit-flex:1 0 auto;-ms-flex:1 0 auto;margin-top:10px;padding:15px;background:#fff;margin-bottom:10px;box-shadow:inset 0 0 0 #fff,inset 0 1px 1px -1px #fff,0 1px 1px 0 #e3e2e2;border-radius:5px}
.word-type-header-bg{background-color:#f4d032;border-radius:5px 5px 0 0;position:relative;color:#272727;font-weight:600;font-size:22px}
@media (max-width: 800px) {
.word-type-header-bg{font-size:18px}
}
.word-type-box-number{background-color:#272727;border-radius:100%;font-family:Poppins;font-weight:600;font-size:20px;color:#f5d033;width:38px;height:38px;line-height:38px;position:absolute;z-index:10;top:8px;left:8px}
@media (max-width: 800px) {
.word-type-box-number{font-size:18px}
}
.word-type-box-bg{background-color:#595954;border-radius:0 0 5px 5px;padding:5px 15px}
.restart-button-wrap{width:60%;margin:8px auto}
.start-button{background-color:#272727;font-family:Poppins;font-size:22px;color:#f5d033!important;font-weight:500;height:auto;text-transform:capitalize;border-radius:4px;width:40%;border:2px solid #f5d033;transition:all .3s ease-in-out 0;box-shadow:none;padding-top:4px;padding-bottom:4px;cursor:pointer;margin:0 auto}
.start-button:hover{background-color:#f5d033;color:#272727!important}
@media (max-width: 800px) {
.start-button{width:80%}
}
.lesson-section{padding:0;margin:0}
.lesson-section ul{padding:0;margin:10px 5px;display:flex}
.lesson-section li{padding:0;margin:0 5px 0 0;list-style-type:none;display:inline-block;width:100%;height:10px;cursor:pointer;background-color:#fff}
.lesson-section li.active{background-color:#f5d033}
.lesson-section li:last-child{margin:0}
.word-type-bottom-block{padding:20px 0 0;margin:0}
.typing-lesson-icon{position:relative;background-color:#595954;display:inline-block;padding:12px;margin-right:20px;z-index:1;border-radius:5px 0 0 0}
.typing-lesson-icon::after{content:'';width:15px;height:15px;border-radius:2px;position:absolute;left:100%;transform:translate(-50%,-50%) rotate(45deg);top:50%;background-color:#595954;margin-left:-1px;z-index:-1}
.typing-lesson-icon img{width:40px;height:auto}
.speed-box{width:47%;border:2px solid #f5f8fa;font-family:Poppins;font-size:18px;color:#272727;text-align:center;border-radius:3px;padding:3px 0;float:left;font-weight:600;background-color:#f5f8fa}
.accuracy-box{width:47%;border:2px solid #f5f8fa;font-family:Poppins;font-size:18px;color:#272727;text-align:center;border-radius:3px;padding:3px 0;float:right;font-weight:600;background-color:#f5f8fa}
@media (max-width: 800px) {
.speed-box,.accuracy-box{width:100%;font-size:16px;padding:5px 0;margin-bottom:0;margin-top:10px}
}
.category-title{margin:30px auto;padding:5px;text-align:center;font-weight:600;color:#000;position:relative;background:#fff;border-radius:10px;font-size:34px;font-family:Poppins;letter-spacing:1px;position:relative;line-height:90px}
@media (max-width: 800px) {
.category-title{font-size:20px}
}
.sb9:before{content:'';display:block;height:35px;width:35px;background-color:inherit;border:inherit;position:absolute;bottom:-17px;left:calc(50% - 0px);clip-path:polygon(0% 0%,100% 100%,0% 100%);transform:rotate(-45deg);border-radius:0 0 0 .23em}
.cat-svg{opacity:.5}
.cat-svg:hover{opacity:1}
.cat-svg:active{opacity:1}
.cat-svg:focus{opacity:1}
.progress-bar-text a{font-family:Montserrat;font-weight:600;color:#272727;font-size:20px;text-align:center}
.progress-bar-text a:hover{color:#272727;text-decoration:underline}
.cat-selection{padding-top:20px;padding-bottom:20px}
.cat-cards{background:#FFF;padding:15px;border-radius:5px;margin:auto;text-align:justify;margin-bottom:10px;font-size:18px;letter-spacing:.25px;margin-top:15px;font-family:Poppins}
.grade-box{border-radius:5px;overflow:hidden;margin-bottom:10px;counter-increment:number;transition:all ease .2s;opacity:1;margin-top:20px}
.grade-box:hover,.grade-box:focus{opacity:.8}
.grade-icon{background-color:#303032;position:relative;border-bottom:3px solid #fff}
.grade-icon::before{color:#fff;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-size:24px;font-weight:700;margin-top:-20px;line-height:1;counter-increment:grade-number;content:counter(grade-number)}
.grade-icon img{margin-left:auto;margin-right:auto;display:block;cursor:pointer;max-width:120px;padding-top:10px;padding-bottom:10px;position:relative}
.grade-label{display:block;background-color:#F4D032;font-size:18px;font-weight:600;padding:8px;color:#272727}
.grade-label:hover,.grade-label:focus{color:#272727;transition:.3s ease-in-out}
@media screen and (min-width: 40em) {
.grade-icon::before{font-size:28px;margin-top:-15px}
.grade-label{font-size:22px;padding:10px}
}
@media screen and (min-width: 64em) {
.grade-icon::before{margin-top:-17px}
}
.typing-test-list{margin-top:10px;margin-bottom:10px}
.typing-test-link{border-radius:4px;overflow:hidden;display:block;background-color:#fff;font-size:18px;color:#575757;transition:all ease .2s;font-family:Open sans;font-weight:600;border:2px solid #373737;letter-spacing:.25px;text-transform: capitalize;line-height:50px}
.typing-test-link:hover,.typing-test-link:focus{background-color:#F4D032;color:#272727}
.typing-test-icon{position:relative;background-color:#272727;display:inline-block;padding:5px;margin-right:20px;z-index:1}
.typing-test-icon::after{content:'';width:15px;height:15px;border-radius:2px;position:absolute;left:100%;transform:translate(-50%,-50%) rotate(45deg);top:50%;background-color:#272727;margin-left:-1px;z-index:-1}
.typing-test-icon img{width:40px;height:auto;padding-top:5px;padding-bottom:5px}
@media (max-width: 800px) {
.typing-test-link{font-size:14px}
}
.catactive{opacity:1}
li.section_completed{background-color:#f4d032}
@font-face{font-family:SFCompactTextM;src:url(../font/SFCompactText-Medium.otf)}
.typing-content{background-color:#fff;padding:2px 18px;border-radius:10px;margin:auto;height:144px;overflow:hidden;margin-bottom:15px}
@media (max-width: 1366px) {
.typing-content{height:144px}
}
.typing-text-line{font-size:32px;font-weight:400;color:#333;line-height:70px;font-family:'Roboto Mono',monospace;border-bottom:2px solid #e0e1e2}
@media (max-width: 1400px) {
.typing-text-line{font-size:30px}
}
.typing-text-line-last{line-height:57px;height:70px}
.letter{margin-right:1px;margin-left:1px;padding-bottom:5px}
.rightnew{color:#0e630e;background:#e7fbd3;padding-top:3px!important;border-radius:4px}
.letter.iswrong{background-color:#ffdcd9;border-radius:3px;color:#d55b60;padding-top:3px!important}
.goingnew{border-bottom:4px solid #2994e2;border-radius:0!important;color:#2994e2}
.goingnewnew{border-bottom:4px solid #2994e2;border-radius:0!important;color:#2994e2}
.keyboard-container{display:flex;padding:3px;margin:auto;width:60rem!important;position:relative;margin-top:15px;margin-bottom:320px}
@media (max-width: 1366px) {
.keyboard-container{width:55rem!important}
}
.keyboard-bg{background:#e0e1e2;border-radius:10px;width:100%}
.keyboard-layout{padding:16px}
.key-row{display:flex;flex:1;justify-content:space-between;margin-bottom:8px;max-height:50px}
@media (max-width: 1366px) {
.key-row{max-height:45px}
}
.key-row:last-child{margin-bottom:0}
.double-key{-ms-flex-direction:column;flex-direction:column;font-size:17px}
.key2{-ms-flex:1;flex:1;-ms-flex-preferred-size:40px;flex-basis:40px;margin-right:6px;box-shadow:inset 0 0 0 #fff,inset 0 1px 1px -1px #fff,0 1px 3px 0 #c3c3c3}
.key2:last-child{margin-right:0}
.key-style{background-color:#000;color:#c3c3c3;font-size:24px;font-weight:400;border-radius:3px;position:relative;text-transform:uppercase}
@media (max-width: 1366px) {
.key-style{font-size:22px}
}
.double-key .key-text:first-child{height:50%;font-size:18px}
.double-key .key-text:last-child{height:50%;top:48%;font-size:18px}
.key-text{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;height:100%;-ms-flex-pack:center;justify-content:center;left:0;position:absolute;top:0;text-align:center;white-space:nowrap;width:100%;font-family:Open Sans;font-weight:600}
.key-style:after{content:"";display:block;margin-top:100%}
.special-key-left .key-text{-ms-flex-align:end;align-items:flex-end;bottom:5px;color:#aaa;display:block;font-size:14px;line-height:1;font-weight:600;text-align:left;padding-top:7px;padding-left:7px;line-height:1}
.special-key-right .key-text{-ms-flex-align:end;align-items:flex-end;bottom:5px;color:#d3d3d3;display:block;font-size:14px;line-height:1;font-weight:600;text-align:right;padding-top:7px;padding-right:7px;line-height:1}
@media (max-width: 980px) {
.keyboard-container{width:85%!important}
.key-row{max-height:32px}
.key-style{font-size:14px}
.double-key .key-text:last-child{font-size:12px}
.double-key .key-text:first-child{font-size:12px}
.special-key-left .key-text{font-size:9px;padding:2px}
.special-key-right .key-text{font-size:9px;padding:2px}
}
@media (max-width: 500px) {
.key-row{max-height:22px}
}
.hand-box-wrap{position:absolute;z-index:10;top:0;left:0;display:block;width:100%;height:100%}
.finger-DN{display:none;opacity:.9}
.finger-scale-left{transform:scale(0.5);transform-origin:left top;position:absolute;z-index:100}
.finger-1{top:0;left:-9%}
.finger-2{top:1%;left:-2%}
.finger-3{top:-1%;left:-4%}
.finger-4{top:-1%;left:3%}
.finger-5{top:-1%;left:5%}
.finger-Tab{top:25%;left:-7%}
.finger-Q{top:20%;left:-7%}
.finger-W{top:25%;left:-3%}
.finger-E{top:25%;left:-2%}
.finger-R{top:22%;left:-2%}
.finger-T{top:22%;left:1%}
.finger-CapsLock{top:33%;left:-8%}
.finger-A{top:33%;left:-2%}
.finger-S{top:33%;left:-2%}
.finger-D{top:33%;left:-2%}
.finger-F{top:33%;left:-2%}
.finger-F-Default{top:33%;left:-2%}
.finger-G{top:33%;left:0}
.finger-Shift-Left{top:32%;left:-5%}
.finger-Z{top:20%;left:2%}
.finger-X{top:28%;left:4%}
.finger-C{top:28%;left:3%}
.finger-V{top:28%;left:-6%}
.finger-B{top:26%;left:-4%}
.finger-Left-Space{transform:scale(0.5);transform-origin:left top;position:absolute;top:32%;left:-2%;z-index:100}
.finger-scale-right{transform:scale(0.5);transform-origin:right top;position:absolute;z-index:100}
.finger-delete{top:-3%;right:3%}
.finger-Add{top:-2%;right:-5%}
.finger-Substract{top:-2%;right:2%}
.finger-0{top:-3%;right:8%}
.finger-9{top:4%;right:15%}
.finger-8{top:1%;right:13%}
.finger-7{top:1%;right:20%}
.finger-6{top:-8%;right:15%}
.finger-Pipe{top:20%;right:0}
.finger-Bracket-Close{top:23%;right:0}
.finger-Bracket-Open{top:16%;right:-1%}
.finger-P{top:19%;right:5%}
.finger-O{top:26%;right:6%}
.finger-I{top:26%;right:6%}
.finger-U{top:24%;right:7%}
.finger-Y{top:22%;right:11%}
.finger-Enter{top:35%;right:2%}
.finger-Apostrophe{top:38%;right:4%}
.finger-Colon{top:33%;right:4%}
.finger-L{top:33%;right:4%}
.finger-K{top:33%;right:4%}
.finger-J{top:33%;right:4%}
.finger-J-Default{top:33%;right:4%}
.finger-H{top:33%;right:7%}
.finger-Shift-Right{top:33%;right:2%}
.finger-Qus{top:31%;right:6%}
.finger-Greaterthan{top:28%;right:7%}
.finger-Lessthen{top:28%;right:3%}
.finger-M{top:28%;right:-5%}
.finger-N{top:24%;right:-1%}
.finger-Right-Space{top:33%;right:5%}
.typing-page{width:100%;margin:0 auto;margin-top:0;margin-bottom:0;margin-top:10px;margin-bottom:30px}
.blinkone{background-color:red!important;border:1px solid red!important;color:#FFF!important}
.keyHighlight{background-color:#0071BD!important;border:1px solid #0071BD!important;color:#FFF!important;height:auto}
.keyHighlightnew{background-color:#0071BD!important;border:1px solid #0071BD!important;color:#FFF!important;height:auto}
.keyHighlightnewshift{background-color:#0071BD!important;border:1px solid #0071BD!important;color:#FFF!important;height:auto}
.displayfingerkey{display:none}
.keydisplayfinger{display:block!important}
.letter.wrong{background-color:#ffdcd9;border-radius:4px;color:#d55b60;padding-top:3px!important}
.letter.wrongnew{background-color:#ffdcd9;border-radius:3px;color:#d55b60;padding-top:3px!important}
.letter.iswrong{background-color:#ffdcd9;border-radius:3px;color:#d55b60;padding-top:3px!important}
.shiftrighttextcolor{color:#fff!important}
.shiftlefttext{color:#fff!important}
.hideLine{display:none}
.keyboard-real-time{background-color:#fff;border:2px solid #e0e1e2;border-radius:5px;padding:14px;width:100%}
.keyboard-setting{background-color:#F9f9f9;border:2px solid #EEEEEC;border-radius:5px;padding:14px;margin:0 auto}
.wpm-block{float:left;width:60%}
.setting-block{display:flex;flex-direction:row-reverse}
.wpm-text{font-size:19px;font-weight:600;font-family:Open Sans;color:#757575}
.wpm-icon{margin-top:-10px;margin-right:5px}
.switch{margin-bottom:0!important;margin-left:10px}
.icons{margin-bottom:0!important;margin-right:15px}
.typing-icons{display:inline-block;vertical-align:middle;max-width:100%;height:29px;-ms-interpolation-mode:bicubic}
.typing-result-banner{margin-top:10px;margin-bottom:10px}
input:checked ~ .switch-paddle{background:#2994e2!important}
.result-block{padding:10px}
.result-section{background-color:#fff;border-radius:10px;padding:15px;margin:0 auto}
.not-sign{background-color:#8a1806!important;color:#fff!important;font-size:21px;text-align:center;border-radius:5px;margin:0 auto;margin-bottom:10px;font-weight:500}
@media (max-width: 700px) {
.not-sign{font-size:18px}
}
.content-sub-text{font-size:20px;font-weight:500;color:#000;text-align:center;font-family:Montserrat;margin-bottom:10px}
.table-score-board{margin-top:10px;margin-bottom:10px;font-weight:600;font-size:20px;font-family:Open Sans;color:#666565;letter-spacing:.5px}
.result{width:100%;text-align:center}
.result .inner{text-align:center;border-top:2px solid #e0e1e2;border-bottom:2px solid #e0e1e2;margin-left:15px;margin-right:15px}
.result .inner h6{font-size:22px;font-weight:700;margin-top:10px;color:#666;margin-bottom:0}
.result .inner p{font-size:36px;font-weight:700;margin-bottom:10px}
.result .inner p sub{font-size:20px;margin:auto;bottom:0;padding-left:2px}
.guest-result{margin-bottom:10px;width:100%;margin-top:15px;padding-right:10px;padding-left:10px}
.guest-result .guest-link{background:#333;font-size:20px;padding:10px 35px;color:#fff;border-radius:40px;display:inline-block;width:100%;text-align:center;font-weight:600;font-family:Poppins}
.guest-result .guest-link:hover{background:#F4D032;color:#000;text-decoration:none}
.btn-modify-submit{background:#272727;font-size:24px;padding:15px 65px;color:#fff;border-radius:5px;display:inline-block;text-align:center;font-weight:500;font-family:Poppins;transition:.3s ease-out;font-size:24px;letter-spacing:.5px;margin-top:20px}
.btn-modify-submit:hover{background:#f4d032;color:#272727}
.btn-modify-submit:focus{background:#f4d032;color:#272727}
.print-certi{background-color:#fff;margin:0 auto;border-radius:5px;padding:15px}
.print-certi-left{margin-left:15px}
.print-certi-right{margin-right:15px}
#print-btn{text-align:center}
input[type=text]{border:2px solid #82828294;border-radius:3px;height:45px;width:100%;padding-left:20px;font-size:18px;font-weight:500;font-family:inherit;letter-spacing:2px;color:#272727}
[type='text']:focus,[type='password']:focus,[type='date']:focus,[type='datetime']:focus,[type='datetime-local']:focus,[type='month']:focus,[type='week']:focus,[type='email']:focus,[type='number']:focus,[type='search']:focus,[type='tel']:focus,[type='time']:focus,[type='url']:focus,[type='color']:focus,textarea:focus{outline:none;border:2px solid #82828294!important;background-color:#fefefe;-webkit-box-shadow:0 0 5px #cacaca;box-shadow:0 0 5px #cacaca;-webkit-transition:border-color .25s ease-in-out,-webkit-box-shadow .5s;transition:border-color .25s ease-in-out,-webkit-box-shadow .5s;transition:box-shadow 0.5s,border-color .25s ease-in-out;transition:box-shadow 0.5s,border-color .25s ease-in-out,-webkit-box-shadow .5s}
@media (max-width: 700px) {
.guest-result .guest-link{margin-bottom:15px}
}
@media (max-width: 768px) {
.index-stats-box{padding:15px 0;margin:0 0 .75rem}
.index-stats-box-heading-text{font-size:20px}
.index-stats-box-sub-heading-text{font-size:14px}
.index-section-2{padding:20px 0}
.index-section-3{padding:20px 0}
.about-heading-text{font-size:20px}
.about-normal-text{font-size:15px;padding-right:0}
.started-today-image-block{height:2px}
.index-section-5{padding-bottom:5px}
.index-section-6{padding:30px 0;margin-top:30px;margin-bottom:30px}
.free-for-student-heading-text{font-size:24px}
.btn-section-6{font-size:18px;padding:10px 30px}
.footer-social-icon-box{display:none}
.section-1-btn{font-size:20px;width:100%;margin:10px 0}
.index-section-1{margin:0 auto;padding-top:30px;height:360px;margin-top:50px}
.banner-text{font-size:26px;line-height:50px}
.copyright-text{font-size:15px;text-align:center;padding-bottom:5px}
.footer-nav-2 a{font-size:13px;text-align:center}
.footer-nav a{font-size:13px;text-align:center}
}
.section-value{display:none}
li.section{background-color:grey}
.lesson-content{background-color:#fff;padding:2px 18px;border-radius:10px;margin:auto;height:144px;overflow:hidden;margin-bottom:15px}
.lesson-content .nbsp,.lesson-content-box .nbsp{display: inline-flex;height: 4px;width: 18px;border: 2px solid #ebeaea;border-top:0;}
.lesson-content-box{width:100%;overflow:hidden;margin:30px auto!important;text-align:center;height:110px}
.box-lesson-letter.screen-letter{border:1px solid #e1e1e1;border-radius:5px!important;background-color:#fff;color:#000;font-size:60px;line-height:110px;margin:10px;padding:10px 32px}
@media (max-width: 1366px) {
.lesson-content{height:144px}
.box-lesson-letter.screen-letter{margin:6px;padding:10px 30px}
}
@media (max-width: 1366px) {
.lesson-content-box{height:110px}
}
.lesson-text-line{font-size:46px;font-weight:400;color:#333;line-height:70px;font-family:'Roboto Mono',monospace;border-bottom:2px solid #e0e1e2}
@media (max-width: 1400px) {
.lesson-text-line{font-size:46px}
}
.lesson-cat-des{background:#fff;padding:20px 0;color:#000;font-weight:400;font-family:Open Sans;font-size:18px}
.newfooter-des{background:#f5f8fa;padding:20px 0;color:#000;font-weight:400;font-family:Open Sans;text-align: justify;font-size:18px}
.box-lesson-text-line{font-size:32px;font-weight:400;letter-spacing:.25px;color:#333;line-height:70px;font-family:'Roboto Mono',monospace}
.lesson-text-line-last{line-height:57px;height:70px}
.lesson-letter{margin-right:1px;margin-left:1px;padding-bottom:5px}
.box-lesson-letter{margin:0 2px;padding:1px}
.lesson-rightnew{color:#0e630e;background:#e7fbd3;padding-top:3px!important;border-radius:4px}
.box-lesson-rightnew{background:#e7fbd3!important;color:#0e630e!important}
.lesson-letter.wronglesson{background-color:#ffdcd9;border-radius:3px;color:#d55b60;padding-top:3px!important}
.box-lesson-letter.box-wronglesson{background:#ce3e44;color:#fff;position:relative;z-index:1}
.lesson-goingnew{border-bottom:4px solid #2994e2;border-radius:0!important;color:#2994e2}
.box-lesson-goingnew{border:1px solid #3295db!important;background-color:#3295db!important;color:#fff!important}
.lesson-goingnewnew{border-bottom:4px solid #2994e2;border-radius:0!important;color:#2994e2}
.box-lesson-goingnewnew{border:1px solid #3295db!important;background-color:#3295db!important;color:#fff!important}
.lesson-letter.lesson-wrong{background-color:#ffdcd9;border-radius:4px;color:#d55b60;padding-top:3px!important}
.box-lesson-letter.box-lesson-wrong{background-color:#ffdcd9;border-radius:4px;color:#d55b60;padding-top:3px!important}
.lesson-letter.lesson-wrongnew{background-color:#ffdcd9;border-radius:3px;color:#d55b60;padding-top:3px!important}
.box-lesson-letter.box-lesson-wrongnew{background:#ce3e44;color:#fff;position:relative;z-index:1}
.lesson-letter.wronglesson{background-color:#ffdcd9;border-radius:3px;color:#d55b60;padding-top:3px!important}
.box-lesson-letter.box-wronglesson{background:#ce3e44;color:#fff;position:relative;z-index:1}
.remarks_large{font-weight:700;text-align:center;font-size:34px;margin:0 0 30px;margin-right:30px}
.starsholder{display:flex;width:fit-content;box-shadow:0 3px 6px rgba(0,0,0,0.16),0 0 0 6px #f5f8fa;margin:0 26px 50px;padding:10px 20px;background:#f4f8fb;border-radius:110px}
.completed-starsholder{display:flex;width:fit-content;box-shadow:0 3px 6px rgba(0,0,0,0.16),0 0 0 6px #f5f8fa;margin:0 26px 50px;padding:10px 20px;background:#f4f8fb}
.star{width:60px;height:60px;margin:0}
.scoreannouncmnt{font-weight:700;font-size:22px;text-align:left;text-transform:capitalize}
.redo,.continue{font-size:18px;letter-spacing:.5px;font-weight:600;padding:15px 20px;background:#F4D032;transition:.3s ease-out;margin:30px 10px;border:2px solid #303032;width:150px;color:#111;border-radius:4px;cursor:pointer}
.redo:hover,.continue:hover{background-color:#303032;color:#Fff}
.group-btn-lesson{text-align:right}
.return{font-size:18px;letter-spacing:.5px;font-weight:600;padding:15px 20px;margin:30px 15px;color:#272727;cursor:pointer;border:2px solid transparent;background:#f5f8fa}
.return:hover{color:#111;border:2px solid #000;background:#fff}
.return:focus{border:2px solid #000!important;background:#f5f8fa!important;color:#272727!important}
.start-lesson{float:right;padding:5px;margin-right:5px}
.start-lesson-btn{font-size:18px;letter-spacing:.5px;font-weight:700;padding:10px 15px;background:#f5f8fa;transition:.3s ease-out;margin:6px;border:2px solid #272727;width:140px;color:#595954;border-radius:4px}
.start-lesson-btn:hover{background:#595954;border:2px solid #595954;color:#f5f8fa}
.lesson-message{margin:0 auto;display:block}
.lesson-total-section{margin-right:5px;color:#fff;font-size:15px;font-weight:600;text-transform:capitalize;font-family:Open Sans}
.lesson-total-section-completed{margin-right:5px;color:#fff;float:right;font-size:15px;font-weight:600;font-family:Open Sans;text-transform:capitalize}
.arrow-drop-down-color{font-size:36px;line-height:10px}
.lesson-completed{font-size:24px;font-weight:700;padding:0 0 40px;color:#797a7b}
.stats{overflow:hidden;text-align:center;padding:20px;margin:15px;font-size:32px;font-weight:700;color:#333;padding-top:0;padding-bottom:20px}
.stats:before,.stats:after{background-color:#e0e1e2;content:"";display:inline-block;height:2px;position:relative;vertical-align:middle;width:50%}
.stats:before{right:.5em;margin-left:-50%}
.stats:after{left:.5em;margin-right:-50%}
.form-control:focus{box-shadow:none}
.login-error{background-color:#f2543b!important;color:#fff!important;font-size:21px;text-align:center;margin:0 auto;font-weight:500;margin-top:50px;width:850px}
.login_wrapper{top:0;width:100%;bottom:0;min-height:50vh;z-index:9;opacity:1;position:relative;display:-webkit-box;display:-moz-box;display:-ms-flexbox;display:-webkit-flex;display:flex;justify-content:center;align-items:center;padding:30px 0;background-repeat:no-repeat;background-position:0 bottom;background-size:cover}
.login_wrapper .login-inner-form{color:#272323;text-align:center;height:100%;display:flex;flex-direction:column;justify-content:center}
.login_wrapper .col-pad-0{padding:0}
.login_wrapper .login-inner-form .details p{color:#403838;font-weight:400;font-size:15px}
a.logo_text{color:#fff;font-size:30px;font-weight:700;text-decoration:none;display:flex;align-items:center;justify-content:center;margin:0 auto 15px}
a.logo_text span{background:#fff;line-height:1;display:inline-block;padding:4px 5px 2px;color:#ff574d;font-weight:700;border-radius:4px;margin-right:10px}
.login_wrapper .login-inner-form .details p a{margin-left:3px;color:#604BFE;font-size:15px}
.details p a:hover{text-decoration:underline}
.login_wrapper .login-inner-form .details{padding:30px}
.login_wrapper .login_right{background-size:cover;width:100%;bottom:0;border-radius:10px 0 0 10px;padding:80px 20px;background:#303032;position:relative;height:100%;display:flex;flex-direction:column;justify-content:center}
.login-box-12{margin:0 auto;max-width:850px;border-radius:10px;background:#fff;background-size:cover;top:0;bottom:0;opacity:1;text-align:center;overflow:hidden;align-items:stretch;box-shadow:0 0 50px rgba(0,0,0,0.05)}
.login_wrapper .btn-outline{border-radius:3px;padding:6px 30px;color:#ff574d;background:#fff;letter-spacing:1px;font-size:14px;font-weight:600;margin:0 auto;border:2px solid #fff;transition:all ease .4s}
.login_wrapper .none-2{display:none}
.login_wrapper .btn-outline:hover{background:transparent;text-decoration:none;color:#fff;border-color:#fff}
.login_wrapper .login-inner-form h3{margin:0 0 25px;font-size:22px;font-weight:700;font-family:'Nunito',sans-serif;color:#272323;position:relative;padding:0 0 15px}
.login_wrapper .login-inner-form h3 span{color:#ff574d}
.login_wrapper .login-inner-form h3:after{display:block;content:"";position:absolute;left:0;right:0;width:50px;height:1px;background:#ff574d;margin:0 auto;bottom:0}
.login_wrapper .login-inner-form .form-group{margin-bottom:20px}
.login_wrapper .login-inner-form .input-text{outline:none;width:100%;padding:10px 20px;font-size:15px;outline:0;font-weight:500;color:#717171;height:45px;border-radius:3px;border:1px solid #ddd!important;box-shadow:0 2px 6px 0 rgba(0,0,0,.04)}
.login_wrapper .login-inner-form .btn-md{cursor:pointer;padding:10px 50px 8px;height:45px;letter-spacing:1px;font-size:14px;font-weight:600;font-family:'Nunito',sans-serif;border-radius:3px;text-transform:uppercase}
.login_wrapper .login_right .social-list li{display:inline-block;font-size:16px}
.login_wrapper .login_right .logo{height:30px;margin-bottom:20px}
.login_wrapper .login_right p{font-size:15px;color:#fff;margin-bottom:30px}
.login_wrapper .login_right .btn-sm{padding:6px 20px;font-size:13px}
.login_wrapper .login_right .social-list{margin-top:35px;padding:0}
.login_wrapper .login_right .social-list li a{display:block;background:rgba(0,0,0,0.07);border-radius:3px;display:inline-block;margin:0 3px;width:32px;height:32px;color:#fff;font-size:16px;line-height:32px;transition:all ease .4s}
.login_wrapper .login_right .social-list li a:hover{background:#fff;color:#ff574d;transform:translateY(-3px)}
.login_wrapper .login-inner-form input[type=checkbox],input[type=radio]{margin-right:3px}
.login_wrapper .login-inner-form button:focus{outline:none;outline:0 auto -webkit-focus-ring-color}
.login_wrapper .login-inner-form .btn-theme.focus,.btn-theme:focus{box-shadow:none}
.login_wrapper .login-inner-form .btn-theme{background:#ff574d;border:none;color:#fff}
.login_wrapper .login-inner-form .btn-theme:hover{background:#ec4a40;box-shadow:0 0 35px rgba(0,0,0,0.1)}
.login_wrapper .login-inner-form .terms{margin-left:3px}
.login_wrapper .login-inner-form .checkbox{margin-bottom:20px;font-size:14px}
.login_wrapper .login-inner-form .form-check{float:left;margin-bottom:0}
.login_wrapper .login-inner-form .form-check a{color:#717171;float:right}
.login_wrapper .login-inner-form .form-check-input{position:absolute;margin-left:0;opacity:0}
.login_wrapper .login-inner-form .form-check label::before{content:"";display:inline-block;position:absolute;width:17px;height:17px;margin-left:-25px;border:1px solid #c5c3c3;border-radius:3px;background-color:#fff}
.login_wrapper .login-inner-form .form-check-label{padding-left:25px;margin-bottom:0;font-size:14px;color:#403838}
.login_wrapper .login-inner-form .checkbox-input input[type="checkbox"]:checked + label::before{background-color:#ff574d;border-color:#ff574d}
.login_wrapper .login-inner-form input[type=checkbox]:checked + label:before{font-weight:400;color:#f3f3f3;line-height:15px;font-size:10px;content:"\f00c";background-color:#ff574d;border-color:#ff574d;font-family:fontAwesome}
.login_wrapper .login-inner-form input[type=checkbox],input[type=radio]{margin-top:4px}
.login_wrapper .login-inner-form .checkbox a{font-size:15px;color:#604BFE;float:right}
.checkbox a:hover{text-decoration:underline}
@media (max-width: 991px) {
.login_wrapper .pad-0{padding:0}
.login_wrapper .login-box-12{margin:0 auto;max-width:400px}
.login_wrapper .login-inner-form .details{padding:30px}
.login_wrapper .login_right{border-radius:0;padding:40px 20px}
.login_wrapper .login_right:after{bottom:-20px;top:auto;left:50%;right:auto;margin-left:-20px;transform:rotate(90deg)}
}
@media (max-width: 767px) {
.login_wrapper .login-inner-form .details{padding:40px 10px 30px}
}
@media (max-width: 479px) {
.login_wrapper .login-inner-form .details{padding:30px 10px}
}
.profile-dropdown{display:inline-block;position:relative;background:#f4d032;margin:auto;font-weight:700;font-size:1.3rem;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;cursor:pointer}
.profile-dropdown *{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}
.profile-dropdown input[type="checkbox"]{display:none}
.profile-dropdown input[type="checkbox"]:checked ~ ul{display:block;animation:pulse .5s}
.profile-dropdown input[type="checkbox"]:checked ~ label{background:orange}
.profile-dropdown input[type="checkbox"]:checked ~ label i{color:#f2f2f2}
.profile-dropdown input[type="checkbox"]:checked ~ label:after{content:'';position:absolute;top:100%;right:calc(50% - 10px);display:block;border-style:solid;border-width:7px 10px 0;border-color:orange transparent transparent;width:0;height:0}
.profile-dropdown img{display:inline-block;height:2.5rem;vertical-align:middle;margin:.5rem .75rem .5rem .5rem;cursor:pointer}
.profile-dropdown span{display:inline-block;vertical-align:sub;width:125px;margin-right:2rem;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;line-height:normal}
.profile-dropdown ul{display:none;list-style:none;padding:0;marrgin:0;background:#fff;position:absolute;top:100%;right:0;width:100%;border-radius:3px;z-index:9999}
.profile-dropdown ul li a{display:block;padding:.75rem 1rem;text-decoration:none;color:#737373;font-size:1rem;font-weight:600}
.profile-dropdown ul li a i{font-size:1.3rem;vertical-align:middle;margin:0 .75rem 0 -.25rem}
.profile-dropdown ul li a:hover{background:#e5e5e5}
.profile-dropdown ul li:first-child a:hover{border-radius:3px 3px 0 0}
.profile-dropdown ul li:last-child a:hover{border-radius:0 0 3px 3px}
.profile-dropdown > label{position:relative;height:3.5rem;display:block;text-decoration:none;background:transparent;color:#333;box-sizing:border-box;float:right;border-radius:0 3px 3px 0;cursor:pointer;padding-left: 10px;}
.profile-dropdown > label i{color:#303032;font-size:1.75rem}
.profile-dropdown:after{content:'';display:table;clear:both}
.mdi-menu-down{font-size:60px!important;margin-top:-20px}
.mdi-wifi-strength-4{font-size:22px!important}

.jq-toast-wrap {
   
    width: 40%!important;
}

.jq-icon-warning {
background-color: #f5f8fa!important;    
    border: 2px solid #111!important;
    border-bottom: 0px!important;
    border-radius: 10px 10px 0px 0px!important;
}

.jq-toast-single h2 {  
    font-size: 28px!important;
    margin: 0 0 7px!important;
	color: #8a1806 !important;
}

.jq-toast-single {
    line-height: 100px!important;
    font-size: 40px!important;
    color: #111!important;
}

.close-jq-toast-single {

    top: -20px!important;
    right: 15px!important;
    font-size: 36px!important;
}

/*section.tpl play lesson button design */
.lesson-play-style{
    text-align: center;
}
button.button.lesson-play {
font-size: 18px;
letter-spacing: .5px;
font-weight: 600;
padding: 15px 20px;
background:
#F4D032;
transition: .3s ease-out;
margin: 10px 10px;
border: 2px solid
#303032;
color:
#111;
border-radius: 4px;
cursor: pointer;
}

button.button.lesson-play:hover{background-color:
#303032;
color:
#Fff;}

.share {
text-align: center;
    overflow-x: hidden;
    margin: 0px 15px;
    background: #fff;
    padding: 15px 0 10px 0;
    border-radius: 5px;
    min-height:60px;
}

.lesson-share {
    overflow-x: hidden;
    margin: 0px;
}

.link-us{padding:5px}
.link-us-icon{position:relative;background-color:#272727;padding:14.5px;z-index:1;color:#fff;width:110px;font-size:15px;font-weight:600;border:2px solid #373737}
.link-us-icon::after{content:'';width:15px;height:15px;border-radius:2px;position:absolute;left:100%;transform:translate(-50%,-50%) rotate(45deg);top:50%;background-color:#272727;margin-left:-1px;z-index:-1}
#comment{resize:none;background:#fff;border:none;height:100%;padding:5px;font-size:14px;margin-bottom:-16px;border:2px solid #373737 !important;padding-left:20px}
.text-form-control{overflow:hidden;width:100%}

.subscribe {
margin:0 auto;
max-width: 60rem;
  
}

#mc_embed_signup form {
text-align:center;
padding:10px 0
}




.mc-field-group {
display:inline-block
}

#mc_embed_signup input.email {
font-size:15px;
border:1px solid #ABB0B2;
-webkit-border-radius:3px;
-moz-border-radius:3px;
border-radius:3px;
color:#343434;
background-color:#fff;
box-sizing:border-box;
height:48px;
padding:1.25em;
display:inline-block;
margin:0;
width:500px;
vertical-align:top
}



#mc_embed_signup input[type="email"]::placeholder { /* Firefox, Chrome, Opera */ 
      color: #000; 
  font-size:18px;
  font-weight: 500;
  text-transform:capitalize;
} 
  
  
#mc_embed_signup label {
display:block;
font-size:16px;
padding-bottom:10px;
font-weight:700
}

#mc_embed_signup .clear {
display:inline-block
}

#mc_embed_signup .button {
    font-size: 15px;
    border: none;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    letter-spacing: .03em;
    color: #222;
box-sizing: border-box;
height: 48px;
line-height: 32px;
padding: 0 18px;
display: inline-block;
margin: 0;
transition: all .23s ease-in-out 0 background-color:#777;
background-color: #f4d032;
    font-weight: 500;
}
#mc_embed_signup .button:hover {
background-color:#fff;
cursor:pointer;
color:#272727;
}

#mc_embed_signup div#mce-responses {
float:left;
top:-1.4em;
padding:0 .5em;
overflow:hidden;
width:90%;
margin:0 5%;
clear:both
}

#mc_embed_signup div.response {
margin:1em 0;
padding:1em .5em .5em 0;
font-weight:700;
float:left;
top:-1.5em;
z-index:1;
width:80%
}

#mc_embed_signup #mce-error-response {
display:none
}

#mc_embed_signup #mce-success-response {
color:#529214;
display:none
}

#mc_embed_signup label.error {
display:block;
float:none;
width:auto;
margin-left:1.05em;
text-align:left;
padding:.5em 0
}

@media (max-width: 768px) {
#mc_embed_signup input.email {
width:100%;
margin-bottom:5px
}

#mc_embed_signup .clear {
display:block;
width:100%
}

#mc_embed_signup .button {
width:100%;
margin:0
}

}



@media (max-width: 1200px){
    .teach-vid{
    display:none;
}
}

.dashboard {
margin:0 auto;
max-width:80rem
}

@media (min-width: 1400px) {
.dashboard {
max-width:85rem
}
}

@media screen and (max-width: 1240px) {
.dashboard .score-tab ul li {
margin:5px 0;
width:100%!important
}

.dashboard .test-score-tab ul li {
margin:5px 0;
width:100%!important
}

.dashboard .wpm-score-tab ul li {
margin:5px 0;
width:100%!important
}

.dashboard .score-tab .tab-padding {
margin:5px 0;
width:100%!important
}

.dashboard .test-score-tab .test-tab-padding {
margin:5px 0;
width:100%!important
}
.dashboard .wpm-score-tab .test-tab-padding {
margin:5px 0;
width:100%!important
}
}

.dashboard .dashboard-left-top {
background-color:#303032;
padding:20px 0;
text-align:center
}

.dashboard .left-user-wrap {
width:100px;
height:100px;
border-radius:50px;
border:2px solid #fff;
text-align:center
}

.dashboard .user-name {
font-size:16px;
color:#fff;
font-weight:700;
text-align:center;
margin-top:5px
}

.dashboard .user-id {
font-family:Open Sans;
font-size:13px;
color:#fff;
text-align:center
}

.dashboard .list-block {
padding:0;
margin:0
}

.dashboard .list-block ul {
padding:0;
margin:0
}

.dashboard .list-block li {
padding:12px 12px 0;
margin:0;
background-color:#f4d032;
list-style-type:none;
border-bottom:2px solid #303032
}

.dashboard .avg-text {
font-size:18px;
color:#303032;
font-weight:700
}

.dashboard .avgResult {
font-size:50px;
color:#303032;
font-weight:700;
line-height:52px
}

.dashboard .avgResult-sub {
font-size:18px;
color:#303032;
font-weight:700
}

.dashboard .right-block-main {
margin-left:20px
}

.dashboard .score-tab .tabs-title > a:focus,.tabs-title > a[aria-selected="true"] {
background:#f4d032;
color:#000
}

.dashboard .score-tab .tabs-title > a {
display:block;
padding:1.25rem 1.5rem;
font-size:1.2rem;
line-height:1;
color:#000;
font-weight:600;
width:100%;
text-align:center
}

.dashboard .score-tab ul li {
margin-right:7px;
background-color:#fff;
width:25%;
border:1px solid #e6e6e6;
border-top:3px solid #303032;
text-align:center;
font-weight:600;
padding:.9rem 0;
font-size:1.2rem;
color:#333
}

.dashboard .test-score-tab ul li {
margin-right:7px;
background-color:#fff;
width:25%;
border:1px solid #e6e6e6;
border-top:3px solid #303032;
text-align:center;
font-weight:600;
padding:.9rem 0;
font-size:1.2rem;
color:#333;
display:inline-block
}
.dashboard .wpm-score-tab ul li {
margin-right:7px;
background-color:#fff;
width:25%;
border:1px solid #e6e6e6;
border-top:3px solid #303032;
text-align:center;
font-weight:600;
padding:.9rem 0;
font-size:1.2rem;
color:#333;
display:inline-block
}

.dashboard .score-tab ul li:last-child {
margin-right:0;
background-color:#fff;
width:22.4%;
border-top:1px solid #e6e6e6;
padding:1px 0
}

.dashboard .test-score-tab ul li:last-child {
margin-right:0;
background-color:#fff;
width:22.4%;
border-top:1px solid #e6e6e6;
padding:1px 0
}
.dashboard .wpm-score-tab ul li:last-child {
margin-right:0;
background-color:#fff;
width:22.4%;
border-top:1px solid #e6e6e6;
padding:1px 0
}

.dashboard .score-tab .tabs {
margin:0;
border:none;
background:none;
list-style-type:none
}

.dashboard .test-score-tab .legend-tabs {
margin:0;
border:none;
background:none;
list-style-type:none
}
.dashboard .wpm-score-tab .wpm-legend-tabs {
margin:0;
border:none;
background:none;
list-style-type:none
}

.dashboard .test-score-tab .test-tabs-content {
border:0 solid #e6e6e6;
background:#fefefe;
color:#0a0a0a;
-webkit-transition:all .5s ease;
transition:all .5s ease;
margin-top:8px;
min-height:435px
}
.dashboard .wpm-score-tab .test-tabs-content {
border:0 solid #e6e6e6;
background:#fefefe;
color:#0a0a0a;
-webkit-transition:all .5s ease;
transition:all .5s ease;
margin-top:8px;
min-height:435px
}

.dashboard .score-tab .tabs-content {
border:0 solid #e6e6e6;
background:#fefefe;
color:#0a0a0a;
-webkit-transition:all .5s ease;
transition:all .5s ease;
margin-top:8px;
min-height:435px
}

.dashboard .score-tab .dropdown-style {
margin-bottom:0;
padding:5px 5px 5px 25px;
font-size:13px;
height:auto;
cursor:pointer
}

.dashboard .test-score-tab .test-dropdown-style {
margin-bottom:0;
padding:5px 5px 5px 25px;
font-size:13px;
height:auto;
cursor:pointer
}
.dashboard .wpm-score-tab .wpm-dropdown-style {
margin-bottom:0;
padding:5px 5px 5px 25px;
font-size:13px;
height:auto;
cursor:pointer
}
.test-tabs-panel {
padding:1rem
}

.dashboard .score-tab .tab-padding {
padding:1px 6px 0!important;
float:right;
background-color:#2294e1;
border:1px solid #e6e6e6;
width:22.5%;
border-top:3px solid #303032
}

.dashboard .test-score-tab .test-tab-padding {
padding:1px 6px 0!important;
float:right;
background-color:#2294e1;
border:1px solid #e6e6e6;
width:22.5%;
border-top:3px solid #303032
}

.dashboard .wpm-score-tab .wpm-tab-padding {
padding:1px 6px 0!important;
float:right;
background-color:#2294e1;
border:1px solid #e6e6e6;
width:22.5%;
border-top:3px solid #303032
}

.dashboard .score-tab .date-year {
font-size:14px;
color:#fff;
text-align:center;
font-weight:400;
margin-top:4px
}

.dashboard .test-score-tab .dropdown-date-year {
font-size:14px;
color:#fff;
text-align:center;
font-weight:400;
margin-top:4px
}

.dashboard .wpm-score-tab .wpm-date-year {
font-size:14px;
color:#fff;
text-align:center;
font-weight:400;
margin-top:4px
}

.dashboard .score-tab .dropdown-wrap {
position:relative;
width:80%;
margin:auto;
cursor:pointer
}

.dashboard .test-score-tab .test-dropdown-wrap {
position:relative;
width:80%;
margin:auto;
cursor:pointer
}

.dashboard .wpm-score-tab .wpm-dropdown-wrap {
position:relative;
width:80%;
margin:auto;
cursor:pointer
}

.dashboard .score-tab .calender {
position:absolute;
z-index:100;
top:4px;
left:6px;
opacity:.6
}

.dashboard .test-score-tab .calender {
position:absolute;
z-index:100;
top:4px;
left:6px;
opacity:.6
}

.dashboard .wpm-score-tab .calender {
position:absolute;
z-index:100;
top:4px;
left:6px;
opacity:.6
}

.dashboard .score-tab .caret {
position:absolute;
z-index:100;
top:4px;
right:10px;
opacity:.6;
pointer-events:none
}

.dashboard .test-score-tab .caret {
position:absolute;
z-index:100;
top:4px;
right:10px;
opacity:.6;
pointer-events:none
}

.dashboard .wpm-score-tab .caret {
position:absolute;
z-index:100;
top:4px;
right:10px;
opacity:.6;
pointer-events:none
}

.typing-category {
width:100%
}

.dashboard .typing-category .subabs-title > a:focus,.subabs-title > a[aria-selected="true"] {
background:#000;
color:#fff
}

.dashboard .dashboard-table {
padding:0;
margin:20px 0 0
}

.dashboard .dashboard-table thead {
background:#fff;
color:#0a0a0a
}

.dashboard .dashboard-table tbody tr:nth-child(2n) {
background-color:#fff
}

.dashboard .dashboard-table .start-button2 {
background-color:#323232;
font-size:13px;
color:#fff;
font-weight:600;
border-radius:50px;
text-align:center;
padding:4px 20px 5px;
margin-bottom:0
}

.dashboard .dashboard-table .start-button2:hover {
background-color:#f4d032;
color:#000
}

.dashboard .dashboard-table .start-button2.active {
background-color:#f4d032;
color:#000
}

.dashboard .dashboard-table tr {
border-bottom:1px solid #303032
}

.dashboard .tab .is-active {
background-color:#323232;
padding:0;
margin:0;
line-height:18px;
letter-spacing:5px
}

.loaderChart {
width:97%;
background:#ca8b1814;
text-align:center;
position:absolute;
height:93%;
display:none
}

.loaderChart img {
width:100px;
position:absolute;
top:40%;
left:47%
}

*,:after,:before {
-webkit-box-sizing:border-box;
-moz-box-sizing:border-box;
box-sizing:border-box
}

.clearfix:before,.clearfix:after {
content:" ";
display:table
}

.clearfix:after {
clear:both
}

.typing-category h1 {
color:#ccc;
text-align:center
}

.typing-category a {
color:#ccc;
text-decoration:none;
outline:none
}

.tab_container {
width:100%;
margin:0 auto;
position:relative
}

.typing-category input,section {
clear:both;
padding-top:10px;
display:none
}

.typing-category label {
font-weight:700;
font-size:18px;
display:block;
float:left;
width:25%;
padding:.7em;
color:#757575;
cursor:pointer;
text-decoration:none;
text-align:center;
margin-left:0;
background:#f0f0f0;
margin-right:0
}

.typing-category .lesson_tabs label {
font-weight:700;
font-size:18px;
display:block;
float:left;
width:25%;
padding:.7em;
color:#303032;
cursor:pointer;
text-decoration:none;
text-align:center;
margin-left:0;
background:#f4d032;
margin-right:0
}

#tab1:checked ~ #content1,#tab2:checked ~ #content2,#tab3:checked ~ #content3,#tab4:checked ~ #content4,#tab5:checked ~ #content5 {
display:block;
padding:10px 0 0;
background:#fff;
color:#999;
border-bottom:2px solid #f0f0f0
}

#lesson_tab1:checked ~ #lesson_content1,#lesson_tab2:checked ~ #lesson_content2,#lesson_tab3:checked ~ #lesson_content3,#lesson_tab4:checked ~ #lesson_content4 {
display:block;
padding:8px;
background:#fff;
color:#999;
border-bottom:2px solid #f0f0f0
}

.lesson_tabs [id^="lesson_tab"]:checked + label {
background:#fff;
box-shadow:inset 0 -3px #f4d032
}

.tab_container .tab-content p,.tab_container .tab-content h3 {
-webkit-animation:fadeInScale .7s ease-in-out;
-moz-animation:fadeInScale .7s ease-in-out;
animation:fadeInScale .7s ease-in-out
}

.tab_container .tab-content table {
-webkit-animation:fadeInScale .7s ease-in-out;
-moz-animation:fadeInScale .7s ease-in-out;
animation:fadeInScale .7s ease-in-out
}

.tab_container .lesson_tab-content table {
-webkit-animation:fadeInScale .7s ease-in-out;
-moz-animation:fadeInScale .7s ease-in-out;
animation:fadeInScale .7s ease-in-out
}

.tab_container .tab-content .score-tab {
-webkit-animation:fadeInScale .7s ease-in-out;
-moz-animation:fadeInScale .7s ease-in-out;
animation:fadeInScale .7s ease-in-out;
margin:20px 0
}

.tab_container .tab-content .test-score-tab  {
-webkit-animation:fadeInScale .7s ease-in-out;
-moz-animation:fadeInScale .7s ease-in-out;
animation:fadeInScale .7s ease-in-out;
margin:20px 0
}

.tab_container .tab-content .wpm-score-tab  {
-webkit-animation:fadeInScale .7s ease-in-out;
-moz-animation:fadeInScale .7s ease-in-out;
animation:fadeInScale .7s ease-in-out;
margin:20px 0
}

.tab_container .tab-content h3 {
text-align:center
}

.tab_container [id^="tab"]:checked + label {
background:#fff;
box-shadow:inset 0 3px #0ce
}

.tab_container [id^="lesson_tab"]:checked + label .mdi {
color:#f4d032
}

.tab_container [id^="tab"]:checked + label .mdi {
color:#0ce
}

label .mdi {
font-size:1.1em;
margin:0 .4em 0 0
}

#content1 .lesson_tabs {
margin-top:10px
}

@media only screen and (max-width: 900px) {
label span {
display:none
}
}

@keyframes fadeInScale {
0% {
transform:scale(0.9);
opacity:0
}

100% {
transform:scale(1);
opacity:1
}
}

.avatar-upload {
position:relative;
max-width:150px;
margin:5px auto
}

.avatar-upload .avatar-edit {
position:absolute;
right:0;
z-index:1;
top:10px
}

.avatar-upload .avatar-edit input {
display:none
}

.avatar-upload .avatar-edit input + label {
display:inline-block;
width:34px;
height:34px;
margin-bottom:0;
border-radius:100%;
background:#FFF;
border:1px solid transparent;
box-shadow:0 2px 4px 0 rgba(0,0,0,0.12);
cursor:pointer;
font-weight:400;
transition:all .2s ease-in-out
}

.avatar-upload .avatar-edit input + label:hover {
background:#f1f1f1;
border-color:#d6d6d6
}

.avatar-upload .avatar-edit #edit {
font-size:18px;
margin-top:10px;
margin-left:7px
}

.avatar-upload .avatar-preview {
width:150px;
height:150px;
position:relative;
border-radius:100%;
border:6px solid #F8F8F8;
box-shadow:0 2px 4px 0 rgba(0,0,0,0.1)
}

.avatar-upload .avatar-preview > div {
width:100%;
height:100%;
border-radius:100%;
background-size:cover;
background-repeat:no-repeat;
background-position:center
}

.message {
color:#fff;
font-size:12px;
text-align:center;
margin-top:8px;
display:none
}


.footer-blog{
    background:#fff;
    padding:20px 0;
}

.para {
   color:#272727;
}
h3{font-size:20px;
    font-weight: 600;
font-family: Open Sans;
padding:0 0 20px 0;
}

.typing-skill{
    padding:0px;
}

.updateAvatar {
background-color:#4CAF50;
border:none;
color:#fff;
padding:5px 12px;
text-align:center;
text-decoration:none;
display:inline-block;
font-size:14px;
margin:4px 2px;
cursor:pointer
}

.updateAvatar:hover {
background-color:#539156
}

.loader {
border:5px solid #f3f3f3;
border-radius:50%;
border-top:5px solid #7c7171;
width:35px;
height:35px;
-webkit-animation:spin 2s linear infinite;
animation:spin 2s linear infinite;
position:absolute;
z-index:100;
top:37%;
left:37%;
display:none
}

@-webkit-keyframes spin {
0% {
-webkit-transform:rotate(0deg)
}

100% {
-webkit-transform:rotate(360deg)
}
}

@keyframes spin {
0% {
transform:rotate(0deg)
}

100% {
transform:rotate(360deg)
}
}

.responsive-table li {
border-radius:3px;
padding:25px 30px;
display:flex;
justify-content:space-between;
margin-bottom:25px;
font-weight:600;
font-size:18px;
color:#303032;
font-family:Open Sans
}

.responsive-table .table-header {
background-color:#303032;
color:#fff;
font-size:22px;
font-weight:600;
font-family:Open Sans
}

.responsive-table .table-row {
background-color:#fff;
box-shadow:0 0 2px 0 #c3c3c8
}

.responsive-table .col-1 {
flex-basis:30%
}

.responsive-table .col-2 {
flex-basis:15%;
text-align:center
}

.responsive-table .col-3 {
flex-basis:15%;
text-align:center
}

.responsive-table .col-4 {
flex-basis:20%;
text-align:center
}

.responsive-table .col-5 {
flex-basis:20%;
text-align:center
}

@media (max-width: 767px) {
.responsive-table .table-header {
display:none
}

.responsive-table li {
display:block
}

.responsive-table .col {
flex-basis:100%;
display:flex;
padding:10px 0
}

.responsive-table .col:before {
color:#6c7a89;
padding-right:10px;
content:attr(data-label);
flex-basis:50%;
text-align:right
}
}