:root{
    --primary-color:#2F327D;
    --secondary-color:#FF5733;
    --dark-color:#111111;
    --light-color:#fff;
    --text-color:#696984;
}

@media (max-width: 576px) {
    #smooth-wrapper{
        overflow-x: hidden;
    }
    .course-module{
        overflow-x: hidden;
    }
    .top-header{
        display: none;
    }
    .main-header .mobile-d-none{
        display: none;
    }
    .main-header {
        background-color: #F5F5F5;
    }
    .navbar-toggler-icon{
        font-size: 20px;
        display: flex;
        align-items: center;
        justify-content: center;
        background-color: #D9D9D9;   
        padding: 10px;
        border-radius: 50%;
        width: 45px;
        height: 45px;
        font-weight: 400;
    }
    .main-header .logo img{
        width: 130px;
    }
    .navbar-toggler:focus{
        box-shadow: none;
    }
    .main-header{
        padding: 0px;
    }
    .main-header .container{
        padding: 5px 10px;
    }
    .mob-head-right{
        display: flex;
        align-items: center;
        grid-area: 10px;
    }
    .mob-head-right img{
        width: 22px;
        height: 22px;
    }
    .mob-head-right buton{
        background-color: lightgrey;
    }
    .menu-items ul li a {
        padding: 10px 20px !important;
        font-size: 15px;
        border-bottom: 1px solid #e8e8e8;
    }
    .menu-items ul li:last-child a {
        border-bottom: none;
    }
    .dropdown-menu li:last-child .dropdown-item{
        border-bottom: none !important;
    }
    .navbar-nav .dropdown-menu{
        padding: 10px 20px !important;
        background: transparent;
        background: var(--secondary-color);
        border-radius: 20px;
    }
    .menu-items .dropdown-menu .dropdown-item{
        color: #Fff;
        font-size: 14px;
    }
    .main-banner .banner-title{
        max-width: 100%;
    }
    .main-banner{
        margin-top: 15px;
    }
    .main-banner h1{
        font-size: 20px;
        font-weight: 500;
    }
    .main-banner .banner-title p{
        padding: 20px 0px;
        font-size: 12px;
    }
    .theme-btn a {
        padding: 10px 15px;
        font-size: 13px;
    }
    .main-banner .banner-btns .watch-video h6{
        font-size: 13px;
    }
    .main-banner .banner-btns .watch-video .icon {
        height: 30px;
        width: 30px;
        background: #fff;
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .main-banner .banner-btns .watch-video svg{
        width: 15px;
        height: 15px;
        flex-shrink: 0;
    }
    .main-banner .main-shapes .shape2{
        top: 45%;
        left: 0%;
    }
    .main-banner .main-shapes .shape2 img{
        max-width: 55%;
    }
    .main-banner .main-shapes .shape1{
        bottom: 25%;
        right: -25%;
    }
    .main-banner .main-shapes .shape1 img{
        max-width: 55%;
    }
    .main-banner .main-image .shape1{
        top: 40%;
        left: 0%;
    }
    .main-banner .shapes .item{
        padding: 7px;
        border-radius: 7px;
    }
    .main-banner .banner-image .main-image .main-banner-image-new{
        width: 270px;
    }
    .main-banner .main-image .shape2{
        bottom: 35%;
        right: 0%;
    }
    .main-banner .main-image .shape3{
        bottom: 15%;
        left: 0%;
    }
    .main-banner .shapes .item h6{
        font-size: 10px;
        margin-bottom: 2px;
    }
    .main-banner .shapes .item p{
        font-size: 8px;
        letter-spacing: normal;
    }
    .main-banner .shape3 button{
        margin-top: 5px;
        font-size: 10px;
    }
    .main-banner .shape1 .icon{
        width: 25px;
        height: 25px;
        border-radius: 5px;
    }
    .main-banner .shape2 .icon{
        width: 25px;
        height: 25px;
        border-radius: 5px;
    }
    .main-banner .shape2 .item{
        gap: 10px;
    }
    .main-banner .shapes .item{
        gap: 10px;
    }
    .main-banner .main-image .shape3 img{
        width: 25px;
    }
    .section-padding{
        padding: 40px 0px;
    }
    .brand-slider h3{
        font-size: 18px;
        margin-bottom: 30px;
        letter-spacing: normal;
    }
    .brand-slider img{
        max-width: 90%;
    }
    .section-title h2{
        font-size: 22px;
    }
    .section-title p{
        font-size: 13px;
    }
    .benefits-section .item .icon{
        width: 50px;
        height: 50px;
    }
    .benefits-section .item .content{
        padding-top: 60px;
    }
    .benefits-section .col-lg-3{
        width: 50%;
        margin-bottom: 50px;
    }
    .benefits-section .item{
        height: 100%;
        padding: 10px;
    }
    .benefits-section .item .content h4{
        font-size: 18px;
    }
    .benefits-section .item .content p{
        font-size: 12px;
    }
    .section-title-left h2{
        font-size: 25px;
        max-width: 70%;
    }
    .section-title-left p{
        font-size: 13px;
    }
    .benefits-section{
        padding-bottom: 0px;
    }
    .course-module-row .col-lg-6{
        width: 50%;
    }
    .course-module .item{
        padding: 10px;
        height: 100%;
    }
    .course-module .item h4{
        font-size: 18px;
    }
    .course-module .item p{
        font-size: 13px;
        margin-bottom: 5px;
    }
    .course-module .item button{
        font-size: 15px;
    }
    .learner-experience{
        margin: 30px 10px 50px 10px;
    }
    .learner-experience .box-section{
        margin-bottom: 0px;
    }
    .learner-experience .item{
        margin-top: 20px;
    }
    .learner-experience .box-section{
        margin: 0px auto 0px auto;
    }
    .learner-experience .item .content{
        padding: 10px;
        margin: 10px;
        border-radius: 10px;
    }
    .learner-experience .item .content h1{
        font-size: 15px;
    }
    .learner-experience .item .content p{
        font-size: 10px;
    }
    .learner-experience .item .icon{
        width: 40px;
        height: 40px;
    }
    .smartLearning h2{
        font-size: 25px;
    }
    .smartLearning p{
        font-size: 13px;
        line-height: normal;
    }
    .smartLearning {
        margin-top: 20px !important;
    }
    .smartLearning h3{
        font-size: 18px;
    }
    .smartLearning  .col-6{
        width: 100%;
    }
    .smartLearning .numbers-row .col-md-3{
        width: 25%;
        padding: 5px;
    }
    .smartLearning h6{
        font-size: 10px;
        line-height: normal;
    }
    .smartLearning img{
        margin-top: 30px !important;
    }
    .training_section h4{
        font-size: 25px;
        font-weight: 500;
        line-height: normal;
    }
    .training_section button{
        margin-bottom: 10px;
    }
    .training_section p{
        font-size: 13px;
        padding-right: 0px !important;
    }
    .training_section .col-6{
        width: 100%;
    }
    .training_section img{
        margin-top: 25px;
    }
    .smartLMSection .col-6{
        width: 100%;
    }
    .smartLMSection .row{
        padding-left: 10px !important;
        padding-right: 10px !important;
        flex-direction: column-reverse;
    }
    .smartLMSection h3{
        line-height: normal;
        font-size: 25px;
        margin-top: 20px;
    }
    .smartLMSection{
        padding: 20px 0px 0px 0px;
    }
    .smartLMSection p{
        font-size: 13px;
        line-height: normal;
    }
    .smartLMSection img{
        margin-top: 30px !important;
    }
    #form-section .container{
        padding: 20px !important;
    }
    .main-form h2{
        font-size: 25px;
        line-height: normal;
    }
    .main-form p{
        font-size: 13px;
    }
    .latest_section h1{
        line-height: normal;
        font-size: 25px;
        font-weight: 500;
    }
    .latest_section p{
        font-size: 13px;
        line-height: normal;
    }
    .latest_section h3{
        font-size: 20px;
        line-height: normal;
    }
    .latest_section h6{
        font-size: 15px;
        line-height: normal;
    }
    .latest_section .mini-blogs .col-md-4{
        width: 100%;
    }
    .latest_section .mini-blogs img{
        width: 100%;
        height: 200px;
        object-fit: cover;
        border-radius: 20px;
        margin-bottom: 20px;
    }
    .latest_section .mini-blogs h5{
        font-weight: 500;
        font-style: Medium;
        font-size: 20px;
        line-height: normal;
        letter-spacing: 0%;
        color: #252641;
    }
    .mini-blogs .row{
        margin-top: 30px;
    }
    .footer img{
        width: 200px;
    }
    .footer{
        margin-left: 10px;
        margin-right: 10px;
    }   
    .footer-content p{
        font-size: 15px;
        line-height: 30px;
        width: 100%;
    }
    .footer-content .mt-5{
        margin-top: 0px !important;
    }

    /* product sample page */

    .about-smartLMSection .row{
        flex-direction: row-reverse;
    }
    .about-smartLMSection .btn-and-video{
        flex-direction: column-reverse;
        align-items: start;
    }
    .what-is-upguage img{
        margin-bottom: 30px !important;
    }
    .step-section .section-title{
        margin-bottom: 30px !important;
    }
    .step-section .item .shape img{
        height: 340px;
    }
    .step-section .item{
        height: 320px;
        padding: 70px 20px 50px 50px;
        width: 270px;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-direction: column;
        margin-bottom: 50px;
    }
    .step-section .item .shape img{
        width: 360px;
    }
    .step-section .item h1{
        font-size: 22px;
    }
    .step-section .item p{
        font-size: 16px;
    }
    .who-can-use-sec .box-top{
        margin-top: -20px;
    }
    .who-can-use-sec h2{
        max-width: 100%;
    }
    .who-can-use-sec .item p{
        font-size: 12px;
    }
    .who-can-use-sec .item{
        width: 100%;
        padding: 20px;
        text-align: center;
    }
    .who-can-use-sec .image img{
        margin-top: 30px;
    }
    .what-makes-diff-sec img{
        max-width: 100%;
        display: flex;
        margin: 0px auto;
    }
    .what-makes-diff-sec .section-title{
        margin-bottom: 30px;
    }
    .counter-section .col-lg-3{
        width: 50%;
    }
    .counter-section h5{
        font-size: 25px;
    }
    .counter-section .item p{
        max-width: 100%;
        font-size: 18px;
    }
    .ai-powered .main-image img{
        max-width: 100%;
    }
    .ai-powered .item-4, .ai-powered .item-3, .ai-powered .item-2, .ai-powered .item-1{
        position: static;
    }
    .ai-powered .item{
        width: 100%;
        margin-bottom: 20px;
    }
    .ai-powered .section-title-left{
        text-align: center;
    }
    .ai-powered .section-title-left h2 {
        max-width: 100% !important;
    }
    .dark-cta{
        max-width: 100%;
        padding: 200px 0px 50px 0px;
        margin: 10px;
        position: relative;
        overflow: hidden;
        z-index: 1;
    }
    .dark-cta h3{
        font-size: 25px;
    }
    .dark-cta p{
        font-size: 16px;
        padding: 10px 0px;
    }
    .dark-cta::before{
        content: "";
        background: linear-gradient(to top, rgba(0, 0, 0, 1), rgba(0, 0, 0, 0));
        height: 70%;
        width: 100%;
        position: absolute;
        bottom: 0;
        left: 0;
        z-index: -1;
    }
    .faq-section h2{
        text-align: center;
        max-width: 100%;
    }
    .faq-section .accordion-item h2 button{
        font-size: 16px;
    }
    .faq-section .accordion-item p{
        font-size: 14px;
    }

    /* about page  */

    .empowering-smarter .image img{
        max-width: 100%;
    }
    .mission .item{
        height: 100%;
    }
    .mission .item h1{
        font-size: 30px;
    }
    .mission .item p{
        font-size: 15px;
    }
    .what-we-believe .section-title-left h2{
        text-align: center;
        max-width: 100%;
    }
    .what-we-believe .section-title-left{
        margin-bottom: 30px;
    }
    .what-we-believe .item{
        height: 100%;
    }
    .what-we-believe  .col-lg-4{
        margin-bottom: 30px;
    }
    .what-we-believe .item h4{
        font-size: 20px;
    }
    .what-we-believe .item p{
        font-size: 16px;
    }
    .why-choose-section .col-lg-4{
        margin-bottom: 30px;
    }
    .why-choose-section .item{
        padding: 20px;
        height: 100%;
        margin-bottom: 0px;
    }
    .why-choose-section .item h4{
        font-size: 20px;
    }
    .why-choose-section .item p{
        font-size: 16px;
    }
    .dark-cta .btn-and-video{
        flex-direction: column;
        align-items: start;
    }
    .lets-simply{
        margin: 50px 0px 100px 0px;
    }

    /* pricing style */

    .samplePricing p{
        font-size: 13px;
    }
    .samplePricing h2{
        font-size: 22px;
        line-height: normal;letter-spacing: normal;
    }
    .samplePricing h6{
        font-size: 14px;
        letter-spacing: normal;
        line-height: normal;
        width: 100%;
    }
    .price{
        font-size: 30px;
    }
    .sampleTablePricing{
        overflow-x: auto;
    }
    .header-row th{
        padding: 10px;
    }
    .Comprehensive .col-6{
        width: 100%;
    }
    .Comprehensive h3{
        font-size: 22px;
    }
    .Comprehensive p{
        font-size: 16px;
        line-height: normal;
        letter-spacing: normal;
    }
    .pricing-page-accordion .accordion-button{
        font-size: 16px !important;
    }
    .pricing-page-accordion .classy-accordion-body{
        padding: 15px !important;
        font-size: 14px !important;
    }
    .pricing-page-accordion .classy-accordion-button{
        padding: 20px 50px 20px 0px !important;
    }
}

@media (min-width:577px) and (max-width:768px){
    #smooth-wrapper{
        overflow-x: hidden;
    }
    .course-module{
        overflow-x: hidden;
    }
    .container{
        max-width: 690px !important;
    }
    .top-header{
        display: none;
    }
    .main-header .mobile-d-none{
        display: none;
    }
    .main-header {
        background-color: #F5F5F5;
    }
    .navbar-toggler-icon{
        font-size: 25px;
        display: flex;
        align-items: center;
        justify-content: center;
        background-color: #D9D9D9;   
        padding: 10px;
        border-radius: 50%;
        width: 55px;
        height: 55px;
        font-weight: 400;
    }
    .main-header .logo img{
        width: 160px;
    }
    .navbar-toggler:focus{
        box-shadow: none;
    }
    .main-header{
        padding: 0px;
    }
    .main-header .container{
        padding: 5px 20px;
    }
    .mob-head-right{
        display: flex;
        align-items: center;
        gap: 20px;
    }
    .mob-head-right img{
        width: 30px;
        height: 30px;
    }
    .mob-head-right buton{
        background-color: lightgrey;
    }
    .menu-items ul li a {
        padding: 15px 20px !important;
        font-size: 20px;
        border-bottom: 1px solid #e8e8e8;
    }
    .menu-items ul li:last-child a {
        border-bottom: none;
    }
    .dropdown-menu li:last-child .dropdown-item{
        border-bottom: none !important;
    }
    .navbar-nav .dropdown-menu{
        padding: 15px 20px !important;
        background: transparent;
        background: var(--secondary-color);
        border-radius: 20px;
    }
    .menu-items .dropdown-menu .dropdown-item{
        color: #Fff;
        font-size: 18px;
    }
    .main-banner .banner-title{
        max-width: 100%;
    }
    .main-banner{
        margin-top: 15px;
    }
    .main-banner h1{
        font-size: 35px;
        font-weight: 500;
    }
    .main-banner .banner-title p{
        padding: 20px 0px;
        font-size: 18px;
    }
    .theme-btn a {
        padding: 10px 15px;
        font-size: 18px;
    }
    .main-banner .banner-btns .watch-video h6{
        font-size: 18px;
    }
    .main-banner .banner-btns .watch-video .icon {
        height: 40px;
        width: 40px;
        background: #fff;
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .main-banner .banner-btns .watch-video svg{
        width: 25px;
        height: 25px;
        flex-shrink: 0;
    }
    .main-banner .main-shapes .shape2{
        top: 42%;
        left: 20%;
    }
    .main-banner .main-shapes .shape2 img{
        max-width: 70%;
    }
    .main-banner .main-shapes .shape1{
        bottom: 35%;
        right: 15%;
    }
    .main-banner .main-shapes .shape1 img{
        max-width: 70%;
    }
    .main-banner .main-image .shape1{
        top: 40%;
        left: 15%;
    }
    .main-banner .shapes .item{
        padding: 10px;
        border-radius: 10px;
    }
    .main-banner .banner-image .main-image .main-banner-image-new{
        width: 350px;
    }
    .main-banner .main-image .shape2{
        bottom: 35%;
        right: 20%;
    }
    .main-banner .main-image .shape3{
        bottom: 15%;
        left: 18%;
    }
    .main-banner .shapes .item h6{
        font-size: 15px;
        margin-bottom: 5px;
    }
    .main-banner .shapes .item p{
        font-size: 10px;
        letter-spacing: normal;
    }
    .main-banner .shape3 button{
        margin-top: 10px;
        font-size: 13px;
    }
    .main-banner .shape1 .icon{
        width: 30px;
        height: 30px;
        border-radius: 5px;
    }
    .main-banner .shape2 .icon{
        width: 30px;
        height: 30px;
        border-radius: 5px;
    }
    .main-banner .shape2 .item{
        gap: 10px;
    }
    .main-banner .shapes .item{
        gap: 10px;
    }
    .main-banner .main-image .shape3 img{
        width: 30px;
    }
    .section-padding{
        padding: 60px 0px;
    }
    .brand-slider h3{
        font-size: 28px;
        margin-bottom: 30px;
        letter-spacing: normal;
    }
    .brand-slider img{
        max-width: 80%;
    }
    .section-title h2{
        font-size: 28px;
    }
    .section-title p{
        font-size: 18px;
    }
    .benefits-section .item .icon{
        width: 60px;
        height: 60px;
    }
    .benefits-section .item .content{
        padding-top: 60px;
    }
    .benefits-section .col-lg-3{
        width: 50%;
        margin-bottom: 50px;
    }
    .benefits-section .item{
        height: 100%;
        padding: 10px;
    }
    .benefits-section .item .content h4{
        font-size: 23px;
    }
    .benefits-section .item .content p{
        font-size: 16px;
    }
    .section-title-left h2{
        font-size: 28px;
        max-width: 70%;
    }
    .section-title-left p{
        font-size: 18px;
    }
    .course-module .image img{
        max-width: 85%;
        display: flex;
        margin: auto;
    }
    .benefits-section{
        padding-bottom: 0px;
    }
    .course-module-row .col-lg-6{
        width: 50%;
    }
    .course-module .item{
        padding: 15px;
        height: 100%;
    }
    .course-module .item h4{
        font-size: 22px;
    }
    .course-module .item p{
        font-size: 16px;
        margin-bottom: 5px;
    }
    .course-module .item button{
        font-size: 18px;
    }
    .learner-experience{
        margin: 30px 20px 50px 20px;
    }
    .learner-experience .box-section{
        margin-bottom: 0px;
    }
    .learner-experience .item{
        margin-top: 20px;
    }
    .learner-experience .box-section{
        margin: 0px auto 0px auto;
    }
    .learner-experience .item .content{
        padding: 15px;
        margin: 10px;
        border-radius: 15px;
    }
    .learner-experience .item .content h1{
        font-size: 22px;
    }
    .learner-experience .item .content p{
        font-size: 16px;
    }
    .learner-experience .item .icon{
        width: 45px;
        height: 45px;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .smartLearning h2{
        font-size: 28px;
    }
    .smartLearning p{
        font-size: 18px;
        line-height: normal;
    }
    .smartLearning {
        margin-top: 20px !important;
    }
    .smartLearning h3{
        font-size: 22px;
    }
    .smartLearning  .col-6{
        width: 100%;
    }
    .smartLearning .numbers-row .col-md-3{
        width: 25%;
        padding: 20px;
    }
    .smartLearning h6{
        font-size: 16px;
        line-height: normal;
    }
    .smartLearning img{
        max-width: 70%;
        display: flex;
        margin: auto;
        margin-top: 30px !important;
    }
    .training_section h4{
        font-size: 28px;
        font-weight: 500;
        line-height: normal;
    }
    .training_section button{
        margin-bottom: 10px;
    }
    .training_section p{
        font-size: 18px;
        padding-right: 0px !important;
    }
    .training_section .col-6{
        width: 100%;
    }
    .training_section img{
        display: flex;
        max-width: 70%;
        margin: auto;
        margin-top: 25px;
    }
    .smartLMSection .col-6{
        width: 100%;
    }
    .smartLMSection .row{
        padding-left: 10px !important;
        padding-right: 10px !important;
        flex-direction: column-reverse;
    }
    .smartLMSection h3{
        line-height: normal;
        font-size: 28px;
        margin-top: 20px;
    }
    .smartLMSection{
        padding: 30px 50px 0px 50px;
    }
    .smartLMSection p{
        font-size: 18px;
        line-height: normal;
    }
    .smartLMSection img{
        margin-top: 30px !important;
    }
    #form-section .container{
        padding: 25px !important;
    }
    .main-form h2{
        font-size: 28px;
        line-height: normal;
    }
    .main-form p{
        font-size: 18px;
    }
    .latest_section h1{
        line-height: normal;
        font-size: 28px;
        font-weight: 500;
    }
    .latest_section p{
        font-size: 18px;
        line-height: normal;
    }
    .latest_section h3{
        font-size: 23px;
        line-height: normal;
    }
    .latest_section h6{
        font-size: 16px;
        line-height: normal;
    }
    .latest_section .col-md-6{
        width: 100% ;
    }
    .latest_section .mini-blogs .col-md-4{
        width: 100%;
    }
    .latest_section .mini-blogs img{
        width: 100%;
        height: 350px;
        object-fit: cover;
        border-radius: 20px;
        margin-bottom: 20px;
    }
    .latest_section .mini-blogs h5{
        font-weight: 500;
        font-style: Medium;
        font-size: 22px;
        line-height: normal;
        letter-spacing: 0%;
        color: #252641;
    }
    .mini-blogs .row{
        margin-top: 30px;
    }
    .mini-blogs .text-start{
        width: 100%;
    }
    .footer img{
        width: 250px;
    }
    .footer .col-md-6{
        width: 100%;
    }
    .footer{
        margin-left: 10px;
        margin-right: 10px;
    }   
    .footer-content p{
        font-size: 18px;
        line-height: 30px;
        width: 100%;
    }
    .footer-content h1{
        font-size: 28px;
    }
    .footer-content .quick-links ul li{
        font-size: 18px;
    }
    .footer-content .location ul li{
        font-size: 18px;
    }
    .footer-content .mt-5{
        margin-top: 0px !important;
    }

    /* product sample page */

    .about-smartLMSection .row{
        flex-direction: row-reverse;
    }
    .about-smartLMSection h3{
        font-size: 35px;
    }
    .about-smartLMSection p{
        font-size: 20px;
    }
    .about-smartLMSection img{
        max-width: 80%;
        display: flex;
        margin: auto;
    }
    .what-is-upguage img{
        margin-bottom: 30px !important;
        max-width: 100%;
    }
    .what-is-upguage .col-6{
        width: 50%;
    }
    .step-section .section-title{
        margin-bottom: 30px !important;
    }
    .step-section .item .shape img{
        height: 450px;
    }
    .step-section .item{
        height: 420px;
        padding: 70px 20px 50px 50px;
        width: 300px;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-direction: column;
        margin-bottom: 50px;
    }
    .step-section .item .shape img{
        width: 400px;
    }
    .step-section .item h1{
        font-size: 25px;
    }
    .step-section .item p{
        font-size: 18px;
    }
    .who-can-use-sec .section-title-left{
        max-width: 100% !important;
    }
    .who-can-use-sec .section-title-left h2 {
        text-align: center;
    }
    .who-can-use-sec .box-top{
        margin-top: -20px;
    }
    .who-can-use-sec .course-module-d-flex-mob .col-lg-6{
        display: flex;
        gap: 20px;
    }
    .who-can-use-sec .image img{
        max-width: 100%;
    }
    .who-can-use-sec h2{
        max-width: 100%;
    }
    .who-can-use-sec .item p{
        font-size: 14px;
    }
    .who-can-use-sec .item{
        width: 50%;
        padding: 20px;
        text-align: center;
    }
    .who-can-use-sec .image img{
        margin-top: 30px;
    }
    .what-makes-diff-sec img{
        max-width: 100%;
        display: flex;
        margin: 0px auto;
    }
    .what-makes-diff-sec .section-title{
        margin-bottom: 30px;
    }
    .what-makes-diff-sec .content{
        padding: 0px 50px;
    }
    .counter-section .col-lg-3{
        width: 50%;
    }
    .counter-section .item{
        display: flex;
        align-items: center;
        justify-content: center;
        flex-direction: column;
    }
    .counter-section h5{
        font-size: 27px;
    }
    .counter-section .item p{
        max-width: 100%;
        font-size: 20px;
    }
    .ai-powered .main-image img{
        max-width: 70%;
    }
    .ai-powered .item-4, .ai-powered .item-3, .ai-powered .item-2, .ai-powered .item-1{
        position: static;
    }
    .ai-powered .item{
        width: 100%;
        margin-bottom: 20px;
    }
    .ai-powered .section-title-left{
        text-align: center;
    }
    .ai-powered .section-title-left h2 {
        max-width: 100% !important;
    }
    .dark-cta{
        max-width: 100%;
        padding: 200px 0px 50px 0px;
        margin: 10px;
        position: relative;
        overflow: hidden;
        z-index: 1;
    }
    .dark-cta h3{
        font-size: 27px;
    }
    .dark-cta p{
        font-size: 18px;
        padding: 10px 0px;
    }
    .dark-cta::before{
        content: "";
        background: linear-gradient(to top, rgba(0, 0, 0, 1), rgba(0, 0, 0, 0));
        height: 70%;
        width: 100%;
        position: absolute;
        bottom: 0;
        left: 0;
        z-index: -1;
    }
    .faq-section h2{
        text-align: center;
        max-width: 100%;
    }
    .faq-section .accordion-item h2 button{
        font-size: 18px;
    }
    .faq-section .accordion-item p{
        font-size: 16px;
    }



    /* about page  */

    .empowering-smarter .image img{
        max-width: 100%;
    }
    .mission .item{
        height: 100%;
    }
    .mission .item h1{
        font-size: 32px;
    }
    .mission .item p{
        font-size: 18px;
    }
    .what-we-believe .section-title-left h2{
        text-align: center;
        max-width: 100%;
    }
    .what-we-believe .section-title-left{
        margin-bottom: 30px;
        max-width: 100% !important;
    }
    .our-team-section img{
        max-width: 70%;
        display: flex;
        margin: auto;
    }
    .what-we-believe .item{
        height: 100%;
    }
    .what-we-believe  .col-lg-4{
        margin-bottom: 30px;
    }
    .what-we-believe .item h4{
        font-size: 25px;
    }
    .what-we-believe .item p{
        font-size: 18px;
    }
    .why-choose-section .col-lg-4{
        margin-bottom: 30px;
    }
    .why-choose-section .item{
        padding: 20px;
        height: 100%;
        margin-bottom: 0px;
    }
    .why-choose-section .item h4{
        font-size: 25px;
    }
    .why-choose-section .item p{
        font-size: 18px;
    }
    .lets-simply{
        margin: 50px 0px 100px 0px;
    }


    /* pricing style */

    .samplePricing p{
        font-size: 15px;
    }
    .samplePricing h2{
        font-size: 30px;
        line-height: normal;letter-spacing: normal;
    }
    .samplePricing h6{
        font-size: 14px;
        letter-spacing: normal;
        line-height: normal;
        width: 100%;
    }
    .price{
        font-size: 30px;
    }
    .sampleTablePricing{
        overflow-x: auto;
    }
    .header-row th{
        padding: 10px;
    }
    .Comprehensive .col-6{
        width: 100%;
    }
    .Comprehensive h3{
        font-size: 24px;
    }
    .Comprehensive p{
        font-size: 18px;
        line-height: normal;
        letter-spacing: normal;
    }
    .pricing-page-accordion .accordion-button{
        font-size: 18px !important;
    }
    .pricing-page-accordion .classy-accordion-body{
        padding: 17px !important;
        font-size: 16px !important;
    }
    .pricing-page-accordion .classy-accordion-button{
        padding: 20px 50px 20px 0px !important;
    }

}

@media (min-width:769px) and (max-width:992px){
    #smooth-wrapper{
        overflow-x: hidden;
    }
    .course-module{
        overflow-x: hidden;
    }
    .container{
        max-width: 800px !important;
    }
    .main-header .mobile-d-none{
        display: none;
    }
    .main-header {
        background-color: #F5F5F5;
    }
    .navbar-toggler-icon{
        font-size: 25px;
        display: flex;
        align-items: center;
        justify-content: center;
        background-color: #D9D9D9;   
        padding: 10px;
        border-radius: 50%;
        width: 55px;
        height: 55px;
        font-weight: 400;
    }
    .main-header .logo img{
        width: 180px;
    }
    .navbar-toggler:focus{
        box-shadow: none;
    }
    .main-header{
        margin-bottom:60px;
        padding: 0px;
    }
    .main-header .container{
        padding: 5px 20px;
    }
    .mob-head-right{
        display: flex;
        align-items: center;
        gap: 20px;
    }
    .mob-head-right img{
        width: 30px;
        height: 30px;
    }
    .mob-head-right buton{
        background-color: lightgrey;
    }
    .menu-items ul li a {
        padding: 15px 20px !important;
        font-size: 22px;
        border-bottom: 1px solid #e8e8e8;
    }
    .menu-items ul li:last-child a {
        border-bottom: none;
    }
    .dropdown-menu li:last-child .dropdown-item{
        border-bottom: none !important;
    }
    .navbar-nav .dropdown-menu{
        padding: 15px 20px !important;
        background: transparent;
        background: var(--secondary-color);
        border-radius: 20px;
    }
    .menu-items .dropdown-menu .dropdown-item{
        color: #Fff;
        font-size: 20px;
    }
    .main-banner .banner-title{
        max-width: 100%;
    }
    .main-banner{
        margin-top: 15px;
    }
    .main-banner h1{
        font-size: 37px;
        font-weight: 500;
    }
    .main-banner .banner-title p{
        padding: 20px 0px;
        font-size: 20px;
    }
    .theme-btn a {
        padding: 10px 15px;
        font-size: 20px;
    }
    .main-banner .banner-btns .watch-video h6{
        font-size: 20px;
    }
    .main-banner .banner-btns .watch-video .icon {
        height: 40px;
        width: 40px;
        background: #fff;
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .main-banner .banner-btns .watch-video svg{
        width: 25px;
        height: 25px;
        flex-shrink: 0;
    }
    .main-banner .main-shapes .shape2{
        top: 42%;
        left: 20%;
    }
    .main-banner .main-shapes .shape2 img{
        max-width: 70%;
    }
    .main-banner .main-shapes .shape1{
        bottom: 35%;
        right: 15%;
    }
    .main-banner .main-shapes .shape1 img{
        max-width: 70%;
    }
    .main-banner .main-image .shape1{
        top: 40%;
        left: 15%;
    }
    .main-banner .shapes .item{
        padding: 10px;
        border-radius: 10px;
    }
    .main-banner .banner-image .main-image .main-banner-image-new{
        width: 350px;
    }
    .main-banner .main-image .shape2{
        bottom: 35%;
        right: 20%;
    }
    .main-banner .main-image .shape3{
        bottom: 15%;
        left: 18%;
    }
    .main-banner .shapes .item h6{
        font-size: 15px;
        margin-bottom: 5px;
    }
    .main-banner .shapes .item p{
        font-size: 10px;
        letter-spacing: normal;
    }
    .main-banner .shape3 button{
        margin-top: 10px;
        font-size: 13px;
    }
    .main-banner .shape1 .icon{
        width: 30px;
        height: 30px;
        border-radius: 5px;
    }
    .main-banner .shape2 .icon{
        width: 30px;
        height: 30px;
        border-radius: 5px;
    }
    .main-banner .shape2 .item{
        gap: 10px;
    }
    .main-banner .shapes .item{
        gap: 10px;
    }
    .main-banner .main-image .shape3 img{
        width: 30px;
    }
    .section-padding{
        padding: 60px 0px;
    }
    .brand-slider h3{
        font-size: 30px;
        margin-bottom: 30px;
        letter-spacing: normal;
    }
    .brand-slider img{
        max-width: 80%;
    }
    .section-title h2{
        font-size: 30px;
    }
    .section-title p{
        font-size: 20px;
    }
    .benefits-section .item .icon{
        width: 60px;
        height: 60px;
    }
    .benefits-section .item .content{
        padding-top: 60px;
    }
    .benefits-section .col-lg-3{
        width: 50%;
        margin-bottom: 50px;
    }
    .benefits-section .item{
        height: 100%;
        padding: 10px;
    }
    .benefits-section .item .content h4{
        font-size: 25px;
    }
    .benefits-section .item .content p{
        font-size: 18px;
    }
    .section-title-left h2{
        font-size: 30px;
        max-width: 70%;
    }
    .section-title-left p{
        font-size: 20px;
    }
    .course-module .image img{
        max-width: 85%;
        display: flex;
        margin: auto;
    }
    .benefits-section{
        padding-bottom: 0px;
    }
    .course-module-row .col-lg-6{
        width: 50%;
    }
    .course-module .item{
        padding: 17px;
        height: 100%;
    }
    .course-module .item h4{
        font-size: 24px;
    }
    .course-module .item p{
        font-size: 18px;
        margin-bottom: 5px;
    }
    .course-module .item button{
        font-size: 20px;
    }
    .learner-experience{
        margin: 30px 20px 50px 20px;
    }
    .learner-experience .box-section{
        margin-bottom: 0px;
    }
    .learner-experience .item{
        margin-top: 20px;
    }
    .learner-experience .box-section{
        margin: 0px auto 0px auto;
    }
    .learner-experience .item .content{
        padding: 15px;
        margin: 10px;
        border-radius: 15px;
    }
    .learner-experience .item .content h1{
        font-size: 24px;
    }
    .learner-experience .item .content p{
        font-size: 18px;
    }
    .learner-experience .item .icon{
        width: 45px;
        height: 45px;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .smartLearning h2{
        font-size: 30px;
    }
    .smartLearning p{
        font-size: 20px;
        line-height: normal;
    }
    .smartLearning {
        margin-top: 20px !important;
    }
    .smartLearning h3{
        font-size: 24px;
    }
    .smartLearning  .col-6{
        width: 100%;
    }
    .smartLearning .numbers-row .col-md-3{
        width: 25%;
        padding: 20px;
    }
    .smartLearning h6{
        font-size: 18px;
        line-height: normal;
    }
    .smartLearning img{
        max-width: 50%;
        display: flex;
        margin: auto;
        margin-top: 30px !important;
    }
    .training_section h4{
        font-size: 30px;
        font-weight: 500;
        line-height: normal;
    }
    .training_section button{
        margin-bottom: 10px;
    }
    .training_section p{
        font-size: 20px;
        padding-right: 0px !important;
    }
    .training_section .col-6{
        width: 100%;
    }
    .training_section img{
        display: flex;
        max-width: 70%;
        margin: auto;
        margin-top: 25px;
    }
    .smartLMSection .col-6{
        width: 100%;
    }
    .smartLMSection .row{
        padding-left: 10px !important;
        padding-right: 10px !important;
        flex-direction: column-reverse;
    }
    .smartLMSection h3{
        line-height: normal;
        font-size: 30px;
        margin-top: 20px;
    }
    .smartLMSection{
        padding: 30px 50px 0px 50px;
    }
    .smartLMSection p{
        font-size: 20px;
        line-height: normal;
    }
    .smartLMSection img{
        margin-top: 30px !important;
    }
    #form-section .container{
        padding: 25px !important;
    }
    .main-form h2{
        font-size: 30px;
        line-height: normal;
    }
    .main-form p{
        font-size: 20px;
    }
    .latest_section h1{
        line-height: normal;
        font-size: 30px;
        font-weight: 500;
    }
    .latest_section p{
        font-size: 20px;
        line-height: normal;
    }
    .latest_section h3{
        font-size: 25px;
        line-height: normal;
    }
    .latest_section h6{
        font-size: 18px;
        line-height: normal;
    }
    .latest_section .col-md-6{
        width: 100% ;
    }
    .latest_section .mini-blogs .col-md-4{
        width: 100%;
    }
    .latest_section .mini-blogs{
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
    }
    .latest_section .mini-blogs .row{
        width: 50%;
    }
    .latest_section .mini-blogs img{
        width: 100%;
        height: 250px;
        object-fit: cover;
        border-radius: 20px;
        margin-bottom: 20px;
    }
    .latest_section .mini-blogs h5{
        font-weight: 500;
        font-style: Medium;
        font-size: 20px;
        line-height: normal;
        letter-spacing: 0%;
        color: #252641;
    }
    .latest_section .mini-blogs p{
        font-size: 16px;
    }
    .mini-blogs .row{
        margin-top: 30px;
    }
    .mini-blogs .text-start{
        width: 100%;
    }
    .footer img{
        width: 250px;
    }
    .footer .col-md-6{
        width: 100%;
    }
    .footer{
        margin-left: 10px;
        margin-right: 10px;
    }   
    .footer-content p{
        font-size: 20px;
        line-height: 30px;
        width: 100%;
    }
    .footer-content h1{
        font-size: 30px;
    }
    .footer-content .quick-links ul li{
        font-size: 20px;
    }
    .footer-content .location ul li{
        font-size: 20px;
    }
    .footer-content .mt-5{
        margin-top: 0px !important;
    }



        /* product sample page */

    .about-smartLMSection .row{
        flex-direction: row-reverse;
    }
    .about-smartLMSection h3{
        font-size: 35px;
    }
    .about-smartLMSection p{
        font-size: 20px;
    }
    .about-smartLMSection img{
        max-width: 80%;
        display: flex;
        margin: auto;
    }
    .what-is-upguage img{
        margin-bottom: 30px !important;
        max-width: 100%;
    }
    .what-is-upguage .col-6{
        width: 50%;
    }
    .step-section .section-title{
        margin-bottom: 30px !important;
    }
    .step-section .item .shape img{
        height: 450px;
    }
    .step-section .item{
        height: 420px;
        padding: 70px 20px 50px 50px;
        width: 300px;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-direction: column;
        margin-bottom: 50px;
    }
    .step-section .item .shape img{
        width: 400px;
    }
    .step-section .item h1{
        font-size: 25px;
    }
    .step-section .item p{
        font-size: 18px;
    }
    .who-can-use-sec .section-title-left{
        max-width: 100% !important;
    }
    .who-can-use-sec .section-title-left h2 {
        text-align: center;
    }
    .who-can-use-sec .box-top{
        margin-top: -20px;
    }
    .who-can-use-sec .course-module-d-flex-mob .col-lg-6{
        display: flex;
        gap: 20px;
    }
    .who-can-use-sec .image img{
        max-width: 100%;
    }
    .who-can-use-sec h2{
        max-width: 100%;
    }
    .who-can-use-sec .item p{
        font-size: 14px;
    }
    .who-can-use-sec .item{
        width: 50%;
        padding: 20px;
        text-align: center;
    }
    .who-can-use-sec .image img{
        margin-top: 30px;
    }
    .what-makes-diff-sec img{
        max-width: 100%;
        display: flex;
        margin: 0px auto;
    }
    .what-makes-diff-sec .section-title{
        margin-bottom: 30px;
    }
    .what-makes-diff-sec .content{
        padding: 0px 50px;
    }
    .counter-section .col-lg-3{
        width: 50%;
    }
    .counter-section .item{
        display: flex;
        align-items: center;
        justify-content: center;
        flex-direction: column;
    }
    .counter-section h5{
        font-size: 27px;
    }
    .counter-section .item p{
        max-width: 100%;
        font-size: 20px;
    }
    .ai-powered .main-image img{
        max-width: 70%;
    }
    .ai-powered .item-4, .ai-powered .item-3, .ai-powered .item-2, .ai-powered .item-1{
        position: static;
    }
    .ai-powered .item{
        width: 100%;
        margin-bottom: 20px;
    }
    .ai-powered .section-title-left{
        text-align: center;
    }
    .ai-powered .section-title-left h2 {
        max-width: 100% !important;
    }
    .dark-cta{
        max-width: 100%;
        padding: 200px 0px 50px 0px;
        margin: 10px;
        position: relative;
        overflow: hidden;
        z-index: 1;
    }
    .dark-cta h3{
        font-size: 27px;
    }
    .dark-cta p{
        font-size: 18px;
        padding: 10px 0px;
    }
    .dark-cta::before{
        content: "";
        background: linear-gradient(to top, rgba(0, 0, 0, 1), rgba(0, 0, 0, 0));
        height: 70%;
        width: 100%;
        position: absolute;
        bottom: 0;
        left: 0;
        z-index: -1;
    }
    .faq-section h2{
        text-align: center;
        max-width: 100%;
    }
    .faq-section .accordion-item h2 button{
        font-size: 18px;
    }
    .faq-section .accordion-item p{
        font-size: 16px;
    }


        /* about page  */

    .empowering-smarter .image img{
        max-width: 100%;
    }
    .mission .item{
        height: 100%;
    }
    .mission .item h1{
        font-size: 32px;
    }
    .mission .item p{
        font-size: 18px;
    }
    .what-we-believe .section-title-left h2{
        text-align: center;
        max-width: 100%;
    }
    .what-we-believe .section-title-left{
        margin-bottom: 30px;
        max-width: 100% !important;
    }
    .our-team-section img{
        max-width: 50%;
        display: flex;
        margin: auto;
    }
    .what-we-believe .item{
        height: 100%;
    }
    .what-we-believe  .col-lg-4{
        margin-bottom: 30px;
    }
    .what-we-believe .item h4{
        font-size: 25px;
    }
    .what-we-believe .item p{
        font-size: 18px;
    }
    .why-choose-section .col-lg-4{
        margin-bottom: 30px;
    }
    .why-choose-section .item{
        padding: 20px;
        height: 100%;
        margin-bottom: 0px;
    }
    .why-choose-section .item h4{
        font-size: 25px;
    }
    .why-choose-section .item p{
        font-size: 18px;
    }
    .lets-simply{
        margin: 50px 0px 100px 0px;
    }

        /* pricing style */

    .samplePricing p{
        font-size: 18px;
    }
    .samplePricing h2{
        font-size: 35px;
        line-height: normal;letter-spacing: normal;
    }
    .samplePricing h6{
        font-size: 16px;
        letter-spacing: normal;
        line-height: normal;
        width: 100%;
    }
    .price{
        font-size: 35px;
    }
    .sampleTablePricing{
        overflow-x: auto;
    }
    .header-row th{
        padding: 10px;
    }
    .Comprehensive .col-6{
        width: 100%;
    }
    .Comprehensive h3{
        font-size: 26px;
    }
    .Comprehensive p{
        font-size: 20px;
        line-height: normal;
        letter-spacing: normal;
    }
    .pricing-page-accordion .accordion-button{
        font-size: 20px !important;
    }
    .pricing-page-accordion .classy-accordion-body{
        padding: 19px !important;
        font-size: 18px !important;
    }
    .pricing-page-accordion .classy-accordion-button{
        padding: 20px 50px 20px 0px !important;
    }
}

@media (min-width:993px) and (max-width:1200px){
    .course-module{
        overflow-x: hidden;
    }
    .container{
        max-width: 1100px !important;
    }
    .main-header {
        background-color: #F5F5F5;
    }
    .navbar-toggler-icon{
        font-size: 25px;
        display: flex;
        align-items: center;
        justify-content: center;
        background-color: #D9D9D9;   
        padding: 10px;
        border-radius: 50%;
        width: 55px;
        height: 55px;
        font-weight: 400;
    }
    .main-header .logo img{
        width: 180px;
    }
    .navbar-toggler:focus{
        box-shadow: none;
    }
    .main-header{
        padding: 0px;
    }
    .main-header .container{
        padding: 5px 20px;
    }
    .mob-head-right{
        display: flex;
        align-items: center;
        gap: 20px;
    }
    .mob-head-right img{
        width: 30px;
        height: 30px;
    }
    .mob-head-right buton{
        background-color: lightgrey;
    }
    .menu-items ul li a {
        padding: 15px 20px !important;
        font-size: 18px;
        border-bottom: 1px solid #e8e8e8;
    }
    .menu-items ul li:last-child a {
        border-bottom: none;
    }
    .dropdown-menu li:last-child .dropdown-item{
        border-bottom: none !important;
    }
    .navbar-nav .dropdown-menu{
        padding: 15px 20px !important;
        background: transparent;
        background: var(--secondary-color);
        border-radius: 20px;
    }
    .menu-items .dropdown-menu .dropdown-item{
        color: #Fff;
        font-size: 20px;
    }
    .main-banner .banner-title{
        max-width: 100%;
    }
    .main-banner{
        margin-top: 15px;
    }
    .main-banner h1{
        font-size: 45px;
        font-weight: 700;
    }
    .main-banner .banner-title p{
        padding: 20px 0px;
        font-size: 20px;
    }
    .theme-btn a {
        padding: 10px 15px;
        font-size: 20px;
    }
    .main-banner .banner-btns .watch-video h6{
        font-size: 20px;
    }
    .main-banner .banner-btns .watch-video .icon {
        height: 40px;
        width: 40px;
        background: #fff;
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .main-banner .banner-btns .watch-video svg{
        width: 25px;
        height: 25px;
        flex-shrink: 0;
    }
    .main-banner .main-shapes .shape2{
        top: 35%;
        left: 10%;
    }
    .main-banner .main-shapes .shape2 img{
        max-width: 70%;
    }
    .main-banner .main-shapes .shape1{
        bottom: 40%;
        right: 10%;
    }
    .main-banner .main-shapes .shape1 img{
        max-width: 70%;
    }
    .main-banner .main-image .shape1{
        top: 40%;
        left: 30%;
    }
    .main-banner .shapes .item{
        padding: 10px;
        border-radius: 10px;
    }
    .main-banner .banner-image .main-image .main-banner-image-new{
        width: 350px;
    }
    .main-banner .main-image .shape2{
        bottom: 35%;
        right: 30%;
    }
    .main-banner .main-image .shape3{
        bottom: 15%;
        left: 22%;
    }
    .main-banner .shapes .item h6{
        font-size: 18px;
        margin-bottom: 5px;
    }
    .main-banner .shapes .item p{
        font-size: 14px;
        letter-spacing: normal;
    }
    .main-banner .shape3 button{
        margin-top: 10px;
        font-size: 13px;
    }
    .main-banner .shape1 .icon{
        width: 40px;
        height: 40px;
        border-radius: 5px;
    }
    .main-banner .shape2 .icon{
        width: 40px;
        height: 40px;
        border-radius: 5px;
    }
    .main-banner .shape2 .item{
        gap: 10px;
    }
    .main-banner .shapes .item{
        gap: 10px;
    }
    .main-banner .main-image .shape3 img{
        width: 40px;
    }
    .section-padding{
        padding: 60px 0px;
    }
    .brand-slider h3{
        font-size: 30px;
        margin-bottom: 30px;
        letter-spacing: normal;
    }
    .brand-slider img{
        max-width: 80%;
    }
    .section-title h2{
        font-size: 30px;
    }
    .section-title p{
        font-size: 20px;
    }
    .benefits-section .item .icon{
        width: 60px;
        height: 60px;
    }
    .benefits-section .item .content{
        padding-top: 60px;
    }
    .benefits-section .col-lg-3{
        width: 50%;
        margin-bottom: 50px;
    }
    .benefits-section .item{
        height: 100%;
        padding: 10px;
    }
    .benefits-section .item .content h4{
        font-size: 25px;
    }
    .benefits-section .item .content p{
        font-size: 18px;
    }
    .section-title-left h2{
        font-size: 30px;
        max-width: 70%;
    }
    .section-title-left p{
        font-size: 20px;
    }
    .course-module .image img{
        max-width: 85%;
        display: flex;
        margin: auto;
    }
    .benefits-section{
        padding-bottom: 0px;
    }
    .course-module-row .col-lg-6{
        width: 50%;
    }
    .course-module .item{
        padding: 17px;
        height: 100%;
    }
    .course-module .item h4{
        font-size: 24px;
    }
    .course-module .item p{
        font-size: 18px;
        margin-bottom: 5px;
    }
    .course-module .item button{
        font-size: 20px;
    }
    .learner-experience{
        margin: 30px 20px 50px 20px;
    }
    .learner-experience .box-section{
        margin-bottom: 0px;
    }
    .learner-experience .item{
        margin-top: 20px;
    }
    .learner-experience .box-section{
        margin: 0px auto 0px auto;
    }
    .learner-experience .item .content{
        padding: 15px;
        margin: 10px;
        border-radius: 15px;
    }
    .learner-experience .item .content h1{
        font-size: 24px;
    }
    .learner-experience .item .content p{
        font-size: 18px;
    }
    .learner-experience .item .icon{
        width: 45px;
        height: 45px;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .smartLearning h2{
        font-size: 30px;
    }
    .smartLearning p{
        font-size: 20px;
        line-height: normal;
    }
    .smartLearning {
        margin-top: 20px !important;
    }
    .smartLearning h3{
        font-size: 24px;
    }
    .smartLearning  .col-6{
        width: 100%;
    }
    .smartLearning .numbers-row .col-md-3{
        width: 25%;
        padding: 20px;
    }
    .smartLearning h6{
        font-size: 18px;
        line-height: normal;
    }
    .smartLearning img{
        max-width: 50%;
        display: flex;
        margin: auto;
        margin-top: 30px !important;
    }
    .training_section h4{
        font-size: 30px;
        font-weight: 500;
        line-height: normal;
    }
    .training_section button{
        margin-bottom: 10px;
    }
    .training_section p{
        font-size: 20px;
        padding-right: 0px !important;
    }
    .training_section .col-6{
        width: 100%;
    }
    .training_section img{
        display: flex;
        max-width: 70%;
        margin: auto;
        margin-top: 25px;
    }
    .smartLMSection .col-6{
        width: 100%;
    }
    .smartLMSection .row{
        padding-left: 10px !important;
        padding-right: 10px !important;
        flex-direction: column-reverse;
    }
    .smartLMSection h3{
        line-height: normal;
        font-size: 30px;
        margin-top: 20px;
    }
    .smartLMSection{
        padding: 30px 50px 0px 50px;
    }
    .smartLMSection p{
        font-size: 20px;
        line-height: normal;
    }
    .smartLMSection img{
        margin-top: 30px !important;
    }
    #form-section .container{
        padding: 25px !important;
    }
    .main-form h2{
        font-size: 30px;
        line-height: normal;
    }
    .main-form p{
        font-size: 20px;
    }
    .latest_section h1{
        line-height: normal;
        font-size: 30px;
        font-weight: 500;
    }
    .latest_section p{
        font-size: 20px;
        line-height: normal;
    }
    .latest_section h3{
        font-size: 25px;
        line-height: normal;
    }
    .latest_section h6{
        font-size: 18px;
        line-height: normal;
    }
    .latest_section .col-md-6{
        width: 100% ;
    }
    .latest_section .mini-blogs .col-md-4{
        width: 100%;
    }
    .latest_section .mini-blogs{
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
    }
    .latest_section .mini-blogs .row{
        width: 50%;
    }
    .latest_section .mini-blogs img{
        width: 100%;
        height: 250px;
        object-fit: cover;
        border-radius: 20px;
        margin-bottom: 20px;
    }
    .latest_section .mini-blogs h5{
        font-weight: 500;
        font-style: Medium;
        font-size: 20px;
        line-height: normal;
        letter-spacing: 0%;
        color: #252641;
    }
    .latest_section .mini-blogs p{
        font-size: 16px;
    }
    .mini-blogs .row{
        margin-top: 30px;
    }
    .mini-blogs .text-start{
        width: 100%;
    }
    .footer img{
        width: 250px;
    }
    .footer .col-md-6{
        width: 100%;
    }
    .footer{
        margin-left: 10px;
        margin-right: 10px;
    }   
    .footer-content p{
        font-size: 20px;
        line-height: 30px;
        width: 100%;
    }
    .footer-content h1{
        font-size: 30px;
    }
    .footer-content .quick-links ul li{
        font-size: 20px;
    }
    .footer-content .location ul li{
        font-size: 20px;
    }
    .footer-content .mt-5{
        margin-top: 0px !important;
    }

    /* product sample page */

    .about-smartLMSection .row{
        flex-direction: row-reverse;
    }
    .about-smartLMSection h3{
        font-size: 45px;
    }
    .about-smartLMSection p{
        font-size: 25px;
    }
    .about-smartLMSection img{
        max-width: 100%;
        display: flex;
        margin: auto;
    }
    .what-is-upguage img{
        margin-bottom: 30px !important;
        max-width: 80%;
    }
    .what-is-upguage .col-6{
        width: 50%;
    }
    .step-section .section-title{
        margin-bottom: 30px !important;
    }
    .step-section .item .shape img{
        height: 450px;
    }
    .step-section .item{
        height: 420px;
        padding: 70px 20px 50px 50px;
        width: 300px;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-direction: column;
        margin-bottom: 50px;
    }
    .step-section .item .shape img{
        width: 400px;
    }
    .step-section .item h1{
        font-size: 25px;
    }
    .step-section .item p{
        font-size: 18px;
    }
    .who-can-use-sec .section-title-left{
        max-width: 100% !important;
    }
    .who-can-use-sec .section-title-left h2 {
        text-align: center;
    }
    .who-can-use-sec .box-top{
        margin-top: -20px;
    }
    .who-can-use-sec .image img{
        max-width: 100%;
    }
    .who-can-use-sec h2{
        max-width: 100%;
    }
    .who-can-use-sec .item p{
        font-size: 14px;
    }
    .who-can-use-sec .item{
        width: 100%;
        padding: 20px;
        text-align: center;
    }
    .who-can-use-sec .image img{
        margin-top: 30px;
        max-width: 80%;
    }
    .what-makes-diff-sec img{
        max-width: 100%;
        display: flex;
        margin: 0px auto;
    }
    .what-makes-diff-sec .section-title{
        margin-bottom: 30px;
    }
    .what-makes-diff-sec .content{
        padding: 0px 50px;
    }
    .counter-section .col-lg-3{
        width: 50%;
    }
    .counter-section .item{
        display: flex;
        align-items: center;
        justify-content: center;
        flex-direction: column;
    }
    .counter-section h5{
        font-size: 27px;
    }
    .counter-section .item p{
        max-width: 100%;
        font-size: 20px;
    }
    .ai-powered .section-title-left .col-lg-5{
        width: 100%;
    }
    .ai-powered .section-title-left .col-lg-7{
        width: 100%;
    }
    .ai-powered .main-image img{
        max-width: 50%;
    }
    .ai-powered .item{
        margin-bottom: 20px;
    }
    .ai-powered .item-4{
        bottom: 7%;
    }
    .ai-powered .item-1{
        top: 20%;
    }
    .ai-powered .item-2{
        top: 55%;
    }
    .ai-powered .section-title-left{
        text-align: center;
    }
    .ai-powered .section-title-left h2 {
        max-width: 100% !important;
    }
    .dark-cta{
        margin: 10px;
    }
    .dark-cta .col-lg-4{
        width: 50%;
    }
    .faq-section h2{
        text-align: center;
        max-width: 100%;
    }
    .faq-section .accordion-item h2 button{
        font-size: 20px;
    }
    .faq-section .accordion-item p{
        font-size: 18px;
    }
        /* about page  */

    .mission .item{
        height: 100%;
    }
    .mission .item h1{
        font-size: 32px;
    }
    .mission .item p{
        font-size: 18px;
    }
    .what-we-believe .section-title-left h2{
        text-align: center;
        max-width: 100%;
    }
    .what-we-believe .section-title-left{
        margin-bottom: 30px;
        max-width: 100% !important;
    }
    .our-team-section img{
        max-width: 70%;
        display: flex;
        margin: auto;
    }
    .what-we-believe .item{
        height: 100%;
    }
    .what-we-believe  .col-lg-4{
        margin-bottom: 30px;
    }
    .what-we-believe .item h4{
        font-size: 25px;
    }
    .what-we-believe .item p{
        font-size: 18px;
    }
    .why-choose-section .col-lg-4{
        margin-bottom: 30px;
    }
    .why-choose-section .item{
        padding: 20px;
        height: 100%;
        margin-bottom: 0px;
    }
    .why-choose-section .item h4{
        font-size: 25px;
    }
    .why-choose-section .item p{
        font-size: 18px;
    }
    .lets-simply{
        margin: 50px 0px 100px 0px;
    }

            /* pricing style */

    .samplePricing p{
        font-size: 22px;
    }
    .samplePricing h2{
        font-size: 45px;
        line-height: normal;letter-spacing: normal;
    }
    .samplePricing h6{
        font-size: 18px;
        letter-spacing: normal;
        line-height: normal;
        width: 100%;
    }
    .price{
        font-size: 37px;
    }
    .sampleTablePricing{
        overflow-x: auto;
    }
    .header-row th{
        padding: 10px;
    }
    .Comprehensive .col-6{
        width: 100%;
    }
    .Comprehensive h3{
        font-size: 28px;
    }
    .Comprehensive p{
        font-size: 22px;
        line-height: normal;
        letter-spacing: normal;
    }
    .pricing-page-accordion .accordion-button{
        font-size: 20px !important;
    }
    .pricing-page-accordion .classy-accordion-body{
        padding: 19px !important;
        font-size: 18px !important;
    }
    .pricing-page-accordion .classy-accordion-button{
        padding: 20px 50px 20px 0px !important;
    }
}


@media (max-width:900px){
    .new-breadcrumb-section h1{
        font-size: 30px;
    }
    .new-breadcrumb-section p{
        font-size: 16px;
        max-width: 100%;
    }
    .new-breadcrumb-section .image img{
        width: 100%;
    }
    .new-counter-sec .item{
        justify-content: center;
        margin-bottom: 20px;
    }
    .new-why-us .section-title-left h2{
        max-width: 100% !important;
    }
    .new-why-us  img{
        margin-bottom: 0px !important;
    }
    .flow-chart .flow-content .item{
        width: 100%;
    }
    .flow-chart .flow-content{
        flex-wrap: wrap;
        gap: 20px;
    }
    .flow-image img{
        width: 100%;
    }
    .flow-image{
        padding: 30px 10px;
    }
    .flow-image h1{
        font-size: 30px;
        line-height: normal;
        text-align: center;
        margin-top: 20px;
    }
    .testimonial-slider .section-title-left h2{
        max-width: 100%;
        text-align: center;
    }
    .testimonial-slider{
        padding: 20px 0px;
    }
    .new-form{
        padding: 20px !important;
    }
    .new-cta{
        padding: 50px 20px !important;
        margin-bottom: 30px !important;
    }
}