/* 2xl (1536px) */
@media screen and (max-width: 1600px){
    .header-top .content-wrapper {
        padding: 0 40px;
    }
    .nav-menubar {
        padding: 5px 40px;
    }
    .nav-menu {
        gap: 30px;
    }
    
}

/* xl-1440 */
@media screen and (max-width: 1440px){
    /* header */
    .header-top .content-wrapper {
        padding: 0 30px;
    }
    .header-top .content-wrapper a{
        font-size: 16px;
    }
    .header-top .content-wrapper a i {
        font-size: 18px;
        margin-right: 6px;
    }
    .header-top .news-events-wrapper .side-wrapper .text-wrapper p {
        font-size: 21px;
        line-height: 21px;
    }
    .header-top .news-events-wrapper .marquee .link {
        font-size: 15px;
    }
    .header-top .news-events-wrapper .marquee .link .new-tag {
        font-size: 12px;
        font-weight: bold;
    }
    .nav-menubar .header-logo {
        width: 150px;
    }
    .nav-menubar {
        padding: 5px 30px;
    }
    .nav-menu {
        gap: 24px;
    }

    /* footer */
    .footer-mid .contact-by h3 {
        font-size: 28px;
    }
    
    

}
/* xl (1280px) */
@media screen and (max-width: 1280px){
    .header-top .news-events-wrapper .side-wrapper .text-wrapper p {
        font-size: 18px;
    }
    .nav-menu {
        gap: 20px;
    }
    .nav-menu .menu-item .menu-link {
        font-size: 18px;
        font-weight: 500;
    }

    /* footer */
    .footer-mid .contact-by h3 {
        font-size: 25px;
    }
}
/* lg (1024px) */
@media screen and (max-width: 1024px){


    /* footer */
    .footer-mid .contact-by h3 {
        font-size: 23px;
    }

    .top-banner .banner-form .form-wrapper {
        padding: 1rem 0.75rem;
        width: 100%;
        margin-bottom: 1.5rem;
    }
}
/* md (768px) */
@media screen and (max-width: 768px){
    .container{
        padding-left: 25px;
        padding-right: 25px;
    }

    /* footer */
    .footer-mid .contact-by h3 {
        font-size: 21.5px;
        text-align: center;
    }

    /* app-banner  */
    .app-banner {
        padding: 20px 18px;
    }
    .app-banner .app-banner-content h2 {
        font-size: 35px;
        line-height: auto;
    }
    .app-banner .app-banner-content p {
        font-size: 16px;
        line-height: 20px;
    }
    .app-banner .app-banner-content .btn {
        width: 170px;
        height: 52px;
        margin: 30px auto 20px auto;
        display: block;
    }
    .app-banner .app-banner-content .qr-scanner {
        width: 170px;
        height: 170px;
        margin: 0 auto;
    }
    .app-banner .img-wrapper {
        margin-top: 30px;
    }
    .app-banner .socials-icon-wrapper{
        justify-content: center;
    }

}
/* sm (640px) */
@media screen and (max-width: 640px){

    /* footer */
    /* footer */
    footer{
        padding: 20px 25px 40px 25px;
    }
    footer .col-12{
        padding-left: 0;
        padding-right: 0;
    }
    .footer-mid .contact-by{
        padding: 20px 14px;
        gap: 20px;
    }
    .footer-mid .contact-by h3 {
        font-size: 20px;
    }
}

/* extra-sm (576px) */
  @media screen and (max-width: 576px) {
    /* utilities */
    .container{
        padding-left: 25px;
        padding-right: 25px;
    }
    .page-section {
        margin: 1.25rem 0;
    }
    .section-title-1 {
        font-size: 1.25rem;
        font-weight: bold;
        /* line-height: 128%; */
    }
    .section-para-1 {
        font-size: 14px;
        line-height: 20px;
        letter-spacing: 0.025rem;
        margin-bottom: 0.95rem;
    }
    .mid-btn-wrapper{
        margin-top: 1.25rem;
        font-size: 18px;
        line-height: 20px;
        padding: 12px 30px;
        border-radius: 102px;
    }


    /* header */
    header {
        margin-bottom: 20px;
    }
    .nav-menubar{
        padding-top: 10px;
        padding-bottom: 10px;
    }
    .nav-menubar .header-logo{
        width: 90px;
    }
    .nav-menu{
        padding: 11px 0;
        display: none;
    }
    .nav-menubar .header-btn{
        display: none;
    }
    /* mobile-menu-btn */
    .nav-menubar .mobile-menu-btn{
        display: block;
    }
    .header-top .news-events-wrapper{
        display: none;
    }
    .header-top .content-wrapper{
        width: 100%;
        gap: 10px;
        padding: 0 25px;
    }
    .header-top .content-wrapper a{
        text-decoration: none;
        color: #ffffff;
        font-size: 13px;
        font-weight: bold;
        margin: 0;
        display: flex;
        align-items: center;
    }
    .header-top .content-wrapper a i{
        font-size: 13px;
        margin-right: 5px;
    }



    /* top banner */
    .top-banner {
        width: 100%;
        height: auto;
        background: rgb(61, 126, 203);
        background: linear-gradient(65deg, rgba(61, 126, 203, 1) 25%, rgba(61, 203, 124, 1) 66%);
        border-radius: 8px;
        overflow: auto;
        margin-top: 1.25rem;
    }
    .top-banner .col-12{
        padding: 0 18px;
    }
    .top-banner .banner-content {
        padding: 1.25rem 0;
        display: flex;
        flex-direction: column;
        justify-content: flex-end;
        height: 100%;
    }
    .top-banner .banner-content h2 {
        font-size: 35px;
        line-height: 31px;
        margin-bottom: 0.95rem;
        padding-top: 0;
    }
    .top-banner .banner-content p{
        line-height: 20px;
        font-weight: 500;
        margin-bottom: 0;
    }
    .top-banner .banner-content .img-wrapper.desktop-img{
        display: none;
    }
    .top-banner .img-wrapper.mobile-img{
        display: block;
    }
    .top-banner .banner-form .form-wrapper {
        padding: 1rem 0.75rem;
        width: 100%;
        margin-bottom: 1.25rem;
    }
    .top-banner .banner-form .form-wrapper h4 {
        font-weight: 600;
        margin-bottom: 5px;
    }
    .top-banner .banner-form .form-wrapper p {
        font-size: 14px;
        line-height: 20px;
        margin-bottom: 0.75rem;
    }
    .top-banner .banner-form .form-wrapper .form-label {
        font-size: 14px;
    }
    .top-banner .banner-form .form-wrapper .form-control,
    .top-banner .banner-form .form-wrapper .form-select{
        font-size: 12px;
        padding: 2px 10px;
    }
    .top-banner .banner-form .form-wrapper .btn {
        margin-top: 1.9rem;
        width: 100%;
        border-radius: 67px;
        font-size: 14px;
        font-weight: bold;
        line-height: 25px;
        padding: 9px;
    }

    /* course-mode-cards */
    .course-mode-card .card-wrapper {
        --bs-gutter-x: 15px;
        --bs-gutter-y: 15px;
    }
    .course-mode-card .card-wrapper .card .text-wrapper {
        padding: 14px 60px 14px 14px;
    }
    .course-mode-card .card-wrapper .card .text-wrapper h4 {
        font-size: 18px;
        margin-bottom: 2px;
    }
    .course-mode-card .card-wrapper .card .text-wrapper h6 {
        font-size: 14px;
        line-height: 20px;
    }
    /* rank-booster */
    .rank-booster img{
        margin-bottom: 22px;
    }
    .rank-booster .list-items{
        padding-left: 0;
    }
    .rank-booster .list-items li {
        margin-bottom: 5px;
    }
    .rank-booster .list-items li img {
        margin-right: 15px;
        margin-bottom: 0;
    }
    .rank-booster .list-items li p {
        font-size: 14px;
    }

    /* apply-coaching */
    .apply-coaching .div-wrapper {
        flex-direction: column;
        padding: 0 35px;
    }
    .apply-coaching .text-wrapper h3{
        text-align: center;
        font-size: 1.25rem;
        line-height: 24px;
        font-weight: 400;
        margin-bottom: 20px;
    }
    .apply-coaching .btns-wrapper {
        flex-direction: column;
        gap: 20px;
        align-items: center;
    }
    .apply-coaching .btns-wrapper .btn {
        padding: 6px 12px;
        font-size: 14px;
        line-height: 17.6px;
        font-weight: bold;
    }
    .apply-coaching .btns-wrapper .btn img{
        width: 18px;
        height: 18px;
    }
    .apply-coaching .btns-wrapper .btn.btn-clyn{
        padding: 6px 12px;
        font-size: 14px;
        line-height: 17.6px;
        font-weight: bold;
        width: fit-content;
    }

    /* know-about */
    .know-about {
        height: auto;
        padding: 20px 18px;
        flex-direction: column-reverse;
    }
    .know-about .banner-bg-img img {
        width: 100%;
    }
    .know-about .content-wrapper {
        padding: 0;
        margin-bottom: 20px;
    }
    .know-about .content-wrapper .content-div {
        gap: 1rem;
        margin-bottom: 15px;
    }
    .know-about .content-wrapper .content-div .content h4 {
        font-size: 18px;
    }
    .know-about .content-wrapper .content-div .content p {
        font-size: 14px;
        line-height: 20px;
        color: rgba(235, 235, 235, 1);
    }
    .know-about .img-wrapper {
        position: unset;
        width: 100%;
        height: auto;
        transform: scale(1.15);
    }



    /* crash-course-features */
    .crash-course-features {
        --bs-gutter-x: 15px;
        --bs-gutter-y: 15px;
        margin: 0;
    }
    .crash-course-features .col-12{
        padding-left: 0;
        padding-right: 0;
    }
    .crash-course-features .card {
        padding: 20px 18px 50px 18px;
        border-radius: 8px;
    }
    .crash-course-features .card img {
        height: 38px;
        width: 37px;
        margin-bottom: 15px;
    }
    .crash-course-features .card h4{
        font-size: 18px;
        margin-bottom: 15px;
    }
    .crash-course-features .card p {
        font-size: 14px;
        font-weight: 500;
        line-height: 20px;
    }

    /* modes-of-course */
    .course-mode-card-list .card-wrapper {
        --bs-gutter-y: 15px;
    }
    .modes-of-course .top-img .play-btn-icon{
        width: 24px;
    }
    .modes-of-course .top-img .play-btn-icon img{
        width: 24px;
        height: 24px;
    }
    .modes-of-course .nav-tabs {
        gap: 30px;
        margin-bottom: 22px;
    }
    .modes-of-course .nav-tabs .nav-link {
        font-size: 14px;
        line-height: 20px;
    }
    .modes-of-course .tab-content .tab-pane .title {
        font-size: 18px;
        line-height: 20px;
        margin-bottom: 15px;
    }
    .modes-of-course .tab-content .tab-pane .para{
        font-size: 14px;
        line-height: 20px;
    }
    .modes-of-course .btn{
        padding: 6px 23px;
        font-size: 20px;
        line-height: 24px;
        display: flex;
        align-items: center;
    }
    .modes-of-course .btn img {
        width: 2rem;
        height: 2rem;
        margin-left: 0;
    }
    .course-mode-card-list .card-wrapper .card .card-top .text-wrapper {
        padding: 14px 60px 14px 14px;
    }
    .course-mode-card-list .card-wrapper .card .card-top .text-wrapper h4{
        font-size: 18px;
        margin-bottom: 2px;
    }
    .course-mode-card-list .card-wrapper .card .card-top .text-wrapper h6{
        font-size: 14px;
        line-height: 20px;
    }
    .course-mode-card-list .card-wrapper .card .card-content{
        padding: 18px 23px 20px 18px;
    }
    .course-mode-card-list .card-wrapper .card .card-content p {
        font-size: 14px;
    }
    .course-mode-card-list .card-wrapper .card .card-content ul{
        padding-left: 20px;
    }
    .course-mode-card-list .card-wrapper .card .card-content ul li{
        font-size: 14px;
        line-height: 20px;
    }

    /* count-down-wrapper */
    .count-down-wrapper{
        overflow: hidden;
    }
    .count-down-wrapper .col-12{
        padding-left: 18px;
        padding-right: 18px;
    }
    .count-down-wrapper .content{
        padding: 20px 4px;
    }
    .count-down-wrapper .content h3{
        font-size: 1.25rem;
        line-height: normal;
        letter-spacing: 2px;
        margin-bottom: 15px;
    }
    .count-down-wrapper .count-down {
        flex-wrap: wrap;
        justify-content: center;
        margin-bottom: 15px;
    }
    .count-down-wrapper .count-down .divider{
        display: none;
    }
    .count-down-wrapper .content p{
        margin-bottom: 20px;
        font-weight: 400;
    }
    .count-down-wrapper .content .btn{
        font-size: 1rem;
        line-height: normal;
        padding: 12px;
        border-radius: 46px;
        margin-bottom: 20px;
    }
    .count-down-wrapper .img-div img {
        transform: scale(1.9, 1.8);
        margin-bottom: 106px;
        margin-top: 56px;
    }

    /* weekly-schedule  */
    .weekly-schedule .content-wrapper h2 {
        font-size: 35px;
        /* line-height: 30px; */
        margin-bottom: 10px;
    }
    .weekly-schedule .content-wrapper p {
        margin-bottom: 10px;
    }
    .weekly-schedule .right-div {
        margin-top: 15px;
        --bs-gutter-y: 0;
    }
    .weekly-schedule .right-div .col-12{
        padding: 0;
    }
    .weekly-schedule .div-wrapper{
        margin-bottom: 15px;
    }
    .weekly-schedule .div-wrapper h3 {
        font-size: 18px;
        line-height: 20px;
        margin-bottom: 15px;
    }


    /* career-counselling */
    .career-counselling{
        row-gap: 15px;
    }
    .career-counselling .card {
        padding: 20px 23px;
        border-radius: 8px;
        gap: 15px;       
    }
    .career-counselling .card .img img{
        width: 30px;
        height: 30px;
    }

    /* banner-2 */
    .banner-2 {
        height: auto;
    }
    .banner-2 .content{
        padding: 44px 18px 20px 18px;
    }
    .banner-2 .content .tags {
        margin-bottom: 15px;
    }
    .banner-2 .content h3 {
        font-size: 1.25rem;
        line-height: 1.25rem;
        margin-bottom: 5px;
    }
    .banner-2 .content h5 {
        font-size: 14px;
        line-height: 20px;
        font-weight: 500;
    }
    .banner-2 .img-wrapper img {
        transform: scale(1.2);
        bottom: 20px;
        right: 5%;
        margin-top: 28px;
    }
    .banner-2 .banner-bg-img {
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
    }
    .banner-2 .banner-bg-img img{
        object-position: -382px;
    }

    /* course-syllabus */
    .course-syllabus .nav-tabs .nav-link {
        padding: 8px 9px 8px 14px;
        font-size: 18px;
        line-height: 20px;
    }
    .course-syllabus .tab-content{
        margin-top: 15px;
    }
    .course-syllabus .tab-content .tab-pane {
        overflow: scroll;
    }
    .course-syllabus .tab-content .tab-pane table {
        width: 175%;
        margin-bottom: 15px;
    }
    .course-syllabus .tab-content .tab-pane table th,
    .course-syllabus .tab-content .tab-pane table td{
    padding: 1rem 1.2rem;
    width: 50%;
    }
    .course-syllabus .tab-content .tab-pane table th {
        font-size: 14px;
    }
    .course-syllabus .tab-content .tab-pane table td {
        font-size: 14px;
    }


    /* block-cards */
    .block-cards {
        --bs-gutter-y: 15px;
    }
    .block-cards .card {
        height: 450px;
        border-radius: 8px;
    }
    .block-cards .card .content-wrapper h3 {
        font-size: 18px;
        line-height: 20px;
        width: 100%;
        margin-bottom: 0.25rem;
    }
    .block-cards .card .content-wrapper p {
        font-size: 14px;
        margin-bottom: 15px;
    }

    /* book-banner */
    .book-banner {
        border-radius: 8px;
        margin-top: 38px;
        margin-bottom: 20px;
        height: auto;
    }
    .book-banner .row{
        flex-direction: column-reverse;
    }
    .book-banner .img-wrapper{
        width: 90%;
        margin: 0 auto;
    }
    .book-banner .img-wrapper img {
        width: 100%;
        height: 100%;
        transform: scale(1);
        bottom: 38px;
    }
    .book-banner .content-wrapper {
        padding: 0 20px 20px 20px;
    }
    .book-banner .content-wrapper h2 {
        font-size: 18px;
        line-height: 20px;
        margin-bottom: 15px;
        width: 100%;
    }
    .book-banner .content-wrapper h5 {
        font-size: 14px;
        line-height: 20px;
        margin-bottom: 20px;
        width: 100%;
    }
    .book-banner .content-wrapper .btn {
        font-size: 1rem;
        line-height: normal;
        padding: 8px 15px;
        width: auto;
    }


    /* faqs */
    .faqs .accordion-button, .faqs .accordion-button:not(.collapsed),
    .faqs .accordion-button, .faqs .accordion-button {
        padding: 17px 0;
        font-size: 18px;
    }
    .faqs .accordion-body {
        font-size: 14px;
    }


    /* footer */
    footer{
        padding: 20px 25px 40px 25px;
    }
    footer .col-12{
        padding-left: 0;
        padding-right: 0;
    }
    .footer-heading-1 {
        margin-bottom: 15px;
    }
    .footer-mid .social-links-wrapper {
        gap: 20px;
        padding-top: 20px;
        padding-bottom: 20px;
    }
    .footer-mid .social-wrapper .social-icon-list {
        gap: 25px;
    }
    .footer-mid .social-wrapper .social-img {
        width: 30px;
        height: 30px;
    }
    .footer-mid .social-links-wrapper .heading {
        line-height: 1.1;
    }
    .footer-mid .contact-by .btn-wrapper {
        gap: 20px;
        flex-direction: column;
    }
    .footer-mid .contact-by .btn-wrapper .btn span {
        font-size: 14px;
        line-height: 17px;
    }
    .footer-mid .contact-by .btn-wrapper .btn svg {
        width: 18px;
    }
    .footer-bottom {
        row-gap: 20px;
        margin: 20px -12px;
    }
    .footer-copyright{
        flex-direction: column;
        gap: 20px;
    }



 }