@media(max-width:1200px){
    body{
        padding-bottom: 59px;
    }
    #header .logo img{
        height: 95px;
    }
    .header-padding{
        padding-top: 109px;
    }
    .header-padding.withsearch{
        padding-top: 199px;
    }
    .main-nav > ul > li{
        padding: 0px 10px;
    }
    .main-nav a{
        font-size: 13px;
    }
    .main-nav .drop-down .dropdownmenu{
        width: 140px;
        padding: 20px 10px;
    }
    .banner-content h2{
        font-size: 35px;
        line-height: 55px;
    }
    .banner-content p{
        font-size: 16px;
        margin-bottom: 30px;
    }
    .main-btn{
        padding: 6px 30px;
        font-size: 16px;
    }
    .home-banner{
        padding: 100px 0px 280px;
    }
    .our-space-bx h3{
        font-size: 26px;
    }
    .our-space-bx-inner h4{
        font-size: 24px;
    }
    .our-video{
        padding: 250px 0px;
    }
    .popular-course-content{
        padding: 10px 40px;
    }
    .course-box .popular-course-content {
        margin-left: -120px;
    }
    .course-box-pad .popular-course-content {
        margin-right: -120px;
    }
    .course-box-pad{
        padding: 100px 0px;
    }
    .main-features-content{
        padding: 70px 0px;
    }
    .main-features-cont-bx h6{
        font-size: 20px;
    }
    .main-features-cont-bx h3{
        font-size: 30px;
    }
    .footer{
        padding: 20px 0px 15px;
    }
    .mobile-nav a{
        text-align: left;
    }
    .main-nav a img{
        width: 25px;
        height: 25px;
    }
    .about-area{
        padding: 100px 0px 65px;
    }
    .material-category{
        padding: 20px 40px;
    }
    .material-price-box .btn{
        width: 100%;
        font-size: 18px;
        padding: 7px 0px;
    }
    .material-price-box ul li{
        padding-bottom: 10px;
    }
    .material-price-box{
        padding: 20px 10px;
    }
    .material-area{
        padding: 40px 0px;
    }
    .benefit-box .count{
        width: 50px;
        height: 50px;
        margin-right: 5px;
    }
    .benefit-box .benefit{
        font-size: 14px;
    }
    .user-profile .section-header h3{
        font-size: 35px;
    }
    .user-profile-pic .main-img{
        width: 120px;
        height: 120px;
    }
    .course-details-content{
        padding: 70px 70px;
    }
    .inner-banner{
        padding: 150px 0px;
    }
    .inner-banner-content p{
        font-size: 22px;
    }
    .search-box-area{
        top: 109px;
    }
}
@media(max-width:992px){
    #header .logo img{
        margin: 0;
    }
    .header-padding{
        padding-top: 95px;
    }
    .header-padding.withsearch{
        padding-top: 165px;
    }
    .our-space-bx-inner{
        margin-bottom: 20px;
    }
    .our-space-bx{
        padding: 20px;
    }
    .our-space{
        margin-top: 0px;
        padding: 30px 0px;
    }
    .our-video{
        margin-top: 0;
        padding: 50px 0px 150px;
    }
    .section-header h3{
        margin-bottom: 40px;
    }
    .course-box .popular-course-content,.course-box-pad .popular-course-content{
        margin: -100px 45px 0px;
    }
    .course-box-pad {
        padding: 40px 0px;
    }
    .feature-box{
        margin-bottom: 20px;
        height: auto;
        background-position: 32px 26px;
    }
    .popular-course-content h4{
        font-size: 24px;
    }
    .home-banner {
        padding: 100px 0px;
    }
    .about-content{
        padding: 20px;
    }
    .about-content p{
        font-size: 14px;
        margin-bottom: 20px;
    }
    .about-content h4{
        font-size: 30px;
        margin-bottom: 20px;
    }
    .classes-box .owl-nav{
        right: 0;
        display: flex;
        align-items: center;
        width: 100%;
        justify-content: space-between;
    }

    .classes-box .owl-nav .owl-prev{
        margin-left: -55px;
    }

    .classes-box .owl-nav .owl-next{
        margin-right: -55px;
    }

    .classes-box .owl-nav .owl-next, .classes-box .owl-nav .owl-prev{
        width: 50px;
        height: 50px;
    }

    .classes-box h4{
        font-size: 20px;
    }
    .search-box-area{
        padding: 10px 0px;
        top: 95px;
    }
    .material-area h3{
        font-size: 26px;
        margin-bottom: 20px;
    }
    .material-price-box{
        margin:0px 0px 30px;
    }
    .material-desc-top{
        padding: 30px 70px;
    }
    .review-header-content{
        top: 50px;
    }
    .customer-review .owl-carousel{
        padding-top:60px ;
    }
    .user-profile-pic{
        margin-bottom: 20px;
    }
    .course-details-content {
        padding: 50px 50px;
    }
    .course-details-content h2{
        font-size: 26px;
        margin-bottom: 30px;
    }
    .course-details-content h4{
        font-size: 18px;
        margin-bottom: 10px;
    }
    .course-details-content p{
        margin-bottom: 20px;
    }
    .course-list ul li{
        margin-bottom: 15px;
    }
    .course-list{
        margin-bottom: 30px;   
    }
    .breadcrumb{
        margin-bottom: 10px;
    }
    .section-pad {
        padding: 40px 0px;
    }
    .subscription-bx{
        margin-bottom: 30px;
        height:auto;
    }
    .pay-btn{
        margin-top: 0;
    }
    .sign-in-area{
        min-height: calc(100vh - 154px);
    }
    .material-desc-top.inner{
        min-height:auto;
    }
    .material-desc-top.inner::before{
        min-height:auto;
    }
}

@media(max-width:767px){
    #header .logo img {
        height: 70px;
    }
    .header-padding{
        padding-top: 70px;
    }
    .header-padding.withsearch{
        padding-top: 140px;
    }
    .home-banner {
        padding: 60px 0px;
    }
    .banner-content h2 {
        font-size: 30px;
        line-height: 40px;
        margin-bottom: 10px;
    }
    .banner-content p {
        font-size: 14px;
        margin-bottom: 20px;
    }
    .main-btn{
        padding: 6px 20px;
    }
    .our-space-bx {
        padding: 10px;
    }
    .our-video{
        padding: 40px 0px 115px;
    }
    .popular-course-content {
        padding: 20px 30px;
    }
    .course-box .popular-course-content, .course-box-pad .popular-course-content {
        margin: -60px 30px 0px;
    }
    .main-features-cont-bx h3 {
        font-size: 24px;
        margin-bottom: 10px;
    }
    .main-features-cont-bx h6{
        font-size: 16px;
        margin-bottom: 20px;
    }
    .about-content{
        background-size: cover;
    }
    .about-content {
        padding: 20px 20px 50px;
    }
    .about-content h4 {
        font-size: 24px;
        margin-bottom: 15px;
    }
    .classes-box .owl-nav .owl-next {
        margin-right: -45px;
    }
    .classes-box .owl-nav .owl-prev{
        margin-left: -45px;
    }
    .search-box .form-control{
        padding-right: 40px;
    }
    .material-desc-top {
        padding: 20px 35px;
    }
    .material-desc-top-content h2{
        line-height: 34px;
        font-size: 26px;
    }
    .material-desc-top-content p{
        font-size: 14px;
        margin-bottom: 20px;
    }
    .material-desc-top-content h4{
        font-size: 18px;
    }
    .material-desc-top-content img{
        width: 16px;
        margin: 0px 2px;
    }
    .material-desc-top-content h4 span{
        font-size: 14px;
        padding: 0px 5px;
    }
    .material-desc-bottom{
        padding: 20px 35px;
    }
    .more-section{
        padding: 10px 0px;
    }
    .material-price-box {
        margin:0px 0px 20px;
    }
    .material-desc-bottom-content .see-more-btn{
        padding: 7px 25px;
    }
    .review-header h3{
        font-size: 24px;
    }
    .review-header-content h4{
        font-size: 16px;
        line-height: 30px;
        text-align: right;
    }
    .profile-img img{
        width: 80px !important;
        height: 80px !important;
    }
    .rating-star img{
        width: 18px !important;
        margin-right: 4px;
    }
    .testimonial-box p{
        font-size: 14px;
    }
    .testimonial-box a{
        font-size: 14px;
    }
    .accordion-body ul li .preview-btn{
        position: relative;
        top: auto;
        right: auto;
        display: flex;
        align-items: center;
        justify-content: space-between;
    }
    .accordion-body ul li .preview-btn span{
        font-size: 10px;
    }
    .nav-pills .nav-link{
        padding: 7px 25px;
    }
    .user-profile{
        padding: 40px 0px;
    }
    .course-thumb-img img{
        width: auto;
    }
    .inprogress-content{
        margin-top: 30px;
    }
    .course-thumb-img{
        margin-bottom: 20px;
    }
    .course-box-content h3{
        font-size: 20px;
        margin-bottom: 10px;
    }
    .course-progress{
        margin-bottom: 10px;
    }
    .course-list{
        margin-bottom: 20px;   
    }
    .inner-banner {
        padding: 80px 0px;
    }
    .inner-banner-content h4{
        font-size: 26px;
    }
    .inner-banner-content p{
        font-size: 20px;
    }
    .subscription-bx h3{
        font-size: 30px;
        line-height: 40px;
        margin: 20px 0px;
    }
    .sign-in-area{
        padding: 40px 0px;
        min-height: calc(100vh - 129px);
    }
    .contact-content h4{
        font-size: 26px;
    }
    .signin-box form {
        padding: 0px 40px;
    }
    .signin-box{
        padding: 20px;
    }
    .cart-bx {
        padding: 10px 20px;
    }
    .total-amount td{
        padding-top: 15px !important;
        font-size: 20px !important;
    }
    .search-box-area{
        top: 70px;
    }
    .class-cover{
            min-height: 170px;
    }
}

@media(max-width:580px){
    .classes-box .owl-nav .owl-next {
        margin-right: 0px;
    }
    .classes-box .owl-nav .owl-prev{
        margin-left: 0px;
    }
    .classes-box .owl-nav .owl-next, .classes-box .owl-nav .owl-prev{
        width: 35px;
        height: 35px;
    }
    .class-type{
        margin: 0px;
    }

    .classes-box .owl-carousel{
        padding: 0px 40px;
    }
    .user-other-details{
        padding: 0px 20px;
    }
    .user-other-details p{
        margin-bottom: 10px;
    }
    .user-other-details .form-control{
        margin-bottom: 20px;
    }
    .benefit-box{
        margin-bottom: 10px;
    }
    .benefit-box .count{
        font-size: 30px;
        margin-right: 10px;
    }
    .course-details-content{
        padding: 30px;
    }
    .course-list{
       padding: 20px 20px 20px 0px;
    }
}

@media(max-width:480px){
    body{
        padding-bottom: 46px;
    }
    .home-banner {
        padding: 40px 0px;
        /* background-position: center right; */
    }
    .banner-content{
        text-align: center;
    }
    .banner-content h2{
        font-size: 24px;
        line-height: 34px;
    }
    .our-space-bx h3 {
        font-size: 20px;
    }
    .our-space-bx-inner h4 {
        font-size: 18px;
    }
    .youtube-video iframe{
        height: 250px;
    }
    .our-video {
        padding: 40px 0px 80px;
    }
    .section-header h3{
        margin-bottom: 20px;
        font-size: 24px;
    }
    .course-box .popular-course-content, .course-box-pad .popular-course-content{
        margin: -50px 15px 0px;
    }
    .popular-course-content {
        padding: 20px 15px;
        border-radius: 0px 40px;
    }
    .popular-course-content h4 {
        font-size: 20px;
        margin-bottom: 10px;
    }
    .popular-course-content p{
        font-size: 14px;
        margin-bottom: 20px;
    }
    .popular-course img{
        border-radius: 0px 40px;
    }
    .main-features-content {
        padding: 40px 0px 20px;
    }
    .main-features-cont-bx h3{
        font-size: 18px;
    }
    .main-features-cont-bx h6{
        font-size: 14px;
    }
    .footer {
        padding: 15px 0px 10px;
    }
    .footer p{
        font-size: 14px;
    }
    .popular-course-content .btn{
        padding: 6px 20px;
    }
    .about-area {
        padding: 60px 0px;
    }
    .about-content {
        padding: 20px 20px 40px;
    }
    .user-profile {
        padding: 20px 0px;
    }
    .class-type h3{
        font-size: 24px;
        left: 10px;
    }
    .classes-box {
        padding: 15px 0px;
    }
    .classes-box h4 {
        font-size: 16px;
        margin-bottom: 10px;
    }
    .material-area h3{
        font-size: 20px;
    }
    .material-category {
        padding: 20px 10px;
    }
    .material-desc-top {
        padding: 20px 15px;
    }
    .material-desc-top-content h2{
        line-height: 25px;
        font-size: 20px;
        margin-bottom: 10px;
    }
    .material-desc-top-content h4{
        display: inline-block;
        line-height: 24px;
        margin: 0;
    }
    .material-desc-bottom{
        padding: 20px 15px;
    }
    .material-desc-bottom-content h4{
        font-size: 15px;
        margin-bottom: 10px;
    }
    .material-desc-bottom-content ul li{
        font-size: 14px;
    }
    .material-desc-bottom-content ul li img{
        width: 18px;
    }
    .more-section{
        font-size: 14px;
    }
    .material-price-box h4{
        font-size: 18px;
    }
    .material-desc-bottom-content .accordian-heading{
        padding: 10px 20px;
    }
    .material-desc-bottom-content .accordian-heading h5{
        font-size: 14px;
    }
    .material-desc-bottom-content .accordion-button{
        padding: 10px 15px 10px 40px;
    }
    .accordion-button::after{
        left: 10px;
    }
    .material-desc-bottom-content .accordion-button span{
        right: 10px;
        font-size: 12px;
    }
    .material-price-box p{
        margin-bottom: 20px;
    }
    .material-price-box h5{
        font-size: 20px;
        line-height: 32px;
    }
    .material-price-box ul li{
        font-size: 14px;
    }
    .material-desc-bottom-content p{
        font-size: 14px;
    }
    .review-header h3{
        font-size: 20px;
        line-height: 36px;
        margin-bottom: 20px;
    }
    .review-header-content{
        top: 36px;
    }
    .material-desc{
        padding-bottom: 40px;
    }
    .material-price-box .btn{
        font-size: 16px;
    }
    .user-profile .section-header h3{
        font-size: 26px;
        margin-bottom: 20px;
    }
    .user-other-details h4{
        font-size: 15px;
        margin-bottom: 10px;
    }
    .user-other-details p{
        font-size: 15px;
    }
    .user-other-details .save-btn{
        font-size: 14px;
    }
    .nav-pills .nav-link{
        font-size: 16px;
        margin-right: 5px;
        padding: 6px 18px;
    }
    .course-box-content h3{
        font-size: 18px;
    }
    .inprogress-content{
        padding: 10px;
    }
    .course-box-content span{
        font-size: 12px;
    }
    .course-details-content {
        padding: 20px;
    }
    .course-details-content h2{
        font-size: 20px;
        margin-bottom: 20px;
    }
    .course-details-content h4{
        font-size: 16px;
    }
    .course-content {
        padding: 20px 0px;
    }
    .breadcrumb-item{
        font-size: 14px;
    }
    .page-right-btns ul li{
        padding: 0px 10px;
    }
    .page-right-btns ul li a{
        font-size: 14px;
    }
    .inner-banner {
        padding: 50px 0px;
    }
    .inner-banner-content h4{
        font-size: 24px;
        margin-bottom: 20px;
    }
    .inner-banner-content p{
        margin: 0;
        font-size: 16px;
    }
    .subscription-bx{
        padding: 20px 15px;
    }
    .subscription-bx h4{
        font-size: 20px;
    }
    .subscription-bx ul li{
        padding-bottom: 10px;
        font-size: 14px;
    }
    .subscription-bx {
        margin-bottom: 20px;
    }
    .subscription-bx .btn{
        padding: 6px 18px;
    }
    .signin-box{
        padding: 20px;
    }
    .contact-content h4 {
        font-size: 20px;
        margin-bottom: 20px;
    }

    .contact-content p{
        font-size: 14px;
        margin-bottom: 30px;
    }
    .signin-box form {
        padding: 0px;
    }
    .signin-box h4{
        font-size: 24px;
    }
    .signin-box p{
        font-size: 14px;
        width: 100%;
    }
    .pay-btn{
        padding: 6px 20px;
    }
    .search-box{
        padding: 5px 4px;
    }
    .search-box .form-control{
        font-size: 12px;
        padding-right: 30px;
    }
    .search-box .form-select{
        font-size: 12px;
        background-size: 11px 7px;
    }
    .search-box .search-btn{
        padding: 0;
    }
    .banner-content p{
        padding: 0;
    }
    .sign-in-area{
        min-height: calc(100vh - 116px);
    }
    .class-cover{
        min-height: 130px;
        padding: 10px;
    }
    .class-type h5{
        font-size:16px;
    }
}