@media only screen and (max-width: 1280px) and (min-width: 1200px) {

      /* hero css start */
      .grid-hero {
            display: grid;
            grid-template-columns: 54.668% 41.332%;
            column-gap: 45px;
      }

      .hero-content .hero-content-title {
            font-size: 64px;
            letter-spacing: -2px;
            line-height: 78px;
      }

      .companies-slider-main::after {
            top: -40%;
      }

      /* hero css end */
}

@media (max-width:1024px) {
      /* hero css start */

      .hero-main-content {
            padding: 80px 0px;
      }

      .grid-hero {
            grid-template-columns: 1fr 464px;
            column-gap: 30px;
      }

      .hero-content .hero-content-title {
            font-size: 51px;
            letter-spacing: -1px;
            line-height: 68px;
      }

      .logo-header {
            margin-left: -20px;
      }

      .nav-header-inner .nav-header-list {
            margin-right: 20px;
      }

      /* hero css end */
}

@media (max-width: 991px) {
      /*  mobile menu CSS start */

      .nav-header-inner .nav-header-list {
            margin-right: 0px;
      }

      .box-menu-mobile {
            align-items: center;
            background: transparent;
            display: flex;
            flex-direction: column;
            justify-content: center;
            padding: 5px 10px;
            border: 1px solid var(--WhiteColor);
            border-radius: 8px;
            -webkit-border-radius: 8px;
            -moz-border-radius: 8px;
            -ms-border-radius: 8px;
            -o-border-radius: 8px;
      }

      .box-menu-mobile .menu-btn {
            background: transparent;
            border: 0;
            box-shadow: none;
            outline: none;
      }

      .redirect-logo .logo-header-img {
            max-width: 155px;
            height: 75px;
      }

      .menu-btn .menu-icon {
            height: 16px;
            width: 19px;
            object-fit: contain;
      }

      .logo-header {
            margin-left: -20px;
      }

      .nav-header-inner {
            position: fixed;
            z-index: 2;
            left: -260px;
            top: 0;
            max-width: 250px;
            width: 100%;
            background: var(--SecondaryColor);
            bottom: 0;
            box-shadow: 0px 2px 10px 2px #00000026;
            padding: 20px 0px;
            transition: 0.5s all ease-in-out;
            -webkit-transition: 0.5s all ease-in-out;
            -moz-transition: 0.5s all ease-in-out;
            -ms-transition: 0.5s all ease-in-out;
            -o-transition: 0.5s all ease-in-out;
      }

      .nav-header-inner.active {
            left: 0px;
      }

      .nav-header-inner .nav-header-list {
            flex-direction: column;
            align-items: start;
            gap: 0px;
            max-height: calc(100vh - 70px);
            overflow: auto;
      }

      .nav-header-inner .nav-header-list li {
            width: 100%;
            padding: 12.5px 20px;
      }

      .nav-header-inner .nav-header-list li a {
            width: 100%;
            display: flex;
      }

      .nav-head-listitem .redirect-navitem::after {
            display: none;
      }

      .overlay-mobile-show {
            background: #0000004a;
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            z-index: 2;
            display: none;
            transition: 0.5s all ease-in-out;
      }

      .mobile-logo-header {
            display: flex;
      }

      .overlay-mobile-show.active {
            display: block;
      }

      .remove-menu-responsive {
            display: flex;
            justify-content: end;
      }

      .mobile-flex-justify {
            display: flex;
            align-items: center;
            justify-content: space-between;
            padding: 0px 20px 20px 20px;
      }

      .mobile-logo-header .logo-header-img {
            height: 41px;
      }

      .remove-menu-responsive .btn-close-icons {
            height: 30px;
            width: 30px;
            background: transparent;
            border: none;
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            border: 1px solid var(--WhiteColor);
            border-radius: 8px;
            -webkit-border-radius: 8px;
            -moz-border-radius: 8px;
            -ms-border-radius: 8px;
            -o-border-radius: 8px;
      }

      .remove-menu-responsive .btn-close-icons .close-icons {
            height: 20px;
            width: 20px;
            filter: brightness(0) saturate(100%) invert(99%) sepia(99%) saturate(0%) hue-rotate(44deg) brightness(112%) contrast(101%);
            -webkit-filter: brightness(0) saturate(100%) invert(99%) sepia(99%) saturate(0%) hue-rotate(44deg) brightness(112%) contrast(101%);
      }

      .header-override {
            overflow: hidden;
      }

      /*  mobile menu CSS start */

      /* hero CSS start */

      .grid-hero {
            grid-template-columns: 1fr 1fr;
            column-gap: 30px;
      }

      .hero-main-content,
      .enabled-content-details,
      .discover-content-details,
      .birthday-content-details,
      .faq-main-content,
      .firstknow-main {
            padding: 50px 0px;
      }

      .hero-content .hero-content-title {
            font-size: 38px;
            letter-spacing: -1px;
            line-height: 50px;
      }

      .hero-content .hero-subtitle {
            font-size: 18px;
            line-height: 28px;
            margin-bottom: 14px;
      }

      .hero-description-details p {
            font-size: 15px;
            line-height: 23px;
            margin-bottom: 20px;
      }

      .hero-description-details {
            margin-bottom: 30px;
      }

      .hero-comming-store p {
            font-size: 14px;
            margin-bottom: 10px;
      }

      /* hero CSS end */

      /* conpanies CSS start */

      .companies-slider-main::after {
            top: -40%;
      }

      /* companies CSS end */

      /* discover CSS start */

      .discover-heading {
            max-width: 700px;
            margin: 0 auto 50px auto;
      }

      .discover-heading .discover-heading-title,
      .discover-heading .discover-heading-title span,
      .faq-heading .faq-heading-title {
            font-size: 38px;
            line-height: 41px;
      }

      .discover-content-details {
            padding: 50px 0px 0px 0px;
      }

      /* discover CSS end */

      /* faq CSS start */

      .faq-heading {
            margin-bottom: 50px;
      }

      /* faq CSS end */

      /* firstknow CSS start */

      .first-mobile-img .firstknow-img {
            height: 579px;
            min-height: unset;
      }

      .grid-firstknow {
            grid-template-columns: 1.3fr 1fr;
            gap: 30px;
      }

      .first-know-contain .first-know-heading {
            font-size: 31px;
      }

      .first-know-contain {
            margin-left: 1px;
      }

      /* firstknow CSS end */
}


@media (max-width: 767px) {

      /*  hero CSS start */

      .grid-hero {
            grid-template-columns: 1fr;
            row-gap: 30px;
            column-gap: 0px;
      }

      .hero-content .hero-content-title {
            font-size: 45px;
            line-height: 61px;
      }

      .hero-description-details p {
            margin-bottom: 20px;
      }

      /*  hero CSS end */

      /* enabled CSS start */

      .enabled-content-details br,
      .max-birthday-details p br,
      .first-know-subtitle br {
            display: none;
      }

      /* enabled CSS end */

      /* discover CSS start */

      .discover-heading .discover-heading-title,
      .discover-heading .discover-heading-title span,
      .faq-heading .faq-heading-title {
            font-size: 31px;
            line-height: 46px;
      }

      .discover-heading {
            margin-bottom: 50px;
      }

      .discover-item-card {
            padding: 32px 15px;
      }

      .discover-grid.row .col-xl-4.col-lg-4.col-md-6.col-sm-12.col-12 .discover-details .disover-desc {
            max-width: 100%;
      }

      /* discover CSS end */

      /* faq CSS start */

      .faq-heading .faq-heading-title {
            margin-bottom: 15px;
      }

      .faq-accordion-details .accordion .accordion-item .accordion-button {
            padding: 16px 15px;
      }

      .faq-accordion-details .accordion .accordion-item .accordion-body {
            padding: 0px 15px 16px 15px;
      }

      /* faq CSS end */

      /* firstknow CSS start */

      .grid-firstknow {
            grid-template-columns: 1fr;
            gap: 30px;
      }

      .first-mobile-img .firstknow-img {
            min-height: unset;
            height: 598px;
      }


      .firstknow-main .max-first-know {
            padding-left: 2px;
      }

      .first-know-contain .first-know-heading {
            font-size: 29px;
            line-height: 35px;

      }

      /* firstknow CSS end */

      /* footer CSS start */

      .nav-footer-listing .list-nav {
            column-gap: 20px;
            flex-wrap: wrap;
            row-gap: 10px;
      }

      .footer-center-content .footer-logo-details .redirect-footer-logo {
            max-width: 100%;
            height: 130px;
      }
}

@media (max-width: 575px) {
      .hero-content .hero-content-title {
            font-size: 39px;
            line-height: 56px;
      }
}

@media (max-width: 391px) {

      /* hero CSS start */

      .hero-description-details {
            margin-bottom: 30px;
      }

      .hero-content .hero-content-title {
            font-size: 41px;
            line-height: 55px;
      }

      .hero-comming-store p {
            font-size: 15px;
            line-height: 18px;
            margin-bottom: 10px;
      }

      .hero-bg-main .hero-main-img {
            min-height: 367px;
      }

      /* Hero CSS end */

      /* enabled CSS start */

      .max-enabled-details p,
      .max-birthday-details p {
            font-size: 22px;
            line-height: 31px;
      }

      /* enabled CSS end */

      /* discover CSS start */

      .discover-heading .discover-heading-title,
      .discover-heading .discover-heading-title span,
      .faq-heading .faq-heading-title {
            font-size: 29px;
            line-height: 39px;
      }

      /* discover CSS end */

      /* faq CSS start */

      .faq-accordion-details .accordion .accordion-item .accordion-button {
            font-size: 16px;
            line-height: 25px;
      }

      /* faq CSS end */

      /* footer CSS start */

      .copyright-footer .copyright-title {
            font-size: 12px;
            line-height: 27px;
      }

      /* footer CSS end */
}

@media (max-width: 367px) {
      .hero-content .hero-content-title {
            font-size: 36px;
            line-height: 50px;
            letter-spacing: -1px;
      }

      .discover-heading .discover-heading-title,
      .discover-heading .discover-heading-title span,
      .faq-heading .faq-heading-title {
            font-size: 27px;
            line-height: 36px;
      }

}

@media (max-width: 345px) {

      /* enabled and birthday CSS start */

      .max-enabled-details p,
      .max-birthday-details p {
            font-size: 19px;
            line-height: 27px;
      }

      /* enabled and birthday CSS end */

      /* faq and discover CSS start */

      .discover-heading .discover-heading-title,
      .discover-heading .discover-heading-title span,
      .faq-heading .faq-heading-title {
            font-size: 24px;
            line-height: 35px;
      }

      /* faq and discover CSS end */
}

@media (max-width: 321px) {

      /* hero CSS start */

      .hero-content .hero-content-title {
            font-size: 31px;
            line-height: 40px;
      }

      .hero-content .hero-subtitle {
            font-size: 15px;
            line-height: 23px;
            margin-bottom: 12px;
      }

      .hero-description-details p {
            font-size: 14px;
            line-height: 23px;
      }

      .hero-main-content,
      .enabled-content-details,
      .discover-content-details,
      .birthday-content-details,
      .faq-main-content,
      .firstknow-main {
            padding: 35px 0px;
      }

      /* hero CSS end */


}