@media (max-width: 769px) {

    body {}


    header {
        position: relative;
    }

    .header {
        height: 110px;
        padding: 0;
        position: relative;
    }
    .logo {height: 110px; line-height: 110px;}
    .logo img {max-height: 50px;max-width: 40%;}
    .header .col-md-6 {position: inherit;}

    .header-cat-menu-area {display: none;}
    .header-lang-menu {display:  none;}
    .header-menu {display: none;}
    .header-other-menu {display: none;}
    .header-menu-area {display: none;}


    .header-buttons {position: absolute;right: 0;top: 35px;height: 40px;}
    .header-buttons ul li:last-child {}
    .header-buttons ul li i {width: 40px; height: 40px; line-height: 40px; }
    .header-buttons .header-lang-button {width: 40px; height: 40px; line-height: 40px; }
    .header-buttons ul li a {width: 40px; height: 40px;}
    .mobile-menu-button.active a i:first-child {
        margin-top: -40px;
    }

    .header-search {display: block; right: auto; left: 0; width: 100%; height: 100%; top: 0;
        border-radius: 0; border-radius: 10px 10px 0 0;}

    .mobile-top {display: block;}

    .header-leftside {
        height: 110px;
        padding: 0;
    }
    .header-logo {
        height: 110px;
        line-height: 110px;
        border: none;
        padding: 0;
        float: none;
    }
    .header-logo img {}
    .header-logo a {}

    .mobile-menu-button {display: block;}


    /******* Section ******/
    section {}

    .banner-section {
        margin-bottom: 20px;
    }
    .main-banner-slider {}
    .main-banner-slider ul li {}
    .banner-area {}
    .banner-area > img {}
    .banner-content-area {}
    .banner-content {
        width: 100%;
        margin: 0;
        padding: 0;
    }
    .banner-photo {
        width: 100%;
        float: none;
        height: 250px;
        line-height: 250px;
        padding: 0 30px;
    }
    .banner-photo img {}
    .banner-desc {
        width: 100%;
        float: none;
        padding: 0 30px;
        height: 200px;
    }
    .banner-desc h4 {
        font-size: 24px;
        line-height: 27px;
    }
    .banner-desc p {
        font-size: 14px;
        margin-top: 10px;
    }

    .banner-search-area {
        margin: 0;
        left: 10%;
        width: 80%;
        bottom: 30px;
    }
    .banner-search {
        width: 100%;
        height: 50p;
    }
    .banner-search input {
        height: 50px;
    }
    .banner-search a {
        height: 50px;
    }
    .banner-search a i {height: 50px; line-height: 50px;}

    .campaigns-section {
        height: auto;
        padding: 20px 10px;
    }
    .campaigns-area {}
    .campaigns-title-area {
        padding: 0 0 20px 0;
        height: auto;
    }
    .campaigns-title-area h3 {
        font-size: 24px;
    }
    .campaigns-title-area p {
        font-size: 13px;
    }
    .campaigns-title-area a {
        height: 36px;
        line-height: 36px;
        font-size: 13px;
    }

    .main-campaign {
        padding: 20px 0;
        border-top: 1px solid #dbdbdb;
        border-left: none;
        height: auto;
    }
    .main-campaign b {
        font-size: 11px;
    }
    .main-campaign h4 {
        font-size: 16px;
        line-height: 20px;
    }
    .main-campaign p {
        font-size: 13px;
    }
    .main-campaign a {}
    .main-campaign a i {}
    .main-campaign a i:before {}

    .teachers-section {
        padding: 30px 10px;
    }
    .teachers-area {}
    .teachers-banner {
        height: 150px;
    }
    .teachers-banner img {
        max-height: 100%;
    }

    .teachers-banner-information {
        padding: 30px 0;
        position: relative;
    }
    .teachers-banner-information h4 {
        font-size: 25px;
        margin-bottom: 20px;
    }
    .teachers-banner-information p {
        font-size: 14px;
        line-height: 20px;
        margin-bottom: 0;
    }
    .teachers-banner-buttons {
        position: absolute;
        top: -120px;
        right: 20px;
    }
    .teachers-banner-buttons ul {}
    .teachers-banner-buttons ul li {
        float: none;
        font-size: 14px;
    }
    .teachers-banner-buttons ul li + li {margin: 10px 0 0 0;}
    .teachers-banner-buttons ul li a {padding: 0; }
    .teachers-banner-buttons ul li i {}
    .teachers-banner-buttons ul li i:before {
        font-size: 28px;
    }

    .teachers-list-area {
        padding: 30px 0;
    }
    .teachers-list-title {
        padding: 0 0 30px 0;
    }
    .teachers-list-title h3 {
        font-size: 26px;
        padding-right: 100px;
        margin-bottom: 20px;
    }
    .teachers-list-title p {
        font-size: 13px;
    }
    .teachers-list-title a {}
    .teachers-list-title i {}
    .teachers-list-title i:before {}

    .teachers-list {
        padding: 0;
    }
    .teachers-list ul {}
    .teachers-list ul li {
        width: 50%;
        margin-bottom: 30px;
    }
    .teacher-box-photo {width: 100%;height: 140px;padding: 5px;}
    .teacher-box-photo img {width: 100%;height: 100%;object-fit: cover;}
    .teacher-box-title h4 {
        font-size: 17px;
    }
    .teacher-box-title h5 {
        font-size: 13px;
    }

    .lessons-section {
        padding: 50px 10px;
    }
    .lessons-header-area {
        margin-bottom: 20px;
    }
    .lessons-header-area h3 {
        font-size: 26px;
    }
    .lessons-header-area p {
        font-size: 13px;
    }

    .lessons-menu {
        margin: 0 0 20px 0;
        height: 40px;
        overflow-x: scroll;
    }
    .lessons-menu ul {
        width: max-content;
        float: none;
    }
    .lessons-menu ul li {
        font-size: 13px;
        font-weight: 500;
    }

    .lesson-box {
        height: 360px;
    }
    .lesson-box-title {
        height: 100px;
        padding: 15px 15px 0 15px;
    }
    .lesson-box-title h4 {
        font-size: 18px;
    }
    .lesson-box-title ul li {}

    .lesson-box-info {
        height: 90px;
        padding: 0 15px 15px 15px;
    }
    .lesson-box-info h5 {
        font-size: 14px;
    }
    .lesson-box-info h6 {
        font-size: 13px;
    }

    .introduction-section {
        padding: 50px 10px;
    }

    .introduction-header {padding-bottom: 50px}
    .introduction-title {
        padding: 0;
        margin-bottom: 30px;
    }
    .introduction-title h3 {font-size: 26px;}
    .introduction-title p {font-size: 13px;}

    .introduction-photo {}
    .introduction-photo img {}

    .introduction-steps {padding: 0 0 0 20px;}
    .introduction-steps ul {}
    .introduction-steps ul li {
        height: 30px;
        font-size: 13px;
        line-height: 15px;
    }
    .introduction-steps ul li + li {margin-top: 10px;}
    .introduction-steps ul li b {
        width: 30px;
        height: 30px;
        line-height: 30px;
        font-size: 13px;
        margin-right: 10px;
    }

    .introduction-box {
        padding-right: 0;
        margin-bottom: 40px;
    }
    .introduction-box i {float: left;margin: 0 20px 20px 0;}
    .introduction-box h4 {font-size: 20px;/* height: 55px; */}
    .introduction-box p {
        width: 100%;
        float: left;
    }

    .inner-banner {
        height: 220px;
    }
    .inner-banner > img {}

    .inner-header-area {}

    .inner-header {
        height: 220px;
        position: relative;
    }
    .inner-title {
        /* padding-top: 50px; */
        top: 30px;
    }
    .inner-title h1 {
        font-size: 22px;
    }
    .inner-title h1 b{}
    .inner-title h2 {font-size: 22px;}
    .inner-title h2 b{ }
    .inner-title p {
        font-size: 17px;
        line-height: 19px;
    }

    .inner-header .col-md-3 {position: inherit;}

    .inner-header-photo {
        position: absolute;
        right: 0;
        top: 0;
        height: 150px;
        line-height: 150px;
    }
    .inner-header-photo img {
        max-width: 70px;
        max-height: 70px;
    }

    .inner-breadcrumb {bottom: 70px;}
    .content-detail {padding: 20px; margin-top: -50px;}
    .list-area {padding: 20px; margin-top: -50px;}
    .detail-section .list-area {padding: 20px; margin-top: -50px;}


    .blog-box {height: 320px}

    .detail-slider {height: 250px;}
    .detail-slider ul li {height: 250px}
    .detail-slider ul li img {object-fit: contain;}

    .object-style-four {
        height: 390px;
    }
    .object-style-four-photo {
        height: 230px;
    }
    .object-style-four-title {height: 160px;}

    .blog-box-title i {left: auto; right: 20px; bottom: 10px;}

    .content-photos-slider {height: auto;}
    .content-photos-slider li {height: 250px;}

    .content-photos-slider .bx-wrapper .bx-controls-direction a {
        width: 36px;
        height: 36px;
        border-radius: 0;
        border: 1px solid #fff;
        transition: all 300ms ease-in;
        display: block;
    }

    .content-photos-slider .bx-wrapper .bx-prev {left: 20px; background: #333333 url(../img/icons/icon-min-prev-white.png) no-repeat center center;}
    .content-photos-slider .bx-wrapper .bx-next {right: 20px; background: #333333 url(../img/icons/icon-min-next-white.png) no-repeat center center;}

    .content-photos-slider .bx-wrapper .bx-prev:hover {background: #000 url(../img/icons/icon-min-prev-white.png) no-repeat center center;}
    .content-photos-slider .bx-wrapper .bx-next:hover {background: #000 url(../img/icons/icon-min-next-white.png) no-repeat center center;}

    .content-photos-slider-pager ul li a {height: 100px;}

    .detail-title {margin-bottom: 20px; }
    .detail-title h1 {margin-bottom: 10px; font-size: 22px;  }
    .detail-title h2 {}
    .detail-title span {display: block; margin-bottom: 10px; }
    .detail-title p {font-size: 18px;}

    .map-box {margin-bottom: 20px;}

    .description-box i {width: 50px;text-align: left;margin-bottom: 20px;}
    .description-box p {width: auto;padding-left: 0;}

    .form ul li > b {width: 100%;padding: 10px 20px 0 0;}
    .form ul li > span {width: 100%; }
    .form ul li > button, .form ul li > input {width: 100%;}

    .form-photo {height: 250px;}

    .form ul li > span > label {width: 50%; }
    .form ul li > span > select.birthdate-month {width: 30%;}
    .form ul li > span > select.birthdate-date {width: 30%;}

    .membership-login-area {padding: 30px;}
    .membership-fast-buttons ul li {width: 50%;}


    .admit-option label {width: 15%; }
    .admit-option b {width: 85%; }

    .membership-form ul li button {width: 100%;}

    .order-step-area {height: 130px; padding: 0 5px}

    .order-step-prev {width: 10%;font-size: 11px;height: 130px;padding-top: 40px;}
    .order-step-prev i {width: 36px;height: 36px;line-height: 30px;display: inline-block;}
    .order-step-prev a {width: auto; }

    .order-step {padding: 10px 10px;width: 80%;height: 130px;}
    .order-step ul li h5 {}
    .order-step ul li span {}
    .order-step ul li b {font-size: 16px; line-height: 16px;}

    .order-step-next {width: 10%;font-size: 11px;height: 130px;padding-top: 40px;}
    .order-step-next i {width: 36px;height: 36px;line-height: 30px;display: inline-block;}
    .order-step-next a {width: auto; }

    .order-step-body {padding: 20px;}
    .basket-order-list {padding-right: 0;}

    .basket-order ul li {width: 30%; text-align: left; }

    .basket-order ul li:nth-child(1) {width: 100%; margin-bottom: 10px;}
    .basket-order ul li:nth-child(2) {}
    .basket-order ul li:nth-child(3) {}
    .basket-order ul li:nth-child(4) {}
    .basket-order ul li:nth-child(5) {width: 10%; text-align: right;}

    .alert-message {width: 90%; }

    .order-section {margin-top: 50px;}

    .rightside {margin: 0 0 80px 0}

    .content-detail-area {margin: 0;}

    .heading-title h1 {color: #000; }
    .heading-title h2 {color: #000; }

    .heading-cover-photo {margin: -100px auto 0 auto;}
    .heading {padding: 20px 0 0 0; }
    .heading-title {text-align: center; }

    .filter-area ul li {width: 100%;padding: 10px;height: auto;}
    .filter-area ul li + li {border: none; border-top: 1px solid #dbdbdb;}
    .filter-area ul li:last-child {width: 100%; }


    .categories-tab {
        overflow-x: scroll;
    }
    .categories-tab ul {
        width: 1000px;
    }
    .categories-tab ul li {}
    .categories-tab ul li a {}

    /***** Foooter *****/
    footer {}

    .cookies-information-area {width: 90%; left: 5%; }

    .footer-top-section {
        height: auto;
        padding: 0 20px;
    }
    .footer-top {}

    .footer-box {
        height: 80px;
        padding: 15px 0;
        border: none;
        border-top: 1px solid #dbdbdb;
    }
    .footer-box a {}
    .footer-box i {}
    .footer-box i:before {}
    .footer-box h4 {}
    .footer-box h4 b {}

    .footer-section {padding: 0 20px; }

    .footer-leftside {padding: 30px 0;  border-bottom: 1px solid #dbdbdb;}

    .footer-menu {overflow: hidden;padding: 30px 0;}
    .footer-menu > ul > li + li {margin: 0;}
    .footer-menu > ul > li {width: 50%;display: inline-grid;float: none;margin-bottom: 25px;} {}

    .footer:before {display: none;}

    .footer-logo {margin-bottom: 20px;text-align: center;}
    .footer-logo a {display: block; }
    .footer-logo img {max-width: 200px; }
    .footer-address {display: none;}
    .footer-social {text-align: center;}
    .footer-social ul {display: inline-block;}
    .footer-social ul li {}


    .footer-rightside {padding: 30px 0; border-top: 1px solid #dbdbdb; }


    .copyright {text-align: center; }
    .copyright ul {display: inline-block; width: auto;}
    .copyright ul li {float: none;display: inline-block;}
    .copyright ul li a {}

    .signature {text-align: center; padding: 15px 20px; }

    .detail-body p img {float: none !important; max-width: 100% !important;}
    .detail-body p img + strong {width: 100% !important;float: none;display: block;}

    /* @yvzyrlmz 2022 */


    .main-banner {margin: 0;height: 400px;border-radius: 10px;}
    .banner-description {width: 100%;padding: 30px 20px;}
    .banner-description h4 {font-size: 26px}
    .main-banner ul li {height: 400px; }

    .main-banner .bx-wrapper .bx-prev {right: 80px; }
    .main-banner .bx-wrapper .bx-next {right: 30px}

    .main-banner img.desktop-banner {display: none;}
    .main-banner img.mobile-banner {display: block;}

    .main-services-area {height: auto;overflow: hidden;}
    .main-services-title {padding: 30px 20px;height: auto;}
    .main-services-list {height: auto;padding: 30px 20px;display: inline-block;width: 100%;border-top: 1px solid rgba(0,0,0,0.2);}
    .main-services-list ul li {width: 100%; }
    .main-services-list ul li + li {margin-top: 20px;}

    .main-service-box {height: auto; }
    .main-service-box a {
        padding: 0;
    }
    .main-service-box i {width: 80px;height: 80px;line-height: 80px;display: block;float: left;margin-bottom: 0;margin-right: 15px;}
    .main-service-box i:before {font-size: 30px;}
    .main-service-box h4 {
        height: 80px;
        font-size: 18px;
        line-height: 26px;
        font-weight: 500;
        text-align: left;
        padding-top: 15px;
        padding-right: 30px;
    }


    .promotion-features {padding: 30px 10px;}
    .promotion-features-list {padding-right: 0; }
    .promotion-features-list span {position: relative;height: 150px;width: 150px;right: auto;top: auto;display: block;margin-top: 30px;}


    .process-achievements-section {height: auto;background-position: top 150px right !important;}
    .process-achievements-area {padding-right: 0;height: auto;padding: 30px 10px;}
    .process-achievements-title {padding-right: 0; }

    .promotion-video {margin-right: 0;height: auto;}
    .promotion-video-photos span {height: 200px}
    .promotion-video-photos span:last-child b {bottom: 0; }


    .main-calculation-section {height: auto;padding-bottom: 30px;}
    .main-calculation-area {}
    .main-calculation-title {
        height: auto;
        padding: 30px 0 30px 0;
    }
    .main-calculation-title:before {display: none; }
    .main-calculation-title h4 {
        font-size: 30px;
        margin-bottom: 0;
    }
    .main-calculation-title h4:before {}

    .main-calculation-form {
        padding: 0 0;
        height: auto;
        display: inline-block;
        width: 100%;
    }
    .main-calculation-form ul {}
    .main-calculation-form ul li {
        width: 100%;
        height: 50px;
    }
    .main-calculation-form ul li + li {margin: 10px 0 0 0;  }

    .success-stories-section {padding: 50px 0 ; }
    .main-faq-list ul li {width: 100%; }

    .fast-link-section {padding: 30px;}
    .fast-link-area {padding: 0; }


    .mobile-menu-button {display: block;}

    .process-achievements ul li {
        min-height: 110px;
        position: relative;
        padding: 0px 0 20px 100px;
    }
    .process-achievements ul li i {
        position: absolute;
        width: 90px;
        height: 90px;
        line-height: 88px;}
    .main-faq-list ul li:nth-child(even) {margin-left: 0;}

    .body-mass-page h4 {width: 100%;margin-bottom: 5px;}
    .body-mass-page ul li {width: 100%; }
    .body-mass-page ul li + li {border-left: none; border-top: 1px solid #aaa; }

    .body-mass-page h4 span {left: 0px;top: 50%;opacity: 1;margin: -24px 0 0 0;/* background: #000; */border-width: 25px 0 25px 25px;border-color: transparent transparent transparent #fff !important;}

    .form-area {width: 100% !important;}

}