@media screen and (max-width: 1100px) {

    .header nav .nav-item > .nav-link {
        padding: 1rem 0.4rem;
        font-size: 13px;
    }



}

@media screen and (max-width: 1199px){
    #course .content .save-button,
    #course .content .buy-button{
        padding: 8px 15px;
    }

    #single-clients .wrapper{
        width: 85%;
    }

    #single-clients .wrapper .content{
        width: 80%;
    }
}

@media screen and (max-width: 991px) {

    #testimonial .carousel-inner{
        width: 100%;
    }

    footer .links{
        margin-top: 30px;
        text-align: right ;
    }

    #login .forms,#login .alert{
        width: 60%;
    }

    #single-clients .wrapper{
        width: 90%;
    }

    #single-clients .wrapper .content{
        width: 85%;
    }

    #single-lesson .links .links-menu .menu-item i{
        font-size: 15px;
    }

    #single-lesson .links .links-menu .menu-item span,
    #single-lesson .related-lessons .lesson a
    {
        font-size: 12px;
    }

    #single-lesson .content .about .lesson-title h3{
        font-size: 18px;
    }

    #single-lesson .content .about .lesson-desc p{
        font-size: 14px;
    }

}

@media screen and (max-width: 800px) {
    #course-view .lessons .lesson{
        padding: 0 5px;
    }

}

@media screen and (max-width: 767px) {

   body.page-template-home .slick-slider .slick-prev{
        right: -10% !important;
   }

    body.page-template-home .slick-slider .slick-next{
        left: -10% !important;
    }

    .section-title{
        width: 60%;
    }

    #courses .btns .btn{
        margin: 0 2px;
        padding: 10px 15px;
        font-size: 14px;
    }

    #free-contents .btns .btn{
        margin: 0 2px;
        padding: 10px 15px;
        font-size: 14px;
    }

    #testimonial .slider{
        padding: 25px 15px;
    }

    #testimonial .slider .text{
        font-size: 13px;
    }

    #testimonial .slider .name h3{
        font-size: 16px;
    }

    #testimonial .slider .name p{
        font-size: 16px;
    }

    #login .forms, #login .alert{
        width: 90%;
    }

    #course .content .course-head .course-box{
        text-align: center;
        margin-bottom: 20px;
    }

    #course .content .course-head .course-details{
        text-align: center !important;
    }

    #single-clients .wrapper{
        width: 100%;
    }

    #single-clients .wrapper .content{
        width: 90%;
    }

    #single-lesson .related-lessons .lesson{
        width: 48%;
        float: right;
        margin-left: 2%;
    }

    #single-lesson .related-lessons{
        overflow: hidden;
        margin-top: 25px;
    }

    #courses .box .box-img img{
        height: 140px;
    }

    #courses .box .box-teacher,#courses .box .box-price{

    }

    #courses .box .box-teacher p,
    #courses .box .box-price p{
        font-size: 13px;
    }

    #courses .box .box-title h3{
        font-size: 14px;
        margin: 0 0 10px 0;
    }

}

@media screen and (max-width: 650px) {

    body.page-template-home .slick-slider .slick-prev{
        right: -6% !important;
    }

    body.page-template-home .slick-slider .slick-next{
        left: -6% !important;
    }

}

@media screen and (max-width: 575px) {

    body.page-template-home .slick-slider .slick-prev{
        display: none !important;
    }

    body.page-template-home .slick-slider .slick-next{
        display: none !important;
    }

    #check-certificate .form{
        width: 90%;
    }

    #course .content .course-desc{
        font-size: 13px;
    }

    #course .content .lessons .lessons-wrapper .lesson .lesson-content{
        font-size: 11px;
    }

    #single-clients .wrapper .content p{
        font-size: 13px;
    }

    #single-clients .wrapper .title{
        width: 60%;
    }

    #single-lesson .links .links-menu{
        overflow: hidden;
    }

    #single-lesson .links .links-menu .menu-item{
        width: 49%;
        float: right;
        border-left: 1px solid #3b505a;
    }

    #courses .box .box-img img{
        height: 200px;
    }
}

@media screen and (max-width: 500px) {
    #courses .btns .btn{
        margin: 0;
        padding: 8px 10px;
        font-size: 14px
    }

    #free-contents .btns .btn{
        margin: 0;
        padding: 8px 10px;
        font-size: 14px
    }

    #courses .box .box-teacher, #courses .box .box-price{

    }

    #courses .box{
        width: 70%;
        margin: 0 auto 20px auto;
    }

    #courses .box .box-teacher{

    }

    #courses .box .box-price{

    }


}

@media screen and (max-width: 475px) {

    #login .forms, #login .alert{
        width: 95%;
    }

    #courses .box .box-img img{

    }

    #courses .box .box-teacher,#courses .box .box-price{

    }

    #courses .box .box-teacher p,
    #courses .box .box-price p{
        font-size: 12px;
    }

    #courses .box .box-teacher, #courses .box .box-price{
        bottom: 0;
        top: auto;
    }

    #courses .box{
        width: 75%;
    }

}

@media screen and (max-width: 450px) {

    #login .form .btn{
        display: block;
        width: 100%;
        margin-bottom: 15px;
    }

    #courses .box{
        width: 77%;
    }

    #course .content .course-tabs #pills-tab .nav-item a{
        font-size: 12px;
        padding: 3px 15px;
    }

}

@media screen and (max-width: 415px) {
    #courses .btns .btn{
        margin: 0;
        padding: 6px 5px;
        font-size: 12px;
    }

    #free-contents .btns .btn{
        margin: 0;
        padding: 6px 5px;
        font-size: 12px;
    }

    #courses .box .box-img img{

    }

    #courses .box .box-teacher,#courses .box .box-price{

    }

    #courses .box .box-teacher p,
    #courses .box .box-price p{
        font-size: 12px;
    }
    #courses .box{
        width: 84%;
    }

    #courses .box .box-teacher{

    }

    #courses .box .box-price{

    }

    #courses .box .box-img img{
        height: 180px;
    }
}

@media screen and (max-width: 400px){
    #courses .box {
        width: 90%;
    }

    #courses .box .box-teacher{
        right: 1%;
    }

    #courses .box .box-price{
        left: 1%;
    }

}

@media screen and (max-width: 380px) {
    #courses .box .box-img img{

    }

    #courses .box .box-teacher,#courses .box .box-price{

    }

    #courses .box .box-teacher p,
    #courses .box .box-price p{
        font-size: 11px;
    }

    #courses .box .box-teacher{

    }
    #courses .box{
        width: 94%;
    }

    #course .content .course-tabs #pills-tab .nav-item a{
        font-size: 11px;
        padding: 2px 10px;
    }


    #course .content .course-tabs #pills-tab .nav-item{
        margin-left:4px;
    }

    #free-videos .slick-slider img{
        height: 130px
    }

    #courses .section-title{
        width: 80%;
    }

    #courses .section-title h3{
        font-size:18px;
    }

    #teachers .teacher{
        height: 140px;
    }

    #teachers .teacher .teacher-img img{
        width: 50px;
    }

    #teachers .teacher .teacher-name h3{
        font-size: 13px;
    }

    #teachers .teacher .teacher-employee p{
        font-size: 12px;
    }

    #free-contents .box .box-img img{
        height: 130px;
    }

    #free-contents .box .box-title h3{
        font-size: 13px;
    }

    #course-book .content #contact-form{
        width: 90%;
    }

    #clients-page .title{
        width: 80%;
    }

}

@media screen and (max-width: 350px) {

    #courses .box{
        width: 97%;
    }
}

@media screen and (max-width: 330px) {
    #course .content .save-button, #course .content .buy-button{
        padding: 8px 10px;
        font-size: 12px;
        display: block;
        width: 100%;
        margin-bottom: 10px;
    }

    #courses .box .box-img img{
        /*height: 150px;*/
    }

    #courses .box .box-teacher, #courses .box .box-price{

    }

    #courses .box{
        width: 100%;
    }

}