@media (min-width:1400px) {
     html {
        font-size: .6945vw;
    }
    .container{
        max-width: 120rem;
    }
}
@media (max-width:991.98px) {
   html{
    font-size: 48%;
   }
    .hamburger-menu{
        display: block;
    }
    .hamburger-menu img{
        width: 2.6rem;
    }
    .hamburger-menu.current .hamburger-icon{
        display: none;
    }
    .hamburger-menu.current .hamburger-cross{
        display: block;
    }
    .hamburger-menu .hamburger-icon{
        display: block;
    }
    .hamburger-menu .hamburger-cross{
        display: none;
    }
    .header-menu {
        position: absolute;
        left: 0;
        top: 0rem;
        width: 100%;
        background-color: var(--white);
        transform: translateY(-100%);
        transition: .3s ease-in-out;
        z-index: 5;
        padding-top: 5rem;
    }
    .header-menu.current{
        transform: translateY(0);
        top: 6rem;
    }
    .header-menu ul {
        flex-direction: column;
        display: flex;
        align-items: center;
    }
    .header-menu ul li{
        margin-bottom: 3.2rem;
    }
    .header-menu ul li:nth-child(2){
        order: 3;
    }
    .how-help-slider .owl-nav {
        display: flex;
        justify-content: flex-end;
        align-items: center;
        column-gap: 1.6rem;
        margin-top: 3.2rem;
    }
    .how-help-slider .owl-nav button {
        display: flex;
        height: 4rem;
        width: 4rem;
        border-radius: 50%;
        background-color: var(--primary);
        border: none;
        color: var(--white);
        font-size: 4rem;
        justify-content: center;
        align-items: center;
        font-family: "Poppins", sans-serif;
        padding: 1rem;
    }
    .how-help-bottom p {
        font-size: 1.8rem;
    }
    .courses-slider .owl-nav {
        display: flex;
        justify-content: flex-end;
        align-items: center;
        column-gap: 1.6rem;
        margin-top: 3.2rem;
        margin-left: 2.5rem;
        margin-right: 4rem;
    }
    .courses-slider .owl-nav button {
        display: flex;
        height: 4rem;
        width: 4rem;
        border-radius: 50%;
        background-color: var(--primary);
        border: none;
        color: var(--white);
        font-size: 4rem;
        justify-content: center;
        align-items: center;
        font-family: "Poppins", sans-serif;
        padding: 1rem;
    }
    .how-work-content::after {
        left: 48%;
    }
    .pricing-head {
        height: 13rem;
    }
    .pricing-feature .primary-btn span:last-child {
        transform: translateX(-45%);
    }
    .pricing-feature .primary-btn:hover span:last-child {
        transform: translateX(-93%);
    }
    .pricing-feature .primary-btn:hover span:first-child {
        transform: translateX(28rem);
    }
    .learn-content>li {
        width: 50%;
    }
    .exceptional-slider .owl-nav {
        display: flex;
        justify-content: center;
        align-items: center;
        column-gap: 1.6rem;
        margin-top: 3.2rem;
    }
    .exceptional-slider .owl-nav button {
        display: flex;
        height: 4rem;
        width: 4rem;
        border-radius: 50%;
        background-color: var(--primary);
        border: none;
        color: var(--white);
        font-size: 4rem;
        justify-content: center;
        align-items: center;
        font-family: "Poppins", sans-serif;
        padding: 1rem;
    }
    .featured-text h3 {
        margin-bottom: 3.2rem;
    }
    .footer-logo {
        margin-bottom: 3.2rem;
    }
    .new-skill-content {
        max-width: 50rem;
    }
    .new-skill-content p{
        max-width: 100%;
    }
    .login-logo {
        top: 3.2rem;
        left: 50%;
        transform: translateX(-50%);
    }
    .login-form-area {
        padding-top: 9rem;
    }
    .login-form-area form{
        position: relative;
    }
    .login-form-area .forgot-password {
        position: absolute;
        bottom: 14rem;
        left: 0;
        color: wheat;
        z-index: 5;
    }
    .login-form-area form button {
        margin-top: 2rem;
    }
    .mbl-resigter-btn p{
        font-size: 1.6rem;
        font-weight: 600;
        color: var(--black3);
        margin-top: 5rem;
    }
    .mbl-resigter-btn a{
        color: var(--primary);
    }
    .login-page .login-img {
        display: none;
    }
    .login-content {
        padding-bottom: 5rem;
    }
    .how-work-content li p {
        font-size: 2rem;
    }
}
@media (max-width:767.99px) {
    html{
        font-size: 57%;
    }
    .banner-sec {
        background-image: url(../img/banner-bg-2.jpg);
        height: 130rem;
        background-position: bottom center;
        align-items: start;
        padding-top: 5rem;
    }
    .banner-content h1 {
        font-size: 3.5rem;
        font-weight: 700;
        color: var(--black1);
        margin-bottom: 3.5rem;
    }
    .how-work-content::after {
        display: none;
    }
    .how-work-employer {
        max-width: 100%;
    }
    .how-work-helper {
        max-width: 100%;
        margin-top: 4.8rem;
    }
    .pricing-box{
        margin-bottom: 3rem;
    }
    .pricing-head {
        height: auto;
    }
    .pricing-feature .primary-btn span:last-child {
        transform: translateX(-150%);
    }
    .pricing-feature .primary-btn:hover span:last-child {
        transform: translateX(-268%);
    }
    .pricing-feature .primary-btn:hover span:first-child {
        transform: translateX(54rem);
    }
    .miss-out-slider-wrap::before {
        display: none;
    }
    .modal-design .modal-dialog {
        max-width: 90%;
        margin: 0 auto;
    }
    .miss-out-slider-wrap::after {
        display: none;
    }
    footer>.container{
        position: relative;
    }
    .footer-bottom .footer-social {
        display: flex;
        flex-direction: column;
        gap: 1.6rem;
        position: absolute;
        right: 0;
        top: 50%;
        transform: translateY(-50%);
    }
    .footer-bottom {
        justify-content: center;
    }
    .footer-link {
        margin-bottom: 5.2rem;
    }
    .new-skill-sec {
        height: 128rem;
        display: flex;
        align-items: flex-end;
        background-image: url(../img/new-skill-bg-2.jpg);
        background-position: top center;
        background-size: cover;
        background-repeat: no-repeat;
        padding-bottom: 5rem;
    }
    .new-skill-content {
        max-width: 100%;
    }
    .modal-design button.btn-close {
        top: auto;
        right: 50%;
        bottom: -6rem;
        transform: translateX(50%);
    }
    .modal-design .modal-video {
        padding: 0;
    }
    .courses-bottom-content {
        max-width: calc(100% - 2.4rem);
        width: 100%;
    }
    .courses-bottom-content p {
        font-size: 1.8rem;
    }
    
}
@media (max-width:576px) {
    html{
        font-size: 1.9vw;
    }
    .container{
        padding: 0 24px;
    }
    .header-menu ul li a{
        font-size: 2rem;
    }
    .banner-sec {
        height: 106rem;
    }
    .banner-content h1 {
        font-size: 3.9rem;
        font-weight: 600;
        line-height: 1.5;
    }
    .banner-content p {
        font-size: 2.1rem;
        font-weight: 500;
    }
    .how-help-box {
        min-height: auto;
        /* width: 80%; */
        margin: auto;
    }
    .how-help-box h3 {
        font-size: 2.2rem;
    }
    .how-help-box p {
        font-size: 1.8rem;
    }
    .pricing-head {
        flex-direction: column;
        gap: 1rem;
        padding-bottom: 1rem;
    }
    .pricing-head h3 {
        font-size: 2.2rem;
    }
    .pricing-feature li {
        font-size: 1.9rem;
    }
    .pricing-feature h4 {
        font-size: 2rem;
    }
    .pricing-feature li img {
        width: 3.3rem;
    }
    .pricing-feature .primary-btn span:last-child {
        transform: translateX(-75%);
    }
    .pricing-feature .primary-btn:hover span:last-child {
        transform: translateX(-95%);
    }
    .pricing-feature .primary-btn:hover span:first-child {
        transform: translateX(0);
    }
    .featured-logo .featured-2 {
        width: 20rem;
    }
    .featured-logo .featured-1 {
        width: 8.3rem;
    }
    .featured-logo .featured-3 {
        width: 9.5rem;
    }
    .courses-bottom-content p {
        font-size: 2.3rem;
    }
    .new-skill-sec {
        height: 112rem;
    }
    .new-skill-content h2 {
        font-size: 3.5rem;
        line-height: 4.6rem;
        font-weight: 600;
    }
    .new-skill-content p {
        font-size: 2.1rem;
    }
    .course-hover-text{
        top: 0;
        left: 0;
        bottom: 0;
        right: 0;
        height: 100%;
    }
    .course-hover-text a {
        opacity: 0;
        height: 100%;
        width: 100%;
    }
    .course-hover-text a {
        font-size: 1.8rem;
        font-weight: 700;
        color: var(--white) !important;
        display: block;
        height: 100%;
    }
    .courses-box:hover .course-hover-text {
        bottom: 0;
        opacity: 1;
    }
    .how-help-box {
        height: 20rem;
    }
    .how-help-slider .owl-stage{
        padding-left: 0 !important;
        padding-right: 3rem !important;
    }
    .courses-slider .owl-stage{
        padding-left: 3rem !important;
        padding-right: 3rem !important;
    }
    .courses-sec .container{
        padding: 0;
    }

    .certification-title h2 {
        font-size: 3.5rem;
        line-height: 4.6rem;
        font-weight: 600;
    }
    .certification-content p {
        font-size: 2.1rem;
    }

    .miss-out-sec .section-title p {
        font-size: 2.1rem;
    }
    .miss-slider-content h3 {
        font-size: 2.4rem;
        line-height: 1.5;
    }
    .miss-slider-content p {
        font-size: 1.6rem;
    }
    .section-title h2 {
        font-size: 2.9rem;
        line-height: 1.5;
    }
    .exceptional-sec .section-title p {
        max-width: 100%;
        font-size: 2.2rem;
    }
    .exceptional-box li p {
        font-size: 2rem;
    }
    .exceptional-box li img {
        width: 3.3rem !important;
    }
    .exceptional-bottom p {
        font-size: 2.2rem;
    }
}