/* ============================================
   FULLY RESPONSIVE CSS FOR ALL SCREENS
   ============================================ */

/* ===== TOGGLER BUTTON STYLES ===== */
.navbar-toggler:not(:disabled):not(.disabled) {
    cursor: pointer;
    background: none;
}

.navbar-light .navbar-toggler {
    color: #131313;
    outline: 0;
}

.navbar-toggler i {
    font-size: 28px;
}

.navbar-toggler {
    border: none;
}

/* ============================================
   MEDIA QUERIES
   ============================================ */

/* ===== EXTRA LARGE SCREENS (1200px and above) ===== */
@media (min-width: 1200px) {
    /* Default styles - no changes needed */
}

/* ===== LARGE SCREENS (1024px - 1199px) ===== */
/*@media (min-width: 1024px) and (max-width: 1199px) {*/
/*    !* Header *!*/
/*    #header {*/
/*        padding: 15px 0;*/
/*    }*/
/*    .header-item a span {*/
/*        font-size: 14px;*/
/*    }*/
/*    .header-item a span i {*/
/*        font-size: 15px;*/
/*    }*/
/*    .social-logo {*/
/*        padding-right: 15px;*/
/*    }*/
/*    .social-logo i {*/
/*        width: 28px;*/
/*        height: 28px;*/
/*        line-height: 28px;*/
/*        font-size: 14px;*/
/*        margin-right: 5px;*/
/*    }*/

/*    !* Navigation *!*/
/*    .navbar-light .navbar-nav .nav-link {*/
/*        font-size: 14px;*/
/*        margin: 5px 6px;*/
/*        padding: 5px 8px;*/
/*    }*/
/*    .navbar-brand {*/
/*        font-size: 26px;*/
/*    }*/
/*    .new_navbtn .nav-link {*/
/*        padding: 6px 12px;*/
/*        font-size: 14px;*/
/*    }*/

/*    !* Banner *!*/
/*    .left_arrow, .right_arrow {*/
/*        display: none !important;*/
/*    }*/
/*    .bnr_text {*/
/*        padding-top: 100px;*/
/*        padding-bottom: 150px;*/
/*    }*/
/*    .bnr_text h1 {*/
/*        font-size: 42px;*/
/*    }*/
/*    .bnr_text h1 span {*/
/*        font-size: 34px;*/
/*    }*/
/*    .bnr_text h1::after {*/
/*        width: 270px;*/
/*        height: 8px;*/
/*        bottom: 16px;*/
/*    }*/
/*    .bnr_text p {*/
/*        padding-right: 300px;*/
/*        font-size: 15px;*/
/*    }*/
/*    .bnr_text .start_course {*/
/*        font-size: 18px;*/
/*        padding: 12px 20px;*/
/*    }*/

/*    !* Overview *!*/
/*    .overview-item {*/
/*        padding: 20px;*/
/*    }*/
/*    .overview-item h3 {*/
/*        font-size: 22px;*/
/*    }*/
/*    .overview-item p {*/
/*        font-size: 14px;*/
/*        line-height: 24px;*/
/*    }*/
/*    .oi-text h3 {*/
/*        font-size: 18px;*/
/*    }*/
/*    .oi-text p {*/
/*        font-size: 14px;*/
/*    }*/
/*    .oi-icon i {*/
/*        font-size: 20px;*/
/*        width: 45px;*/
/*        height: 45px;*/
/*        line-height: 45px;*/
/*    }*/

/*    !* About *!*/
/*    .about-text h3 {*/
/*        font-size: 20px;*/
/*    }*/
/*    .about-text p {*/
/*        font-size: 14px;*/
/*        padding-right: 20px;*/
/*        line-height: 24px;*/
/*    }*/
/*    .about-text a {*/
/*        padding: 12px 18px;*/
/*        font-size: 15px;*/
/*    }*/
/*    .vid-over a i {*/
/*        width: 50px;*/
/*        height: 50px;*/
/*        line-height: 50px;*/
/*        font-size: 17px;*/
/*    }*/
/*    .vid-over a i:after {*/
/*        width: 60px;*/
/*        height: 60px;*/
/*    }*/

/*    !* Course *!*/
/*    .news-text h4 {*/
/*        font-size: 18px;*/
/*        line-height: 28px;*/
/*    }*/
/*    .news-text p {*/
/*        font-size: 14px;*/
/*        line-height: 24px;*/
/*    }*/
/*    .c-btn {*/
/*        padding: 10px 16px;*/
/*        font-size: 14px;*/
/*    }*/
/*    .dynamic a span {*/
/*        font-size: 13px;*/
/*        padding-right: 8px;*/
/*    }*/
/*    .portfolioFilter a {*/
/*        font-size: 14px;*/
/*        padding: 5px 12px;*/
/*        margin-right: 15px;*/
/*    }*/
/*    .date-over span {*/
/*        font-size: 18px;*/
/*    }*/

/*    !* Count *!*/
/*    .c-number {*/
/*        font-size: 22px;*/
/*    }*/
/*    .c-item i {*/
/*        font-size: 30px;*/
/*    }*/
/*    .c-data span {*/
/*        font-size: 14px;*/
/*    }*/

/*    !* Event *!*/
/*    .calendar_header h2 {*/
/*        font-size: 18px;*/
/*    }*/
/*    .event-cata h3 {*/
/*        font-size: 18px;*/
/*        padding: 15px 0 15px 15px;*/
/*    }*/
/*    .event1 {*/
/*        padding: 15px 0;*/
/*    }*/
/*    .event-time b {*/
/*        font-size: 20px;*/
/*    }*/
/*    .event-infos h4 {*/
/*        font-size: 17px;*/
/*    }*/
/*    .edata span {*/
/*        font-size: 13px;*/
/*        margin-right: 10px;*/
/*    }*/

/*    !* Teacher *!*/
/*    .teacher-info h3 {*/
/*        font-size: 20px;*/
/*    }*/
/*    .teacher-info span {*/
/*        font-size: 14px;*/
/*    }*/
/*    .teacher-icon i {*/
/*        font-size: 16px;*/
/*        margin-right: 6px;*/
/*    }*/

/*    !* Discount *!*/
/*    .dis-text h3 {*/
/*        font-size: 22px;*/
/*    }*/
/*    .dis-text h4 {*/
/*        font-size: 19px;*/
/*    }*/
/*    .dis-text p {*/
/*        font-size: 14px;*/
/*        line-height: 24px;*/
/*    }*/
/*    .dis-text a {*/
/*        padding: 12px 18px;*/
/*        font-size: 15px;*/
/*    }*/
/*    .dis-form h3 {*/
/*        font-size: 21px;*/
/*    }*/
/*    .dis-form .form-control {*/
/*        font-size: 14px;*/
/*        padding: 10px 15px;*/
/*    }*/
/*    .coun_time h2 {*/
/*        font-size: 22px;*/
/*    }*/

/*    !* Price *!*/
/*    .price-item h3 {*/
/*        font-size: 21px;*/
/*    }*/
/*    .price-tag span {*/
/*        font-size: 26px;*/
/*    }*/
/*    .price-btn a {*/
/*        padding: 12px 18px;*/
/*        font-size: 15px;*/
/*    }*/

/*    !* Testimonial *!*/
/*    .slick-padding h3 {*/
/*        font-size: 20px;*/
/*    }*/
/*    .comment-text-item p {*/
/*        font-size: 14px;*/
/*        line-height: 24px;*/
/*    }*/
/*    .comment-text-item h3 {*/
/*        font-size: 18px;*/
/*    }*/

/*    !* Blog *!*/
/*    .blog-card-item .card-body .card-title {*/
/*        font-size: 17px;*/
/*    }*/
/*    .blog-card-item .card-body .card-excerpt {*/
/*        font-size: 14px;*/
/*    }*/
/*    .blog-card-item .card-body .btn-read {*/
/*        font-size: 13px;*/
/*        padding: 6px 18px;*/
/*    }*/
/*    .blog-card-item .card-img-wrap {*/
/*        height: 200px;*/
/*    }*/

/*    !* Brand *!*/
/*    .market-item {*/
/*        padding: 20px;*/
/*    }*/

/*    !* Footer *!*/
/*    .item-logo {*/
/*        font-size: 22px;*/
/*    }*/
/*    .footer-text p {*/
/*        font-size: 14px;*/
/*        line-height: 24px;*/
/*    }*/
/*    .links h3 {*/
/*        font-size: 20px;*/
/*    }*/
/*    .links ul li a {*/
/*        font-size: 14px;*/
/*        padding: 4px 0;*/
/*    }*/
/*    .footer-social a i {*/
/*        font-size: 15px;*/
/*        width: 35px;*/
/*        height: 35px;*/
/*        line-height: 35px;*/
/*        margin-right: 6px;*/
/*    }*/

/*    !* FAQ *!*/
/*    .faq-question {*/
/*        font-size: 16px;*/
/*        padding: 15px 20px;*/
/*    }*/
/*    .faq-answer p {*/
/*        font-size: 14px;*/
/*    }*/

/*    !* Instructor *!*/
/*    .in-item h3 {*/
/*        font-size: 20px;*/
/*    }*/
/*    .in-item a {*/
/*        font-size: 15px;*/
/*        padding: 12px 18px;*/
/*    }*/
/*}*/

/* ===== EXACT 1024px ===== */
@media (width: 1024px) {
    .bnr_text p {
        padding-right: 350px;
    }
    .bnr_text h1 {
        font-size: 40px;
    }
    .bnr_text h1 span {
        font-size: 32px;
    }
    .bnr_text h1::after {
        width: 250px;
        height: 7px;
        bottom: 15px;
    }
    .about-text p {
        padding-right: 15px;
    }
    .oi-text h3 {
        font-size: 17px;
    }
    .news-text h4 {
        font-size: 17px;
    }
    .teacher-info h3 {
        font-size: 18px;
    }
    .blog-card-item .card-body .card-title {
        font-size: 16px;
    }
    .blog-card-item .card-img-wrap {
        height: 180px;
    }
    .portfolioFilter a {
        font-size: 13px;
        padding: 4px 10px;
        margin-right: 10px;
    }
}


/* ============================================
   NAVIGATION FIX FOR 992px - 1200px
   ============================================ */

/* Make nav items smaller so they fit in one line */
@media (min-width: 992px) and (max-width: 1200px) {
    /* Make menu text smaller */
    .navbar-nav .nav-link {
        font-size: 13px !important;
        padding: 8px 6px !important;
        margin: 0 2px !important;
        white-space: nowrap !important;
    }

    /* Make login button smaller */
    .navbar-nav .nav-item.dropdown:last-child .nav-link {
        padding: 6px 10px !important;
        font-size: 13px !important;
    }

    /* Make logo smaller */
    .navbar-brand img {
        max-height: 60px !important;
    }

    /* Hide the icons in header to save space */
    .header-item a span i {
        display: none !important;
    }

    /* Make header text smaller */
    .header-item a span {
        font-size: 13px !important;
    }
}

/* Even smaller for 1024px to 1199px */
@media (min-width: 1024px) and (max-width: 1199px) {
    .navbar-nav .nav-link {
        font-size: 12px !important;
        padding: 6px 4px !important;
        margin: 0 1px !important;
    }

    .navbar-nav .nav-item.dropdown:last-child .nav-link {
        padding: 4px 8px !important;
        font-size: 12px !important;
    }

    .navbar-brand img {
        max-height: 55px !important;
    }
}

/* Smallest for 992px to 1023px */
@media (min-width: 992px) and (max-width: 1023px) {
    .navbar-nav .nav-link {
        font-size: 11px !important;
        padding: 6px 3px !important;
        margin: 0 1px !important;
    }

    .navbar-nav .nav-item.dropdown:last-child .nav-link {
        padding: 4px 6px !important;
        font-size: 11px !important;
    }

    .navbar-brand img {
        max-height: 50px !important;
    }
}

/* ===== TABLET LARGE (992px - 1199px) ===== */
/*@media (min-width: 992px) and (max-width: 1199px) {*/
/*    #header {*/
/*        padding: 15px 0;*/
/*    }*/
/*    .header-item a span {*/
/*        font-size: 15px;*/
/*    }*/
/*    .header-item a span i {*/
/*        display: none;*/
/*    }*/
/*    .navbar-light .navbar-nav .nav-link {*/
/*        font-size: 15px;*/
/*    }*/
/*    .left_arrow,*/
/*    .right_arrow {*/
/*        display: none !important;*/
/*    }*/
/*    .oi-text h3 {*/
/*        font-size: 18px;*/
/*    }*/
/*    .news-text h4 {*/
/*        font-size: 19px;*/
/*    }*/
/*    .vid-over {*/
/*        -webkit-transform: translate(-50%, -90%);*/
/*        -ms-transform: translate(-50%, -90%);*/
/*        transform: translate(-50%, -90%);*/
/*    }*/
/*}*/

/* ============================================
   NAVIGATION FIX FOR 992px - 1200px
   ============================================ */

/* Make nav items smaller so they fit in one line */
@media (min-width: 992px) and (max-width: 1200px) {
    /* Make menu text smaller */
    .navbar-nav .nav-link {
        font-size: 13px !important;
        padding: 8px 6px !important;
        margin: 0 2px !important;
        white-space: nowrap !important;
    }

    /* Make login button smaller */
    .navbar-nav .nav-item.dropdown:last-child .nav-link {
        padding: 6px 10px !important;
        font-size: 13px !important;
    }

    /* Make logo smaller */
    .navbar-brand img {
        max-height: 60px !important;
    }

    /* Hide the icons in header to save space */
    .header-item a span i {
        display: none !important;
    }

    /* Make header text smaller */
    .header-item a span {
        font-size: 13px !important;
    }
}

/* Even smaller for 1024px to 1199px */
@media (min-width: 1024px) and (max-width: 1199px) {
    .navbar-nav .nav-link {
        font-size: 12px !important;
        padding: 6px 4px !important;
        margin: 0 1px !important;
    }

    .navbar-nav .nav-item.dropdown:last-child .nav-link {
        padding: 4px 8px !important;
        font-size: 12px !important;
    }

    .navbar-brand img {
        max-height: 55px !important;
    }
}

/* Smallest for 992px to 1023px */
@media (min-width: 992px) and (max-width: 1023px) {
    .navbar-nav .nav-link {
        font-size: 11px !important;
        padding: 6px 3px !important;
        margin: 0 1px !important;
    }

    .navbar-nav .nav-item.dropdown:last-child .nav-link {
        padding: 4px 6px !important;
        font-size: 11px !important;
    }

    .navbar-brand img {
        max-height: 50px !important;
    }
}

/* ===== TABLET (768px - 991px) ===== */
@media (min-width: 768px) and (max-width: 991px) {
    #header {
        display: none;
    }
    .slidPrv,
    .slidNext,
    .slick-dots {
        display: none !important;
    }

    .menu-item {
        padding: 5px 0;
    }
    .navbar-light .navbar-nav .nav-link {
        text-align: center;
    }
    .middle {
        text-align: center;
        display: contents;
    }

    .bnr_text {
        padding-top: 91px;
        padding-bottom: 166px;
    }
    .bnr_text p {
        padding-right: 225px;
    }
    .bnr_text .start_course {
        font-size: 18px;
    }

    .overview-item {
        margin-bottom: 38px;
    }
    .pa-top {
        padding-top: 35px;
    }
    .oi-text {
        text-align: center;
    }
    .oi-text h3 {
        padding-top: 15px;
    }
    .about-text {
        padding-bottom: 47px;
    }
    #about::before {
        width: 100%;
    }

    #portfolio {
        padding-top: 8px;
    }
    .c-item {
        margin-bottom: 30px;
    }
    .arrowss {
        margin-top: 15px;
    }
    .teacher-info h3 {
        font-size: 23px;
    }
    .coun {
        margin-bottom: 30px;
    }
    .price-item {
        margin-bottom: 40px;
    }
    .slick-padding {
        padding-top: 24px;
        padding-right: 65px;
        padding-bottom: 10px;
    }
    .market-item {
        padding: 14px;
    }
    .blog-item {
        margin-bottom: 25px;
    }
    .blog-right-item {
        padding-bottom: 10px;
    }
    .browse {
        padding: 45px 0 20px;
    }
}

/* ===== SMALL TABLET / LARGE PHONE (576px - 767px) ===== */
@media (min-width: 576px) and (max-width: 767px) {
    #header {
        display: none;
    }
    .slidPrv,
    .slidNext,
    .slick-dots {
        display: none !important;
    }

    .bnr_text p {
        padding-right: 100px;
    }
    .menu-item {
        padding: 5px 0;
    }
    .navbar-light .navbar-nav .nav-link {
        text-align: center;
    }
    .middle {
        text-align: center;
        display: contents;
    }

    .bnr_text {
        padding-top: 110px;
        padding-bottom: 196px;
    }
    .bnr_text .start_course {
        font-size: 18px;
    }

    .overview-item {
        margin-bottom: 30px;
    }
    .pa-top {
        padding-top: 46px;
    }
    .oi-text {
        text-align: center;
    }
    .oi-text h3 {
        padding-top: 20px;
    }
    #about::before {
        width: 100%;
    }
    .about-img {
        margin-top: 55px;
    }

    .portfolioFilter a {
        margin-right: 0;
        margin-bottom: 12px;
    }
    .news-text {
        padding: 10px 0 20px;
    }
    .port-item {
        background: none;
        -webkit-box-shadow: none;
        box-shadow: none;
    }
    .news-text h4 {
        font-size: 18px;
        line-height: 27px;
    }

    .c-item {
        margin-bottom: 30px;
    }
    .arrowss {
        margin-top: 23px;
    }
    .event-infos {
        padding-top: 15px;
        text-align: center;
    }
    .teacher-img {
        margin-bottom: 40px;
    }
    .teacher-hide {
        display: block;
    }
    .teacher-btn {
        padding-top: 0;
    }
    .coun {
        margin-bottom: 30px;
    }
    .price-item {
        padding: 25px 23px 0;
        margin-bottom: 50px;
    }
    .slick-padding {
        padding-bottom: 15px;
    }
    #brand {
        padding: 19px 0;
    }
    #blog {
        padding: 50px 0;
    }
    .blog-text {
        padding: 11px 18px 13px;
    }
    .sm-ma-bo {
        margin-bottom: 30px;
    }
    .in-item {
        text-align: center;
    }
    .in-btn-pa {
        padding-top: 23px;
    }
    #footer {
        padding: 48px 0 0;
    }
    .links ul li a {
        font-size: 15px;
    }
    .footer-text {
        margin-bottom: 30px;
    }
}

/* ===== MOBILE (up to 575px) ===== */
@media (max-width: 575px) {
    .menu-item {
        padding: 5px 0;
    }
    .navbar-light .navbar-nav .nav-link {
        text-align: center;
    }
    .middle {
        text-align: center;
        display: contents;
    }

    #header,
    .slidPrv,
    .slidNext,
    .slick-dots {
        display: none !important;
    }

    #search input[type="search"] {
        font-size: 40px;
    }
    .modal-body h3 {
        font-size: 17px;
    }

    .bnr_text p {
        padding-right: 0;
    }
    .bnr_text h1 span {
        font-size: 30px;
    }
    .bnr_text h1 {
        font-size: 32px;
    }
    .bnr_text h1::after {
        bottom: 15px;
        width: 202px;
        height: 6px;
    }
    .bnr_text {
        padding: 80px 0 140px;
    }
    .bnr_text .start_course {
        font-size: 16px;
        padding: 14px 20px;
    }

    .overview-item {
        padding: 25px;
        margin-bottom: 30px;
    }
    .oi-text {
        text-align: center;
    }
    .oi-text h3 {
        padding-top: 23px;
    }
    .pa-top {
        padding-top: 30px;
    }

    #about::before {
        width: 100%;
        background: rgba(19, 19, 19, 0.6);
    }
    .header-style h3::after {
        left: 10px;
    }
    .header-style h3 {
        font-size: 33px;
    }
    .course-head-text a {
        font-size: 15px;
    }
    .about-text {
        padding-bottom: 50px;
    }
    .mobile-device h3 {
        color: white;
    }
    .mobile-device2 h3 {
        color: white;
        font-size: 18px;
    }
    .mobile-device2 h4 {
        font-size: 17px;
    }
    .mobile-device2 p {
        padding-right: 0;
        color: white;
    }

    #portfolio {
        padding-top: 5px;
    }
    .portfolioFilter a {
        margin: 10px 0;
        border: 1px solid #fbaa33;
        color: #fbaa33;
    }

    .c-item {
        margin-bottom: 30px;
    }
    .calendar_weekdays div,
    .calendar_content div {
        font-size: 18px;
    }
    .m-responsive {
        margin: 0 auto;
    }
    .count-item {
        margin-bottom: 30px;
    }
    .arrowss {
        margin-top: 23px;
    }
    .event-infos h4 {
        padding-top: 12px;
        line-height: 26px;
    }
    .event-infos {
        text-align: center;
    }

    .teacher-info {
        margin-bottom: 30px;
    }
    .teacher-btn {
        padding-top: 0;
    }

    .dis-text h3 {
        font-size: 23px;
        line-height: 31px;
    }
    .dis-text h4 {
        font-size: 18px;
    }
    .dis-form {
        padding: 25px 23px;
    }
    .text-down span {
        font-size: 15px;
    }

    .price-item {
        margin-bottom: 30px;
    }

    .slick-padding {
        padding-top: 14px;
        padding-right: 16px;
        padding-bottom: 15px;
    }
    .comment-text-item p {
        padding-top: 5px;
    }

    .market-item {
        padding: 5px;
    }

    .blog-text {
        padding: 11px 17px 12px;
        background: #fff;
    }
    .l-m {
        margin-top: 30px;
    }

    .in-item {
        text-align: center;
    }
    .in-item h3 {
        font-size: 20px;
        line-height: 29px;
        padding-bottom: 23px;
    }
    .links h3 {
        padding-top: 20px;
    }
    #footer {
        padding: 35px 0;
    }
}

/* ===== EXTRA SMALL (480px - 575px) ===== */
@media (min-width: 480px) and (max-width: 575px) {
    .oi-text p {
        padding: 0 58px;
    }
}

/* ===== HAMBURGER MENU FIXES ===== */
@media (max-width: 991px) {
    .navbar-collapse {
        background: #fff;
        padding: 15px 20px;
        border-radius: 8px;
        box-shadow: 0 10px 30px rgba(0,0,0,0.1);
        margin-top: 10px;
    }
    .navbar-nav .dropdown-menu {
        background: #f8f9fa;
        border-radius: 6px;
        padding: 10px 0;
    }
    .navbar-nav .dropdown-item {
        padding: 8px 20px;
        text-align: center;
    }
    .new_navbtn {
        display: inline-block;
        width: auto;
        margin: 0 auto;
    }
    .new_navbtn .nav-link {
        justify-content: center;
    }
    .menu-item .nav-item {
        margin: 3px 0;
    }
}

/* ===== PRINT STYLES ===== */
@media print {
    #header, #banner, #overview, #count, #event, #discount,
    #brand, #instructor, #footer, #footer-btm, .backtotop,
    .preload-main, .modal, .navbar, .slick-dots, .slidPrv, .slidNext {
        display: none !important;
    }
    body {
        background: #fff !important;
    }
    .container {
        max-width: 100% !important;
    }
}
