*{
    box-sizing: border-box;
}
html,
body{
    overflow-x: hidden;
}
body{
    margin: 0;
    padding: 0;
}

/*---- Button ----*/
.btn{
    padding: 14px 30px;
    border-radius: 4px;	
    display: inline-block;
    font-size: 16px;
    font-weight: bold;
}
.btn-light-gray{
    background: #f4f4f4;
    color: #666
}

/*---- Hero ----*/
.hero .social-proof {
    text-align: center;
    margin: 55px auto 35px auto;
    max-width: 845px;
    display: block;
}
.hero .social-proof i {
    display: inline-block;
    margin: 0 2px 0 0;
    font-size: 20px;
    color: #ffd203;
}
.hero .social-proof i:last-child {
    margin-right: 0px;
}

.hero .social-proof .social-name p {
    display: inline-block;
    font-size: 1.8rem;
}

.hero .social-proof .social-name .name {
    background: #f4f4f4;
    padding-top: 10px;
    border-radius: 250px;
    width: 48px;
    height: 48px;
    display: inline-block;
    font-weight: bold;
}


.hero .brand-list {
    margin: 56px auto 40px auto;
    text-align: center;
}

.hero .brand-list .relative {
    position: relative;
}

.hero .brand-list p {
    font-size: 1.8rem;
    text-transform: uppercase;
    text-align: center;
    position: relative;
    margin: 0 auto 25px auto;
    z-index: 9;
    background: #fff;
    display: block;
    padding: 0px;
    width: 155px;
    opacity: 1;
    color: #acacac;
    letter-spacing: 0.1em;
}

.hero .brand-list hr {
    display: block;
    width: 100%;
    height: 1px;
    background: #f4f4f4;
    position: absolute;
    z-index: 2;
    max-width: 1440px;
    margin: 0 auto;
    top: 11px;
    padding: 0 calc(2rem + 2vw);
}

.brand-list img {
    opacity: 1;
    width: 90%;
    margin: 0 auto;
    display: block;
}

/*---- Background ----*/
.bg-light-gray{
    background-color: #f4f4f4;
}
.bg-white{
    background-color: #fff;
}
.bgcover{
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
}

ul.dots {
    margin: 36px 0 0 0;
    padding: 0;
}

.cta-buttons h3 {
    max-width: 700px;
    margin: 0 auto;
    margin-bottom: 25px;
}

ul.dots li {
    background: url('../images/icon-dot.png') 0 0 no-repeat;
    background-size: 30px;
    padding-left: 45px;
    list-style: none;
    margin-bottom: 15px;
}

.personalized .align-center {
    display: inline-block;
    text-align: center;
    margin: 0 auto;
}

.personalized a {
    margin-top: 35px;
    background: #eaeaea !important;
}

.personalized .right {
    background: #f4f4f4;
    border-radius: 15px;
    padding-bottom: 0;
}

.how-it-works .number {
    background: #303030;
    height: 41px;
    width: 41px;
    border-radius: 250px;
    font-weight: bold;
    color: #fff;
    text-align: center;
    padding-top: 6px;
    margin: 22px 0 14px 0;
}

.how-it-works h3 {
    margin-top: 0;
}
.how-it-works {
    padding-bottom: 0 !important;
}
/*---- Padding ----*/
.py-5{
    padding-top: 50px;
    padding-bottom: 50px;
}
.py-4{
    padding-top: 25px;
    padding-bottom: 25px;
}
.px-4{
    padding-left: 25px;
    padding-right: 25px;
}

.ourtutors {
    padding: 95px 0 0 0;
}

.ourtutors .gato {
    display: block;
    text-align: center;
    margin: 30px auto 0 auto;
    width: 70%;
    max-width: 495px;
}

.ourtutors .title {
    max-width: 1140px;
    margin: 0 auto;
}

.ourtutors .title p {
    font-size: 2.8rem;
}

.announcement-button {
    padding: 7px 11px;
    border: 1px solid #fff;
}


/*---- Common Classes ----*/
.text-center{
    text-align: center;
}
.d-flex{
    display: flex;	
}
.justify-content-center{
    justify-content: center;
}
.align-items-center{
    align-items: center;
}
.justify-content-end{
    justify-content: flex-end;
}
.row{
    display: flex;
    flex-wrap: wrap;
}
.col-md-8 {
    -ms-flex: 0 0 66.666667%;
    flex: 0 0 66.666667%;
    max-width: 66.666667%;
}
.col-md-4 {
    -ms-flex: 0 0 33.333333%;
    flex: 0 0 33.333333%;
    max-width: 33.333333%;
    padding-left: 15px;
    padding-right: 15px;
}

/*---- Our Tutors ----*/
.card-subtitle {
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
}

.tutordescription {
    min-height: 200px;
}
.ourtutors .card {
    min-height: 560px;
}
.tutorssldr .slick-list{
    padding-top: 40px !important;
    padding-bottom: 40px !important;
}
.tutorsitem{
    padding: 0 15px;	
}
.tutorsbox{
    border-radius: 8px;
    box-shadow: 0 0 15px rgba(0,0,0,0.08);
}
.tutorimg{
    width: 170px;
    height: 170px;
    margin: 0 auto;
}
.tutorcntry img{
    padding: 0 10px 0 0;
}
.tutorssldr .slick-arrow{
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 9;
}
.tutorssldr .slick-prev{
    left: -60px;
}
.tutorssldr .slick-next{
    right: -60px;
}
.tutorssldr .slick-arrow::before{
    display: block;
    content: "";
    font-family: FontAwesome;
    font-size: 32px;
    color: #212529;
    position: absolute;
    top: 49%;
    transform: translateY(-50%);
}
.tutorssldr .slick-prev::before{
    content: "\f104";
}
.tutorssldr .slick-next::before{
    content: "\f105";
}
.tutormore{
    padding: 20px 0 10px;
}
.tutormore a{
    width: 100%;
}

/*---- Our Testimonials ----*/
.tstmnlitem{
    padding: 0 15px;	
}
.tstmnlbox{
    border: 2px solid #e9e9e9;
    border-radius: 8px; 
}
.fivestars i{
    margin: 0 5px 0 0;
    font-size: 20px;
    color: #ffd203;
}
.tstmnlrtng i{
    margin: 0 2px 0 0;
    font-size: 20px;
    color: #ffd203;
}
.tstmnldesc{
    padding: 30px 0;
}
.tstmnlsbtns i{
    width: 50px;
    height: 50px;	
    padding: 0;
    margin: 0;
    background: #fff;
    border: 1px solid #ebebeb;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 30px;
    cursor: pointer;
}
.tstmnlmeta {
}
.tstmnlinfo{
    padding: 0 0 0 15px;
}
.tstmnltitle{
    font-size: 16px;
    color: #018965;
    font-weight: bold;
}
.tstmnljob {
    font-size: 16px;
}
.tstmnlimg {
    width: 49px;
    height: 49px;
    background: #008964;
    font-weight: bold;
    font-size: 1.6rem;
    color: #fff;
    border-radius: 250px;
    display: block;
}

.tstmnlimg span {
    display: block;
    margin-top: 13px;
    text-align: center;
}

.ourtstmnls .section-title {
    margin-top: 21px !important;
}

/*---- Slick Slider ----*/
.slick-arrow{
    width: 50px;
    height: 50px;	
    padding: 0;
    margin: 0;
    background: #fff;
    border: 1px solid #ebebeb;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 0; 
    text-align: center;	
}
.slick-arrow:focus{
    border-color: #ebebeb;
    outline: none;
}
.slick-arrow i{
    font-size: 30px;
    position: relative;
    top: -2px;
}
.ourtstmnlssldr .slick-dots{
    margin: 30px 0 0 0;
    padding: 0;
    list-style: none;
    display: flex;
    justify-content: center;
}
.ourtstmnlssldr .slick-dots li{
    margin: 0 4px;
}
.ourtstmnlssldr .slick-dots li button{
    width: 13px;
    height: 13px;
    margin: 0;
    padding: 0;
    background: #f4f4f4;
    border: none;
    border-radius: 50%;
    font-size: 0;
    outline: none;
}
.ourtstmnlssldr .slick-dots li.slick-active button{
    background: #018965;
}
.ourtstmnls .fa-angle-left {
    margin-right: 11px !important;
}
/*---- Homepage specific resets ----*/
.home .mb-xxl, .home .mb-xl {
    margin-bottom: 0 !important;
}
.home .pv-xxl {
    padding-top: 95px !important;
}
.home .mv-xl {
    margin-bottom: 45px !important;
}
.home .mt-xl {
    margin-top: 45px !important;
}

#footer .footer-primary {
    margin-top: 0 !important;
}
.unique-as-you {
    padding-bottom: 50px !important;
}

section.clouds {
    background: url('../images/bg-clouds.jpg') center bottom no-repeat #f4f4f4;
    background-size: 100%;
    padding-bottom: 95px !important;
}
section.clouds img {
    width: 90%;
    margin: 0 auto;
}
section.cta-bottom {
    padding-bottom: 50px;
}

/*---- CTA Bottom ----*/
.cta-bottom {
    background: url('../images/bg-trees-dark.jpg') center bottom no-repeat #313130;
    background-size: 1920px;
    color: #fff;
}

.cta-bottom .align-center, .cta-bottom .align-center .section-title {
    text-align: center;
}

.cta-bottom .container {
    max-width: 950px;
}

.cta-bottom p, .cta-bottom h2 {
    color: #fff;
}
.cta-bottom .cta-buttons .button-hint {
    display: block;
    text-align: center;
    margin-top: 0.3em;
}
.cta-bottom .cta-buttons {
    margin-top: 45px;
}

/*---- Responsive ----*/
@media(min-width: 768px){
    .px-md-5{
        padding-left: 50px;
        padding-right: 50px;
    }
}
@media(min-width: 1810px) {
    .tstmnldesc{
        min-height: 355px;
    }
}

@media(max-width: 1809px) {
    .tstmnldesc{
        min-height: 370px;
    }
}
@media(max-width: 1668px) {
    .tstmnldesc{
        min-height: 391px;
    }
}

@media(max-width: 1599px) {
    .tstmnldesc{
        min-height: 345px;
    }
}

@media(max-width: 1468px) {
    .tstmnldesc{
        min-height: 360px;
    }
}

@media(max-width: 1368px) {
    .tstmnldesc{
        min-height: 380px;
    }
}
@media(max-width: 1350px) {
    .tstmnldesc{
        min-height: 390px;
    }
}
@media(max-width: 1338px) {
    .tstmnldesc{
        min-height: 400px;
    }
}
@media(max-width: 1280px) {
    .tstmnldesc{
        min-height: 340px;
    }
}

@media(max-width: 1140px) {
    .tstmnldesc{
        min-height: 361px;
    }
}

@media(max-width: 1040px) {
    .tstmnldesc{
        min-height: 393px;
    }
}

@media(max-width: 992px) {
    .tstmnldesc{
        min-height: 275px;
    }
}

@media(max-width: 910px) {
    .tstmnldesc{
        min-height: 305px;
    }
}

@media(max-width: 850px) {
    .tstmnldesc{
        min-height: 335px;
    }
}

@media(max-width: 750px) {
    .tstmnldesc{
        min-height: 280px;
    }
}

@media(max-width: 700px) {
    .tstmnldesc{
        min-height: 310px;
    }
}

@media(max-width: 668px) {
    .tstmnldesc{
        min-height: 335px;
    }
}

@media(max-width: 630px) {
    .tstmnldesc{
        min-height: 355px;
    }
}

@media(max-width: 600px) {
    .tstmnldesc{
        min-height: 395px;
    }
}

@media(max-width: 574px){
    .tstmnldesc{
        min-height: 300px;
    }
}

@media(max-width: 480px){
    .tstmnldesc{
        min-height: 320px;
    }
}

@media(max-width: 430px){
    .tstmnldesc{
        min-height: 350px;
    }
}

@media(max-width: 380px){
    .tstmnldesc{
        min-height: 380px;
    }
}

@media(max-width: 1140px) {
    .hero h1 {
        font-size: 6rem;
    }  
    .hero p, .ourtutors .title p, .text-size-lg {
        font-size: 2.6rem;
    }
}


@media(max-width: 992px){ 
    .ourtutors .card {
        min-height: 510px;
    }
}
.tablet-on {
    display: none !important;
    visibility: hidden;
}

@media(max-width: 840px) and (min-width: 481px) {
    .tablet-on {
        display: block !important;
        visibility: visible;
    }
    .personalized .right {
        text-align: center;
        padding-bottom: 35px !important;
    }
    .personalized .right p {
        text-align: left;
    }
    .personalized .tablet-on {
        display: inline-block !important;
        margin-top: 20px;
    }
    .personalized .column {
        display: inline-block;
    }
    .navbar, .navbar .container {
        margin-bottom: 2px;
    }
    .hero > .tablet-on {
        margin-bottom: 31px;
    }
}

@media(max-width: 840px){
    .py-5 {
        padding-top: 0 !important;
        padding-bottom: 0 !important;
    }
    .tablet-off {
        display: none !important;
        visibility: hidden !important;
    }
    .ourtstmnls .section-header {
        text-align: left;
    }
}


@media(max-width: 768px){
    .col-md-8 {
        -ms-flex: 0 0 100%;
        flex: 0 0 100%;
        max-width: 100%;	    
    }
    .col-md-4 {
        -ms-flex: 0 0 100%;
        flex: 0 0 100%;
        max-width: 100%;    
    }
    .tutorssldr .slick-prev{
        left: 35px;
    }
    .tutorssldr .slick-next{
        right: 35px;
    }

    .tstmnlsprevbtn,
    .tstmnlsnextbtn{
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        z-index: 9;
    }
    .tstmnlsprevbtn i::before,
    .tstmnlsnextbtn i::before{
        position: relative;
        top: -1px;
    }
    .tstmnlsprevbtn{
        left: 35px;
    }
    .tstmnlsnextbtn{
        right: 35px;
    }
    .ourtstmnls{
        padding-left: 0;
        padding-right: 0;
        position: relative;
    }
    .ourtstmnls header .col-md-4{
        position: static;
    } 
    .ourtstmnls .fa-angle-left {
        margin-right: 0px !important;
    }

    .ourtutors .card {
        min-height: 480px;
    }
    .hero p, .ourtutors .title p, .text-size-lg {
        font-size: 2.3rem;
    }
    .ourtutors {
        padding-top: 75px;
    }
    .home .pv-xxl {
        padding-top: 75px !important;
    }
    .tutordescription {
        min-height: 130px;
    }
    .card-subtitle {
        overflow: hidden;
        display: -webkit-box;
        -webkit-line-clamp: 3;
        -webkit-box-orient: vertical;
    }
}

@media(max-width: 750px){
    .brand-list img {
        min-width: 0;
    }
}


@media(max-width: 640px){

    .tutorssldr .slick-prev{
        left: 35px;
    }
    .tutorssldr .slick-next{
        right: 35px;
    }
    .tstmnlsbtns{
        justify-content: center !important;
    }
    .tstmnlsbtns{
        padding-top: 20px;
    }
    .tstmnlsprevbtn,
    .tstmnlsnextbtn{
        padding: 0 4px !important;
    }
    .tstmnlitem {
        padding: 0 15px;
    }
}

@media(max-width: 575px){

    .tstmnlsprevbtn, 
    .tstmnlsnextbtn {	    
        top: 58%;	    
    }
    .ourtutors .card {
        min-height: 460px;
    }
    .hero p, .ourtutors .title p, .text-size-lg {
        font-size: 2.2rem;
    }
}

@media(min-width: 481px){
    .mobile-off {
        display: block !important;
        visibility: visible;
    }

    .mobile-on {
        display: none !important;
        visibility: hidden;
    }
}

@media(max-width: 480px){
    .personalized .tablet-on {
        display: block !important;
        visibility: visible !important;
    }

    .mobile-on{
        display: block !important;
        visibility: visible;
    }
    .personalized .tablet-on {
        display: block;
        visibility: visible;
    }

    .mobile-off {
        display: none !important;
        visibility: hidden;
    }
    .hero p, .ourtutors .title p, .text-size-lg {
        font-size: 2rem;
    }
    .hero h1 {
        font-size: 4.5rem;
    }
    .hero .brand-list p {
        font-size: 1.65rem;
    }
    .navbar, .navbar .container {
        margin-bottom: 2px;
    }
    .hero > .mobile-on {
        margin-bottom: 25px;
    }
    .hero .brand-list {
        margin-top: 27px;
    }
    .announcement * {
        font-size: 1.1rem;
    }
    .tstmnljob {
        font-size: 1.6rem;
    }
    .ourtutors {
        padding-top: 65px;
    }
    .home .pv-xxl {
        padding-top: 65px !important;
    }
}

@media(max-width: 420px){

    .tutorsitem {
        padding: 0 15px;
    }
    .tutorimg {
        width: 140px;
        height: 140px;
    }
    .slick-arrow{
        width: 38px;
        height: 38px;
    }
    .slick-arrow i{
        font-size: 24px;
    }
    .tstmnlsbtns i {
        width: 38px;
        height: 38px;	    
    }
    .ourtstmnls {
        padding-left: 0;
        padding-right: 0;    	
    }

}

@media(max-width: 390px) {
    .hero h1 {
        font-size: 4rem;
    }
    .hero .brand-list p {
        font-size: 1.5rem;
    }
    .tstmnldesc {
        font-size: 18px;
    }
}