/* Adding Responsive Utilities */
@media (max-width: 2000px) {
    :root {
        --fs-base: 9px;
    }
  }
  
  @media (max-width: 1900px) {
    body {
        font-size: 10px;
    }
  }
  
  @media (max-width: 1000px) {
    body {
        font-size: 8px;
    }
  }
  
  @media (max-width: 470px) {
      .footer .mob-nav ul li {
          margin-left: 0;
          margin-right: 5px;
      }
  
      .footer-products a {
          width: 100%;
      }
      
      .footer-products img {
          margin-right: 0;
          margin-left: 0;
      }
  
  }
  
  @media (max-width: 768px) {
    h1, .hero-headline {
        font-size: calc(var(--fs-hero-headline) * 0.8);
    }
  
    h2, .subheading, .card-heading {
        font-size: calc(var(--fs-subheading-card-heading) * 0.8);
    }
  
    .section-heading-medium {
        font-size: calc(var(--fs-section-medium) * 0.8);
    }
  
    .section-heading-small {
        font-size: calc(var(--fs-section-small) * 0.8);
    }
  
    .mitsy.meedanimate {
        flex-direction: column;
    }
  
    .mitsy.meedanimate img {
        width: 80% !important;
        margin: 0 auto;
    }
  
    .slider {
        height: 300px;
    }
  }
  
  @media (max-width: 900px) {
  
    .footer .mob-nav .drop-box {
          position: absolute !important;
          left: 30px;
          bottom: auto;
          height: auto;
          top: 0;
      }
  
      section.about-charactor-sc.contact form div div.form-head {
          margin-top: 0;
          padding: 0;
      }
  
    .product-section {
        padding: 0 !important;
    }
    
    .slider {
        height: 100%;
        padding: 30px 0 80px;
    }
    
    .controls {
        top: 89%;
    }
  
    .sidenav {
        padding-top: 15px;
    }
  
    .sidenav a {
        font-size: 18px;
    }
  
    .container {
        max-width: 100%;
        padding: 0 1rem;
    }
  
    .hero {
        flex-wrap: wrap;
        width: 100%;
        z-index: 100;
    }
  
    .hero-img img {
        height: 265px;
    }
  
    header > ul {
        display: none;
    }
  
    .product-card, .ecosystem {
        flex-wrap: wrap-reverse;
        width: 100%;
    }
  
    .product-card-content,.product-card-img {
        width: 100%;
        padding: 0;
    }
  
    .product-card {
        height: 37em;
    }
  
    .product-card-img img {
        height: auto;
        width: 75%;
    }
  
    .product-section {
        padding: 60px 0px;
    }
  
    .slider {
        border: none;
    }
  
    .offer-card {
        flex-wrap: wrap;
        padding: 10.625em 0;
    }
  
    body {
        font-size: 7px;
    }
  
    .offer-card .card {
        width: 100%;
        margin-bottom: 20px;
        height: auto;
    }
  
    .offer-card .card img {
        height: 12.625em;
    }
  
    .ecosystem img {
        width: 100%;
        height: auto;
        margin-top: 30px;
    }
  
    .for-mobile {
        display: block;
    }
  
    .for-desktop {
        display: none;
    }
  
    .opennv {
        color: #fff;
        font-size: 29px;
        position: absolute;
        right: 23px;
        top: 25px;
    }
  
    .footer {
        flex-wrap: wrap;
    }
  
    .footer-nav {
        width: 50%;
    }
  
    .footer-products {
        width: 50%;
        text-align: right;
    }
  
    .footer-social {
        width: 100%;
        margin-top: 18px;
    }
  
    .social-links {
        padding-bottom: 0px !important;
    }
  
    .ac-img img {
        height: auto;
        width: 100%;
    }
  
    img.fl-1 {
        width: 26%;
        top: 13px;
    }
  
    img.fl-2 {
        width: 26%;
        bottom: 13px;
    }
  
    .abt-sc {
        flex-wrap: wrap;
    }
  
    section.about-sc {
        height: auto;
        padding-top: 30px;
    }
  
    .abt-cont {
        width: 100%;
        padding: 15px;
    }
  
    .abt-img {
        width: 100%;
        position: relative;
        height: auto;
        text-align: center;
    }
  
    .abt-img img {
        position: initial;
        height: auto;
        width: 50%;
    }
  
    section.about-charactor-sc.contact .form-section {
        padding: 15px;
        border-radius: 10px;
        background: var(--color-footer-blue);
    }
  
    section.about-charactor-sc.contact form div.split-1, section.about-charactor-sc.contact form div.split-2, section.about-charactor-sc.contact form div.split-3 {
        display: flex;
        flex-wrap: wrap;
        margin: 10px 0px;
    }
  
    section.about-charactor-sc.contact form input {
        color: var(--color-footer-blue);
        font-family: var(--font-section-small);
        width: 100%;
        padding: 5px;
        font-size: 1em;
    }
  
    section.about-charactor-sc.contact form div.split-2 textarea {
        font-size: 1em;
    }
  
    section.about-charactor-sc.contact form .split-3 input {
        font-weight: 600;
    }
  
    .team-inner-sc {
        justify-content: center !important;
        width: 100%;
        padding: 15px 15px;
        flex-direction: column;
        text-align: center;
    }
  
    .our-img {
        margin-right: 21px;
    }
  
    .team-head .team-inner-sc {
        width: 100%;
    }
  
    img.fl-3 {
        width: 30%;
        bottom: 18px;
        top: auto;
    }
  
    .req-main {
        flex-wrap: wrap;
    }
  
    .req-content {
        width: 96%;
    }
  
    .req-hd a {
        margin-right: 20px;
    }
  
    .req-hd .prime-btn {
        width: auto;
    }
  
    .req-img img {
        height: 100px;
        margin-bottom: 22px;
    }
  
    .labe-sc {
        flex-wrap: wrap;
    }
  
    .labe-sc h2 {
        margin: 0;
        line-height: normal;
        margin-bottom: 36px;
        text-align: center;
    }
  
    .labe-sc {
        flex-wrap: wrap;
        padding: 0px 10px;
    }
  
    section.label-main {
        padding: 50px 0px;
    }
  
    .bdg-inner-box {
        flex-wrap: wrap;
    }
  
    .bg-box {
        width: 100%;
        margin: 0px auto;
        margin-bottom: 15px;
    }
  
    .bdg-main {
        flex-wrap: wrap;
    }
  
    .bdg-img {
        margin: 0px auto;
    }
  
    .badge-sc {
        padding: 10px 15px;
    }
  
    .bdg-img img {
        height: 210px;
        margin-bottom: 23px;
    }
  }

  @media only screen and (min-width: 768px) and (max-width: 1000px)
    {
      section.about-sc {
            padding-bottom: 0px;
            overflow: hidden;
            height: 200px;
        }

        .abt-cont {
            width: 600px;
        }

        .abt-sc h2 {
            font-size: 2.5rem;
        }
        .abt-img {
            width: 650px;
            top: 0px;
            left: 25px;
        }
        .abt-bread ul li a {
            font-size: 1.4rem;
        }

        header .for-desktop ul li a {
            font-size: 0.99rem;
        }
    }

  /* for ipad mini  */
  @media only screen and (min-width: 768px) and (max-width: 1300px) 
   {
    header ul li a {
        font-size: 1.25rem;
    }

    header ul li {
        margin: 0 1rem;
    }
       
   img.fl-1, img.fl-2, img.fl-3 {
        opacity: 0.5;
    }  
    
    .hero {
        flex-wrap: nowrap;
    }
  
    .hero h1 {
        text-align: left;
    }
  
    .hero h3 {
        text-align: left;
    }
  
    .product-card-content, .product-card-img {
        width: 55%;
    }
  
    .offer-card .card {
        width: 30%;
        margin: 10px;
    }
  
    .product-card, .ecosystem {
        width: 50%;
    }
  
    .ecosystem img {
        width: 50%;
        margin-top: 0px;
        height: auto;
    }
  
    .ecosystem {
        flex-wrap: nowrap;
        width: 100%;
    }
  
    .ecosystem h3 {
        text-align: left;
    }
  
    .footer-products {
        width: 38%;
    }
  
    .footer-products img {
        margin: 10px 35px;
        height: auto;
        width: fit-content !important;
    }
  
    .product-card {
        width: 100%;
    }
  
    .abt-sc {
        flex-wrap: nowrap;
    }
  
    .abt-img {
        height: 187px;
    }
  
    .ac-img img {
        height: 350px;
        width: auto;
    }
  
    section.about-sc {
        padding-bottom: 0px;
        overflow: hidden;
        height: 250px;
    }
  
    .abt-img img {
        position: absolute;
        height: auto;
        width: 100%;
        right: -15px;
        bottom: -23%;
    }
  
    .req-img {
        text-align: center;
    }
  
    .req-hd {
        justify-content: center;
    }
  
    section.api-req {
        padding: 50px 0px;
    }
  
    .labe-sc h2 {
        font-size: 37px;
        margin-bottom: 20px !important;
        line-height: normal;
    }
  
    .req-main p {
        text-align: center;
    }
  
    section.api-req.faq-sc p {
        text-align: right;
    }
  
    .bdg-inner-box {
        flex-wrap: nowrap;
    }
  
    .bg-box {
        margin: 10px;
    }
  
    section.badges-sc {
        padding: 60px 0px;
    }
  
    .badge-sc h2 {
        text-align: center;
    }
  
    .container,.hero {
        width: 100%;
        padding: 0 2rem;
    }
  
    .tagline h2 {
        line-height: normal;
    }
  
    header ul li:last-child a {
        width: 154px;
        text-align: center;
        padding: 13px;
    }
  
    section.about-sc.onchain .abt-img img {
        bottom: -46%;
        right: -6px;
    }
  }
  
  /* Styles for iPad Pro specifically */
  @media only screen and (device-width: 1024px) and (device-height: 1366px) and (-webkit-min-device-pixel-ratio: 2) {
    .abt-img img {
        width: 136%;
        right: -73px;
        bottom: -66%;
    }
  
    .footer-products {
        width: 26%;
    }
  
    .team-head .team-inner-sc {
        justify-content: center;
    }
  
    .abt-img {
        height: 223px;
    }
  
    .bdg-img {
        margin-right: 30px;
    }
  
    .bdg-img img {
        height: auto;
        width: 100%;
    }
  
    section.about-sc {
        height: auto;
        padding-top: 30px;
    }
  
    .onchain .abt-cont {
        padding-top: 31px;
    }
  }
  
  /* New Landing page only */

  @media (max-width: 1500px) {
    .lp.hero-bg .hero {
    }
    
    .lp.section2 h2 {
        /* font-size: 3.7vw; */
    }
    
    .lp.section2 .content-left-para p:first-child {
        padding-right: 2vw;
    }
    
    .lp.section2 .content-right-cta button {
        display: block;
        /* margin-top: 0; */
        padding: 0;
    }
    
    .lp.section3 h4 {
        font-size: 2.7rem;
    }
    
    .lp.section3 h2 {
        font-size: 2.2rem;
    }
    
    .lp.section3 .content-middle .content-left {
        padding-right: 4vw;
    }
    
    .lp.section4 .content-top h2 {
        font-size: 4.2rem;
        line-height: 4.2rem;
    }
    
    .lp.section7 .content-container .content-left {
        padding-right: 7vw;
    }
    
    .lp.section7 .content-container .content-right img {
        padding-top: 1vw;
    }
  }
@media (max-width: 1450px){
    .lp.section4 .content-top h2 {
        font-size: 4rem;
        line-height: 4rem;
    }

}
  @media (max-width: 1599px){
    .lp .container {
        padding: 0 5rem;
    }

  }

  @media  (max-width: 1000px) {
    
    .lp.hero-bg.grad1 {
        padding: 5rem 0;
    }
    
    .lp.hero-bg .hero > div {
        width: 80%;
    }
    
    .lp.hero-bg .hero > div h3 {
        font-size: 1.5rem;
    }
    
    .lp.section2 {
        padding: 5rem 0;
    }
    
    .lp.section2 .content-left {
        width: 100%;
    }
    
    .lp.section2 .content-right {
        width: 100%;
    }
    
    .lp .container {
        flex-direction: column;
        padding: 0 3rem;
    }
    
    .lp.section2 h2 {
        font-size: 3rem;
        line-height: 3rem;
    }
    
    .lp.section2 .content-left-para p {
        padding: 0;
    }
    
    .lp.section2 .content-left-para {
        padding-bottom: 2rem;
    }
    
    .lp.section2 .content-right-cta button {
        margin: 1rem 0;
    }
    
    .lp p {
        font-size: 1.2rem;
        line-height: 1.4rem;
    }
    
    .lp li {
        font-size: 1.2rem;
        line-height: 1.4rem;
    }
    
    .lp.section3 h2 {
        width: 500px;
        font-size: 1.8rem;
        padding-bottom: 2rem;
    }

    .lp.section3 .content-middle .content-right {
        margin-top: 4.5rem;
    }
    
    .lp.section4 .content-middle .content-left p {
        padding-right: 0.5rem;
    }
    
    .lp.section4 .content-top h2 {
        font-size: 2.2rem;
    }
    
    .lp.section4 .content-top img {
        width: 100%;
    }
    
    .lp.section5 .container .content-left, .lp.section5 .container .content-right {
        width: 100%;
    }
    
    .lp.section5 .container .content-left > div img {
        width: 70%;
    }
    
    .lp.section5 .container .content-left > div {
        text-align: center;
        margin-bottom: 4rem;
    }
    
    .lp.section6 .content-container .content-right {
        padding-top: 7rem;
    }
    
    .lp.section6 h2 {width: 500px;padding-bottom: 2rem;}
    
    .lp.section6 .content-bottom {
        padding-top: 2rem;
    }
    
    .lp.section7 .content-top h2 {
        padding-top: 1.6rem;
    }
    
    .lp.section7 .content-container {
        flex-direction: column;
    }
    
    .lp.section7 .content-container .content-left {
        width: 100%;
        padding: 0;
    }
    
    .lp.section7 .content-container .content-left, .lp.section7 .content-container .content-right {
        width: 100%;
    }
    
    .lp.section7 .content-container .content-right .content-right-image {
        padding-top: 2rem;
    }
    
    .lp.section4 .content-middle .content-left, .lp.section4 .content-middle .content-right {
        width: 100%;
    }
    
    .lp.section4 .content-middle {
        flex-direction: column;
    }
    
    .lp.section4 .content-middle .content-right > div {
        padding-bottom: 0;
    }
    
    .lp.section3 img {
        max-width: 300px;
    }
    
    .lp.section3 h4 {
        font-size: 1.7rem;
    }
    
    .lp.section2 img {
        max-width: 300px;
        width: 100%;
    }
    
    .lp.section4 button {
    }
    
    .lp button {
        margin-top: 1rem;
    }
    
    .lp.section5 .container .content-right div img {
        max-width: 300px;
    }

  }

  @media (max-width: 600px){
    .lp.section3 h2 {
        width: 90vw;
        font-size: 1.8rem;
        padding-bottom: 2rem;
    }

    .lp.section3 .content-middle .content-right {
        margin-top: 6.5rem;
    }

    .lp.section7 .content-top h2 {
        padding-top: 2.5rem;
    }
  }

  @media (max-width: 500px){
    .lp .container {
        flex-direction: column;
        padding: 0 1rem;
    }

    .lp h1 {
        font-size: 1.6rem !important;
        line-height: 1.8rem !important;
    }

    .lp h3 {
        font-size: 1.4rem !important;
        line-height: 1.6rem !important;
    }
    
    .lp h2 {
        font-size: 1.5rem !important;
        line-height: 2.2rem !important;
    }

    .lp.section3 h2 {
        width: 90vw;
        padding-bottom: 2rem;
    }

    .lp.section3 .content-middle .content-right {
        margin-top: 4.5rem;
        margin-top: calc(100vh/10);
    }

    .lp.section6 h2 {
        width: 300px;
        padding-bottom: 2rem;
    }

    .lp.section7 .content-top h2 {
        padding-top: 2.5rem;
    }
  }