/*
* Prefixed by https://autoprefixer.github.io
* PostCSS: v8.4.14,
* Autoprefixer: v10.4.7
* Browsers: last 5 version
*/

/*
* Prefixed by https://autoprefixer.github.io
* PostCSS: v8.4.14,
checkbox-section* Autoprefixer: v10.4.7
* Browsers: last 5 version
*/

/*
    * Prefixed by https://autoprefixer.github.io
    * PostCSS: v8.4.14,
    * Autoprefixer: v10.4.7
    * Browsers: last 5 version
    */


    .round-btn {
      height: 2.5rem;
      width: 2.5rem;
      background: black !important;
      border-radius: 50%;
      border: 0.125rem solid white;
      margin-top: 0.625rem;
      position: absolute !important;
      right: 2%;
      cursor: pointer !important;
    }

    html {
      scroll-behavior: smooth;
    }
    body{
        overflow-x: hidden !important;
        margin: 0 !important;
          padding: 0 !important;

    }


    .contact-head-main-left {
      font-size: 50px !important;
      line-height: 120% !important;
      font-weight: 400 !important;
      font-family: GalliardStd !important;
      margin-bottom: 45px !important;
    }

    @media only screen and (min-width: 64.0625rem) {
      .main-c {
        overflow-x: hidden;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
      }

      .scroll-now {
        min-width: 100vw !important;
        min-height: 100vh !important;
      }
    }

    .h1,
    .h2,
    .h3,
    .h4,
    .h5,
    .h6,
    h1,
    h2,
    h3,
    h4,
    h5,
    h6 {
      font-family: GalliardStd !important;
      line-height: 1.15;
    }

    p {
      font-family: NeueHaasUnica !important;
      font-weight: 400;
      font-size: 1.375rem;
      color: #5b5b5b;
    }

    .display-flex {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
    }

    a {
      cursor: pointer !important;
    }

    .footer_link_title {
      font-size: 22px;
    }

    .link-footer {
      font-size: 18px;
      line-height: 150%;
    }

    .link-footer:hover {
      text-decoration: underline;
    }

    .span-link-footer a:hover {
      text-decoration: underline;
    }

    .galli {
      font-family: GalliardStd !important;
    }

    .neu {
      font-family: NeueHaasUnica !important;
    }

    .btn-span {
      height: 2.5rem !important;
      width: 2.5rem !important;
    }

    .footer-main {
      padding: 3rem;
      position: relative;
      min-height: 100vh;
    }

    .about-col-head23 {
      font-size: 24px;
      margin-bottom: 95px;
      font-weight: 400;
      font-family: GalliardStd !important;
      line-height: normal;
    }

    .abv-links {
      position: absolute;
      bottom: 50px;
      width: 100%;
      float: left;
      padding: 0 50px;
      left: 0;
    }

    .font-30 {
      font-size: 2.1875rem;
      font-weight: 600 !important;
    }

    .font-50 {
      font-size: 50px;
      font-weight: 600 !important;
    }

    .footer-text {
      margin-top: 2rem;
      width: 44%;
      font-size: 1.125rem;
      color: #e7e7e7;
      line-height: 150%;
      font-weight: 200;
    }

    .footer-logo {
      height: 5rem;
      width: 5rem;

      position: absolute;
      right: 0;
      top: 0;
    }

    .footer_links_container {
      width: 100%;
      background: black;
      padding-left: 1.875rem;
      padding-right: 1.875rem;
      position: relative;
      bottom: 1.875rem;
    }

    .footer_grid {
      -webkit-text-size-adjust: 100%;
      --black: #181818;
      --smoke: #eee;
      --kl-reviews-color-light-gray: #e9e9eb;
      --swiper-pagination-bottom: 0;
      -webkit-font-smoothing: antialiased;
      font-family: Soehne web leicht, sans-serif;
      font-size: 0.9375rem;
      line-height: 150%;
      font-weight: 200;
      color: #fff;
      -webkit-box-sizing: border-box;
      box-sizing: border-box;
      grid-row-gap: 1rem;
      grid-auto-columns: 1fr;
      display: -ms-grid;
      display: grid;
      width: 100%;
      grid-column-gap: 1.5625rem;
      -ms-grid-rows: auto;
      grid-template-rows: auto;
      -ms-grid-columns: 1fr 1.5625rem 1fr 1.5625rem 1fr 1.5625rem 1fr 1.5625rem 1fr 1.5625rem 1fr 1.5625rem 1fr 1.5625rem 1fr 1.5625rem 1fr 1.5625rem 1fr 1.5625rem 1fr 1.5625rem 1fr;
      grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
    }

    .footer_grid>*:nth-child(1) {
      -ms-grid-row: 1;
      -ms-grid-column: 1;
    }

    .footer_grid>*:nth-child(2) {
      -ms-grid-row: 1;
      -ms-grid-column: 3;
    }

    .footer_grid>*:nth-child(3) {
      -ms-grid-row: 1;
      -ms-grid-column: 5;
    }

    .footer_grid>*:nth-child(4) {
      -ms-grid-row: 1;
      -ms-grid-column: 7;
    }

    .footer_grid>*:nth-child(5) {
      -ms-grid-row: 1;
      -ms-grid-column: 9;
    }

    .footer_grid>*:nth-child(6) {
      -ms-grid-row: 1;
      -ms-grid-column: 11;
    }

    .footer_grid>*:nth-child(7) {
      -ms-grid-row: 1;
      -ms-grid-column: 13;
    }

    .footer_grid>*:nth-child(8) {
      -ms-grid-row: 1;
      -ms-grid-column: 15;
    }

    .footer_grid>*:nth-child(9) {
      -ms-grid-row: 1;
      -ms-grid-column: 17;
    }

    .footer_grid>*:nth-child(10) {
      -ms-grid-row: 1;
      -ms-grid-column: 19;
    }

    .footer_grid>*:nth-child(11) {
      -ms-grid-row: 1;
      -ms-grid-column: 21;
    }

    .footer_grid>*:nth-child(12) {
      -ms-grid-row: 1;
      -ms-grid-column: 23;
    }

    .threeblk-margin{
      margin-bottom: 82px !important;
    }


    .testimonial-mtext {
      font-size: 30px;
      line-height: 130%;
      margin-top: 40px !important;
      margin-bottom: 16px !important;
    }

    .testimonial-mtext-pd {
      font-size: 30px;
      line-height: 140%;
      color: #181818 !important;
      text-align: center;
      font-family: NeueHaasUnica !important;
    }

    .testimonial-clientdt {
      font-size: 18px;
      line-height: 150%;
      color: #5b5b5b !important;
    }

    .telp {
      -webkit-text-size-adjust: 100%;
      --black: #181818;
      --smoke: #eee;
      --kl-reviews-color-light-gray: #e9e9eb;
      --swiper-pagination-bottom: 0;
      -webkit-font-smoothing: antialiased;
      font-family: Soehne web leicht, sans-serif;
      font-size: 0.9375rem;
      line-height: 150%;
      font-weight: 200;
      color: #fff;
      -webkit-box-sizing: border-box;
      box-sizing: border-box;
      grid-area: span 1 / span 2 / span 1 / span 2;
    }

    .white-logo {
      visibility: visible;
    }

    .menuHeader {
      color: black !important;
    }

    .hd-top {
      background: transparent;
      padding-top: 1.8125rem !important;
    }

    .hd-top a {
      font-family: NeueHaasUnica !important;
      font-size: 1.125rem;
      font-weight: 400;
    }

    .hlink-margin {
      margin: 0px 34px;
      padding: 0 !important;
      width: -webkit-min-content !important;
      width: -moz-min-content !important;
      width: min-content !important;
    }

    .green-header {
      position: relative;
      left: 0;
      background-color: #000000;
      font-size: 1.125rem;
      padding: 4px 0px 1px 0px;
      line-height: 1.2 !important;
      font-weight: 500 !important;
    }

    .proj-c:hover .view-all-btn {
      padding: 0rem 1.0725rem 0.0625rem 1.0725rem;
      border: 0.0625rem solid white;
      border-radius: 1.25rem;
      margin: 0rem 0.375rem;
      background: #eeeeee !important;
      color: black !important;
      -webkit-transition: all 0.3s ease-in-out;
      -o-transition: all 0.3s ease-in-out;
      transition: all 0.3s ease-in-out;
    }

    .proj-c:hover .h-black {
      color: black !important;
    }

    .view-proj-text:hover .view-all-btn {
      padding: 0rem 1.0725rem 0.0625rem 1.0725rem;
      border: 0.0625rem solid white;
      border-radius: 1.25rem;
      margin: 0rem 0.375rem;
      background: #eeeeee !important;
      color: black !important;
      -webkit-transition: all 0.3s ease-in-out;
      -o-transition: all 0.3s ease-in-out;
      transition: all 0.3s ease-in-out;
    }

    .view-proj-text:hover .h-black {
      color: black !important;
    }

    .cta-sm:hover .view-all-btn {
      padding: 0rem 1.0725rem 0.0625rem 1.0725rem;
      border: 0.0625rem solid white;
      border-radius: 1.25rem;
      margin: 0rem 0.375rem;
      background: #eeeeee !important;
      color: black !important;
      -webkit-transition: all 0.3s ease-in-out;
      -o-transition: all 0.3s ease-in-out;
      transition: all 0.3s ease-in-out;
    }

    .cta-sm:hover .h-black {
      color: black !important;
    }

    .greenc {
      color: #00b4a3;
      font-family: "NeueHaasUnica";
      font-weight: 400 !important;
    }

    .header-text {
      rotate: 315deg;
      left: 1.5625rem;
      bottom: 0;
      margin-left: -77%;
      top: 19%;
    }

    .topt-2004 {
      height: 12.5rem;
      width: 12.5rem;
      background: transparent;
      top: 0;
      left: 0;
      -webkit-transition: -webkit-transform 0.3s ease-in-out;
      transition: -webkit-transform 0.3s ease-in-out;
      -o-transition: transform 0.3s ease-in-out;
      transition: transform 0.3s ease-in-out;
      transition: transform 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out;
    }

    .about-company-pd {
      margin-top: 150px !important;
      padding-right: 20%;
      padding-left: 20%;
      margin-bottom: 150px !important;
    }

    .desjoyauz-intro-pd23 {
      margin-top: 165px !important;
      padding-right: 16.5%;
      padding-left: 16.5%;
      margin-bottom: 125px !important;
  }
  .green-intro-pd23 {
    margin-top: 95px !important;
    padding-right: 16.5%;
    padding-left: 16.5%;
    margin-bottom: 95px !important;
  }

  .spacing-tb23{
    padding-top: 3rem;
    padding-bottom: 3rem;
  }
    .top-btm23{
      padding-top:  2rem;
      padding-bottom: 4rem;
    }

    /*project detail page styles*/
    .pd-whiteslide-heading {
      font-size: 84px;
      line-height: 110%;
      font-weight: 400;
      font-family: GalliardStd !important;
      text-align: center;
      opacity: 1;
    }

    .pd-services-heading {
      font-size: 70px;
      line-height: normal;
      font-weight: 400;
      font-family: GalliardStd !important;
      text-align: center;
      opacity: 1;
    }

    .wrapper {
      display: none !important;
    }

    .viewalltext-divp-pd {
      position: absolute;
      bottom: 0;
      -webkit-transition: all 0.5s ease-in-out;
      -o-transition: all 0.5s ease-in-out;
      transition: all 0.5s ease-in-out;
      padding: 64px 48px;
      width: 100%;
      opacity: 1;
    }

    .font-14 {
      font-size: 14px !important;
      font-weight: 400 !important;
      line-height: 120%;
    }

    .t-under {
      text-decoration: underline;
    }

    .font-c50 {
      font-size: 50px;
      line-height: 120%;
      font-weight: 400;
    }

    .vw52 {
      width: 52vw;
    }

    .mh-90 {
      margin: 0 !important;
      height: 90vh;
    }

    .pd-px-c100 {
      padding-right: 70px !important;
      padding-left: 70px !important;
    }

    /*project detail page styles end*/

    /*project detail page styles code of Abhi*/
    .cust-mt-2 {
      margin-top: 15px !important;
    }

    .cust-mt-7 {
      margin-top: 80px !important;
    }

    .cust-mt-8 {
      margin-top: 65px !important;
    }

    .cust-mt-77 {
      margin-top: 115px;
      margin-bottom: 115px;
    }

    .cust-mt-10 {
      padding-top: 175px !important;
      padding-bottom: 175px !important;

    }

    .service-mt-mb {
      margin-top: 184px !important;
    }

    .cust-bt-10 {
      margin-bottom: 190px !important;
    }

    .big-pic {
      margin-top: 36px !important;
    }

    .pd-px-200 {
      padding-right: 70px !important;
      padding-left: 70px !important;
    }

    .pd-px-183 {
      padding-right: 25px !important;
      padding-left: 25px !important;
    }
    .about-testi-back20 {
      background: #f8f7f7;
    }


    .service-pd {
      background: #f8f8f8;
    }

    .pd-right {
      padding-right: 54px !important;
    }

    .big-ss-top {
      padding-top: 90px !important;
      padding-bottom: 120px !important;
    }

    .mb-down {
      margin-bottom: 40px !important;
    }

    .testimonial-top {
      margin-top: 165px !important;
      margin-bottom: 165px !important;
    }

    .button-transprent {
      -webkit-transition: all .5s ease;
      -o-transition: all .5s ease;
      transition: all .5s ease;
      background: #ffffff;
      border-width: 1.59px;
      -webkit-box-sizing: border-box;
              box-sizing: border-box;
      color: #181818;
      border-color: #181818;
      font-family: NeueHaasUnica !important;
      margin-right: 10px;
      position: relative;
      font-size: 16px;
      border-radius: 6px;
      font-weight: 400;
      cursor: default !important;
    }

    /* .btn-project-pad23{
      padding: 14px 30px 9px 30px !important;
    }
     */

    .btn-project-pad23{
      padding: 9px 30px 5px 29px !important;
    }

    .btn-uxdesign-pad23{
      padding: 14px 37px 9px 39px !important;
    }

    .btn-prototype-pad23{
      padding: 14px 33px 9px 35px !important;
    }

    .web-button {
      -webkit-transition: all .5s ease;
      -o-transition: all .5s ease;
      transition: all .5s ease;
      background: #ffffff;
      border-width: 1.59px;
      -webkit-box-sizing: border-box;
              box-sizing: border-box;
      color: #181818;
      border-color: #181818;
      font-family: NeueHaasUnica !important;
      margin-right: 11px;
      padding: 14px 20px 9px 19px !important;
      position: relative;
      font-size: 16px;
      border-radius: 6px;
      font-weight: 400;
      cursor: default !important;
    }

    .testimonial-text {
      margin-top: 80px !important;
    }

    .testimonial-pic-top {
      margin-top: 52px !important;
    }

    .bg-gray-color {
      background: #f8f8f8;
    }

    .font-itc {
      font-family: Neue Haas Unica WG;
    }

    .servie-ptext {
      font-size: 24px;
      font-family: GalliardStd !important;
      line-height: 150%;
      font-weight: 400;
      color: #181818 !important;
    }

    .carousel-control-next,
    .carousel-control-prev {
      position: absolute;
      top: 0;
      bottom: 0;
      z-index: 1;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-align: center;
          -ms-flex-align: center;
              align-items: center;
      -webkit-box-pack: center;
          -ms-flex-pack: center;
              justify-content: center;
      width: 15%;
      padding: 0;
      color: #fff;
      text-align: center;
      background: 0 0;
      border: 0;
      opacity: 1 !important;
      -webkit-transition: opacity .15s ease;
      -o-transition: opacity .15s ease;
      transition: opacity .15s ease;
    }

    .golden-bright {
      background-color: #EFE5DB !important;
    }

    .gray-clr-23 {
      background-color: #efefef !important;
    }

    .paragraph-ss {
      font-family: NeueHaasUnica !important;
      font-weight: 400 !important;
      font-size: 34px;
      color: #181818;
    }

    .grid-align {
      display: block;
    }

    .full-ss-intro {
      font-family: NeueHaasUnica !important;
      font-weight: 400 !important;
      font-size: 30px;
      color: #181818;
      line-height: 140%;
    }

    .full-ss-p {
      font-family: NeueHaasUnica !important;
      font-weight: 400 !important;
      font-size: 22px;
      color: #181818;
      line-height: 150%;
      margin-bottom: 28px !important;
    }

    .img-shadow {
      --tw-shadow: 0 0 20px rgba(0, 0, 0, .1);
      --tw-shadow-colored: 0 0 20px var(--tw-shadow-color);
      -webkit-box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
              box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
    }

    .sticky {
      position: sticky;
    }

    .static-p {
      position: static !important;
    }

    .testimonial-project {
      height: 140px;
      width: 140px !important;
    }

    .testimonial-p {
      font-family: NeueHaasUnica !important;
      font-size: 30px;
      font-weight: 400;
      line-height: 130%;
      width: 92% !important;
    }

    .testimonial-name {
      font-family: NeueHaasUnica !important;
      font-size: 18px;
      font-weight: 300;
      line-height: 150%;
    }


    .cust-mt-6 {
      margin-top: 4rem !important;
      margin-bottom: 4rem !important;
    }

    .bg-white {
      background-color: #ffffff;
    }

    .owl-carousel .owl-slide {
      position: relative;
      height: 100vh;
      background-color: lightgray;
    }

    .owl-carousel .owl-slide-animated {
      -webkit-transform: translateX(20px);
          -ms-transform: translateX(20px);
              transform: translateX(20px);
      opacity: 0;
      visibility: hidden;
      -webkit-transition: all 0.05s;
      -o-transition: all 0.05s;
      transition: all 0.05s;
    }

    .owl-carousel .owl-slide-animated.is-transitioned {
      -webkit-transform: none;
          -ms-transform: none;
              transform: none;
      opacity: 1;
      visibility: visible;
      -webkit-transition: all 0.5s;
      -o-transition: all 0.5s;
      transition: all 0.5s;
    }

    .owl-carousel .owl-slide-title.is-transitioned {
      -webkit-transition-delay: 0.2s;
           -o-transition-delay: 0.2s;
              transition-delay: 0.2s;
    }

    .owl-carousel .owl-slide-subtitle.is-transitioned {
      -webkit-transition-delay: 0.35s;
           -o-transition-delay: 0.35s;
              transition-delay: 0.35s;
    }

    .owl-carousel .owl-slide-cta.is-transitioned {
      -webkit-transition-delay: 0.5s;
           -o-transition-delay: 0.5s;
              transition-delay: 0.5s;
    }

    /*CHANGES*/
    .owl-carousel .owl-dots,
    .owl-carousel .owl-nav [class*=owl-] {
      position: absolute;
    }

    .owl-carousel .owl-dots .owl-dot,
    .owl-carousel .owl-nav [class*="owl-"]:focus {
      outline: none;
    }

    .owl-carousel .owl-dots .owl-dot span {
      background: transparent;
      border: 1px solid var(--main-black-color);
      -webkit-transition: all 0.2s ease;
      -o-transition: all 0.2s ease;
      transition: all 0.2s ease;
    }

    .owl-dots {
      display: none;
    }

    .owl-carousel .owl-dots .owl-dot:hover span,
    .owl-carousel .owl-dots .owl-dot.active span {
      background: var(--main-black-color);
    }

    .owl-theme .owl-nav {
      margin-top: 0px !important;
    }

    /*CHANGES*/
    .owl-carousel .owl-nav [class*=owl-] {
      top: 0;
      bottom: 0;
      width: 50%;
      margin: 0;
    }

    .owl-carousel .owl-nav .owl-prev {
      left: 0;
      cursor: url(https://goodwebsitedevsite.eternalsoft.in/wp-content/uploads/2024/07/left-slider-2x.png), move;
      cursor: url(https://goodwebsitedevsite.eternalsoft.in/wp-content/uploads/2024/07/left-slider-2x.png) 16 16, move;
    }

    .owl-carousel .owl-nav .owl-next {
      right: 0;
      cursor: url(https://goodwebsitedevsite.eternalsoft.in/wp-content/uploads/2024/07/right-slider-2x.png), move;
      cursor: url(https://goodwebsitedevsite.eternalsoft.in/wp-content/uploads/2024/07/right-slider-2x.png) 16 16, move;
    }

    .owl-carousel .owl-nav svg {
      display: none;
    }

    .owl-carousel .owl-nav [class*="owl-"]:hover {
      background: transparent;
    }


    /* Service page css started on big screen  */


    .sec-mt-10 {
      margin-top: 120px !important;
      margin-bottom: 120px !important;
    }


    .accordion {
      --bs-accordion-active-bg: #ffffff;
      --bs-accordion-btn-icon-transform: rotate(-0deg);
      -webkit-box-shadow: inset 0 -1px 0 rgba(0, 0, 0, -0.875);
              box-shadow: inset 0 -1px 0 rgba(0, 0, 0, -0.875);
      --bs-border-width: 0px;
      --bs-accordion-body-padding-y: 0rem !important;
      --bs-accordion-btn-padding-y: 0rem !important;
    }

    .accordion-button:not(.collapsed) {
      color: var(--bs-accordion-active-color);
      background-color: #ffffff !important;
    }

    .accordion-button:focus {
      z-index: 3;
      border-color: #ffffff;
    }

    .box-half-services {
      float: left;
      width: 33.33%;
      padding: 10px;
      height: 300px;
      /* Should be removed. Only for demonstration */
    }

    .col-sp-1 {
      padding-top: 160px;
      margin-bottom: 90px;
      font-size: 24px;
      font-family: GalliardStd !important;
    }

    .text-ft-section {
      font-size: 26px;
      font-family: NeueHaasUnica !important;
      font-weight: 500;
      color: #000;
      margin-bottom: 300px;
      margin-top: 35px;
    }

    .text-bt-section {
      font-size: 26px;
      font-family: NeueHaasUnica !important;
      font-weight: 500;
      color: #000;
      margin-bottom: 300px;
      margin-top: 1rem;
    }

    .text-project2 {
      font-size: 18px;
      line-height: 150%;
      color: white !important;
      font-weight: 200;
      cursor: pointer;
      font-family: NeueHaasUnica !important;
      overflow: visible;
    }

    .div-block-6 {
      border: 1px solid #fff !important;
      border-radius: 20px;
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
          -ms-flex-direction: column;
              flex-direction: column;
      -webkit-box-pack: center;
          -ms-flex-pack: center;
              justify-content: center;
      -webkit-box-align: center;
          -ms-flex-align: center;
              align-items: center;
      width: 22px;
      height: 22px;
      margin-top: 1px;
      margin-left: 10px !important;
      padding: 12px !important;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
    }

    .about-section {
      height: 100%;
      padding-top: 150px !important;
      text-align: center;
      background: #eee;
  }

    .mt-xl-b40 {
      margin: 4.5rem 26rem 0.75rem 24rem;
    }

    .html-embed-2 {
      -webkit-box-pack: center;
          -ms-flex-pack: center;
              justify-content: center;
      padding-left: 0px !important;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      color: rgb(0, 0, 0);
    }

    /* about page code by abhii */
    .some_goodweb_head {
      padding-top: 156px;
      padding-bottom: 80px;
      font-size: 24px;
      font-family: GalliardStd !important;
      font-weight: 500;
    }

    .num-ft-section {
      font-size: 95px;
      font-family: NeueHaasUnica !important;
    }

    .some_goodweb_paragraph20 {
      font-size: 26px;
      font-family: NeueHaasUnica !important;
      font-weight: 400;
      color: #000;
      margin-bottom: 254px;
      margin-top: 20px;
      position: relative;
    }

    .some_goodweb_para-last30 {
      font-size: 26px;
      font-family: NeueHaasUnica !important;
      font-weight: 400;
      color: #000;
      margin-bottom: 195px;
      margin-top: 20px;
      position: relative;
    }

    .btn-live-website {
      background: transparent;
      -webkit-backface-visibility: hidden;
      backface-visibility: hidden;
      border-width: 1.59px;
      -webkit-box-sizing: border-box;
      box-sizing: border-box;
      color: #181818;
      border-color: #181818;
      cursor: pointer;
      display: inline-block;
      font-family: NeueHaasUnica !important;
      font-size: 24px;
      font-weight: 400;
      line-height: 140%;
      border-radius: 0.313rem;
      border-style: solid;
      padding: 0.962rem 2.22rem 0.702rem 2.22rem;
      position: relative;
      text-align: left;
      text-decoration: none;
      -webkit-transform: translateZ(0) scale(1);
      transform: translateZ(0) scale(1);
      -webkit-transition: -webkit-transform 0.2s;
      transition: -webkit-transform 0.2s;
      -o-transition: transform 0.2s;
      transition: transform 0.2s;
      transition: transform 0.2s, -webkit-transform 0.2s;
      -moz-user-select: none;
      -ms-user-select: none;
      user-select: none;
      -webkit-user-select: none;
      -ms-touch-action: manipulation;
      touch-action: manipulation;
      margin-right: -7px !important;
    }

    .up_next {
      height: 100vh;
      position: relative;
    }

    .grid-area {
      -ms-grid-row: 1;
      -ms-grid-row-span: 1;
      -ms-grid-column: 1;
      -ms-grid-column-span: 1;
      grid-area: 1 / 1 / 2 / 2;
      -ms-grid-row-align: start;
          align-self: start;
    }

    .up_next_container {
      z-index: 1;
      color: #fff;
      padding-bottom: 62px;
      position: sticky;
      top: 0;
    }

    .up-tag {
      color: #fff;
      margin-top: 75px;
      font-family: NeueHaasUnica !important;
      font-size: 18px;
      font-weight: 300;
      line-height: 180%;
    }

    .btn-img-text {
      color: #fff;
      font-family: NeueHaasUnica !important;
      font-size: 18px;
      font-weight: 300;
      line-height: 180%;
    }

    .heading-one {
      color: #fff;
      font-family: GalliardStd !important;
      font-size: 40px;
      font-weight: 400;
      margin-top: 12px;
      line-height: 120%;
    }

    .button-top-fa {
      margin-top: 26px !important;
    }

    .up-grid {
      grid-column-gap: 50px;
      grid-row-gap: 50px;
      width: 100%;
      height: 100%;
      margin-right: 30px;
      padding-left: 30px;
    }

    .w-grid {
      grid-row-gap: 16px;
      grid-column-gap: 16px;
      -ms-grid-rows: auto 16px auto;
      grid-template-rows: auto auto;
      -ms-grid-columns: 1.2fr 16px 1fr;
      grid-template-columns: 1.2fr 1fr;
      grid-auto-columns: 1fr;
      display: -ms-grid;
      display: grid;
    }

    .w-grid > *:nth-child(1) {
      -ms-grid-row: 1;
      -ms-grid-column: 1;
    }

    .w-grid > *:nth-child(2) {
      -ms-grid-row: 1;
      -ms-grid-column: 3;
    }

    .w-grid > *:nth-child(3) {
      -ms-grid-row: 3;
      -ms-grid-column: 1;
    }

    .w-grid > *:nth-child(4) {
      -ms-grid-row: 3;
      -ms-grid-column: 3;
    }

    .up-img {
      -webkit-filter: brightness(70%);
              filter: brightness(70%);
      -o-object-fit: cover;
         object-fit: cover;
      width: 100%;
      height: 100%;
      position: absolute;
      top: 0%;
      bottom: 0%;
      left: 0%;
      right: 0%;
    }

    .static {
      position: static;
    }

    .cover {
      background-size: cover;
      background-position: center;
      background-repeat: no-repeat;
    }

    .img-col {
      -webkit-box-flex: 1;
          -ms-flex: 1 0 0%;
              flex: 1 0 0%;
    }

    .gray-line23 {
      background-color: #707b8d !important;
    }
    .service-color23 {
    background: #000000;
    }
    .bg-white-20 {
      background-color: hsl(0deg 0% 0% / 26%);
    }

    /*Service page styles code of Abhi*/
    .service-header {
      z-index: 2;
      width: 100%;
      height: 100vh;
      padding: 3.125rem;
      position: absolute;
      color: black;
      background: #000000;
    }

    .head-main {
      font-size: 64px !important;
      line-height: 120%;
      font-family: NeueHaasUnica !important;
    }

    .slider-head-main {
      font-size: 50px !important;
      line-height: 120% !important;
      margin-bottom: 10.2rem;
      font-family: NeueHaasUnica !important;
    }

    .service-btn {
      margin-top: 130px !important;
      height: 70px;
      display: inline-table;
      border-bottom: 1px solid black;
    }

    .service-button-transprent {
      -webkit-transition: all .5s ease;
      -o-transition: all .5s ease;
      transition: all .5s ease;
      -webkit-box-sizing: border-box;
              box-sizing: border-box;
      color: #181818;
      font-family: NeueHaasUnica !important;
      margin-right: 12px;
      padding: 30px 0px 0px 20px !important;
      position: relative;
      font-size: 16px;
      border-radius: 6px;
      font-weight: 400;
      cursor: default;
    }

    .head-first-23 {
      font-size: 70px !important;
      line-height: 120% !important;
      font-weight: 400 !important;
      font-family: GalliardStd !important;
      color: #ffffff;
    }

    .head-main-left {
      font-size: 70px !important;
      line-height: 120% !important;
      font-weight: 400 !important;
      font-family: GalliardStd !important;
      color: #000000;
    }

    .info-p1 {
      font-size: 24px;
      font-family: NeueHaasUnica !important;
      line-height: 150%;
      font-weight: 400;
      margin-top: 23px !important;
      color: #ffffff;
    }

    .head-right {
      font-size: 40px;
      font-family: GalliardStd !important;
      line-height: 120%;
      font-weight: 400;
      text-align: left;
      color: #ffffff;
      position: static;
    }

    .connect-mt140 {
      margin-top: 90px !important;
    }

    .heading-thirdsec20 {
      margin-bottom: 15px;
    }

    .custom-sec-mb50 {
      margin-bottom: 17px;
    }

    .info-right {
      font-size: 18px;
      font-family: NeueHaasUnica !important;
      line-height: 180%;
      font-weight: 300;
      color: #ffffff;
    }

    .info-creative-right {
      font-size: 18px;
      font-family: NeueHaasUnica !important;
      line-height: 180%;
      font-weight: 300;
      margin-top: 11px !important;
      color: #ffffff;
    }


    .background-section {
      width: 100%;
      height: auto;
    }
    .service23 {
      color: white;
    }


    .flex-one {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
    }

    .counter-top-46 {
      margin-top: 4rem !important;
    }

    .website-sec {
      font-size: 18px;
      font-family: NeueHaasUnica !important;
      line-height: 180%;
      font-weight: 300;
      text-align: left;
      margin-top: 17px !important;
      margin-bottom: 40px;
      color: #ffffff;
    }

    .replatforming-sec {
      font-size: 18px;
      font-family: NeueHaasUnica !important;
      line-height: 180%;
      font-weight: 300;
      text-align: left;
      margin-top: 17px !important;
      margin-bottom: 40px;
    }

    .replatforming-mt-mb {
      margin-top: 40px !important;
      margin-bottom: 40px;
      padding-left: 18px;
    }

    .replat-mb-23 {
      padding-left: 15px;
    }

    .underline-sec {
      border-bottom: 1px solid #636e80;
      margin-top: 42px !important;
    }

    .underline-white {
      border-bottom: 1px solid #cfcfcf;
      margin-top: 42px !important;
    }

    .underline-caresec20 {
      border-bottom: 1px solid #cfcfcf;
      margin-top: 85px !important;
    }

    .grid-service-ul {
      -moz-column-gap: 40px;
      -webkit-column-gap: var(--spacing-gutter);
              column-gap: var(--spacing-gutter);
      display: -ms-grid;
      display: grid;
      grid-auto-rows: -webkit-min-content;
      grid-auto-rows: min-content;
      -ms-grid-columns: minmax(0, 1fr) var(--spacing-gutter) minmax(0, 1fr);
      grid-template-columns: repeat(2, minmax(0, 1fr));
      margin-top: var(--spacing-xs);
    }

    .grid-service-li {
      border-bottom-width: 1px;
      margin-bottom: 40px;
      padding-bottom: 5px;
      border-bottom: 1px solid #cfcfcf;
    }
    /* Default state for navigation links */
 .navigation__link {
  position: relative;
  text-decoration: none;
}

/* .navigation__link::after {
  content: '';
  position: absolute;
  bottom: -10px;
  left: 0;
  height: 2px !important;
  background-color: white;
  transition: width 0.3s ease-in-out;
} */
.rte--white {
  position: relative;
  text-decoration: none;
}
.rte--white::after{
  color: #ffffff;
  content: '';
  position: absolute;
  bottom: -10px;
  left: 0;
  height: 2px !important;
  background-color: white;
  -webkit-transition: width 0.3s ease-in-out;
  -o-transition: width 0.3s ease-in-out;
  transition: width 0.3s ease-in-out;
}
.rte--white23::after{
  color: #ffffff;
  content: '';
  position: absolute;
  bottom: -10px;
  left: 0;
  height: 2px !important;
  background-color: white;
  -webkit-transition: width 0.3s ease-in-out;
  -o-transition: width 0.3s ease-in-out;
  transition: width 0.3s ease-in-out;
}
.rte--white23.active::after {
  width: 100% !important;
}
.rte--white.active::after {
  width: 100% !important;
}

/* Active state with underline */
/*.navigation__link.active::after {*/
/*  width: 100% !important;*/
/*}*/

.rte--black::after{
  color: #000;
  content: '';
  position: absolute;
  -webkit-text-decoration-color: black;
          text-decoration-color: black;
  bottom: -10px;
  left: 0;
  height: 2px !important;
  background-color: black;
  -webkit-transition: width 0.3s ease-in-out;
  -o-transition: width 0.3s ease-in-out;
  transition: width 0.3s ease-in-out;
}
.rte--black.active::after {
  width: 100% !important;
}

  .navbar-nav {
    display: contents !important;
  }

    /* .rte--dark ul div {
      border-bottom: 1px solid #636e80 !important;
    } */
    .rte--white ul div {
      border-bottom: 1px solid #636e80 !important;
    }
    .trp--white ul div {
      border-bottom: 1px solid #636e80 !important;
    }

    .white--light ul div {
      border-bottom: 1px solid #cfcfcf !important;
    }

    .rte ul div {
      border-bottom-width: 1px !important;
      margin-bottom: 25px !important;
      margin-top: -10px;
      padding-bottom: 15px !important;
      font-size: 18px !important;
      line-height: 204%;
      color: #ffffff;
    }

    .underline-end {
      border-bottom: 1px solid #ffffff;
      margin-top: 80px !important;
    }

    .underline-lastsec40 {
      border-bottom: 1px solid #000000;
      margin-top: 63px !important;
    }

    .underline-approch-secend {
      border-bottom: 1px solid #ffffff;
      margin-top: 100px !important;
    }

    .underline-approch-thirdline {
      border-bottom: 1px solid #ffffff;
      margin-top: 90px !important;
    }

/*
      .navigation {
      color: #ffffff;
    }  */

    .trp--white {
      color: #ffffff;
    }


    .head-one-right {
      font-size: 40px;
      font-family: GalliardStd !important;
      line-height: 120%;
      font-weight: 400;
      margin-top: 90px !important;
      color: #ffffff;
    }

    .smallhead-one-right {
      font-size: 22px;
      font-family: NeueHaasUnica !important;
      line-height: 150%;
      font-weight: 500;
      margin-top: 55px !important;
      margin-bottom: 20px;
      color: #ffffff;
    }

    .info-one-right {
      font-size: 18px;
      font-family: NeueHaasUnica !important;
      line-height: 180%;
      font-weight: 300;
      margin-top: 15px !important;
      margin-bottom: 30px !important;
    }

    .head-two-right {
      font-size: 40px;
      font-family: GalliardStd !important;
      line-height: 120%;
      font-weight: 400;
      margin-top: 86px !important;
      margin-bottom: 25px !important;
      color: #ffffff;
    }

    .info-two-right {
      font-size: 18px;
      font-family: NeueHaasUnica !important;
      line-height: 180%;
      font-weight: 300;
      margin-top: 21px !important;
      margin-bottom: 50px;
      color: #ffffff;
    }

    .sec-tm-one {
      font-size: 64px;
      font-family: GalliardStd !important;
      margin-top: 90px !important;
      margin-bottom: 30px !important;
      line-height: 120%;
      font-weight: 400;
    }

    .service-hero23 {
      --colSpan: 8;
      padding-top: 46rem;
      padding-bottom: 20px;
    }

    .rte--dark {
      color: #000000 !important;
    }

    .clr-black {
      color: #000000 !important;
    }

    .sec-tm-two {
      font-size: 24px;
      font-family: NeueHaasUnica !important;
      margin-top: 10px !important;
      margin-bottom: 30px !important;
      color: #000000;
      line-height: 150%;
    }

    .clr-light-green {
      background-color: #e9ebe3;
    }

    .service-margin53 {
      margin-top: 20px;
      margin-bottom: 106px;
    }

    .accordion-button::after {
      -ms-flex-negative: 0;
          flex-shrink: 0;
      width: 1.25rem;
      height: 1.25rem;
      margin-left: inherit !important;
      margin-right: auto !important;
    }

    .btn-link {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-align: center;
          -ms-flex-align: center;
              align-items: center;
      text-align: left;
    }
/*
    .hover\:text-black-50:hover {
      color: hsla(0, 0%, 100%, .5) !important;
  } */

    .duration-300 {
      -webkit-transition-duration: .3s;
           -o-transition-duration: .3s;
              transition-duration: .3s;
    }

    .transition-colors {
      -webkit-transition-duration: .15s;
           -o-transition-duration: .15s;
              transition-duration: .15s;
      -webkit-transition-property: color, background-color, border-color, fill, stroke, -webkit-text-decoration-color;
      transition-property: color, background-color, border-color, fill, stroke, -webkit-text-decoration-color;
      -o-transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
      transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
      transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, -webkit-text-decoration-color;
      -webkit-transition-timing-function: cubic-bezier(.4, 0, .2, 1);
           -o-transition-timing-function: cubic-bezier(.4, 0, .2, 1);
              transition-timing-function: cubic-bezier(.4, 0, .2, 1);
    }

    .arrow-icon {
      display: inline-block;
      width: 0;
      height: 0;
      margin-right: 10px;
      /* Space between arrow and text */
      border-top: 4px solid transparent;
      border-bottom: 4px solid transparent;
      border-left: 6px solid #000;
      /* Color of the arrow */
      -webkit-transition: -webkit-transform 0.3s ease;
      transition: -webkit-transform 0.3s ease;
      -o-transition: transform 0.3s ease;
      transition: transform 0.3s ease;
      transition: transform 0.3s ease, -webkit-transform 0.3s ease;
      background-image: url(https://goodwebsitedevsite.eternalsoft.in/wp-content/uploads/2024/07/down-arrow.png);
    }

    .service_container {
      z-index: 2000;
      width: 100%;
      height: 100vh;
      margin-top: -90px;
      position: static;
    }

    .sec-head10 {
      padding-bottom: 155px !important;
    }

    .third-custom-sec10 {
      margin-top: 70px !important;
      margin-bottom: 100px !important;
    }

    .two-branding-sec10 {
      margin-top: 145px !important;
      margin-bottom: 30px !important;
    }

    .three-website-sec10 {
      padding-top: 220px;
      margin-top: -80px;
  }

    .faq-p1 {
      padding: 10px 0px 10px 0px;
    }

    .button-slider-top {
      margin-top: 120px !important;
    }

    .work_scroller_item {
      width: 75vw;
      min-width: 75vw;
      height: 100%;
      padding-top: 60px;
      padding-bottom: 30px;
      padding-right: 30px;
      position: relative;
    }

    .w-inline-block {
      max-width: 100%;
      display: inline-block;
    }

    .work_scroller_intro {
      width: 50vw;
      min-width: 47vw;
      margin-right: 25px;
      padding-bottom: 50px;
      padding-left: 50px;
      position: relative;
    }
    .work_scroller_item.last {
      width: 50vw;
      min-width: 50vw;
      padding-right: 50px;
  }

    .work_scroller_frame {
      width: 100%;
      height: 100%;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      overflow: visible;
    }

    .service-all-btn {
      padding: 0rem 0.5rem 0.0625rem 0.5rem;
      border: 0.0625rem solid white;
      border-radius: 1.25rem;
      margin: 0rem 0.375rem;
      -webkit-transition: all 0.3s ease-in-out;
      -o-transition: all 0.3s ease-in-out;
      transition: all 0.3s ease-in-out;
    }

    .service-all-btn i {
      font-size: 0.75rem !important;
      color: white;
      margin-top: 7px;
    }

    .w-background-video {
      color: #fff;
      height: 500px;
      position: relative;
      overflow: hidden;
    }

    .work_scroller_content_container {
      z-index: 1;
      max-width: 400px;
      margin-bottom: 30px;
      position: absolute;
      bottom: 30px;
      left: 30px;
    }

    .work_scroller_item {
      width: 75vw;
      min-width: 75vw;
      height: 100%;
      padding-top: 30px;
      padding-bottom: 30px;
      padding-right: 30px;
      position: relative;
    }

    .w-inline-block {
      max-width: 100%;
      display: inline-block;
    }

    .background-video-2 {
      border-radius: 2px;
      width: 100%;
      height: 100%;
      padding-top: 110px;
    }

    .w-background-video>video {
      -o-object-fit: cover;
         object-fit: cover;
      z-index: -100;
      background-position: 50%;
      background-size: cover;
      width: 100%;
      height: 100%;
      margin: auto;
      position: absolute;
      top: -100%;
      bottom: -100%;
      left: -100%;
      right: -100%;
    }

    .work_scroller_track {
      height: 400vw;
      overflow: visible;
    }

    .work_scroller_camera {
      z-index: 6;
      background-color: #ffffff;
      height: 100vh;
      position: sticky;
      top: 0;
      overflow: hidden;
    }

    .work_scroller_intro_container {
      padding-right: 40px;
      position: absolute;
      top: 30px;
      bottom: auto;
      left: 46px !important;
    }

    .service_40slider {
      padding-left: 60px;
      overflow: visible;
    }

    .project_sec_head1 {
      font-size: 35px;
      font-family: GalliardStd !important;
      line-height: 130%;
      font-weight: 400;
    }

    .project_sec_paragrph1 {
      font-size: 18px;
      font-family: NeueHaasUnica !important;
      line-height: 150%;
      font-weight: 200;
    }

    .project_btn_text1 {
      font-size: 18px;
      font-family: NeueHaasUnica !important;
      line-height: 150%;
      font-weight: 200;
    }

    .list-style23{
      list-style: none !important;
    }

    .faq-symbol {
      background-image: url(https://goodwebsitedevsite.eternalsoft.in/wp-content/uploads/2024/07/Untitled-design-1.png);
    }

    .sticky-button {
      position: sticky;
      top: 0;
      z-index: 33;
        transform: translateY(0); /* Default position */
    opacity: 1; /* Fully visible */
     transition: transform 0.3s ease, opacity 0.3s ease; /* Smooth transition */
    }

    .section-heading100 {
      padding-left: 40px;
      padding-right: 40px;
      overflow: visible;
    }

    .section-btn- {
      padding-left: 40px;
      padding-right: 40px;
      overflow: visible;
    }

    .btn-ml-mr40 {
      padding-left: 40px;
      padding-right: 40px;
      overflow: visible;
      background: rgb(255 255 255 / 75%);
    }

    .column-three-btn {
      -ms-flex-wrap: wrap;
      flex-wrap: wrap;
    }

    .heading-height69 {
      z-index: 2;
      width: 100%;
      height: 80vh;
      background-color: var(--black);
      padding: 3.125rem;
      position: absolute;
      color: black;
      background: white;
      text-align: left;
    }

    .service-back23{
      width: 100%;
      height: 80vh;
      background-color: var(--black);
      padding: 3.125rem;
      position: absolute;
      background: #000000;
      color: white;
    }

    .about-good-website23 {
      font-size: 70px;
      line-height: 120%;
      font-family: GalliardStd !important;
      margin-bottom: 30px;
      color: #000000;
    }

    .about-head20 {
      margin-top: -10px !important;
      margin-bottom: 5px !important;
    }

    .about-center-text60 {
      font-size: 22px;
      line-height: 120%;
      margin-top: 40px !important;
      margin-bottom: 50px !important;
      font-weight: 400;
      color: #000000;
      text-align: center;
    }

    .about-head-left {
      font-size: 70px;
      line-height: 120%;
      font-weight: 500;
      font-family: GalliardStd !important;
    }

    .main-about-paragrph50 {
      font-size: 18px;
      line-height: 180%;
      font-weight: bold;
      font-family: NeueHaasUnica !important;
      color: #181818;
      margin-bottom: 25px;
      margin-top: 23px;
    }

    .main-about-boltt50 {
      font-size: 18px;
      line-height: 180%;
      font-weight: bold;
      font-family: NeueHaasUnica !important;
      color: #181818;
      margin-top: 30px !important;
      margin-bottom: 10px !important;
    }

    .big-bold-p25 {
      padding-top: 20px;
      padding-bottom: 20px;
    }

    .qa-bold-s24 {
        padding-top: 20px;
        padding-bottom: 20px;
    }

    .about-paragrph-right20 {
      font-size: 18px;
      line-height: 180%;
      font-weight: 400 !important;
      font-family: NeueHaasUnica !important;
      color: #181818;
      margin-bottom: 25px;
    }

    .bold-linemt20 {
      font-size: 18px !important;
      line-height: 180% !important;
      font-weight: bold;
      font-family: NeueHaasUnica !important;
      color: #181818;
      margin-bottom: 10px !important;
    }

    .about-head10 {
      margin-top: 180px !important;
      margin-bottom: 25px !important;
    }

    .about-long-line10 {
      margin-top: 45px !important;
      margin-bottom: 25px !important;
    }

    .about-head20 {
      margin-top: -10px;
      margin-bottom: 45px;
    }

    .about-head30 {
      margin-top: -10px !important;
      margin-bottom: 70px !important;
    }

    .abouthead-main-left {
      font-size: 70px !important;
      line-height: 120% !important;
      font-weight: 400 !important;
      font-family: GalliardStd !important;
      margin-bottom: 35px !important;
    }

    .abouthead-perfect-left {
      font-size: 70px !important;
      line-height: 120% !important;
      font-weight: 400 !important;
      font-family: GalliardStd !important;
      margin-bottom: 35px !important;
    }

    .about_head_main {
      font-size: 64px !important;
      line-height: 120% !important;
      font-weight: 400 !important;
      font-family: GalliardStd !important;
      z-index: 25;
      position: relative;
    }

    .service_head_main {
      font-size: 64px !important;
      line-height: 120% !important;
      font-weight: 400 !important;
    }

    .about_big_paragraph98 {
      font-size: 30px !important;
      line-height: 140% !important;
      font-weight: 400 !important;
      font-family: NeueHaasUnica !important;
    }

    .about_white_container {
      width: 100%;
      height: 80vh;
      margin-top: -90px;
  }
   .service_blue_container {
      width: 100%;
      height: 92.4105vh;
      margin-top: -90px;
      background-color: #000000;
  }

    .aboutunderline-end {
      border-bottom: 1px solid #000000;
      margin-top: 93px;
      margin-bottom: 90px;
    }

    .staus-mt240 {
      margin-top: 9rem;
    }

    .contact_220_prpl {
      padding-left: 50px !important;
      padding-right: 50px !important;
      overflow: hidden;
    }

    .contact_mtmb_160 {
      padding-top: 40px;
      padding-bottom: 120px;
    }

    .contact_para190 {
      font-size: 24px !important;
      line-height: 150% !important;
      font-weight: 400 !important;
      font-family: NeueHaasUnica !important;
    }

    .contact-form-control.border-contact-control {
      input-btn-padding-x: 0 !important;
      form-control-radius: 0 !important;
      -webkit-box-shadow: none !important;
              box-shadow: none !important;
      background-color: #ffffff;
      border-top: transparent;
      border-right: transparent;
      border-left: transparent;
    }

    .service-navigationbar-09 {
      padding-top: 120px !important;
    }

    .contact-form-control {
      display: block;
      width: 100%;
      padding: 20px 5px 7px 0px !important;
      font-size: 22px !important;
      font-weight: 400;
      line-height: 150% !important;
      color: #555555;
      background-color: #fff;
      border-bottom: 2px solid #000000 !important;
    }

    .contact-form-field .hover-option:hover {
      background: #ffffff !important;
    }

    select.contact-form-field option.hover-option:hover {
      background-color: #f0f0f0 !important;
      /* Change to your desired hover color */
      color: #000000 !important;
      /* Change to your desired text color on hover */
    }

    .contact-form-field {
      display: block;
      width: 100%;
      padding: 23px 8px 15px 0px !important;
      font-size: 18px !important;
      font-weight: 400;
      line-height: 150%;
      color: #5d5564;
      background-color: #fff;
      border-bottom: 2px solid #000000 !important;
      text-align: left;
    }

    .contact-form-field.border-contact-control {
      input-btn-padding-x: 0 !important;
      form-control-radius: 0 !important;
      -webkit-box-shadow: none !important;
              box-shadow: none !important;
      background-color: #ffffff;
      border-top: transparent;
      border-right: transparent;
      border-left: transparent;
    }

    select.contact-form-field .border-contact-control option:hover {
      background-color: #f0f0f0 !important;
      /* Desired hover color */
    }

    .textarea {
      border: 1.50px solid var(--black) !important;
      background-color: #ffffff;
      border-radius: 2px;
      min-height: 200px;
      font-weight: 200;
    }

    input::-webkit-input-placeholder {
      color: #6d6c6c;
      /* Desired placeholder font color */
      opacity: 1;
      /* Ensures full opacity for the color */
    }

    input::-moz-placeholder {
      color: #6d6c6c;
      /* Desired placeholder font color */
      opacity: 1;
      /* Ensures full opacity for the color */
    }

    input:-ms-input-placeholder {
      color: #6d6c6c;
      /* Desired placeholder font color */
      opacity: 1;
      /* Ensures full opacity for the color */
    }

    input::-ms-input-placeholder {
      color: #6d6c6c;
      /* Desired placeholder font color */
      opacity: 1;
      /* Ensures full opacity for the color */
    }

    input::placeholder {
      color: #6d6c6c;
      /* Desired placeholder font color */
      opacity: 1;
      /* Ensures full opacity for the color */
    }

    input::-webkit-input-placeholder {
      color: #5d5564;
    }

    .dropdown-item {
      display: block;
      width: 100%;
      padding: .25rem 1rem;
      clear: both;
      font-weight: 400;
      color: #212529;
      text-align: inherit;
      text-decoration: none;
      white-space: nowrap;
      background-color: transparent !important;
    }

    .dropdown-menu {
      position: absolute;
      z-index: 1000;
      display: none;
      min-width: 100% !important;
      padding: 0.5rem 0;
      margin: 0 !important;
      font-size: 1rem;
      color: #212529;
      text-align: left !important;
      list-style: none;
      background-color: #fff;
      background-clip: padding-box;
      border: 1px solid rgba(0, 0, 0, .15);
      border-radius: 0px !important;
      margin-top: -12px !important;
    }

    .contact-form-boxtwo {
      display: block;
      width: 100%;
      padding: 20px 5px 5px 23px !important;
      font-size: 22px !important;
      font-weight: 400;
      color: #212529;
      background-color: #fff;
      border: 2px solid var(--black) !important;
      border-radius: 2px;
      min-height: 130px !important;
      margin-top: 30px !important;
    }

    .heading-checkbox {
      font-size: 24px !important;
      line-height: 150% !important;
      font-weight: 600 !important;
      font-family: NeueHaasUnica !important;
      margin-bottom: 50px;
    }

    .smallhead-checkbox {
      font-size: 24px !important;
      line-height: 150% !important;
      font-weight: 400;
      font-family: GalliardStd !important;
      margin-left: 14px;
    }

    .italian-text20 {
      font-size: 22px !important;
      line-height: 150% !important;
      font-weight: 400 !important;
      margin-left: 50px;
      margin-top: 4px;
      font-family: NeueHaasUnica !important;
      font-style: italic;
      width: 70%;
    }

    .checkbox-contact {
      --tw-shadow: 0 0 #0000 !important;
      background-origin: border-box;
      border-color: #000000 !important;
      border-width: 0.0625rem !important;
      color: #ffffff !important;
      display: inline-block;
      height: 20px !important;
      padding: 0px;
      vertical-align: middle;
      width: 20px !important;
      --tw-ring-color: #ffffff !important;
    }

    .checkbox-sectiontwo {
      --tw-shadow: 0 0 #0000 !important;
      background-color: #fff !important;
      background-origin: border-box;
      border-color: #000000 !important;
      border-width: 0.0625rem !important;
      color: #2563eb;
      display: inline-block;
      height: 28px !important;
      padding: 0px;
      vertical-align: middle;
      width: 30px !important;
    }

    [type="checkbox"]:checked {
      background-image: url(https://goodwebsitedevsite.eternalsoft.in/wp-content/uploads/2024/08/check-mark-black.png) !important;
    }

    .contact-sub-btn {
      border-radius: 10px;
      border-style: solid;
      border-width: 1.59px;
      -webkit-box-sizing: border-box;
      box-sizing: border-box;
      color: #ffffff;
      background-color: #81714f;
      cursor: pointer;
      display: inline-block;
      font-family: NeueHaasUnica !important;
      font-size: 36px;
      font-weight: 500;
      line-height: 1.3;
      padding: 24px 41px 17px 46px;
    }

    .box-sqaure {
      --tw-shadow: 0 0 #0000;
      background-color: #fff;
      background-origin: border-box;
      border-color: #6b7280;
      border-width: 0.0625rem;
      color: #2563eb;
      display: inline-block;
      height: 28px;
      padding: 0px;
      vertical-align: middle;
      width: 30px;
    }

    .smallhead-checkbox {
      font-size: 24px !important;
      line-height: 150% !important;
      font-weight: 400;
      font-family: GalliardStd !important;
    }

    .checkbox-right23 {
      font-size: 24px !important;
      line-height: 150% !important;
      font-weight: 400;
      font-family: GalliardStd !important;
      margin-left: 0px;
    }

    .two-checkbox {
      margin-top: -9px !important;
      margin-left: 40px;
    }

    .contact-margin72 {
      margin-top: 72px;
    }

    /* Rotate arrow when FAQ item is expanded */
    .btn-link.collapsed .arrow-icon {
      -webkit-transform: rotate(90deg);
          -ms-transform: rotate(90deg);
              transform: rotate(90deg);
      /* Pointing down when collapsed */
    }

    .btn-link .arrow-icon {
      -webkit-transform: rotate(-90deg);
          -ms-transform: rotate(-90deg);
              transform: rotate(-90deg);
      /* Pointing right when expanded */
    }

    .btn-link.collapsed .arrow-icon {
      -webkit-transform: rotate(-90deg);
          -ms-transform: rotate(-90deg);
              transform: rotate(-90deg);
      /* Arrow pointing down when collapsed */
    }

    .btn-link .arrow-icon {
      -webkit-transform: rotate(0deg);
          -ms-transform: rotate(0deg);
              transform: rotate(0deg);
      /* Arrow pointing up when expanded */
    }

    /* faq section start in service page */
    .card-one {
      position: relative;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
          -ms-flex-direction: column;
              flex-direction: column;
      min-width: 0;
      word-wrap: break-word;
      background-color: #fff;
      background-clip: border-box;
      border-bottom: 1px solid #cfcfcf !important;
      padding: 35px 1px 20px 1px;
    }

    [type="checkbox"]:checked {
      background-image: url(https://goodwebsitedevsite.eternalsoft.in/wp-content/uploads/2024/08/check-mark.png) !important;
    }

    .card-header {
      padding: .5rem 1rem;
      margin-bottom: 0;
      background-color: rgba(0, 0, 0, .03);
      border-bottom: 1px solid rgba(0, 0, 0, .125);
      border: 0px solid rgba(0, 0, 0, 0) !important;
    }

    .down-arrow-btn {
      -ms-flex-negative: 0;
          flex-shrink: 0;
      width: 42px !important;
      height: 25px !important;
      margin-left: auto;
      border-radius: 7px;
      content: "";
      background-repeat: no-repeat;
      background-size: 2.50rem;
      -webkit-transition: -webkit-transform .2s ease-in-out;
      transition: -webkit-transform .2s ease-in-out;
      -o-transition: transform .2s ease-in-out;
      transition: transform .2s ease-in-out;
      transition: transform .2s ease-in-out, -webkit-transform .2s ease-in-out;
      display: inline-block;
      background-color: #000000;
      -webkit-transition: -webkit-transform 0.3s ease;
      transition: -webkit-transform 0.3s ease;
      -o-transition: transform 0.3s ease;
      transition: transform 0.3s ease;
      transition: transform 0.3s ease, -webkit-transform 0.3s ease;
      margin-bottom: -14px;
    }

    .down-arrow-btn.collapsed {
      background-color: #e3e1e1;
    }

    .service-down-btn i.collapsed {
      color: #ffffff !important;
    }

    .service-down-btn i {
      color: rgb(0, 0, 0);
      margin-left: 15px;
      margin-top: 7px;
      opacity: 0.7;
      font-size: 13px;
    }


.rte--white:hover::after {
    width: 100%;
}


.rte--black:hover::after {
    width: 100%;
}


    .desktop-menu a:after {
      background: none repeat scroll 0 0 transparent;
      bottom: 0;
      content: "";
      display: block;
      height: 2px;
      left: 50%;
      position: absolute;
      background: black;
      -webkit-transition: width 0.3s ease 0s, left 0.3s ease 0s;
      -o-transition: width 0.3s ease 0s, left 0.3s ease 0s;
      transition: width 0.3s ease 0s, left 0.3s ease 0s;
      width: 0;
    }

    input::-webkit-input-placeholder {
      color: #5d5564 !important;
      /* Change this to your desired color */
      opacity: 1;
      /* Ensures full color opacity */
    }

    input::-moz-placeholder {
      color: #5d5564 !important;
      /* Change this to your desired color */
      opacity: 1;
      /* Ensures full color opacity */
    }

    input:-ms-input-placeholder {
      color: #5d5564 !important;
      /* Change this to your desired color */
      opacity: 1;
      /* Ensures full color opacity */
    }

    input::-ms-input-placeholder {
      color: #5d5564 !important;
      /* Change this to your desired color */
      opacity: 1;
      /* Ensures full color opacity */
    }

    input::placeholder {
      color: #5d5564 !important;
      /* Change this to your desired color */
      opacity: 1;
      /* Ensures full color opacity */
    }

    textarea::-webkit-input-placeholder {
      color: #5d5564 !important;
      /* Change this to your desired color */
      opacity: 1;
      /* Ensures full color opacity */
    }

    textarea::-moz-placeholder {
      color: #5d5564 !important;
      /* Change this to your desired color */
      opacity: 1;
      /* Ensures full color opacity */
    }

    textarea:-ms-input-placeholder {
      color: #5d5564 !important;
      /* Change this to your desired color */
      opacity: 1;
      /* Ensures full color opacity */
    }

    textarea::-ms-input-placeholder {
      color: #5d5564 !important;
      /* Change this to your desired color */
      opacity: 1;
      /* Ensures full color opacity */
    }

    textarea::placeholder {
      color: #5d5564 !important;
      /* Change this to your desired color */
      opacity: 1;
      /* Ensures full color opacity */
    }

    .input-head23 {
      font-size: 24px;
      font-family: NeueHaasUnica !important;
      line-height: 150%;
    }

    .faq-heading-main {
      font-size: 22px;
      font-family: NeueHaasUnica !important;
      font-weight: 500;
      display: inline-block;
      background-color: white;
      margin-left: 13px;
    }

    .faq-heading-big {
      font-size: 22px;
      font-family: NeueHaasUnica !important;
      font-weight: 500;
      display: inline-block;
      background-color: white;
      margin-left: 13px;
    }

    select option:hover {
      -webkit-box-shadow: 0 0 10px 100px red inset !important;
              box-shadow: 0 0 10px 100px red inset !important;
    }

    .faq-card-boarder {
      -webkit-box-flex: 1;
          -ms-flex: 1 1 auto;
              flex: 1 1 auto;
      padding: 23px 15px 40px 2px;
      font-weight: 300;
    }

    .btn-down23 {
      background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3E%3Cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='m6 8 4 4 4-4'/%3E%3C/svg%3E") !important;
      background-position: right 0.5rem center;
      background-repeat: no-repeat;
      background-size: 1.5em 1.5em;
      padding-right: 2.5rem;
      -webkit-print-color-adjust: exact;
      print-color-adjust: exact;
      color: #959595ba !important;
    }

    .custom-dropdown .dropdown-item {
      color: #414D55;
      font-size: 22px !important;
      font-weight: 400;
      line-height: 150%;
    }

    .custom-dropdown .dropdown-item:active {
      background-color: #414D55;
      color: #fff;
    }
    .owl-mobile-left{
      background-image: url(https://goodwebsitedevsite.eternalsoft.in/wp-content/uploads/2024/07/left-slider-2x.png)
    }
    .owl-mobile-right{
      background-image: url(https://goodwebsitedevsite.eternalsoft.in/wp-content/uploads/2024/07/left-slider-2x.png)
    }

    .status_dropdown[data-color=support-status] {
      background-color: #E9E9E9;
      border: 2px solid #34394D;
    }

    .status_dropdown[data-color=inprogress-status] {
      background-color: #A7D6FF;
      border: 2px solid #2DBDCA;
    }

    .status_dropdown[data-color=finished-status] {
      background-color: #B6FFA7;
      border: 2px solid #72D500;
    }

    .status_dropdown[data-color=rejected-status] {
      background-color: #FCBDBD;
      border: 2px solid #FD5252;
    }

    .accordion .accordion-item {
      border-bottom: 1px solid #e5e5e5;
    }

    .accordion .accordion-item button[aria-expanded='true'] {
      border-bottom: 1px solid #03b5d2;
    }

    .mobile-screens {
      height: 100vh;
      margin-left: 0;
      margin-right: 0;
      padding-left: 0;
      padding-right: 0;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      position: relative;
      overflow: hidden;
      background-color: #000000;
    }

    .italic-about-23 {
      font-style: italic;
      font-family: ITC Galliard Std !important;
    }

    .mobile-screen-container {
      z-index: 10;
      width: 100%;
      height: 100%;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      position: relative;
    }

    .mobile-screen-column-1 {
      width: 25vw;
      padding-left: 30px;
      padding-right: 30px;
    }

    .about-two-size43 {
      font-size: 22px;
      font-weight: 500;
      margin-bottom: 40px;
      line-height: 140%;
      font-family: NeueHaasUnica !important;
    }

    .about-tophead23 {
      padding-top: 80px;
    }

    .about-twobox-23 {
      font-size: 18px;
      color: #181818;
      line-height: 200%;
      font-family: NeueHaasUnica !important;
    }

    .giles-brings-para23 {
      font-size: 22px;
      line-height: 140%;
      font-family: NeueHaasUnica !important;
    }

    .logo-text17 {
        font-size: 22px;
        line-height: 140%;
        font-family: NeueHaasUnica !important;
    }

    .pd-px-456 {
      padding-right: 80px;
      padding-left: 80px;
    }

    .pd-px-298 {
      padding-right: 80px !important;
      padding-left: 80px !important;
    }

    .mobile-screen {
      border-radius: 20px !important;
      margin-bottom: 30px !important;
      padding-bottom: 0 !important;
      padding-left: 0 !important;
      padding-right: 0 !important;
      border-top: 1px solid #00000040 !important;
      border-bottom: 1px solid #00000040 !important;
    }

    .mobile-screens.wild {
      color: #f1f1f0;
      background-color: silver;
      border-top-style: none;
      border-bottom-style: none;
      margin-left: 50px;
      margin-right: 50px
    }

    .mobile-screens.anya {
      background-color: #e7e7e7;
      border-top-style: none;
      border-bottom-style: none
    }

    .custom-header {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-align: center;
          -ms-flex-align: center;
              align-items: center;
      padding: 75px;
    }

    .giles-title43 {
      font-size: 22px;
      font-family: NeueHaasUnica !important;
      font-weight: 400;
      -webkit-box-align: center;
          -ms-flex-align: center;
              align-items: center;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
    }

    .custom-header .left-section {
      font-size: 70px !important;
      line-height: 120% !important;
      font-weight: 400;
      font-family: GalliardStd !important;
    }

    .right-section a {
      color: black;
      text-decoration: none;
      font-size: 16px;
      font-weight: 600;
      margin-right: 5rem;
    }

    .mobile-screens.kaufmann {
      background-color: #f0f0f0;
      border-top-color: rgba(15, 15, 15, .1);
      border-bottom-color: rgba(15, 15, 15, .1)
    }

    .underline-about92 {
      border-bottom: 2px solid #e1e1e1 !important;
      margin-top: 140px;
    }

    .mobile-screens.class {
      background-color: white;
    }

    .last_sec_abouthead {
      font-size: 64px !important;
      line-height: 120% !important;
      font-weight: 400 !important;
      font-family: GalliardStd !important;
      color: #171717;
      margin-top: 130px;
    }

    .clr-lastabout {
      background-color: #2ba4a2;
    }

    .connect_text_p40 {
      font-weight: 400;
      font-size: 24px;
      cursor: pointer;
      padding-right: 10px;
      color: #171717;
      line-height: 150%;
    }

    .contact_mb20 {
      margin-bottom: 145px;
    }

    [type="checkbox"]:focus,
    {
    --tw-ring-inset: var(--tw-empty,
      );
    --tw-ring-offset-width: 0.125rem;
    --tw-ring-offset-color: #fff;
    --tw-ring-color: #ffffff !important;
    }

    .mt-xl-b239 {
      margin: 16.5rem 2rem 3.75rem 2rem;
    }

    .percent120:before {
      content: "£" !important;
      display: inline-block;
    }

    .showreel-play-button {
      z-index: 10000;
      opacity: 1;
      cursor: pointer;
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
          -ms-flex-direction: column;
              flex-direction: column;
      -webkit-box-pack: center;
          -ms-flex-pack: center;
              justify-content: center;
      -webkit-box-align: center;
          -ms-flex-align: center;
              align-items: center;
      width: 130px;
      height: 130px;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      position: absolute;
      inset: 50% 0% auto 50%;
      right: auto;
      -webkit-transform: translate(-50%, -50%);
          -ms-transform: translate(-50%, -50%);
              transform: translate(-50%, -50%)
    }

    .div-block-28 {
      background-color: rgba(255, 255, 255, .05);
      width: 100%;
      height: 100%;
      margin-right: 0;
      padding-right: 0;
      display: none;
    }



    .play-icon {
      cursor: pointer;
      width: 25px;
      padding-left: 5px;
      position: absolute
    }

    .play-icon.work {
      width: 40px;
      padding-left: 0
    }

    .w-embed:before,
    .w-embed:after {
      content: " ";
      -ms-grid-row: 1;
      -ms-grid-row-span: 1;
      -ms-grid-column: 1;
      -ms-grid-column-span: 1;
      grid-area: 1 / 1 / 2 / 2;
      display: table;
    }

    .view-all-service-btn i {
      font-size: 0.75rem !important;
      color: black;
    }

    .view-all-service-btn {
      padding: 7px 10px 7px 9px;
      border: 0.0625rem solid black;
      border-radius: 1.25rem;
      margin: 0rem 0.375rem;
      -webkit-transition: all 0.3s ease-in-out;
      -o-transition: all 0.3s ease-in-out;
      transition: all 0.3s ease-in-out;
    }

    .form-field {
      margin-bottom: 70px !important;
    }

    .view-all-service-btn:hover .h-black {
      font-size: 0.9375rem;
      color: rgb(0, 0, 0) !important;
    }

    .view-all-service-btn i {
      font-size: 0.75rem !important;
      color: black;
    }

    .line-contact23 {
      margin-bottom: 10px !important;
    }

    /* Change color when the FAQ is expanded */
    .down-arrow-btn:not(.collapsed) .fa-angle-down {
      color: #ffffff !important;
      /* Change to your desired color when expanded */
    }

    /*button CSS */
    .button-80 {
      margin-bottom: 0.5rem !important;
      white-space: nowrap;
      background: transparent;
      -webkit-backface-visibility: hidden;
      backface-visibility: hidden;
      border-radius: 0.375rem;
      border-style: solid;
      border-width: 0.0625rem;
      -webkit-box-sizing: border-box;
      box-sizing: border-box;
      color: #ffffff;
      cursor: default !important;
      display: inline-block;
      font-family: Circular, Helvetica, sans-serif;
      font-size: 0.75rem;
      font-weight: 400;
      letter-spacing: -0.01em;
      line-height: 1.3;
      padding: 0.4rem 0.8rem 0.35rem 0.8rem;
      position: relative;
      text-align: left;
      text-decoration: none;
      -webkit-transform: translateZ(0) scale(1);
      transform: translateZ(0) scale(1);
      -webkit-transition: -webkit-transform 0.2s;
      transition: -webkit-transform 0.2s;
      -o-transition: transform 0.2s;
      transition: transform 0.2s;
      transition: transform 0.2s, -webkit-transform 0.2s;
      -moz-user-select: none;
      -ms-user-select: none;
      user-select: none;
      -webkit-user-select: none;
      -ms-touch-action: manipulation;
      touch-action: manipulation;
      margin-right: 0.5rem !important;
    }

    .button-80:focus {
      outline: 0 solid transparent;
    }

    .button-80:focus:before {
      content: "";
      left: calc(-1 * 0.375rem);
      pointer-events: none;
      position: absolute;
      top: calc(-1 * 0.375rem);
      -webkit-transition: border-radius;
      -o-transition: border-radius;
      transition: border-radius;
      -webkit-user-select: none;
      -moz-user-select: none;
      -ms-user-select: none;
      user-select: none;
    }

    /* view all */
    .button-view {
      position: relative;
      display: inline-block;
      cursor: pointer;
      outline: none;
      border: 0;
      vertical-align: middle;
      text-decoration: none;
      background: transparent;
      padding: 0;
      font-size: inherit;
      font-family: inherit;
    }

    .button-view.learn-more {
      height: auto;
    }

    .button-view.learn-more .circle {
      -webkit-transition: all 0.45s cubic-bezier(0.65, 0, 0.076, 1);
      -o-transition: all 0.45s cubic-bezier(0.65, 0, 0.076, 1);
      transition: all 0.45s cubic-bezier(0.65, 0, 0.076, 1);
      position: relative;
      display: block;
      margin: 0;
      width: 3rem;
      height: 3rem;
      background: #282936;
      border-radius: 1.625rem;
    }

    .button-view.learn-more .circle .icon {
      -webkit-transition: all 0.45s cubic-bezier(0.65, 0, 0.076, 1);
      -o-transition: all 0.45s cubic-bezier(0.65, 0, 0.076, 1);
      transition: all 0.45s cubic-bezier(0.65, 0, 0.076, 1);
      position: absolute;
      top: 0;
      bottom: 0;
      margin: auto;
      background: #fff;
    }

    .button-view.learn-more .circle .icon.arrow {
      -webkit-transition: all 0.45s cubic-bezier(0.65, 0, 0.076, 1);
      -o-transition: all 0.45s cubic-bezier(0.65, 0, 0.076, 1);
      transition: all 0.45s cubic-bezier(0.65, 0, 0.076, 1);
      left: 0.625rem;
      width: 1.125rem;
      height: 0.125rem;
      background: none;
    }

    .owl-carousel .owl-nav .owl-prev {
      left: 0;
      cursor: url(https://goodwebsitedevsite.eternalsoft.in/wp-content/uploads/2024/07/left-slider-2x.png), move;
      cursor: url(https://goodwebsitedevsite.eternalsoft.in/wp-content/uploads/2024/07/left-slider-2x.png) 16 16, move;
  }

  .owl-carousel .owl-nav .owl-next {
      right: 0;
      cursor: url(https://goodwebsitedevsite.eternalsoft.in/wp-content/uploads/2024/07/right-slider-2x.png), move;
      cursor: url(https://goodwebsitedevsite.eternalsoft.in/wp-content/uploads/2024/07/right-slider-2x.png) 16 16, move;
  }

  .owl-carousel .owl-nav [class*="owl-"]:hover {
      background: transparent;
  }

    .button-view.learn-more .circle .icon.arrow::before {
      position: absolute;
      content: "";
      top: -0.29rem;
      right: 0.0625rem;
      width: 0.625rem;
      height: 0.625rem;
      border-top: 0.125rem solid #fff;
      border-right: 0.125rem solid #fff;
      -webkit-transform: rotate(45deg);
      -ms-transform: rotate(45deg);
      transform: rotate(45deg);
    }

    .button-view .learn-more .button-view-text {
      -webkit-transition: all 0.45s cubic-bezier(0.65, 0, 0.076, 1);
      -o-transition: all 0.45s cubic-bezier(0.65, 0, 0.076, 1);
      transition: all 0.45s cubic-bezier(0.65, 0, 0.076, 1);
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      bottom: 0;
      padding: 0.75rem 0;
      margin: 0 0 0 1.85rem;
      color: #282936;
      font-weight: 700;
      line-height: 1.6;
      text-align: center;
      text-transform: uppercase;
    }

    .button-view:hover .circle .icon.arrow {
      background: #fff;
      -webkit-transform: translate(1rem, 0);
      -ms-transform: translate(1rem, 0);
      transform: translate(1rem, 0);
    }

    .button-view:hover .button-view-text {
      color: #fff;
    }

    .view-all-btn {
      padding: 0rem 0.5rem 0.0625rem 0.5rem;
      border: 0.0625rem solid white;
      border-radius: 1.25rem;
      margin: 0rem 0.375rem;
      -webkit-transition: all 0.3s ease-in-out !important;
      -o-transition: all 0.3s ease-in-out !important;
      transition: all 0.3s ease-in-out !important;
    }

    .view-all-btn:hover {
      padding: 0rem 1.0725rem 0.0625rem 1.0725rem;
      border: 0.0625rem solid white;
      border-radius: 1.25rem;
      margin: 0rem 0.375rem;
      background: #eeeeee !important;
      color: black !important;
      -webkit-transition: all 0.3s ease-in-out;
      -o-transition: all 0.3s ease-in-out;
      transition: all 0.3s ease-in-out;
    }

    .view-all-btn:hover .h-black {
      font-size: 0.9375rem;
      color: rgb(0, 0, 0) !important;
    }

    .view-all-btn i {
      font-size: 0.75rem !important;
      color: white;
    }

    .font-35 {
      font-size: 2.1875rem !important;
    }

    .view-ptext {
      font-size: 0.875rem;
      font-weight: 200;
      max-width: 430px;
    }

    .viewalltext-divp {
      position: absolute;
      bottom: 0;
      -webkit-transition: all 0.5s ease-in-out;
      -o-transition: all 0.5s ease-in-out;
      transition: all 0.5s ease-in-out;
      padding: 26px 40px;
      width: 100%;
      opacity: 1;
    }

    .viewalltext-divp-black {
      position: absolute;
      bottom: 0;
      -webkit-transition: all 0.5s ease-in-out;
      -o-transition: all 0.5s ease-in-out;
      transition: all 0.5s ease-in-out;
      padding: 26px 40px;
      width: 100%;
      opacity: 1;
    }

    .viewalltext-divp2 {
      position: absolute;
      bottom: 0;
      -webkit-transition: all 0.5s ease-in-out;
      -o-transition: all 0.5s ease-in-out;
      transition: all 0.5s ease-in-out;
      padding: 26px 40px;
      width: 100%;
    }

    .view-proj-text {
      font-weight: 200;
      font-size: 1.125rem;
      cursor: pointer;
    }

    .viewallmain {
      top: 0;
      left: 0;
      height: 100%;
      width: 100%;
    }

    .black-opa {
      background: #0000004d;
      -webkit-transition: background;
      -o-transition: background;
      transition: background;
      -webkit-transition-duration: 0.5s;
      -o-transition-duration: 0.5s;
      transition-duration: 0.5s;
    }

    .bg-custom-grey {
      background: #f8f8f8 !important;
    }

    .bg-graymain190 {
      background: #f0f0f0 !important;
    }

    .cfont-115 {
      font-family: GalliardStd;
      font-weight: 500;
      font-size: 6vw;
      line-height: 140%;
      letter-spacing: -1px;
    }

    .contact-form-control::-webkit-input-placeholder {
      color: #959595ba !important; /* Replace with your desired color */
      opacity: 1; /* Ensures full opacity */
    }

    .contact-form-control::-moz-placeholder {
      color: #959595ba !important; /* Replace with your desired color */
      opacity: 1; /* Ensures full opacity */
    }

    .contact-form-control:-ms-input-placeholder {
      color: #959595ba !important; /* Replace with your desired color */
      opacity: 1; /* Ensures full opacity */
    }

    .contact-form-control::-ms-input-placeholder {
      color: #959595ba !important; /* Replace with your desired color */
      opacity: 1; /* Ensures full opacity */
    }

    .contact-form-control::placeholder {
      color: #959595ba !important; /* Replace with your desired color */
      opacity: 1; /* Ensures full opacity */
    }

    .textarea::-webkit-input-placeholder {
      color: #959595ba !important; /* Replace with your desired color */
      opacity: 1; /* Ensures full opacity */
    }

    .textarea::-moz-placeholder {
      color: #959595ba !important; /* Replace with your desired color */
      opacity: 1; /* Ensures full opacity */
    }

    .textarea:-ms-input-placeholder {
      color: #959595ba !important; /* Replace with your desired color */
      opacity: 1; /* Ensures full opacity */
    }

    .textarea::-ms-input-placeholder {
      color: #959595ba !important; /* Replace with your desired color */
      opacity: 1; /* Ensures full opacity */
    }

    .textarea::placeholder {
      color: #959595ba !important; /* Replace with your desired color */
      opacity: 1; /* Ensures full opacity */
    }

    input[type="date"] {
      color: #959595ba !important;
    }

    .cround-btn {
      background: transparent;
      -webkit-backface-visibility: hidden;
      backface-visibility: hidden;
      border-radius: 0.313rem;
      border-style: solid;
      border-width: 1.59px;
      -webkit-box-sizing: border-box;
      box-sizing: border-box;
      color: #181818;
      border-color: #181818;
      cursor: pointer;
      display: inline-block;
      font-family: NeueHaasUnica !important;
      font-size: 16px;
      font-weight: 400;
      line-height: 1.3;
      padding: 0.962rem 1.875rem 0.702rem 1.875rem;
      position: relative;
      text-align: left;
      text-decoration: none;
      -webkit-transform: translateZ(0) scale(1);
      transform: translateZ(0) scale(1);
      -webkit-transition: -webkit-transform 0.2s;
      transition: -webkit-transform 0.2s;
      -o-transition: transform 0.2s;
      transition: transform 0.2s;
      transition: transform 0.2s, -webkit-transform 0.2s;
      -moz-user-select: none;
      -ms-user-select: none;
      user-select: none;
      -webkit-user-select: none;
      -ms-touch-action: manipulation;
      touch-action: manipulation;
      /*margin-right: 0.625rem !important;*/
    }

    :after,
    :before {
      --tw-content: "";
    }

    .after\:duration-300:after {
      content: var(--tw-content);
      -webkit-transition-duration: .3s;
           -o-transition-duration: .3s;
              transition-duration: .3s;
    }

    .after\:transition-opacity:after {
      -webkit-transition-property: opacity;
      -o-transition-property: opacity;
      transition-property: opacity;
      -webkit-transition-timing-function: cubic-bezier(.4, 0, .2, 1);
           -o-transition-timing-function: cubic-bezier(.4, 0, .2, 1);
              transition-timing-function: cubic-bezier(.4, 0, .2, 1);
    }

    .after\:bg-white:after {
      --tw-bg-opacity: 1;
      background-color: rgb(255 255 255);
    }

    .after\:w-full:after {
      width: 100%;
    }

    .after\:h-1:after {
      height: 1px;
    }

    .after\:z-30:after {
      z-index: 30;
    }

    .after\:left-0:after {
      left: 0;
    }

    .after\:bottom-\[-10px\]:after {
      bottom: -10px;
    }

    .after\:absolute:after {
      position: absolute;
    }

    .after\:opacity-100:after {
      opacity: 1;
    }


    .cusf-145 {
      font-size: 1.375rem;
      line-height: 150%;
    }

    .cta-above-footer {
      background-color: #b97d42;
    }

    .about-three-col-innnercol {
      padding: 0px 66px 40px 66px !important;
    }

    .cta-heading {
      font-size: 70px;
      color: white;
      line-height: 110%;
    }

    /* scroll css */

    /* .wrapper {
                width: 100%;
                height: 100%;
                overflow: hidden;
                -webkit-perspective: 1000;
                perspective: 1000;
              } */

    .wrapper {
      width: 100%;
      height: 100%;
      overflow: hidden;
      -webkit-perspective: 1000;
      display: -ms-grid !important;
      display: grid !important;
      inset: 0 !important;
      position: absolute !important;
      top: 0;
    }

    .section {
      height: 100%;
      width: calc(100% / 0.2);
      float: left;
      position: relative;
    }


    .right-section a:after {
    background-color: #000;
    content: "";
    height: 18px;
    -webkit-mask: url(https://goodwebsitedevsite.eternalsoft.in/wp-content/uploads/2024/07/diagonal.svg) -6px -6px / 32px 32px repeat;
    mask: url(https://goodwebsitedevsite.eternalsoft.in/wp-content/uploads/2024/12/diagonal.svg) -6px -6px / 32px 32px repeat;
    -webkit-transition: -webkit-mask-position .5s ease;
    transition: -webkit-mask-position .5s ease;
    transition: mask-position .5s ease;
    transition: mask-position .5s ease, -webkit-mask-position .5s ease;
    width: 18px;
     margin: 2px 10px 5px 10px;
    position: absolute;
    }
    .right-section a:hover::after,.right-section a:focus::after {
    -webkit-mask-position: 25px -39px;
    mask-position: 25px -39px
}

    .sections {
      width: 150%;
      height: 100%;
    }

    .about-interview23 {
      margin-top: 35px;
      padding: 0.962rem 1.20rem 0.702rem 1.20rem;
    }

    .right-scrolling .red-box {
      background: red;
      border: 0.0625rem solid black;
      height: 12.5rem;
      width: 12.5rem;
    }

    .ftext-36 {
      font-size: 3rem;
      line-height: 120%;
    }

    .testimon-mob-img {
      display: none;
    }

    .span-link-footer {
      color: white;
      font-size: 18px;
      white-space: nowrap !important;
    }

    .copy-right-text {
      position: relative;
      display: inline;
      top: 40%;
    }

    .testinmonial-btn-mt-20 {
      margin-top: 40px;
      margin-bottom: 2px;
    }

    .red-box {
      height: 18.75rem;
      width: 12.5rem;
      background: black;
    }

    .background-video-main {
      height: 100vh;
      opacity: 1;
      -o-object-fit: cover;
      object-fit: cover;
      padding-left: 1.5625rem;
      position: sticky;
      top: 0;
    }

    .about-hero-img{
      height: 100vh;
      background-size: cover;
      background-position: center;
    }

    .nav-links {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-pack: center;
          -ms-flex-pack: center;
              justify-content: center;
      list-style: none;
      gap: 40px;
    }

    .nav-links a {
      text-decoration: none;
      color: white;
      font-size: 16px;
      font-weight: 400;
      position: relative;
    }


    .prograssive-main33 {
      font-size: 40px !important;
      line-height: 120% !important;
      font-weight: 400 !important;
      font-family: GalliardStd !important;
      color: #181818;
      padding-top: 83px;
    }

    .nav-links li a:hover::after,
    .nav-links li a:focus::after {
      content: '';
      display: block;
      height: 2px;
      background-color: white;
      position: absolute;
      bottom: -5px;
      left: 0;
      right: 0;
    }


    .section23-black {
      -webkit-box-pack: center;
          -ms-flex-pack: center;
              justify-content: center;
      -webkit-box-align: center;
          -ms-flex-align: center;
              align-items: center;
      width: 100%;
      height: auto;
      color: #fff;

      &[data-bg="black"] {
        color: #000000;
      }
    }

    .showreel_container {
      z-index: 2000;
      width: 100%;
      height: 202vh;
      margin-top: -90px;
      position: static;
    }

    .showreel_container_pdpage {
      z-index: 2000;
      width: 100%;
      height: 198vh;
      margin-top: -79px;
      position: static;
    }

    .desjoyaux_container_pdpage {
      z-index: 2000;
      width: 100%;
      height: 195vh;
      margin-top: -79px;
      position: static;
    }

    .showreel_container.bottom-0 {
      margin-bottom: 0;
    }

    .showreel_container.articles {
      height: auto;
    }

    .background-video-6 {
      height: 100vh;
      opacity: 1;
      -o-object-fit: cover;
      object-fit: cover;
      position: sticky;
      top: 0;
    }

    .background-video-6.opaque {
      -webkit-filter: saturate(70%) brightness(92%);
      filter: saturate(70%) brightness(92%);
    }

    .grid-service-23 {
      -ms-grid-columns: (minmax(0, 1fr))[9];
      grid-template-columns: repeat(9, minmax(0, 1fr));
    }

    .intro {
      z-index: 2;
      width: 100%;
      height: 80vh;
      background-color: var(--black);
      padding: 3.125rem;
      position: absolute;
      color: black;
      background: white;
    }

    .rte ul {
      -moz-column-gap: var(--spacing-gutter) !important;
      -webkit-column-gap: var(--spacing-gutter) !important;
              column-gap: var(--spacing-gutter) !important;
      display: -ms-grid !important;
      display: grid !important;
      grid-auto-rows: -webkit-min-content !important;
      grid-auto-rows: min-content !important;
      -ms-grid-columns: minmax(0, 1fr) var(--spacing-gutter) minmax(0, 1fr) !important;
      grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
      margin-top: 26px !important;
    }

    .web-bullet {
      font-size: 18px;
      font-family: NeueHaasUnica !important;
      line-height: 140%;
      font-weight: 400;
      margin-bottom: 11px;
      color: #ffffff;
    }

    .section-studio-head-23 {
      padding-top: 125px;
    }

    .section-perfect-head-23 {
      padding-top: 170px;
    }

    .progressive-paragraph-sec23 {
      font-size: 18px;
      line-height: 180%;
      font-weight: 400 !important;
      font-family: NeueHaasUnica !important;
      color: #181818;
      padding-top: 30px;
      width: 96%;
    }

    .progressive-head43 {
      font-size: 40px;
      line-height: 120%;
      font-weight: 400 !important;
      font-family: GalliardStd !important;
      color: #181818;
      padding-top: 35px;
    }

    .progressive-paragraph-sec43 {
      font-size: 18px;
      line-height: 150%;
      font-weight: 400 !important;
      font-family: NeueHaasUnica !important;
      color: #181818;
      padding-top: 30px;
    }

    .studio-head43 {
      font-size: 40px;
      line-height: 120%;
      font-weight: 400;
      font-family: GalliardStd !important;
      color: #181818;
      padding-top: 83px;
    }

    .intro-pd {
      z-index: 2;
      width: 100%;
      height: 100vh;
      background-color: var(--black);
      padding: 3.125rem;
      position: absolute;
      color: black;
      background: white;
      display: -webkit-inline-box !important;
      display: -ms-inline-flexbox !important;
      display: inline-flex !important;
    }

    .desjoyauz-pd {
      z-index: 2;
      width: 100%;
      height: auto;
      background-color: var(--black);
      padding: 3.125rem;
      position: absolute;
      color: black;
      background: white;
      display: -webkit-inline-box !important;
      display: -ms-inline-flexbox !important;
      display: inline-flex !important;
    }

    .back-blue23 {
      background-color: #000000;
    }

    .bg-colprop100 {
      height: 100vh;
      background-size: cover;
      background-position: center;
    }

    .mt-xl-c60 {
      margin: 12.5rem 10rem 3.75rem 10rem;
    }

    .mt-about-23 {
      margin: 12.5rem 10rem 3.75rem 10rem;
    }
    .mt-service-23 {
      margin: 12.5rem 7rem 3.75rem 2rem;
  }

    .top-8 {
      top: 0.5rem !important;
    }

    .right-sticky {
      position: sticky;
      top: 3.125rem;
      bottom: auto;
    }

    .more-btn:hover {
      background: black;
      color: white;
      -webkit-transition: all 0.3s;
      -o-transition: all 0.3s;
      transition: all 0.3s;
    }

    .underline-service23 {
      border-bottom: 1px solid #cfcfcf;
      margin-top: 58px !important;
      margin-bottom: 58px !important;
    }

    .underline-service34 {
      border-bottom: 1px solid #cfcfcf;
      margin-top: 58px !important;
    }

    .blue-clr-back23 {
      background-color: #000000;
      background: #000000;
      display: block;
      content: "";
      height: 14.5rem;
      width: 100%;
      z-index: 1;
      position: relative;
    }

    .navigation-font23 {
      font-size: 18px !important;
      font-weight: 400 !important;
      font-family: NeueHaasUnica !important;
      cursor: pointer;
    }

    /* .section-margin-sec23{
      padding-bottom: 5rem;
    } */

    .about-logo-company64 {
      padding-top: 40px;
      padding-right: 23%;
      padding-left: 23%;
      margin-bottom: 75px;
    }

    .about-logo-company64 p {
      color: #000;
    }

    .bg-colprop4 {
      height: 54vh;
      background-size: cover;
      background-position: center;
    }

    .grid-gap-23 {
      display: flex !important;
      gap: 38px;
  }
    .grid-main-23{
   row-gap: 38px;
  }
    .intro_container {
      position: absolute;
      bottom: 0;
      left: 0;
      right: 0;
    }

    .about-bottom12 {
      margin-top: -10px;
      margin-bottom: 160px;
    }

    .navigation-height23{
        height: 155px;
    }

    .perfect-team-p23 {
      font-size: 24px;
      line-height: 150%;
      font-weight: 400 !important;
      font-family: NeueHaasUnica !important;
      color: #181818;
      margin-top: 80px;
      width: 80%;
      color: #181818;
    }

    .hidden {
      transform: translateY(-100%); /* Move out of view */
      opacity: 0; /* Fade out */
    }

    .perfect-team-p34 {
      font-size: 24px;
      line-height: 150%;
      font-weight: 400;
      font-family: GalliardStd !important;
      color: #181818;
      margin-top: 40px;
      width: 85%;
    }

    .above-footer-img {
      height: 160px;
      width: 160px;
      position: absolute;
      right: 0;
      top: 19.2%;
      margin-right: 10px;
    }

    .quote-img-main {
      height: 52px;
      width: auto;
    }

    .height-px2 {
      height: 2px;
      margin-bottom: 56px;
    }

    .quote-img svg {
      margin-bottom: 36px;
    }

    .resp-service-pb {
      padding-bottom: 32px;
    }
    .home-proj-text {
      cursor: pointer;
      font-size: 22px;
      font-weight: 400;
      font-family: NeueHaasUnica !important;
      color: #181818;
      text-decoration: underline;
      text-underline-offset: 5px;
  }
  .link-space23{
      margin-top: 45px;
  }
  .testi-link-space23{
    margin-top: 40px !important;
}


    @media screen and (min-device-width: 101.76rem) {
      .hover\:text-white-50:hover {
        color: hsl(0deg 3.78% 59.57% / 78%) !important;
      }
    }

    @media screen and (min-device-width: 120rem) {
      .scrollmagic-pin-spacer {
        height: 37.5rem !important;
      }

      .projects-column img {
        height: 100%;
        width: 100%;
        -webkit-box-shadow: rgba(0, 0, 0, 0.35) 0rem 0.3125rem 1.3125rem;
        box-shadow: rgba(0, 0, 0, 0.35) 0rem 0.3125rem 1.3125rem;
      }
    }

    @media screen and (min-device-width: 101.75rem) and (max-device-width: 120rem) {
      .scrollmagic-pin-spacer {
        height: 31.25rem !important;
      }

      .projects-column img {
        height: 100%;
        width: 100%;
        -webkit-box-shadow: rgba(0, 0, 0, 0.35) 0rem 0.3125rem 1.3125rem;
        box-shadow: rgba(0, 0, 0, 0.35) 0rem 0.3125rem 1.3125rem;
      }
    }

    @media screen and (min-device-width: 64.3125rem) and (max-device-width: 101.75rem) {
      .scrollmagic-pin-spacer {
        height: 25rem !important;
      }

      .projects-column img {
        height: 100%;
        width: 100%;
        -webkit-box-shadow: rgba(0, 0, 0, 0.35) 0rem 0.3125rem 1.3125rem;
        box-shadow: rgba(0, 0, 0, 0.35) 0rem 0.3125rem 1.3125rem;
      }
    }

    /*Medium device laptop style */

    @media screen and (min-device-width: 64.25rem) and (max-device-width: 101.5rem) {
      .font-30 {
        font-size: 1.5625rem !important;
      }

      .pd-whiteslide-heading {
        font-size: 60px;
        line-height: 110%;
        font-weight: 400;
      }

      .pd-services-heading {
        font-size: 50px !important;
        line-height: normal;
        font-weight: 400;
      }

      .some_goodweb_head {
        padding-top: 90px;
        padding-bottom: 60px;
        font-size: 18px;
        font-family: GalliardStd !important;
        font-weight: 500;
      }

      .web-bullet {
        font-size: 15px !important;
        line-height: 140% !important;
        font-weight: 400 !important;
      }

      .contact-head-main-left {
        font-size: 40px !important;
        line-height: 120% !important;
        font-weight: 400 !important;
        font-family: GalliardStd !important;
        margin-bottom: 45px !important;
      }

      .navigation-font23 {
        font-size: 15px !important;
        line-height: normal !important;
      }

      .font-c50 {
        font-size: 40px !important;
        line-height: 120%;
      }

      .mh-90 {
        margin: 0 !important;
        height: 120vh;
      }

      .about-company-pd {
        padding-right: 3%;
        margin-top: 120px !important;
        margin-bottom: 120px !important;
        padding-left: 3%;
      }
      .desjoyauz-intro-pd23{
        padding-right: 3%;
        margin-top: 95px !important;
        margin-bottom: 80px !important;
        padding-left: 3%;
      }
      .green-intro-pd23{
        padding-right: 3%;
        margin-top: 75px !important;
        margin-bottom: 80px !important;
        padding-left: 3%;
      }
      .green-wolf-img23 {
        position: relative;
        z-index: 10;
      }

      .big-ss-top {
        padding-top: 90px !important;
        padding-bottom: 121px !important;
      }

      .big-pic {
        margin-top: 27px !important;
      }

      .mb-down {
        margin-bottom: 41px !important;
      }

      .cust-m-pdhero {
        margin-bottom: 0rem;
        margin-top: 0rem !important;
      }

      .cust-mt-7 {
        margin-top: 64px !important;
      }

      .cust-mt-2 {
        margin-top: 15px !important;
      }

      .cust-mt-10 {
        padding-top: 160px !important;
        padding-bottom: 160px !important;
      }

      .pd-right {
        padding-right: 45px !important;
      }

      .showreel_container_pdpage {
        z-index: 2000;
        width: 100%;
        height: 200vh;
        margin-top: -79px;
        position: static;
      }

      .desjoyaux_container_pdpage {
        z-index: 2000;
        width: 100%;
        height: 195vh;
        margin-top: -79px;
        position: static;
      }


      .viewalltext-divp-pd {
        padding: 30px 45px;
      }


      .service-btn-margin46 {
        margin-top: 80px;
        margin-bottom: 80px !important;
      }

      .abv-footer-proj-img-margin {
        margin-bottom: 38px;
      }

      .proj-over-single {
        padding-bottom: 0 !important;
      }

      .csm-lg-dvc-4 {
        margin: 1.71rem;
      }

      .cround-btn {
        font-size: 0.875rem !important;
      }

      .about-description23 {
        font-size: 18px;
        color: #181818;
        line-height: 140% !important;
        padding-top: 10px !important;
            padding-bottom: 8px;
      }

      .above-footer-img {
        height: 122px;
        width: 122px;
        position: absolute;
        right: 0;
        top: 20.2%;
        margin-right: 10px;
      }

      .testimonial-mtext {
        font-size: 25px;
        line-height: 130%;
      }

      .testimonial-mtext-pd {
        font-size: 22px;
        line-height: 140%;
        padding-top: 5rem;
        padding-bottom: 4.5rem;
      }

      .testimonial-clientdt {
        font-size: 15px;
        line-height: 150%;
      }

      .main-about-paragrph50 {
        margin-top: 16px !important;
        font-size: 15px !important;
        line-height: 180% !important;
        margin-bottom: 15px !important;
      }

      .sec-tm-one {
        font-size: 50px !important;
        font-family: GalliardStd !important;
        margin-top: 90px !important;
        margin-bottom: 30px !important;
        line-height: 120%;
        font-weight: 400;
      }

      .menubutton-inline-a {
        font-size: 1.563rem !important;
      }

      .menubutton-inheading {
        font-size: 3.125rem !important;
      }

      .text-14 {
        font-size: 0.9375rem !important;
        line-height: 150%;
      }

      .footer-text {
        margin-top: 2rem;
        width: 57%;
      }

      #myNav {
        top: 28vh !important;
      }

      .view-proj-text {
        font-weight: 200;
        font-size: 0.9375rem;
      }

      .cusf-145 {
        font-size: 1.125rem;
      }

      .cta-heading {
        font-size: 50px;
        line-height: 120%;
      }

      .ftext-36 {
        font-size: 40px;
      }

      .italic-text-3 {
        font-size: 18px;
        font-family: ITC Galliard Std !important;
      }

      .span-link-footer,
      .link-footer {
        font-size: 15px;
      }

      .copyright-link {
        font-size: 14px !important;
      }

      .cust-mb-home-link {
        margin-bottom: 1.5rem !important;
      }

      .main-menu-ul .leading-none {
        line-height: 1 !important;
      }

      /*Medium device laptop style code by abhii */
      .servie-ptext {
        font-size: 18px;
        line-height: normal;
      }

      .about-three-col-heading {
        font-size: 18px !important;
        line-height: normal !important;
      }

      .about-col-head23 {
        font-size: 18px !important;
        line-height: normal !important;
        margin-bottom: 60px;
      }

      .about-three-col-row {
        padding-bottom: 25px !important;
      }

      .full-ss-intro {
        font-size: 22px;
        line-height: 140%;
      }

      .full-ss-p {
        font-size: 18px;
        line-height: 150% !important;
      }

      .sec-tm-two {
        font-size: 18px !important;
        line-height: 180% !important;
      }

      .testimonial-p {
        font-size: 25px;
        line-height: 130%;
      }

      .testimonial-name {
        font-size: 15px;
        line-height: 150%;
      }

      .btn-live-website {
        font-size: 18px;
        line-height: 140%;
      }

      .head-two-right {
        font-size: 30px;
        line-height: 120%;
        margin-top: 50px !important;
      }

      .blue-clr-back23 {
        height: 12rem !important;
      }

      .three-website-sec10 {
        padding-top: 200px !important;
        margin-top: -80px !important;
    }

      .underline-service23 {
        margin-top: 38px !important;
        margin-bottom: 38px !important;
      }

      .sec-head10 {
        padding-bottom: 75px !important;
      }

      .up-tag {
        font-size: 15px;
      }

      .heading-one {
        font-size: 30px;
      }

      .btn-img-text {
        font-size: 15px;
        font-weight: 300;
        line-height: 180%;
      }

      /*service page Medium device laptop style code by abhii */
      .head-main {
        font-size: 50px !important;
      }

      .slider-head-main {
        font-size: 40px !important;
      }

      .mt-xl-b40 {
        margin: 14.5rem 15rem 10.75rem 15rem;
      }

      .head-main-left {
        font-size: 50px !important;
      }

      .head-first-23 {
        font-size: 50px !important;
      }

      .info-p1 {
        font-size: 18px;
      }

      .head-right {
        font-size: 30px;
        line-height: 120%;
        margin-bottom: 1rem;
      }

      .info-right {
        font-size: 15px !important;
        line-height: 180% !important;
      }

      .info-two-right {
        font-size: 15px !important;
        line-height: 180% !important;
      }

      .smallhead-one-right {
        font-size: 18px;
        margin-top: 30px !important;
        margin-bottom: 10px;
      }

      .info-creative-right {
        font-size: 15px;
      }

      .replatforming-sec {
        font-size: 15px;
      }

      .head-one-right {
        font-size: 30px;
        line-height: 120%;
        margin-top: 55px !important;
      }

      .service-header {
        z-index: 2;
        width: 100%;
        height: 95vh;
      }

      .service_container {
        z-index: 2000;
        width: 100%;
        height: 95vh;
      }

      .website_220_top {
        padding-top: 0px;
      }

      .website-sec {
        font-size: 15px;
        margin-top: 5px !important;
        margin-bottom: 25px;
      }

      .underline-sec {
        border-bottom: 1px solid #636e80;
        margin-top: 25px !important;
      }

      .underline-white {
        border-bottom: 1px solid #636e80;
        margin-top: 25px !important;
      }

      .replatforming-sec {
        margin-top: 5px !important;
        margin-bottom: 25px;
      }

      .rte ul div {
        font-size: 15px !important;
        line-height: 140% !important;
      }

      .num-ft-section {
        font-size: 75px;
      }

      .text-ft-section {
        font-size: 20px;
      }

      .text-bt-section {
        font-size: 20px;
      }

      .service-btn {
        margin-top: 110px !important;
      }

      /*about Medium device laptop style code by abhii */
      .some_goodweb_paragraph20 {
        font-size: 20px;
        margin-bottom: 190px !important;
      }

      .some_goodweb_para-last30 {
        font-size: 20px;
      }

      .text-project2 {
        font-size: 15px;
        line-height: 180%;
      }

      .abouthead-main-left {
        font-size: 50px !important;
        width: 80% !important;
      }

      .about-head20 {
        margin-top: -10px !important;
        margin-bottom: 10px !important;
      }

      .big-bold-p25 {
        padding-top: 25px !important;
        padding-bottom: 5px !important;
      }

      .qa-bold-s24 {
        padding-top: 25px !important;
        padding-bottom: 5px !important;
      }

      .abouthead-perfect-left {
        font-size: 50px !important;
      }

      .about_head_main {
        font-size: 50px !important;
        line-height: 120% !important;
        font-weight: 400 !important;
        font-family: GalliardStd !important;
      }

      .service_head_main {
        font-size: 50px !important;
        line-height: 120% !important;
        font-weight: 400 !important;
      }

      .about_big_paragraph98 {
        font-size: 22px !important;
        line-height: 140% !important;
      }

      .about-three-col-description {
        padding-top: 52px !important;
        padding-bottom: 58px !important;
        padding-right: 10px !important;
        padding-left: 10px !important;
      }

      .about-good-website23 {
        font-size: 50px;
      }

      .about-center-text60 {
        font-size: 22px;
      }

      .about-three-col-innner-head {
        font-size: 40px !important;
        font-weight: 400;
        margin-bottom: 25px !important;
        line-height: 120%;
        font-family: GalliardStd !important;
      }

      .contact_para190 {
        font-size: 18px !important;
        line-height: 150% !important;
      }

      .smallhead-checkbox {
        font-size: 18px !important;
        line-height: 180% !important;
      }

      .italian-text20 {
        font-size: 18px !important;
        line-height: 150% !important;
      }

      .contact-form-control {
        font-size: 18px !important;
        line-height: 150% !important;
      }

      .contact-form-boxtwo {
        font-size: 18px !important;
        line-height: 180% !important;
      }

      .heading-checkbox {
        font-size: 18px !important;
        line-height: 180% !important;
      }

      .service-sec-fourth-pt {
        padding-top: 210px !important;
        margin-top: -70px !important;
        padding-bottom: 75px;
    }

      .bold-linemt20 {
        font-size: 15px !important;
      }

      .button-transprent {
        font-size: 15px !important;
      }
      .web-button {
        font-size: 15px !important;
      }

      .about-logo-company64 {
        padding-top: 0px !important;
        padding-right: 23%;
        padding-left: 23%;
        margin-bottom: 30px !important;
      }

      .service-sec-third-pt {
        padding-top: 220px !important;
        margin-top: -60px !important;
      }

      .section-studio-head-23 {
        padding-top: 50px !important;
      }

      .some_goodweb_para-last30 {
        margin-bottom: 150px !important;
      }

      .staus-mt240 {
        margin-top: 4.5rem !important;
      }

      .section-perfect-head-23 {
        padding-top: 80px !important;
      }

      .about-tophead23 {
        padding-top: 27px !important;
      }

      .about-company-section {
        padding-top: 100px !important;
        padding-right: 25% !important;
        padding-left: 25% !important;
        padding-bottom: 100px !important;
      }

      .main-about-boltt50 {
        font-size: 15px !important;
        margin-top: 14px !important;
        line-height: 150% !important;
      }
      .service-margin46 {
        margin-top: 46px;
      }

      .underline-approch-thirdline {
        border-bottom: 1px solid #ffffff;
        margin-top: 45px !important;
      }

      .about-paragrph-right20 {
        font-size: 15px !important;
        line-height: 180% !important;
        margin-bottom: 10px !important;
      }

      .about-big-para72 {
        margin-top: 0px !important;
      }

      .underline-about92 {
        border-bottom: 2px solid #e1e1e1 !important;
        margin-top: 80px !important;
      }

      .about-three-col-innnercol p {
        font-size: 15px !important;
        color: #181818;
        font-weight: 300;
        font-family: NeueHaasUnica !important;
        line-height: 140% !important;
      }

      .service-hero23 {
        padding-top: 23.4rem;
        padding-bottom: 50px !important;
      }

      .underline-end {
        margin-top: 40px !important;
      }

      .about-three-col-innnercol {
        padding: 0px 10px 11px 15px !important;
      }

      .connect_text_p40 {
        font-size: 18px !important;
        line-height: 180% !important;
      }

      .service-sec-first-pt {
        padding-top: 30vh !important;
      }

      .abouthead-giles-left {
        font-size: 50px !important;
        line-height: 120% !important;
      }

      .spacing-tb23 {
        padding-top: 3rem !important;
        padding-bottom: 0rem !important;
      }

      .progressive-paragraph-sec23 {
        font-size: 15px !important;
        line-height: 180% !important;
      }

      .top-btm23 {
        padding-top: 3rem !important;
        padding-bottom: 3rem !important;
    }

      .perfect-team-p23 {
        font-size: 18px !important;
        line-height: 150% !important;
        margin-top: 25px;
      }

      .giles-title43 {
        font-size: 18px !important;
      }

      .contact_mb20 {
        margin-bottom: 90px !important;
        margin-top: 10px;
      }

      .right-section a {
        font-size: 14px !important;
        margin-right: 3rem !important;
      }
      .intro-pd {
        height: 100% !important;
        padding: 1.125rem !important;
      }

      .desjoyauz-pd {
        height: auto !important;
        padding: 1.125rem !important;
      }

      .last_sec_abouthead {
        font-size: 50px !important;
        line-height: 120% !important;
        margin-top: 80px !important;
      }

      .about-head10 {
        margin-top: 100px !important;
        margin-bottom: 15px !important;
      }

      .about-long-line10 {
        margin-top: 30px !important;
        margin-bottom: 25px !important;
      }

      .perfect-team-p34 {
        font-size: 18px !important;
        line-height: 150% !important;
        margin-top: 25px;
      }

      .giles-brings-para23 {
        font-size: 18px;
        line-height: 140%;
        font-family: NeueHaasUnica !important;
      }

      .logo-text17 {
        font-size: 18px;
        line-height: 140%;
        font-family: NeueHaasUnica !important;
      }
      .service_blue_container {
        height: 85vh;
    }


    .service-sec-fifth-pt {
      padding-bottom: 15vh;
      padding-top: 200px !important;
      margin-top: -150px !important;
    }

      .input-head23 {
        font-size: 18px;
        font-family: NeueHaasUnica !important;
        line-height: 150% !important;
      }

      .about-button12 {
        margin-top: 20px !important;
      }
      .testimonial-project {
        height: 120px;
        width: 120px !important;
      }

      .heading-height69 {
        z-index: 2;
        width: 100%;
        height: 80vh !important;
      }
      .service-back23{
        width: 100%;
        height: 80vh !important;
      }

      .about-two-size43 {
        font-size: 18px;
        font-weight: 400;
        margin-bottom: 20px;
        line-height: 140%;
        font-family: NeueHaasUnica !important;
      }

      .progressive-head43 {
        font-size: 30px !important;
        line-height: 120% !important;
      }

      .studio-head43 {
        font-size: 30px !important;
        line-height: 120% !important;
        padding-top: 35px;
      }

      .about-twobox-23 {
        font-size: 15px;
        line-height: 140%;
      }



      .about-bottom12 {
        margin-top: -10px !important;
        margin-bottom: 90px !important;
      }

      .custom-dropdown .dropdown-item {
        font-size: 18px !important;
        font-weight: 400;
        line-height: 150%;
      }

      .underline-approch-secend {
        margin-top: 50px !important;
      }
      .home-proj-text {
        font-size: 18px !important;
      }

      .threeblk-margin {
        margin-bottom: 54px !important;
      }

    }

    @media only screen and (min-width: 1024px) and (max-width: 1366px) and (orientation: portrait),
       only screen and (min-width: 1366px) and (max-width: 1024px) and (orientation: landscape) {
        .img-project-head23{
          margin-top: -35.5rem !important;
          z-index: 20 !important;
          position: relative !important;
          }

          .img-pool-vid41{
            margin-top: -32rem !important;
            z-index: 20 !important;
            position: relative !important;
            }

            .green-wolf-img23{
              margin-top: -21.5rem !important;
              z-index: 20 !important;
              position: relative !important;
            }

          .img-group{
            margin-top: -29rem !important;
             z-index: 999 !important;
             position: relative !important;
          }

          .about-tophead23 {
            padding-top: 55px;
          }
        }

        @media only screen and (width: 820px) and (height: 1180px) and (orientation: portrait),
        only screen and (width: 1180px) and (height: 820px) and (orientation: landscape) {

          .img-project-head23{
            margin-top: -17rem !important;
            z-index: 20;
            position: relative;
          }
          .img-pool-vid41{
            margin-top: -13rem !important;
            z-index: 20;
            position: relative;
            }
            .green-wolf-img23{
              margin-top: -5rem !important;
              z-index: 10;
              position: relative;
            }
        }

    /*tablet view style */
    /* @media only screen and (min-width: 1024px) and (max-height: 1366px) and (orientation: portrait) {

      .img-project-head23{
        margin-top: -22rem !important;
        z-index: 10 !important;
        position: relative !important;
      }

      .about-company-pd {
        margin-top: 4.5vh !important;
        padding-right: 5%;
        padding-left: 5%;
        margin-bottom: 6vh !important;
      }

      .img-project-head23{
        margin-top: -33rem !important;
        z-index: 20 !important;
        position: relative !important;
        }

      .img-group{
        margin-top: -29rem !important;
         z-index: 999 !important;
         position: relative !important;
      }

      .about-tophead23 {
        padding-top: 55px;
      }
    } */

      @media only screen and (width: 768px) and (height: 1024px) and (orientation: portrait),
      only screen and (width: 1024px) and (height: 768px) and (orientation: landscape) {
      .img-project-head23{
        margin-top: -7rem !important;
        z-index: 20;
        position: relative;
      }
      .img-pool-vid41{
        margin-top: -2rem !important;
        z-index: 20;
        position: relative;
        }
    }



    @media screen and (min-device-width: 48rem) and (max-device-width: 64.25rem) {

      .service-sec-first-pt {
        padding-top: 19vh !important;
      }

      .service-sec-sec-pt {
        padding-top: 20vh !important;
      }

      .contact-head-main-left {
        font-size: 40px !important;
        line-height: 120% !important;
        font-weight: 400 !important;
        font-family: GalliardStd !important;
        margin-bottom: 45px !important;
        width: 95% !important;
      }

      .viewalltext-divp-pd {
        position: absolute;
        bottom: 0;
        -webkit-transition: all 0.5s ease-in-out;
        -o-transition: all 0.5s ease-in-out;
        transition: all 0.5s ease-in-out;
        padding: 30px 40px;
        width: 100%;
        opacity: 1;
      }

      .pd-whiteslide-heading {
        font-size: 60px;
        line-height: 110%;
        font-weight: 400;
      }

      .pd-services-heading {
        font-size: 50px !important;
      }

      .about-company-pd {
        margin-top: 3vh !important;
        padding-right: 10%;
        padding-left: 10%;
        margin-bottom: 4vh !important;
      }

      .desjoyauz-intro-pd23 {
        margin-top: 6vh !important;
        padding-right: 10%;
        padding-left: 10%;
        margin-bottom: 3vh !important;
      }
      .green-intro-pd23 {
        margin-top: 6vh !important;
        padding-right: 6%;
        padding-left: 6%;
        margin-bottom: 6vh !important;
      }
      .green-wolf-img23{
      margin-top: 5rem;
      }

      .cust-m-pdhero {
        margin-bottom: 30px;
        margin-top: 30px !important;
      }

      .view-intab:hover {
        background-size: cover !important;
      }

      .vw52 {
        width: 90vw;
      }

      .font-c50 {
        font-size: 40px;
        line-height: 120%;
      }


      .visible .viewalltext-divp {
        opacity: 1 !important;

      }

      .abv-footer-proj-img-margin {
        margin-bottom: 34px;
      }

      .resp-service-pb {
        padding-bottom: 48px;
      }

      .service-btn-margin46 {
        margin-top: 46px;
        margin-bottom: 46px !important;
      }

      .above-footer-img {
        height: 122px;
        width: 122px;
        position: absolute;
        right: 0;
        top: 22%;
        margin-right: 10px;
      }

      .height-px2 {
        margin-bottom: 40px !important;
      }

      .cust-pbm-50 {
        padding-bottom: 92px !important;
      }

      .cust-mb-abvfooter-5 {
        margin-bottom: 4.75rem !important;
      }

      .dmob-flex {
        gap: 5px !important;
      }

      .dmob-flex aside {
        width: 22vw;
      }

      .dmob-flex .cust-width-64 {
        width: 66vw;
        grid-column: none;
      }

      .testimonial-mtext {
        font-size: 22px;
        line-height: 130%;
      }

      .testimonial-mtext-pd {
        font-size: 22px;
        line-height: 140%;
        padding-top: 3rem;
        padding-bottom: 3rem;
      }

      .testimonial-clientdt {
        font-size: 15px;
        line-height: 150%;
        width: 34vw;
      }

      .view-intab {
        cursor: pointer !important;
        background-size: cover !important;
      }

      .desktop-menu,
      .column-tab-btn {
        display: none !important;
      }

      .projects-column-1 img {
        border-radius: 6px;
        width: calc((147.925vw - 40px) / 3) !important;
      }

      .w-gridN {
        width: calc((120vw - var(--spacing-offset)*0 - var(--spacing-gutter)*(var(--items) - 1))/ var(--items)) !important;
      }

      .g-logo-img {
        height: 65px !important;
        width: 64px;
      }

      .cust-mg-md-08 {
        margin: 0.8rem !important;
      }
      .spacing-tb23 {
        padding-top: 1rem !important;
        padding-bottom: 0rem !important;
    }

    .top-btm23 {
      padding-top: 1rem !important;
      padding-bottom: 2rem !important;
     }
      .cust-mg-md-09 {
        margin: 0rem 0.8rem !important;
      }

      .ptbm34 {
        margin-top: 48px !important;
        margin-bottom: 48px !important;
      }

      .heading-tptb {
        padding-top: 52px !important;
        padding-bottom: 52px !important;
      }

      .four-imgs {
        padding: 0rem !important;
      }

      .copyright-link {
        display: none;
      }

      .footer-main {
        padding-right: 1.2rem !important;
        padding-left: 1.2rem !important;
      }

      .menubutton-inline-a {
        font-size: 1.563rem !important;
      }

      .menubutton-inheading {
        font-size: 3.125rem !important;
      }

      #elementToClick {
        top: 29% !important;
        right: 4.5% !important;
        height: 2.5rem !important;
        width: 2.5rem !important;
        -webkit-transition: -webkit-transform 0.3s ease-in-out;
        transition: -webkit-transform 0.3s ease-in-out;
        -o-transition: transform 0.3s ease-in-out;
        transition: transform 0.3s ease-in-out;
        transition: transform 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out;
      }

      #myNav {
        top: 28vh !important;
      }

      .viewalltext-divp {
        padding: 20px 22px;
      }

      .cta-heading {
        font-size: 50px;
        color: white;
        line-height: 120%;
      }

      .cround-btn {
        font-size: 0.875rem !important;
      }

      .abv-links {
        padding: 0 1.2rem;
        width: 100%;
      }

      .ftext-36 {
        font-size: 2.5rem !important;
      }

      .showreel_container {
        width: 100%;
        height: 91vh;
        position: static;
      }

      .about-description23 {
        font-size: 18px;
        color: #181818;
        line-height: 140% !important;
        padding-top: 10px !important;
            padding-bottom: 10px;
      }

      .big-pic {
        margin-top: 78px !important;
      }

      .viewalltext-divp {
        -webkit-transition: visibility 0s, opacity 0.4s linear;
        -o-transition: visibility 0s, opacity 0.4s linear;
        transition: visibility 0s, opacity 0.4s linear;
      }

      .view-intab:hover .viewalltext-divp {
        visibility: visible;
        opacity: 1;
      }

      .view-intab:hover .black-opa {
        background: #000000b3;
        -webkit-transition: all 2s;
        -o-transition: all 2s;
        transition: all 2s;
      }

      .about-hero-img {
        background-position: 20% 50% !important;
      }

      .right-sticky {
        margin-top: 0.625rem;
      }

      .intro {
        z-index: 4;
        width: 100%;
        padding: 1.5625rem;
      }

      .heading-height69 {
        z-index: 4;
        width: 100%;
        height: 80vh !important;
        padding: 1.5625rem;
      }
      .service-back23{
        width: 100%;
        height: 80vh !important;
        padding: 1.5625rem;
      }

      .about_white_container {
        width: 100%;
        height: 80vh !important;
        margin-top: -90px;
      }

      .service_blue_container {
        width: 100%;
        height: 80vh !important;
        margin-top: -90px;
      }

      .intro-pd {
        z-index: 4;
        width: 100%;
        padding: 1.5625rem;
        height: auto;
        margin-top: 0rem;
      }

      .desjoyauz-pd {
        z-index: 4;
        width: 100%;
        padding: 1.5625rem;
        height: auto;
        margin-top: 1rem;
      }

      .cfont-115 {
        font-size: 6vw;
        line-height: 140%;
      }

      .footer-text {
        width: 100%;
      }

      .span-link-footer,
      .link-footer,
      .copy-right-text {
        color: white;
        font-size: 0.75rem;
      }

      .ftext-36 {
        width: 106%;
      }

      .footer-text {
        margin-bottom: auto;
      }

      .mt-xl-b40 {
        margin: 2.75rem 4.75rem 8.25rem 4.75rem;
        font-size: 40px !important;
        line-height: 120%;
      }

      .background-video-6 {
        height: 100vh;
        opacity: 1;
        -o-object-fit: cover;
        object-fit: cover;
        position: sticky;
        top: 0;
        width: auto;
      }

      .showreel_container {
        height: 220vh;
      }

      .showreel_container_pdpage {
        height: 205vh;
        margin-top: -79px !important;
     }

     .desjoyaux_container_pdpage {
      height: 195.5vh;
      margin-top: -79px !important;
   }

      .view-intab {
        height: 45vh;
      }

      .scrollmagic-pin-spacer {
        height: 15.875rem !important;
      }

      .projects-column img {
        height: 100%;
        width: 100%;
        -webkit-box-shadow: rgba(0, 0, 0, 0.35) 0rem 0.3125rem 1.3125rem;
        box-shadow: rgba(0, 0, 0, 0.35) 0rem 0.3125rem 1.3125rem;
      }

      .right-section a {
        color: black;
        text-decoration: none;
        font-size: 14px !important;
        font-weight: 600;
        margin-right: 2rem !important;
        margin-left: 1.9rem !important;
      }

      .about-head10 {
        margin-top: 100px !important;
        margin-bottom: 15px !important;
      }

      .about-long-line10 {
        margin-top: 30px !important;
        margin-bottom: 25px !important;
      }

      .staus-mt240 {
        margin-top: 5rem;
      }

      .font-30 {
        font-size: 1.5625rem !important;
      }

      .text-14 {
        font-size: 0.9375rem !important;
        line-height: 150%;
      }

      .view-proj-text {
        font-weight: 200;
        font-size: 0.9375rem !important;
      }

      .cusf-145 {
        font-size: 1.125rem !important;
      }

      /*Tablet view styles code by abhii*/
      .about-three-col-heading {
        font-size: 18px !important;
        line-height: normal !important;
        font-weight: 400;
      }

      .about-col-head23 {
        font-size: 18px !important;
        line-height: normal !important;
        font-weight: 400;
        margin-bottom: 4rem;
      }

      .servie-ptext {
        font-size: 18px;
        line-height: normal;
      }

      .button-transprent {
        font-size: 16px;
        line-height: 0%;
        padding: 25px 30px 25px 30px !important;
      }

      .web-button {
        font-size: 16px;
        line-height: 0%;
        padding: 25px 30px 20px 30px !important;
      }

      .cust-mt-10 {
        padding-top: 7rem !important;
        padding-bottom: 7rem !important;
      }

      .cust-mt-7 {
        margin-top: 5rem !important;
      }

      .full-ss-intro {
        font-size: 22px;
        line-height: 140%;
      }

      .full-ss-p {
        font-size: 18px;
        line-height: 150% !important;
      }

      .testimonial-p {
        font-size: 22px;
        line-height: 130%;
      }

      .testimonial-name {
        font-size: 15px;
        line-height: 150%;
      }

      .btn-live-website {
        font-size: 18px;
        line-height: 140%;
      }

      .up-tag {
        font-size: 15px;
      }

      .heading-one {
        font-size: 30px;
      }

      .btn-img-text {
        font-size: 15px;
      }

      .big-ss-top {
        padding-top: 0px !important;
        padding-bottom: 0px !important;
      }

      .service-mt-mb {
        margin-top: 130px !important;
      }

      .cust-bt-10 {
        margin-bottom: 130px !important;
      }

      /*Tablet responsive for service page by abhi */
      .service-header {
        z-index: 2;
        width: 100%;
        height: 100vh;
      }

      .sec-head10 {
        padding-top: 0px !important;
        padding-bottom: 70px !important;
      }

      .third-custom-sec10 {
        margin-top: 0px !important;
        margin-bottom: 0px !important;
      }

      .service-sec-fifth-pt {
        padding-top: 0vh !important;
      }

      .two-branding-sec10 {
        margin-top: 20px !important;
        margin-bottom: -72px !important;
      }

      .three-website-sec10 {
        padding-top: 200px !important;
        padding-bottom: 40px !important;
        margin-top: -90px !important;
    }

      .website_220_top {
        padding-top: 0px !important;
        padding-left: 25px;
        padding-right: 25px;
      }

      .head-main-left {
        font-size: 50px !important;
        line-height: 120% !important;
      }

      .head-first-23 {
        font-size: 50px !important;
        line-height: 120% !important;
      }

      .info-p1 {
        font-size: 18px;
        font-family: NeueHaasUnica !important;
        line-height: 150% !important;
      }

      .testimonial-text {
        margin-top: 30px !important;
      }

      .testimonial-pic-top {
        margin-top: 20px !important;
      }

      .head-right {
        font-size: 30px;
        font-family: GalliardStd !important;
        line-height: 120% !important;
        margin-bottom: 1rem;
      }

      .info-right {
        font-size: 15px !important;
        font-family: NeueHaasUnica !important;
        line-height: 180% !important;
      }

      .info-two-right {
        font-size: 15px !important;
        font-family: NeueHaasUnica !important;
        line-height: 180% !important;
      }

      .info-creative-right {
        font-size: 15px;
      }

      .smallhead-one-right {
        font-size: 18px;
        margin-top: 40px !important;
      }

      .head-main {
        font-size: 50px !important;
      }

      .slider-head-main {
        font-size: 50px !important;
      }

      .service_container {
        z-index: 2000;
        width: 100%;
        height: 100.5vh;
      }

      .service-button-transprent {
        padding: 14px 23px 9px 23px !important;
      }


      .underline-end {
        margin-top: 0px !important;
      }

      .service-all-btn i {
        font-size: 0.75rem !important;
        color: white;
        margin-top: 4px;
        margin-bottom: 4px;
      }

      .head-one-right {
        font-size: 30px;
        margin-top: 30px !important;
        line-height: 120% !important;
        margin-top: 55px !important;
      }

      .underline-approch-secend {
        margin-top: 50px !important;
      }

      .underline-approch-thirdline {
        margin-top: 45px !important;
      }

      .underline-caresec20 {
        margin-top: 50px !important;
      }

      .col-sp-1 {
        padding-top: 120px;
        margin-bottom: 70px;
      }

      .text-ft-section {
        margin-bottom: 120px;
        font-size: 20px !important;
        margin-top: 37px !important;
      }

      .text-bt-section {
        margin-bottom: 120px;
        font-size: 20px !important;
      }

      .some_goodweb_head {
        padding-top: 80px;
        padding-bottom: 30px;
        font-size: 18px;
      }

      .mt-service-23 {
        margin: 12.5rem 7rem 2.75rem 2rem;
      }

      .some_goodweb_paragraph20 {
        font-size: 20px;
        margin-bottom: 125px;
        margin-top: 24px;
      }

      .some_goodweb_para-last30 {
        font-size: 20px;
        margin-bottom: 125px;
        margin-top: 24px;
      }

      .button-transprent {
        font-size: 15px !important;
      }
      .web-button {
        font-size: 15px !important;
      }

      .num-ft-section {
        font-size: 75px !important;
        font-weight: 400 !important;
      }

      .head-two-right {
        margin-top: 50px !important;
        font-size: 30px !important;
        line-height: 120% !important;
      }

      .about-two-size43 {
        font-size: 18px;
        margin-bottom: 15px;
        line-height: 140%;
        font-family: NeueHaasUnica !important;
      }

      .underline-caresec20 {
        border-bottom: 1px solid #cfcfcf;
        margin-top: 50px !important;
      }

      .underline-lastsec40 {
        margin-top: 26px !important;
      }

      .mobile-screen-column-1 {
        padding-left: 13px;
        padding-right: 12px;
      }

      .about-twobox-23 {
        font-size: 15px;
        line-height: 140%;
      }

      .mobile-screen {
        margin-bottom: 25px;
      }

      .mobile-screens {
        height: 65vh;
      }

      .text-project2 {
        font-size: 15px;
        line-height: 180%;
      }

      .web-bullet {
        font-size: 15px;
        line-height: 140%;
        font-weight: 400;
        margin-bottom: 11px;
      }

      .abouthead-main-left {
        font-size: 50px !important;
        line-height: 120% !important;
        width: 85% !important;
      }

      .custom-header {
        padding: 40px !important;
      }

      .abouthead-perfect-left {
        font-size: 50px !important;
        line-height: 120% !important;
        margin-bottom: 25px !important;
      }

      .about-three-col-description {
        padding-top: 75px !important;
        padding-bottom: 75px !important;
        padding-right: 5px !important;
        padding-left: 5px !important;
      }

      .about-good-website23 {
        font-size: 50px;
      }

      .main-about-paragrph50 {
        font-size: 15px !important;
        line-height: 180% !important;
      }

      .main-about-boltt50 {
        font-size: 15px !important;
        margin-top: 14px !important;
        line-height: 180% !important;
      }

      .bold-linemt20 {
        font-size: 15px !important;
        line-height: 180% !important;
      }

      .underline-service23 {
        border-bottom: 2px solid #cfcfcf;
        margin-top: 38px !important;
        margin-bottom: 38px !important;
      }
      .video-container {
        position: absolute;
       top: 0;
       left: 0;
       width: 100%;
       height: 100%;
       overflow: hidden;
       z-index: -1;
   }
   .video-last-text{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
    z-index: -1;
   }
    .up-video23{
            height: 100vh;
       object-fit: cover;
    }
    .owl-mobile-img{
      background-position: 97% !important;
    }

        .service-sec-third-pt {
          padding-top: 220px !important;
          margin-top: -100px !important;
      }

      .navigation-font23 {
        font-size: 15px !important;
        line-height: normal !important;
      }

        .service-sec-fourth-pt {
          padding-top: 200px !important;
          margin-top: -120px !important;
      }


      .text-bt-section {
        margin-bottom: 100px !important;
        font-size: 20px !important;
        margin-top: 23px !important;
      }

      .about_head_main {
        font-size: 40px !important;
        line-height: 120% !important;
        font-weight: 400 !important;
        font-family: GalliardStd !important;
      }

      .about-three-col-innnercol {
        padding: 0px 10px 11px 10px !important;
      }

      .grid-service-23 {
        -ms-grid-columns: (minmax(0, 1fr))[9];
        grid-template-columns: repeat(9, minmax(0, 1fr));
      }

      .about-three-col-innner-head {
        font-size: 30px !important;
        font-weight: 300 !important;
        margin-bottom: 25px !important;
        line-height: 120% !important;
        font-family: GalliardStd !important;
      }
      .service-sec-fifth-pt {
        padding-bottom: 5vh !important;
        padding-top: 200px !important;
        margin-top: -170px !important;
    }

      .about-three-col-row {
        padding-bottom: 0px !important;
      }

      .about-company-section {
        padding-top: 100px !important;
        padding-right: 14% !important;
        padding-left: 14% !important;
        padding-bottom: 88px !important;
      }

      .about_head_main {
        font-size: 40px !important;
        line-height: 120% !important;
        font-weight: 400 !important;
        font-family: GalliardStd !important;
      }

      .service_head_main {
        font-size: 40px !important;
        line-height: 120% !important;
      }

      .service-hero23 {
        --colSpan: 8;
        padding-top: 14.5rem;
      }

      .about_big_paragraph98 {
        font-size: 22px !important;
        line-height: 140% !important;
      }

      .sec-tm-two {
        font-size: 18px !important;
        line-height: 180% !important;
      }

      .contact_para190 {
        font-size: 18px !important;
        line-height: 150% !important;
      }

      .smallhead-checkbox {
        font-size: 18px !important;
        line-height: 180% !important;
      }

      .italian-text20 {
        font-size: 18px !important;
        line-height: 150% !important;
      }

      .contact-form-control {
        font-size: 18px !important;
        line-height: 150% !important;
      }

      .last_sec_abouthead {
        font-size: 40px !important;
        margin-top: 60px !important;
      }

      .sec-tm-one {
        font-size: 40px !important;
        line-height: 120% !important;
      }

      .heading-checkbox {
        font-size: 18px !important;
        line-height: 180% !important;
      }

      .about-paragrph-right20 {
        font-size: 15px !important;
        line-height: 180% !important;
        margin-bottom: 10px !important;
      }

      .big-bold-p25 {
        padding-top: 25px !important;
        padding-bottom: 5px !important;
      }

      .qa-bold-s24 {
        padding-top: 25px !important;
        padding-bottom: 5px !important;
      }


      .website-sec {
        font-size: 15px;
        margin-top: 5px !important;
        margin-bottom: 25px;
      }

      .underline-sec {
        border-bottom: 1px solid #636e80;
        margin-top: 25px !important;
      }

      .connect_text_p40 {
        font-size: 18px !important;
        line-height: 180% !important;
      }

      .underline-white {
        border-bottom: 1px solid #cfcfcf;
        margin-top: 25px !important;
      }

      .progressive-paragraph-sec23 {
        font-size: 15px !important;
        line-height: 180% !important;
        width: 85%;
        padding-top: 20px;
      }

      .about-bottom12 {
        margin-top: -10px !important;
        margin-bottom: 55px !important;
      }

      .about-three-col-row {
        padding-bottom: 25px !important;
      }

      .progressive-head43 {
        font-size: 30px !important;
        line-height: 120% !important;
        padding-top: 0px !important;
      }

      .studio-head43 {
        font-size: 30px !important;
        line-height: 120% !important;
        padding-top: 25px !important;
      }

      .about-tophead23 {
        padding-top: 30px !important;
      }

      .contact-sub-btn {
        padding: 26px 40px 19px 43px !important;
        font-size: 24px !important;
        font-weight: 500;
      }

      .contact_mb20 {
        margin-bottom: 60px !important;
      }

      .about-button12 {
        margin-top: 20px !important;
      }

      .giles-title43 {
        font-size: 18px !important;
      }

      .giles-brings-para23 {
        font-size: 18px;
        line-height: 140%;
        font-family: NeueHaasUnica !important;
      }

      .logo-text17 {
        font-size: 18px;
        line-height: 140%;
        font-family: NeueHaasUnica !important;
      }

      .testimonial-project {
        height: 120px;
        width: 120px !important;
      }

      .abouthead-giles-left {
        font-size: 50px !important;
        line-height: 120% !important;
      }

      .about-three-col-innnercol p {
        font-size: 15px !important;
        color: #181818;
        font-weight: 300;
        font-family: NeueHaasUnica !important;
        line-height: 200%;
      }

      .mt-about-23 {
        margin: 8.5rem 6rem 3.30rem 6rem !important;
      }

      .menu-line23 {
        padding-top: 20px !important;
      }

      .perfect-team-p23 {
        font-size: 18px !important;
        line-height: 150% !important;
        margin-top: 25px !important;
      }

      .perfect-team-p34 {
        font-size: 18px !important;
        line-height: 150% !important;
        margin-top: 25px;
      }

      .about-logo-company64 {
        padding-top: 0px !important;
        padding-right: 15% !important;
        padding-left: 15% !important;
        margin-bottom: 30px !important;
      }
      .service-margin46 {
        margin-top: 46px;
      }

      .contact-form-boxtwo {
        font-size: 18px !important;
        line-height: 180% !important;
      }

      .blue-clr-back23 {
        height: 12rem !important;
      }

      .input-head23 {
        font-size: 18px;
        font-family: NeueHaasUnica !important;
        line-height: 150% !important;
      }

      .section-studio-head-23 {
        padding-top: 70px !important;
      }

      .underline-about92 {
        margin-top: 100px !important;
      }

      .about-big-para72 {
        margin-top: 0px !important;
      }

      .section-perfect-head-23 {
        padding-top: 70px !important;
      }

      .faq-heading-big {
        font-size: 22px;
        margin-left: 61px;
        margin-top: -12px;
      }

      .rte ul {
        -ms-grid-columns: (minmax(0, 1fr))[1] !important;
        grid-template-columns: repeat(1, minmax(0, 1fr)) !important;
      }

      .rte ul li {
        margin-bottom: 0px !important;
      }

      .custom-dropdown .dropdown-item {
        font-size: 18px !important;
        font-weight: 400;
        line-height: 150%;
      }
      .home-proj-text {
        font-size: 18px !important;
    }

    .threeblk-margin {
      margin-bottom: 40px !important;
    }
    }

    @media screen and (min-device-width: 12.125rem) and (max-device-width: 20.350rem) {
      .img-group {
        margin-top: 12rem !important;
      }
    }

    @media screen and (min-device-width: 200px) and (max-device-width: 349px) and (min-height: 500px) {
      .desjoyauz-intro-pd23 {
        margin-top: 100px !important;
      }
      .green-intro-pd23 {
        margin-top: 30px !important;
      }
      .desjoyauz-pd {
        height: 180vh !important;
      }
      .img-pool-vid41{
        margin-top: 12rem !important;
      }
      .green-wolf-img23{
        margin-top: 30rem !important;
    }
  }



    @media screen and (min-device-width: 200px) and (max-device-width: 349px) and (min-height: 600px) {
      .intro-pd {
        height: 150vh !important;
        z-index: 4;
        margin-top: -2rem;
        padding: 1.125rem !important;
      }
      .img-pool-vid41{
        margin-top: 2.5rem !important;
      }
      .green-wolf-img23{
        margin-top: 27.5rem !important;
    }
      .desjoyauz-pd {
        height: 150vh !important;
        z-index: 4;
        margin-top: -2rem;
        padding: 1.125rem !important;
      }
      .desjoyauz-intro-pd23 {
        margin-top: 85px !important;
        margin-bottom: 50px !important;
    }
    .green-intro-pd23 {
      margin-top: 85px !important;
      margin-bottom: 50px !important;
  }
      .img-project-head23 {
        margin-top: 3rem !important;
    }
    }


    @media screen and (min-device-width: 200px) and (max-device-width: 349px) {
      .footer-main {
    min-height: 100vh !important;
    }
    .showreel_container_pdpage {
      height: 258.4vh;
    }
    .desjoyaux_container_pdpage {
      height: 258.4vh;
    }
    .intro-pd {
      height: 144vh;
      z-index: 4;
      margin-top: -2rem;
      padding: 1.125rem !important;
    }
    .desjoyauz-pd {
      height: 144vh;
      z-index: 4;
      margin-top: -2rem;
      padding: 1.125rem !important;
    }
    .img-project-head23 {
      margin-top: 9rem;
  }
  .mobile-350{
    width: 50% !important;
  }
  .footer-first23 {
    margin: 12px 0px !important;
}
  .ftext-36 {
    width: 76%;
    margin-bottom: 1.75rem !important;
  }
  }

  @media screen and (min-device-width: 350px) and (max-device-width: 399px) and (min-height: 741px) {
    .img-project-head23{
      margin-top: -10.5rem !important;
    }
    .intro-pd {
      height: 111vh !important;
      z-index: 4;
      margin-top: -3rem;
      padding: 1.125rem !important;
    }
    .desjoyauz-pd {
      height: 111vh !important;
      z-index: 4;
      margin-top: 2rem;
      padding: 1.125rem !important;
    }
  }

      @media screen and (min-device-width: 350px) and (max-device-width: 399px) and (min-height: 550px) and (max-height: 649px){
        .img-pool-vid41 {
          margin-top: 8.5rem !important;
      }
      .green-wolf-img23{
        margin-top: 8.5rem !important;
    }
      }


      @media screen and (min-device-width: 350px) and (max-device-width: 399px) and (min-height: 650px) and (max-height: 740px){
        .img-project-head23 {
          margin-top: 1.5rem !important;
        }
        .img-pool-vid41{
          margin-top: 0rem !important;
        }
        .green-wolf-img23{
          margin-top: 19.5rem !important;
      }

      .intro-pd {
        height: 127vh !important;
        padding: 1.125rem !important;
      }
    }
    @media screen and (min-device-width: 350px) and (max-device-width: 399px) and (min-height: 741px) and (max-height: 799px){
      .green-wolf-img23{
        margin-top: 12.5rem !important;
    }
    }

      @media screen and (min-device-width: 350px) and (max-device-width: 399px) and (min-height: 800px) and (max-height: 849px){
        .green-wolf-img23{
          margin-top: 12.5rem !important;
      }
      }


 @media screen and (min-device-width: 350px) and (max-device-width: 399px) {
    .showreel_container_pdpage {
      height: 245vh;
    }
    .desjoyaux_container_pdpage {
      height: 245vh;
    }
    .img-project-head23{
      margin-top: -2.5rem;
    }
    .intro-pd {
      height: 125vh;
      padding: 1.125rem !important;
    }
    .desjoyauz-intro-pd23 {
      margin-top: 50px !important;
      margin-bottom: 0px !important;
    }
    .green-intro-pd23 {
      margin-top: 30px !important;
      margin-bottom: 0px !important;
    }
    .desjoyauz-pd {
      height: 125vh;
      padding: 1.125rem !important;
    }
    }

@media screen and (min-device-width: 400px) and (max-device-width: 767px) {
  .showreel_container_pdpage {
    height: 220vh;
  }
  .desjoyaux_container_pdpage {
    height: 230vh;
  }
  .desjoyauz-intro-pd23 {
    margin-top: 50px !important;
    padding-right: 0;
    padding-left: 0;
    margin-bottom: 0px !important;
  }
  .green-intro-pd23 {
    margin-top: 50px !important;
    padding-right: 0;
    padding-left: 0;
    margin-bottom: 0px !important;
  }
  .video-pad23{
    margin-top: -14rem;
    z-index: 20;
    position: relative;
  }
  .intro-pd {
    height: 84vh;
    z-index: 4;
    margin-top: -2rem;
    padding: 1.125rem !important;
  }
  .desjoyauz-pd {
    height: 90vh;
    z-index: 4;
    margin-top: -2rem;
    padding: 1.125rem !important;
  }
  .img-project-head23{
    margin-top: -11.5rem;
  }
  }
  @media screen and (min-device-width: 400px) and (max-device-width: 767px) and (min-height: 785px) and (max-height: 900px) {

          .desjoyaux_container_pdpage {
            height: 236vh !important;
        }
        .desjoyauz-pd {
          height: 100vh !important;
        }
        .img-project-head23 {
          margin-top: -9.5rem;
      }
      .green-wolf-img23{
        margin-top: -5rem !important;
        position: relative;
        z-index: 10;
      }
      }

  @media screen and (min-device-width: 400px) and (max-device-width: 767px) and (min-height: 670px) and (max-height: 784px) {
        .desjoyaux_container_pdpage {
          height: 260vh !important;
          }
          .desjoyauz-pd {
            height: 125vh !important;
          }
          .img-project-head23 {
            margin-top: -0.5rem;
        }
        .intro-pd {
          height: 100vh;
        }
          }

 @media screen and (min-device-width: 400px) and (max-device-width: 767px) and (min-height: 901px) and (max-height: 999px) {

         .desjoyaux_container_pdpage {
            height: 226vh;
        }
        .img-pool-vid41{
          margin-top: 2rem !important;
        position: relative;
        z-index: 10;
        }
        .green-wolf-img23{
          margin-top: -3rem !important;
          position: relative;
          z-index: 10;
        }
        .cust-m-pdhero {
          margin-bottom: 10px !important;
          margin-top: -15px !important;
      }
        }

    @media screen and (min-device-width: 2025px) and (max-device-width: 2500px) and (min-height: 890px) and (max-height: 1300px) {
      .img-pool-vid41{
      margin-top: -12rem !important;
    position: relative;
    z-index: 10;
    }
    .green-wolf-img23{
      margin-top: -12rem !important;
  }
    }

    @media screen and (min-device-width: 1920px) and (max-device-width: 2500px) and (min-height: 999px) and (max-height: 1300px) {
      .desjoyaux_container_pdpage {
        height: 195vh;
    }
    .img-pool-vid41{
    margin-top: -4rem !important;
    z-index: 9;
    position: relative;
  }
  .green-wolf-img23{
  margin-top: 0rem !important;
}
    }
    @media screen and (min-device-width: 400px) and (max-device-width: 505px) {
    .about-company-pd {
      margin-top: 220px !important;
    }
    .service-sec-first-pt {
      padding-top: 162px !important;
    }
    .background-image-hero-pd {
      opacity: 1;
      -o-object-fit: cover;
      background-size: auto;
      object-fit: cover;
      height: 126vh !important;
    }
    .background-video-hero-pd {
      opacity: 1;
      -o-object-fit: cover;
      background-size: auto;
      object-fit: cover;
      height: 100vh !important;
    }
    }

    @media screen and (min-device-width: 200px) and (max-device-width: 330px) {
      .img-group{
        margin-top: 9rem !important;
     position: relative;
    }
    }

    @media screen and (min-device-width: 350px) and (max-device-width: 399px) and (min-height: 741px) {
        .desjoyaux_container_pdpage {
        height: 225vh;
    }
  }

    @media screen and (min-device-width: 200px) and (max-device-width: 405px) {
      .mobile-contactbox23 {
        margin-left: 45px !important;
        margin-top: -25px !important;
      }
      .owl-carousel .owl-nav button.owl-prev {
        margin-left: -6rem !important;
      }
      .service-sec-first-pt {
        padding-top: 146px !important;
      }
      .img-group{
           margin-top: 0rem;
        z-index: 1000;
        position: relative;
    }
    }

    @media screen and (min-device-width: 180px) and (max-device-width: 300px) {
    /* .showreel_container_pdpage {
      width: 100%;
      height: 230vh !important;
    } */
    .about-three-col-heading {
      font-size: 16px !important;
      line-height: normal !important;
      margin-bottom: 5px !important;
      margin-top: 53px !important;
    }
    }


    @media screen and (min-device-width: 767px) and (max-device-width: 800px) {
      .ftext-36 {
        width: 96% !important;
      }
    }

    /*Mobile view styles */

    @media screen and (min-device-width: 13.125rem) and (max-device-width: 47.9375rem) {
      .form-field {
        margin-bottom: 25px !important;
      }

      .form-field-mob-24 {
        margin-top: 24px !important;
      }

      .contact-form-control {
        padding: 6px 5px 7px 0px !important;
      }

      .service-navigationbar-09 {
        padding-top: 100px !important;
      }

      .contact-head-main-left {
        font-size: 40px !important;
        line-height: 120% !important;
        font-weight: 400 !important;
        font-family: GalliardStd !important;
        margin-bottom: 40px !important;
      }

      .service-sec-sec-pt {
        padding-top: 20vh !important;
      }

      .service-sec-third-pt {
        padding-top: 194px !important;
        margin-top: -60px !important;
      }

      .service-sec-fourth-pt {
        padding-top: 190px !important;
        margin-top: -55px !important;
        padding-bottom: 0vh;
      }

      .service-sec-fifth-pt {
        padding-top: 175px !important;
        margin-top: -10vh !important;
        padding-bottom: 4vh !important;
      }


      .desktop-menu,
      .topt-2004,
      .hd-top,
      .img-aside-lft,
      .column-tab-btn,
      .d-slash {
        display: none;
      }

      .about-company-pd {
        margin-top: auto !important;
        padding-right: 0;
        padding-left: 0;
        margin-bottom: auto !important;
      }

      .desjoyauz-intro-pd23{
        margin-top: auto;
        padding-right: 0;
        padding-left: 0;
        margin-bottom: auto;
      }

      .green-intro-pd23{
        margin-top: auto;
        padding-right: 0;
        padding-left: 0;
        margin-bottom: auto;
      }

      .cust-m-pdhero {
        margin-bottom: 24px;
        margin-top: 24px;
      }
      .work_scroller_frame {
        display: block;
      }


      .bg-project-over-abv-footer-section {
        background-size: cover !important;
        margin-bottom: 40px !important;
      }


      .pd-whiteslide-heading {
        font-size: 36px;
        line-height: 110%;
        font-weight: 400;
      }

      .pd-services-heading {
        font-size: 27px !important;
        text-align: left;
      }

      .viewalltext-divp-pd {
        position: absolute;
        bottom: 0;
        -webkit-transition: all 0.5s ease-in-out;
        -o-transition: all 0.5s ease-in-out;
        transition: all 0.5s ease-in-out;
        padding: 10px 10px 30px 25px;
        width: 100%;
        opacity: 1;
      }

      .underline-studioup-48 {
        border-bottom: 1px solid #e1e1e1 !important;
        padding-top: 0rem !important;
      }

      .vw52 {
        width: 100%;
      }

      .mobile-mb-22 {
        margin-bottom: 22px;
      }

      .m-dflex {
        display: -webkit-box !important;
        display: -ms-flexbox !important;
        display: flex !important;
      }

      .visible {
        transition: opacity 1s ease !important;
      }

      .font-c50 {
        font-size: 27px;
        line-height: 120%;
      }

      .testinmonial-btn-mt-20 {
        margin-top: 20px !important;
      }

      .testimon-mob-img {
        display: block !important;
        width: 90px;
        height: 90px;
        margin-top: auto;
        margin-bottom: auto !important;
        margin-right: 10px;
      }

      .resp-service-pb {
        padding-bottom: 48px;
      }

      .service-btn-margin46 {
        margin-top: 46px;
      }

      .cust-mb-abvfooter-5 {
        margin-bottom: 76px !important;
      }

      .cust-pbm-50 {
        padding-bottom: 50px !important;
      }


      .fade-in23.visible {
        opacity: 1 !important;
       transform: translateY(0);
        animation-duration: 1s;
        visibility: visible;
      }

      .fade-in23{
        opacity: 0;
        -webkit-transform: translateY(60px);
            -ms-transform: translateY(60px);
                transform: translateY(60px);
        -webkit-transition: opacity 0.22s ease-out, -webkit-transform 0.22s ease-out;
        transition: opacity 0.22s ease-out, -webkit-transform 0.22s ease-out;
        -o-transition: opacity 0.22s ease-out, transform 0.22s ease-out;
        transition: opacity 0.22s ease-out, transform 0.22s ease-out;
        transition: opacity 0.22s ease-out, transform 0.22s ease-out, -webkit-transform 0.22s ease-out;
      }

      .quote-img svg {
        margin-bottom: 6px !important;
      }

      .height-px2 {
        margin-bottom: 28px !important;
      }

      .quote-img {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
      }

      /* .view-intab:hover .viewalltext-divp {
                opacity: 0 !important;
              } */

      .dmob-flex {
        display: -webkit-box !important;
        display: -ms-flexbox !important;
        display: flex !important;
      }

      .testimonial-mtext {
        font-size: 18px;
        line-height: 130%;
        margin-bottom: 18px !important;
        margin-top: 14px !important;
        font-weight: 400;
        font-family: NeueHaasUnica !important;
      }

      .testimonial-mtext-pd {
        font-size: 19px;
        line-height: 140%;
        padding-top: 2rem;
        padding-bottom: 2rem;
      }

      .testimonial-clientdt {
        font-size: 14px;
        line-height: 150%;
        width: 44vw;
        margin-top: auto !important;
        margin-bottom: auto !important;
        margin-left: 10px !important;
        text-align: left;
      }

      .view-intab:hover {
        background-size: cover !important;
      }

      .visible .viewalltext-divp {
        opacity: 1 !important;

      }

      /* .visible {
        background: rgba(0, 0, 0, .5) !important;
      } */

      .viewalltext-divp {
        -webkit-transition: all 0.2s ease-in-out !important;
        -o-transition: all 0.2s ease-in-out !important;
        transition: all 0.2s ease-in-out !important;
      }

      .w-gridN {
        width: calc((119vw - var(--spacing-offset) * 0 - var(--spacing-gutter) * (var(--items) - 1)) / var(--items)) !important;
      }

      .ccta-text-block a {
        position: relative;
        top: -3px;
      }

      .heading-tptb {
        padding-bottom: 0 !important;
      }

      .fourimg-sm-mx-2 {
        margin-right: 15px !important;
        margin-left: 15px !important;
      }

      .p-mob-0 {
         padding: 40px 0px 0px 0px !important;
      }

      .footer-htitle {
        white-space: nowrap;
      }

      .view-all-btn-cta {
        padding: 0rem 0.45rem 0.0625rem 0.5rem;
        border: 0.0625rem solid white;
        border-radius: 1.25rem;
        margin: 0rem 0.375rem;
        -webkit-transition: all 0.3s ease-in-out;
        -o-transition: all 0.3s ease-in-out;
        transition: all 0.3s ease-in-out;
      }

      .projects-column-1 img {
        -webkit-box-shadow: rgb(0 0 0 / 24%) 0rem 0.2rem 0.5rem !important;
        box-shadow: rgb(0 0 0 / 24%) 0rem 0.2rem 0.5rem !important;
        border-radius: 4px !important;
        width: calc((221.79vw - 20px) / 3) !important;
      }

      .grid-8 {
        display: -webkit-box !important;
        display: -ms-flexbox !important;
        display: flex !important;
        gap: 10px !important;
      }

      .black-opa {
        background: #0000004d;
      }

      .ptbm34 {
        padding: 34px 0px;
      }


      .pb-sm-5 {
        padding-bottom: 30px !important;
      }

      .cust-mtm-2 {
        margin-top: 3vh;
      }

      .copyright-link {
        display: none;
      }

      #elementToClick {
        top: 23% !important;
        right: 5.5% !important;
        height: 2.5rem !important;
        width: 2.5rem !important;
        -webkit-transition: -webkit-transform 0.3s ease-in-out;
        transition: -webkit-transform 0.3s ease-in-out;
        -o-transition: transform 0.3s ease-in-out;
        transition: transform 0.3s ease-in-out;
        transition: transform 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out;
      }

      .logo-container {
        height: 3.625rem !important;
        width: 3.625rem !important;
        padding: 9px 10px 7px 6px !important;
      }

      .abv-links {
        width: 100%;
        padding: 0 0.75rem;
      }

      .custom_menu-btn {
        position: fixed;
        right: 1.5625rem;
        top: 1.9375rem;
      }

      .mt-xl-c60 {
        margin: 0 2.125rem 1.625rem 2.125rem;
        font-size: 1.6875rem !important;
        line-height: 1.11;
      }

      .grid-gap-23 {
        gap: 25px !important;
    }
      .grid-main-23{
     row-gap: 25px !important;
    }

      .mt-about-23 {
        margin: 0 2.125rem 1.625rem 2.125rem !important;
        font-size: 1.6875rem !important;
        line-height: 1.11;
      }

      #myNav {
        top: 25vh !important;
      }

      .g-logo-img {
        height: auto !important;
        width: 64px;
      }

      /* .portfolio-mobm {
        margin-top: 4vh;
      } */

      .cust-mb-home-link {
        margin-bottom: 2.75rem !important;
      }

      .work_scroller_item.last {
        width: 100vw !important;
        min-width: 100vw !important;
        padding: 0 15px 15px !important;
      }
      .testi-link-space23 {
        margin-top: 15px !important;
    }
    .link-space23 {
      margin-top: 25px !important;
  }
      .video-container {
     position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 84%;
    overflow: hidden;
    z-index: -1;
}
.video-last-text{
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
  z-index: -1;
}
 .up-video23{
         height: 100.5vh;
    object-fit: cover;
 }


      .mobile-video {
        -o-object-fit: cover;
        object-fit: cover;
        z-index: -100;
        background-position: 50%;
        background-size: cover;
        width: 100%;
        height: 100%;
        margin: auto;
        position: absolute;
        top: -110%;
        bottom: -100%;
        left: -100%;
        right: -100%;
      }
      .showreel-play-button{
        left: 50% !important;
      }

      .bg-colprop4 {
        height: 60vh;
        margin-bottom: 15px;
        background-size: cover !important;
      }

      .viewalltext-divp {
        width: 100%;
        padding: 0.875rem;
        opacity: 0;
      }

      .custom-header {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        padding: 35px 0px 25px 0px !important;
      }

      .mob-margin10 {
        margin-bottom: 3.5rem;
      }

      .cusf-145 {
        font-size: 1rem !important;
        color: black;
      }

      .cround-btn {
        font-size: 0.875rem;
        padding: 16.6px 20px 12.6px 20px;
      }

      .white-logo {
        display: initial !important;
      }

      .cfont-115 {
        font-size: 9vw;
        line-height: 120%;
      }

      .img-half23 {
        -webkit-box-flex: 0 !important;
        -ms-flex: 0 0 auto !important;
        flex: 0 0 auto !important;
        width: 50% !important;
      }

      .cta-heading {
        font-size: 1.875rem;
        color: white;
        line-height: 2.75rem !important;
      }

      .footer-main {
        padding: 2.4375rem 0.75rem;
        position: relative;
      }

      .footer-logo {
        height: 3.5rem;
        width: 3.5rem;
      }

      .giles-brings-para23 {
        font-size: 14px !important;
        /* margin-top: -40px !important;
        margin-bottom: -15px; */
        line-height: 140% !important;
        font-family: NeueHaasUnica !important;
      }

      .logo-text17{
        font-size: 14px !important;
        margin-top: -40px !important;
        margin-bottom: -15px;
        line-height: 140% !important;
        font-family: NeueHaasUnica !important;
      }

      .about-two-size43 {
        font-size: 16px !important;
        font-weight: 500;
        margin-bottom: 12px !important;
        line-height: 140% !important;
        font-family: NeueHaasUnica !important;
      }

      .about-tophead23 {
        padding-top: 35px;
      }

      .about-mobile-mt34 {
        padding-top: 30px !important;
      }

      .font-30 {
        font-size: 1.375rem;
      }

      .about-twobox-23 {
        font-size: 14px;
        line-height: 140%;
      }

      .black-opa {
        background: #00000000;
        -webkit-transition: all 1s !important;
        -o-transition: all 1s !important;
        transition: all 1s !important;
      }

      .text-14 {
        font-size: 0.875rem !important;
        line-height: 150%;
      }

      .view-proj-text {
        font-weight: 200;
        font-size: 0.875rem;
      }

      .italic-text-3 {
        font-size: 1rem;
        font-family: ITC Galliard Std !important;
      }

      .link-footer,
      .span-link-footer {
        font-size: 0.875rem;
      }

      .footer-spanlink-container {
        margin-top: 0.5rem !important;
      }

      .ftext-36 {
        width: 76%;
        font-size: 1.625rem;
        margin-bottom: 2.75rem;
        line-height: 130% !important;
      }

      .footer-mbp-0 {
        padding: 0.75rem !important;
        margin: 0 !important;
      }

      .footer-text {
        margin-top: 0.625rem;
        width: 100%;
        font-size: 1rem;
        color: #e7e7e7;
        margin-bottom: 0;
        line-height: 150%;
        font-weight: 400;
      }

      .intro {
        z-index: 4;
        background-color: white;
        width: 100%;
        height: 95vh;
        position: absolute;
      }

      .heading-height69 {
        z-index: 4;
        background-color: white;
        width: 100%;
        height: 95vh !important;
        position: absolute;
      }

      .service-back23{
        width: 100%;
        height: 95vh !important;
        position: absolute;
      }

      .pd-px-189{
        padding-right: 25px !important;
        padding-left: 25px !important;
      }


      .showreel_container {
        width: 100%;
        height: 220vh;
        margin-top: -90px;
        position: static;
      }

      .background-video-6 {
        opacity: 1;
        -o-object-fit: cover;
        object-fit: cover;
        height: 100vh;
        padding-left: 25px;
        position: sticky;
        top: 0;
      }

      .mobile-heading32 {
        padding-bottom: 25px !important;
      }

      .background-image-hero {
        opacity: 1;
        -o-object-fit: cover;
        background-size: auto;
        object-fit: cover;
        height: 100vh;
        position: sticky;
        top: 0;
      }

      .input-head23 {
        font-size: 16px;
        font-family: NeueHaasUnica !important;
        line-height: 150% !important;
      }

      .background-image-hero-pd {
        opacity: 1;
        -o-object-fit: cover;
        background-size: auto;
        object-fit: cover;
        height: 120vh !important;
        position: sticky;
        top: 0;
      }

      .background-video-hero-pd {
        opacity: 1;
        -o-object-fit: cover;
        background-size: auto;
        object-fit: cover;
        height: 100vh !important;
        position: sticky;
        top: 0;
      }

      .scrollmagic-pin-spacer {
        height: 10.375rem !important;
      }

      .menubutton-inheading {
        font-size: 1.75rem !important;
        line-height: 1.35 !important;
      }

      .projects-column img {
        height: 100%;
        width: 100%;
        -webkit-box-shadow: rgba(0, 0, 0, 0.35) 0rem 0.3125rem 1.3125rem;
        box-shadow: rgba(0, 0, 0, 0.35) 0rem 0.3125rem 1.3125rem;
      }


      /*mobile media query code by abhii*/
      .servie-ptext {
        font-size: 16px;
        line-height: normal;
      }

      .cust-mt-7 {
        margin-top: 2.5rem !important;
      }

      .about-three-col-heading {
        font-size: 16px !important;
        line-height: normal !important;
        margin-bottom: 10px !important;
        margin-top: 35px;
      }

      .about-col-head23 {
        font-size: 16px !important;
        line-height: normal !important;
        margin-bottom: 30px !important;
      }

      .big-ss-top {
        padding-top: 13px !important;
        padding-bottom: 91px !important;
      }

      .pd-px-200 {
        padding-left: 0px !important;
        padding-right: 0px !important;
      }
      .pd-px-183 {
        padding-left: 0px !important;
        padding-right: 0px !important;
      }

      .mb-down {
        margin-bottom: 40px !important;
      }

      .button-transprent {
        font-size: 14px;
        margin-right: 5px !important;
        padding: 10px 10px 5px 10px !important;
      }
      .web-button {
        font-size: 14px;
        margin-right: 5px !important;
        padding: 10px 10px 5px 10px !important;
      }

    .owl-mobile-img{
      background-position: 92% !important;
    }


      .full-ss-intro {
        font-size: 19px;
        line-height: 140%;
      }

      .full-ss-p {
        font-size: 16px;
        line-height: 150%;
        margin-bottom: 30px !important;
      }

      .testimonial-p {
        font-size: 18px;
        line-height: 130%;
        font-weight: 400;
        width: auto !important;
        font-family: NeueHaasUnica !important;
      }


      .testimonial-name {
        font-size: 14px;
        line-height: 150%;
      }

      .btn-live-website {
        font-size: 16px;
        line-height: 140%;
      }

      .up-tag {
        font-size: 14px;
        line-height: 180%;
      }

      .service-mt-mb {
        margin-top: 65px !important;
      }

      .cust-mt-8 {
        margin-top: 2.5rem !important;
      }

      .cust-bt-10 {
        margin-bottom: 65px !important;
      }

      .heading-one {
        font-size: 25px;
        line-height: 120%;
      }

      .spacing-tb23{
        padding-top: 0rem !important;
        padding-bottom: 0rem !important;
      }

      .mt-service-23 {
        margin: 2.5rem 1rem 1.8rem 1.5rem !important;
    }

      .btn-img-text {
        font-size: 14px;
        line-height: 180%;
      }

      .cust-mt-10 {
        padding-top: 5rem !important;
        padding-bottom: 5rem !important;
      }

      .img-col {
        -webkit-box-flex: 1;
        -ms-flex: auto;
         flex: auto;
      }

      .pd-right {
        padding-right: 0px !important;
      }

      .testimonial-project {
        height: 90px !important;
        width: 90px !important;
      }

      .grid-area {
        -ms-grid-row: 1 !important;
        -ms-grid-row-span: 1 !important;
        -ms-grid-column: 1 !important;
        -ms-grid-column-span: 2 !important;
        grid-area: 1 / 1 / 2 / 3 !important;
        -ms-grid-row-align: start;
            align-self: start;
      }

      .custom-dropdown .dropdown-item {
        font-size: 16px !important;
        font-weight: 400;
        line-height: 150%;
      }

      /* .owl-carousel .owl-nav svg {
        display: flex;
        margin-left: 8rem !important;
    } */

      .service-all-btn i {
        font-size: 0.75rem !important;
        color: white;
        margin-top: 4px;
        margin-bottom: 4px;
      }

      .mt-xl-b40 {
        margin: 6.5rem 2rem 0.75rem 2rem !important;
        margin-bottom: 8.5rem !important;
      }

      .slider-head-main {
        font-size: 27px !important;
        line-height: 120%;
        font-family: NeueHaasUnica !important;
      }

      .head-main {
        font-size: 30px !important;
        line-height: 120%;
        font-family: NeueHaasUnica !important;
      }

      .service-button-transprent {
        margin-top: 16px;
        margin-left: 0px;
        font-size: 14px;
        margin-right: 14px;
      }

      .service-header {
        z-index: 2;
        width: 100%;
        height: 109vh;
      }

      .service_container {
        z-index: 2000;
        width: 100%;
        height: 112vh;
      }
      .home-proj-text {
        font-size: 16px !important;
    }

      .head-main-left {
        font-size: 30px !important;
        line-height: 120% !important;
      }

      .head-first-23 {
        font-size: 30px !important;
        line-height: 120% !important;
      }

      .info-p1 {
        font-size: 16px;
        font-family: NeueHaasUnica !important;
        line-height: 150%;
        padding-bottom: 15px;
        margin-top: 15px !important;
      }

      .testimonial-text {
        margin-bottom: 14px !important;
        margin-top: 14px !important;
      }

      .testimonial-pic-top {
        margin-top: 0px !important;
      }

      .up-tag {
        margin-top: 25px;
      }
      .up-grid {
        margin-right: 15px;
        padding-left: 15px;
      }

      .head-right {
        font-size: 22px;
        line-height: 120% !important;
      }

      .web-bullet {
        font-size: 14px;
        line-height: 140%;
        font-weight: 400;
        margin-bottom: 11px;
      }

      .info-right {
        font-size: 14px;
        line-height: 180% !important;
      }

      .info-two-right {
        font-size: 14px;
        line-height: 160% !important;
      }

      .info-creative-right {
        font-size: 14px;
        line-height: 160%;
      }

      .smallhead-one-right {
        font-size: 16px;
        margin-top: 30px !important;
        margin-bottom: 15px;
      }

      .replatforming-mt-mb {
        margin-top: 20px !important;
        margin-bottom: 20px;
      }

      .underline-service23 {
        margin-top: 35px !important;
        margin-bottom: 35px !important;
      }

      .sec-head10 {
        padding-top: 3rem !important;
        padding-bottom: 3rem !important;
      }

      .third-custom-sec10 {
        margin-top: 0px !important;
        margin-bottom: 0px !important;
      }

      .two-branding-sec10 {
        margin-top: 0px !important;
        margin-bottom: 0px !important;
      }
      .cust-mt-77 {
        margin-top: 55px !important;
        margin-bottom: 55px !important;
    }
    .about-hero-img{
      background-position: 15% 66% !important;
    }

      .three-website-sec10 {
        padding-top: 194px !important;
        padding-bottom: 0rem !important;
        margin-top: -60px !important;
      }

      .underline-sec {
        border-bottom: 1px solid #636e80;
        margin-top: 20px !important;
      }

      .underline-white {
        border-bottom: 1px solid #cfcfcf;
        margin-top: 20px !important;
      }

      .replatforming-sec {
        margin-top: 7px !important;
        margin-bottom: 30px;
      }

      .rte ul div {
        border-bottom-width: 1px !important;
        margin-bottom: 26px !important;
        margin-top: -7px !important;
        padding-bottom: 13px !important;
      }

      .website_220_top {
        padding-top: 15rem !important;
        padding-left: 25px;
        padding-right: 25px;
      }

      .service-btn {
        margin-top: 10px !important;
        margin-bottom: 20px !important;
      }

      .rte ul {
        -ms-grid-columns: (minmax(0, 1fr))[1] !important;
        grid-template-columns: repeat(1, minmax(0, 1fr)) !important;
      }

      .rte ul li {
        margin-bottom: 0px !important;
      }

      .grid-service-23 {
        -ms-grid-columns: (minmax(0, 1fr))[8];
        grid-template-columns: repeat(8, minmax(0, 1fr));
      }

      .service-btn-mobile {
        overflow-x: auto;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        word-wrap: break-word;
        height: 4.8rem;
        margin-top: 4.5rem !important;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
        padding-left: 0;
        margin-bottom: 0;
        list-style: none;
      }

      .underline-lastsec40 {
        border-bottom: 1px solid #000000;
        margin-top: 25px !important;
      }

      .btn-ml-mr40 {
        padding-left: 20px !important;
        padding-right: 0px !important;
      }

      .blue-clr-back23 {
        height: 8rem !important;
      }

      .section-heading100 {
        padding-left: 23px !important;
      }

      .mobile-screen-column-1 {
        width: 60vw;
        padding-left: 15px;
        padding-right: 0;
        display: block;
      }

      .mobile-screen-container {
        width: 250vw;
        margin-left: -100vw;
      }

      .mobile-screen-column-1 {
        width: 60vw;
        padding-left: 15px;
        padding-right: 0;
        display: block;
      }

      .mobile-screens {
        display: block;
        overflow: hidden;
      }

      .navigation-font23 {
        font-size: 14px !important;
        line-height: normal !important;
        font-weight: 400 !important;
      }

      .mobile-screens {
        height: 50vh;
      }

      .mobile-screen {
        border-radius: 4px;
        margin-bottom: 15px;
        -webkit-transform: rotate(0);
            -ms-transform: rotate(0);
                transform: rotate(0);
      }

      .work_scroller_item {
        width: 100vw;
        min-width: 100vw;
        height: 75vh;
        padding: 0 15px 15px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
      }

      .work_scroller_content_container {
        z-index: 1001;
        margin-bottom: 0;
        margin-left: 0;
        padding-right: 30px;
        bottom: 35px;
        left: 30px;
        right: 0;
      }

      .work_scroller_camera {
        width: auto;
        height: auto;
      }

      .work_scroller_intro {
        width: 100%;
        height: auto;
        margin-right: 0;
        padding-bottom: 0;
        padding-left: 0px;
        padding-right: 25px;
        display: block;
      }

      .work_scroller_intro_container {
        position: relative;
        top: 0;
        left: 0;
      }

      .work_scroller_frame {
        grid-column-gap: 16px;
        grid-row-gap: 16px;
        -ms-grid-rows: auto 16px auto;
        grid-template-rows: auto auto;
        -ms-grid-columns: 1fr 16px 1fr;
        grid-template-columns: 1fr 1fr;
        grid-auto-columns: 1fr;
        width: auto;
        height: auto;
        display: block;
        position: relative;
      }

      .work_scroller_frame > *:nth-child(1) {
            -ms-grid-row: 1;
            -ms-grid-column: 1;
      }

      .work_scroller_frame > *:nth-child(2) {
            -ms-grid-row: 1;
            -ms-grid-column: 3;
      }

      .work_scroller_frame > *:nth-child(3) {
            -ms-grid-row: 3;
            -ms-grid-column: 1;
      }

      .work_scroller_frame > *:nth-child(4) {
            -ms-grid-row: 3;
            -ms-grid-column: 3;
      }

      .work_scroller_track {
        height: auto;
        overflow: visible;
      }

      .col-sp-1 {
        padding-top: 100px !important;
        margin-bottom: 60px !important;
      }

      .some_goodweb_head {
        padding-top: 90px;
        padding-bottom: 60px;
        font-size: 16px !important;
      }

      .counter-top-46 {
        margin-top: 0rem !important;
      }

      .head-two-right {
        line-height: 120% !important;
        margin-top: 40px !important;
        font-size: 22px !important;
      }

      .display.max_500 {
        margin-bottom: 20px;
      }

      .underline-approch-secend {
        border-bottom: 1px solid #ffffff;
        margin-top: 45px !important;
      }

      .underline-caresec20 {
        margin-top: 50px !important;
      }

      .underline-end {
        border-bottom: 1px solid #ffffff;
        margin-top: 30px !important;
      }

      .head-one-right {
        font-size: 22px;
        font-family: GalliardStd !important;
        line-height: 120%;
        font-weight: 400;
        margin-top: 50px !important;
      }

      .connect-mt140 {
        margin-top: 40px !important;
      }

      .work_scroller_intro_container {
        left: 21px !important;
        padding-bottom: 50px;
      }

      .text-project2 {
        font-size: 14px;
        line-height: 160%;
      }

      /* about page css code by abhii */


      .about-company-section {
        padding-top: 65px !important;
        padding-bottom: 65px !important;
        padding-right: 0% !important;
        padding-left: 0% !important;
      }

      .about-three-col-innnercol {
        padding: 20px 0px 15px 0px !important;
      }

      /* .border-right-p2 {
      border-bottom: 2px solid black !important;
      border-right: 0px solid black !important;
    } */
      .about-three-col-row {
        padding-bottom: 20px !important;
      }



      .about-button12 {
        margin-top: 20px !important;
      }

      .about-big-para72 {
        margin-top: 0px;
        padding: 0.962rem 2.22rem 0.702rem 2.22rem;
      }

      /* .contact-margin72 {
      margin-top: 72px;
    } */
      .about-three-col-description {
        padding-top: 40px !important;
        padding-bottom: 60px !important;
        padding-right: 0px !important;
        padding-left: 0px !important;
      }

      .about-good-website23 {
        font-size: 30px !important;
        line-height: 120% !important;
        margin-bottom: 15px !important;
      }

      .abouthead-main-left {
        font-size: 30px !important;
        line-height: 120% !important;
        margin-bottom: 5px !important;
        margin-top: 25px !important;
      }

      .abouthead-perfect-left {
        font-size: 30px !important;
        line-height: 120% !important;
        margin-bottom: 25px !important;
      }

      .about-paragrph-right20 {
        font-size: 14px !important;
        line-height: 180% !important;
        margin-bottom: 10px !important;
      }

      .big-bold-p25 {
        padding-top: 5px !important;
        padding-bottom: 5px !important;
      }

      .qa-bold-s24{
        padding-top: 25px !important;
        padding-bottom: 5px !important;
      }

      .studio-mobile33 {
        margin-top: 0rem !important;
      }

      .main-about-paragrph50 {
        font-size: 14px !important;
        line-height: 180% !important;
        margin-bottom: 15px !important;
        margin-top: 20px !important;
        font-weight: 500 !important;
      }

      .main-about-boltt50 {
        font-size: 14px !important;
        line-height: 180% !important;
        font-weight: 500 !important;
      }

      .underline-about92 {
        margin-top: 50px !important;
      }

      .bold-linemt20 {
        font-size: 14px !important;
        line-height: 180% !important;
        font-weight: 500 !important;
      }

      .underline-approch-thirdline {
        margin-top: 50px !important;
      }
      .spinning-height-mob23{
        height: 315px !important;
      }

      .perfect-team-p23 {
        font-size: 16px !important;
        line-height: 150% !important;
        margin-top: 30px;
        width: 100% !important;
      }
      .footer-spacing34{
        margin: 20px 0px;
      }

      .footer-first23{
        margin: 30px 0px;
      }

      .perfect-team-p34 {
        font-size: 16px !important;
        line-height: 150% !important;
        margin-top: 25px;
      }

      .text-ft-section {
        margin-bottom: 100px !important;
        margin-top: 15px !important;
        font-size: 18px !important;
      }

      .about-three-col-row {
        padding-bottom: 25px !important;
      }

      .text-bt-section {
        margin-bottom: 100px !important;
        margin-top: 12px !important;
        font-size: 18px !important;
      }

      .some_goodweb_paragraph20 {
        font-size: 16px;
        margin-bottom: 50px;
        margin-top: 14px;
      }

      .some_goodweb_para-last30 {
        font-size: 16px;
        margin-bottom: 38px;
        margin-top: 14px;
      }
        .service-margin46 {
        margin-top: 46px !important;
        }

      .num-ft-section {
        font-size: 32px !important;
        font-weight: 400 !important;
      }

      .about_head_main {
        font-size: 27px !important;
      }

      .about_big_paragraph98 {
        font-size: 19px !important;
        line-height: 140% !important;
        font-family: NeueHaasUnica !important;
      }

      .connect_text_p40 {
        font-size: 16px !important;
        line-height: normal !important;
      }

      .about-logo-company64 {
        padding-top: 0px !important;
        padding-right: 1% !important;
        padding-left: 1% !important;
        margin-bottom: 40px !important;
      }

      .last_sec_abouthead {
        font-size: 27px !important;
        line-height: 120% !important;
        margin-top: 30px !important;
        margin-bottom: 10px !important;
      }

      .about_white_container {
        width: 100%;
        height: 95vh !important;
      }

      .service_blue_container {
        width: 100%;
        height: 95vh !important;
      }

      .contact_mb20 {
        margin-bottom: 70px !important;
      }

      .about-three-col-innner-head {
        font-size: 25px !important;
        font-weight: 300;
        line-height: 120%;
        font-family: GalliardStd !important;
        margin-bottom: 15px !important;
        margin-left: 0px !important;
      }
      .hide-on-mobile{
        display: none;
      }

      .website-sec {
        font-size: 14px;
        font-family: NeueHaasUnica !important;
        line-height: 180%;
        margin-top: 0px !important;
        margin-bottom: 20px !important;
      }

      .about-three-col-innnercol p {
        font-size: 14px !important;
        color: #181818;
        font-weight: 300;
        line-height: 200% !important;
      }

      .rte ul div {
        font-size: 14px !important;
        font-family: NeueHaasUnica !important;
      }

      .aboutunderline-end {
        border-bottom: 1px solid #000000;
        margin-top: 50px !important;
        margin-bottom: 15px !important;
      }

      .staus-mt240 {
        margin-top: 4rem !important;
      }

      .contact_para190 {
        font-size: 16px !important;
        line-height: 150% !important;
      }

      .heading-checkbox {
        font-size: 16px !important;
        line-height: 150% !important;
        font-family: NeueHaasUnica !important;
        margin-top: 2rem;
        margin-bottom: 25px;
      }

      .smallhead-checkbox {
        font-size: 16px !important;
        line-height: 150% !important;
      }

      .italian-text20 {
        font-size: 16px !important;
        margin-left: 46px !important;
        line-height: 150% !important;
      }

      .contact-form-boxtwo {
        font-size: 16px !important;
        line-height: 150% !important;
      }

      .contact-form-control {
        font-size: 16px !important;
        line-height: 150% !important;
      }
      .owl-carousel .owl-nav button.owl-prev {
        margin-left: -7rem;
        position: absolute !important;
        background-image: url(https://goodwebsitedevsite.eternalsoft.in/wp-content/uploads/2024/12/icons-left-back.png) !important;
        background-position: 86% 49% !important;
        background-repeat: no-repeat !important;
      }
      .owl-carousel .owl-nav button.owl-next{
        margin-left: -7rem !important;
        position: absolute !important;
        background-image: url(https://goodwebsitedevsite.eternalsoft.in/wp-content/uploads/2024/12/icons-arrow-right.png) !important;
        background-position: 82% 49% !important;
        background-repeat: no-repeat !important;
      }

      .contact-sub-btn {
        padding: 17.6px 27px 12.6px 32px;
        font-size: 20px;
        font-weight: 500;
      }


      .faq-heading-big {
        font-size: 22px;
        margin-left: 61px;
        margin-top: -12px;
      }

      .service_head_main {
        font-size: 27px !important;
        line-height: 120% !important;
      }

      .service-hero23 {
        --colSpan: 8;
        padding-top: 18.5rem;
      }

      .sec-tm-one {
        font-size: 27px !important;
        line-height: 120% !important;
      }

      .sec-tm-two {
        font-size: 16px !important;
        line-height: normal !important;
      }

      .contact_220_prpl {
        padding-left: 15px !important;
        padding-right: 15px !important;
      }

      .abouthead-giles-left {
        font-size: 30px !important;
        margin-bottom: 25px;
        text-align: center;
        display: -ms-grid !important;
        display: grid !important;
        line-height: 120% !important;
      }

      .pd-px-456 {
        padding-right: 10px !important;
        padding-left: 10px !important;
      }

      .contact_mtmb_160 {
        padding-top: 40px;
        padding-bottom: 40px !important;
      }

      .line-contact23 {
        margin-bottom: 10px !important;
      }

      .custom-header {
        display: block;
      }

      .progressive-paragraph-sec23 {
        font-size: 14px !important;
        line-height: 180% !important;
        padding-top: 10px;
      }

      .progressive-head43 {
        font-size: 22px !important;
        line-height: 120% !important;
        padding-top: 25px;
      }

      .studio-head43 {
        font-size: 22px !important;
        line-height: 120% !important;
        padding-top: 35px !important;
      }
      .right-section a {
        font-size: 12px !important;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        margin-right: 0rem !important;
        margin-left: 0rem !important;
      }

      .about-head10 {
        margin-top: 30px !important;
        margin-bottom: 15px !important;
      }

      .about-long-line10 {
        margin-top: 10px !important;
        margin-bottom: 15px !important;
      }

      .giles-title43 {
        font-size: 16px !important;
        -webkit-box-pack: center !important;
            -ms-flex-pack: center !important;
                justify-content: center !important;
        margin-bottom: 25px !important;
      }

      .section-studio-head-23 {
        padding-top: 40px !important;
      }

      .section-perfect-head-23 {
        padding-top: 35px !important;
      }

      .mobile-downpad43 {
        padding-bottom: 5px;
      }
      .viewalltext-divp{
        opacity: 1 !important;
      }

      .about-bottom12 {
        margin-top: -10px !important;
        margin-bottom: 15px !important;
      }

      .right-section a:after {
        content: "";
        position: relative !important;
      }

      .threeblk-margin{
        margin-bottom: 38px !important;
      }
    }


    /* .col-3 img{
                  height: 12.5rem;
                  width: auto;
              } */

    .minus-100 {
      margin-left: -50%;
    }

    .scrollmagic-pin-spacer {
      padding-top: 0 !important;
      padding-bottom: 0 !important;
      /* height: 25rem !important  ; */
      position: relative !important;
    }

    .projects-column-1 img {
      -webkit-box-shadow: rgba(0, 0, 0, 0.35) 0rem 0.3125rem 1.3125rem;
      box-shadow: rgba(0, 0, 0, 0.30) 0rem 0.2125rem 1.0125rem;
      border-radius: 6px;
      width: calc((100vw - 40px) / 3);
    }

    /*button styles*/

    .custom_menu-btn {
      position: fixed;
      right: 1.5625rem;
      top: 0.9375rem;
      width: 2.5rem;
      height: 2.5rem;
      z-index: 4;
    }

    .custom_menu-btn::before {
      content: "";
      position: absolute;
      top: 0;
      right: 0;
      width: 100%;
      height: 100%;
      background-color: white;
      -webkit-box-shadow: 0 0 0.3125rem 0 rgba(0, 0, 0, 0.07);
      box-shadow: 0 0 0.3125rem 0 rgba(0, 0, 0, 0.07);
      z-index: 7;
      border-radius: 100%;
      -webkit-transition: all 0.8s;
      -o-transition: all 0.8s;
      transition: all 0.8s;
    }

    .custom_menu-btn.menu_btn-style::before {
      width: 100vh;
      height: 100vh;
      background-color: #ffffff;
      -webkit-transform: scale(5);
      -ms-transform: scale(5);
      transform: scale(5);
      border-radius: 0;
    }

    .custom_menu-btn button {
      cursor: pointer !important;
      width: 2.5rem;
      height: 2.5rem;
      outline: none;

      border-radius: 100%;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
      -ms-flex-direction: column;
      flex-direction: column;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      justify-content: center;

      position: relative;
      z-index: 999;
      margin: 0;
    }

    /*
              .custom_menu-btn button span {
                display: block;
                position: absolute;
                width: 86%;
                height: 86%;
                background-color: #000000;
                -webkit-transition: all 0.3s;
                transition: all 0.3s;
                border-radius: 50%;
                bottom: 0.15625rem;
                right: 0.16375rem;
              } */

    .custom_menu-btn button span {
      display: block;
      position: absolute;
      width: 90%;
      height: 90%;

      -webkit-transition: all 0.3s;
      -o-transition: all 0.3s;
      transition: all 0.3s;
      border-radius: 50%;
      bottom: 4.4%;
      left: 5.1%;
      float: left;
    }

    .custom_menu-btn .s-2 {
      -webkit-transition: all 0.1s;
      -o-transition: all 0.1s;
      transition: all 0.1s;
    }

    .menu_btn-style button span {
      background-color: #00000000;
    }

    /* .menu_btn-style button .s-1 {
                -webkit-transform: rotate(45deg) translate(0.375rem, 0.375rem);
                        transform: rotate(45deg) translate(0.375rem, 0.375rem);
              } */

    .menu_btn-style button .s-2 {
      -webkit-transform: translateX(6.25rem);
      -ms-transform: translateX(6.25rem);
      transform: translateX(6.25rem);
    }

    .menu_btn-style button .s-3 {
      -webkit-transform: rotate(-45deg) translate(0.3125rem, -0.3125rem);
      -ms-transform: rotate(-45deg) translate(0.3125rem, -0.3125rem);
      transform: rotate(-45deg) translate(0.3125rem, -0.3125rem);
    }

    .overlay {
      height: 100%;
      width: 0;
      position: fixed;
      top: 0;
      left: 0;
      overflow: hidden;
      -webkit-transition: 1.2s;
      -o-transition: 1.2s;
      transition: 1.2s;
      z-index: 9;
    }

    .overlay .closebtn {
      position: absolute;
      top: 0;
      right: 1.875rem;
      font-size: 3.75rem;
    }

    .overlay a {
      padding: 0rem;
      text-decoration: none;
      color: #ffffff;
      display: block;
      -webkit-transition: 0.3s;
      -o-transition: 0.3s;
      transition: 0.3s;
      margin-bottom: 0.9375rem;

      font-weight: 600;
      opacity: 0;
    }

    .overlay a:hover {
      color: #fd9c6b;
    }

    .overlay-content {
      position: relative;
      width: 100%;
      text-align: center;
      z-index: 9999;
    }

    .menu_width {
      width: 100%;
      overflow: hidden;
    }

    .menu_width.overlay a {
      opacity: 1;
    }

    .overlay-content ul li a {
      color: black !important;
    }

    .menubutton-inline-a {
      font-family: NeueHaasUnica !important;
      font-weight: 400 !important;
    }

    .menubutton-inheading {
      font-size: 3.75rem;
      font-family: NeueHaasUnica !important;
      line-height: 1.2 !important;
      font-weight: 600 !important;
    }

    .menubutton-inheading:hover {
    }

    .copyright-link {
      position: relative;
      top: 55%;
      font-size: 18px;
    }

    .btn-clr {
      background: black;
      border: 2px solid white;
    }

    .menu_btn-style .btn-clr {
      background: white;
      border: 2.35px solid black;
    }

    #myNav {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      justify-content: center;
      top: 30vh;
    }

    .logo-container {
      height: 90px;
      width: 90px;
      padding: 13px 16px 11px 10px;
      border-radius: 50%;
      background: white;
    }

    .logo-container:hover {
      background: #ffffff33;
    }

    .desktop-menu a {
      color: black;
      text-transform: uppercase;
      text-decoration: none;
      letter-spacing: 0.15em;

      display: inline-block;
      padding-bottom: 4px;
      position: relative;
    }

    .desktop-menu a:after {
      background: none repeat scroll 0 0 transparent;
      bottom: 0;
      content: "";
      display: block;
      height: 2px;
      left: 50%;
      position: absolute;
      background: black;
      -webkit-transition: width 0.3s ease 0s, left 0.3s ease 0s;
      -o-transition: width 0.3s ease 0s, left 0.3s ease 0s;
      transition: width 0.3s ease 0s, left 0.3s ease 0s;
      width: 0;
    }

    .desktop-menu a:hover:after {
      width: 100%;
      left: -1.4%;
    }

    .highlight {
      background-color: black !important;
      border: 2px solid black;
    }

    #elementToClick {
      margin: 0;
      top: 44px;
      right: -52px;
      -webkit-transition: -webkit-transform 0.4s ease-out;
      transition: -webkit-transform 0.4s ease-out;
      -o-transition: transform 0.4s ease-out;
      transition: transform 0.4s ease-out;
      transition: transform 0.4s ease-out, -webkit-transform 0.4s ease-out;
      -webkit-transition-delay: 0s !important;
      -o-transition-delay: 0s !important;
      transition-delay: 0s !important;
      margin: 0;
    }

    .d-none {
      display: none;
    }

    .ccta-text-block {
      width: 29px;
      display: inline-block;
      margin-top: 2px;
    }

    .justify-cc {
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      justify-content: center;
    }

    /* specific media query for nav links */
    @media screen and (min-device-width: 1024px) and (max-device-width: 1280px) {
      .medd-linkc {
        margin-right: 7.5vw !important;
        margin-left: 7.5vw !important;
        -webkit-box-pack: center !important;
        -ms-flex-pack: center !important;
        justify-content: center !important;
      }
    }

    @media (min-width: 768px) {
      .m-cust-md-3 {
        margin: 0.75rem !important;
      }
    }

    @media screen and (min-width: 1024px) and (max-width: 1680px) and (min-height: 800px) and (max-height: 849px) {
      .img-project-head23 {
          margin-top: 5rem !important;
      }
      .img-pool-vid41 {
        margin-top: -8rem !important;
        z-index: 10;
        position: relative;
    }
    .green-wolf-img23{
      margin-top: -5rem !important;
      z-index: 10;
      position: relative;
  }
}


    @media screen and (min-width: 1024px) and (max-width: 1680px) and (min-height: 700px) and (max-height: 749px) {
      .img-project-head23 {
          margin-top: 9rem !important;
      }
      .img-pool-vid41 {
        margin-top: -2rem !important;
        z-index: 10;
        position: relative;
    }
    .green-wolf-img23{
      margin-top: 4rem !important;
    }
  }

  @media screen and (min-width: 1024px) and (max-width: 1680px) and (min-height: 750px) and (max-height: 799px) {
    .img-pool-vid41 {
      margin-top: -5rem !important;
      z-index: 10;
      position: relative;
    }
  .img-project-head23 {
    margin-top: 9rem !important;
  }
  .green-wolf-img23{
    margin-top: -1rem !important;
  }
  }

    @media screen and (min-width: 1024px) and (max-width: 1680px) and (min-height: 600px) and (max-height: 649px) {
      .img-project-head23 {
          margin-top: 14rem !important;
      }
      .img-pool-vid41{
        margin-top: 3rem !important;
      }
      .green-wolf-img23{
        margin-top: 8rem !important;
      }
  }

  @media screen and (min-width: 1024px) and (max-width: 1680px) and (min-height: 650px) and (max-height: 699px) {
    .img-project-head23 {
        margin-top: 14rem !important;
    }
    .img-pool-vid41{
      margin-top: 3rem !important;
    }
    .green-wolf-img23{
      margin-top: 5rem !important;
    }
}


  @media screen and (min-width: 1024px) and (max-width: 1680px) and (max-height: 599px) {
    .img-project-head23 {
        margin-top: 18rem !important;
    }
    .img-pool-vid41{
      margin-top: 9rem !important;
    }
    .green-wolf-img23{
      margin-top: 12rem !important;
    }
}

@media screen and (min-device-width: 64.25rem) and (max-device-width: 101.5rem) and (min-height: 850px) and (max-height: 999px) {
  .desjoyaux_container_pdpage {
      height: 189vh !important;
  }
  .img-pool-vid41 {
    margin-top: -8rem !important;
    position: relative;
    z-index: 10;
}
.green-wolf-img23{
   margin-top: -5rem !important;
}
}

    @media screen and (min-device-width: 768px) and (max-device-width: 1200px) {
      .copyright-link {
        display: none !important;
      }
    }

    /*landscape mobile device */
    @media screen and (min-device-width: 500px) and (max-device-width: 760px) {
      .abv-links {
        position: relative !important;
        bottom: 0 !important;
        float: left !important;
        padding: 10px 0 !important;
        left: 0 !important;
      }

      .ftext-36 {
        width: 100% !important;
      }

      .footer-main {
        min-height: 135vh !important;
      }

      .d-slash {
        display: inline-block !important;
      }
    }


    @media screen and (min-device-width: 1024px) and (max-device-width: 1108px) {
      .column-tab-btn {
        display: none !important;
      }
    }

    /* ultra small device */
    @media screen and (min-device-width: 210px) and (max-device-width: 378px) {
      .menubutton-inheading {
        font-size: 1.2rem !important;
        line-height: 1.35 !important;
      }

      .cust-mb-home-link {
        margin-bottom: 1rem !important;
      }

      .text-20 {
        font-size: 0.9rem !important;
      }

      .leading-none {
        line-height: 0.7 !important;
      }
    }

    /* ultra smalldevice- landscape mobile device : height */

    @media screen and (min-device-width: 1281px) and (max-device-width: 1448px) {
      .medd-linkc {
        margin-right: 10vw !important;
        margin-left: 10vw !important;
        -webkit-box-pack: center !important;
        -ms-flex-pack: center !important;
        justify-content: center !important;
      }
    }

    /* specific media query for hero title */
    @media screen and (min-device-width: 1920px) {
      .mt-xl-c60 {
        margin: 12rem 21vw 3.75rem 21vw !important;
      }

      .mt-about-23 {
        margin: 12rem 14vw 3.76rem 14vw !important;
      }

      .abv-footer-proj-img-margin {
        margin-bottom: 50px;
      }

      .csm-lg-dvc-4 {
        margin: 1.71rem !important;
      }

      .service-margin46 {
        margin-top: 46px;
      }

      .threeblk-margin{
        margin-bottom: 82px !important;
      }

    }

    @media screen and (min-device-width: 1029px) and (max-device-width: 1100px) {
      .projects-column-1 img {
        width: calc((147.458vw - 40px) / 3) !important;
      }
    }

    @media screen and (min-device-width: 1029px) and (max-device-width: 1200px) {
      .rte ul {
        -ms-grid-columns: (minmax(0, 1fr))[1] !important;
        grid-template-columns: repeat(1, minmax(0, 1fr)) !important;
      }

      .rte ul li {
        margin-bottom: 0px !important;
      }
    }

    @media screen and (min-device-width: 2480px) {
      .mt-xl-c60 {
        margin: 12.5rem 14vw 3.75rem 14vw !important;
      }

      .mt-about-23 {
        margin: 12.5rem 14vw 3.75rem 14vw !important;
      }
    }

    .hidden-p {
      overflow: hidden !important;
    }

    .box {
      opacity: 1;
      -webkit-transition: opacity 0.8s ease;
      -o-transition: opacity 0.8s ease;
      transition: opacity 0.8s ease;
    }

    .fade-in.fade-in-active {
      opacity: 0;
    }

    .pr-vw2 {
      padding-right: 2.4vw !important;
    }

    .logo-spacing-div {
      width: 90px !important;
      margin-left: 58px !important;
      margin-right: 51px !important;
    }

    .cusp-logoh {
      padding-bottom: 0.875rem;
      padding-top: 0.563rem;
    }

    .column-tab-btn {
      -ms-flex-wrap: wrap;
      flex-wrap: wrap;
    }

    .outer {
      width: 100%;
      min-height: 100vh;
      background-color: grey;
    }

    .booger {
      margin: 7vh 30px 7vh 30px;
      opacity: 0.1;
      -webkit-transition: all 0.2s ease-in-out;
      -o-transition: all 0.2s ease-in-out;
      transition: all 0.2s ease-in-out;
    }

    .booger.scrolled {
      opacity: 1;
      margin: 0px 30px !important;
    }

    .booger.scrolled:nth-child(2) {
      opacity: 0.5;
    }

    .cfont-115 {
      font-family: GalliardStd !important;
      font-weight: 500;
      font-size: 5.5vw !important;
      line-height: 140%;
      letter-spacing: -1px;
      color: #181818;
    }

    .viewall-btn-a {
      font-size: 22px !important;
      height: 22px !important;
      display: inline-block !important;
    }

    .viewall-btn-svg {
      display: inline-block !important;
      margin: 1px 0px 4px 0px !important;
    }

    .cta-round-btn {
      padding: 0.4rem 0.4rem 0.4rem 0.5rem;
    }

    .g-logo-img {
      height: 65px;
      width: 64px;
    }

    .cust-whitesp {
      white-space: nowrap;
      display: block;
    }

    .ccta-text-block a {
      position: relative;
      top: -1.8px;
    }


    .view-intab {
      background-size: 110%;
      -webkit-transition: background-size;
      -o-transition: background-size;
      transition: background-size;
      -webkit-transition-duration: 2.5s;
      -o-transition-duration: 2.5s;
      transition-duration: 2.5s;
      -webkit-transition-timing-function: cubic-bezier(.4, 0, .2, 1);
      -o-transition-timing-function: cubic-bezier(.4, 0, .2, 1);
      transition-timing-function: cubic-bezier(.4, 0, .2, 1);

    }

    .view-intab:hover {
      /*background-size: 119%;*/
      background-color: rgba(0, 0, 0, .5);
    }

    /* .black-opa:hover{

              background-color: rgba(0, 0, 0, .5);
            } */

    /* .view-intab:hover .viewalltext-divp {

              opacity: 1;
            } */


    .visible {
      opacity: 1 !important;
      -webkit-transition: opacity 0.5s ease;
      -o-transition: opacity 0.5s ease;
      transition: opacity 0.10s ease;
    }


    .after\:transition-all:after {
      content: var(--tw-content);
      -webkit-transition-duration: .15s;
      -o-transition-duration: .15s;
      transition-duration: .15s;
      -webkit-transition-property: all;
      -o-transition-property: all;
      transition-property: all;
      -webkit-transition-timing-function: cubic-bezier(.4, 0, .2, 1);
      -o-transition-timing-function: cubic-bezier(.4, 0, .2, 1);
      transition-timing-function: cubic-bezier(.4, 0, .2, 1);
    }

    .after\:bg-white:after {
      --tw-bg-opacity: 1;
      background-color: #ffffff;
      content: var(--tw-content);
    }

    .after\:w-\[var\(--hrSlideWidth\)\]:after {
      content: var(--tw-content);
      width: var(--hrSlideWidth);
    }

    .after\:h-full:after {
      content: var(--tw-content);
      height: 100%;
    }

    .after\:block:after {
      content: var(--tw-content);
      display: block;
    }


    .after\:z-50:after {
      content: var(--tw-content);
      z-index: 50;
    }

    .after\:top-0:after {
      content: var(--tw-content);
      top: 0;
    }

    .after\:left-\[var\(--hrSlidePos\)\]:after {
      content: var(--tw-content);
      left: var(--hrSlidePos);
    }

    .after\:absolute:after {
      content: var(--tw-content);
      position: absolute;
    }


    .nextp-btn {
      background: transparent;
      color: black;
    }


    /*about page styles*/

    .about-company-section {
      padding-top: 154px;
      padding-right: 27%;
      padding-left: 27%;
      padding-bottom: 144px;
    }

    .about-company-section p {
      color: black;
    }



    .mb-rem2 {
      margin-bottom: 2rem;
    }

    .about-three-col-description {
      padding-top: 102px;
      padding-bottom: 105px;
      padding-right: 50px;
      padding-left: 50px;
    }


    .about-three-col-heading {
      font-size: 24px;
      line-height: 150%;
      text-align: center;
      font-family: GalliardStd !important;
    }

    .about-three-col-row {
      padding-bottom: 45px;
    }

    .abouthead-giles-left {
      font-size: 70px;
      line-height: 120%;
      font-weight: 400;
      font-family: GalliardStd;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
    }

    .border-right-p2 {
      border-right: 2px solid black;
    }

    .about-three-col-innner-head {
      font-size: 50px;
      font-weight: 400;
      margin-bottom: 40px;
      line-height: 120%;
      font-family: GalliardStd;
    }

    .underline-light-about32 {
      border-bottom: 2px solid #e1e1e1 !important;
    }

    .underline-about-48 {
      border-bottom: 1px solid #e1e1e1 !important;
    }

    .underline-studioup-48 {
      border-bottom: 1px solid #e1e1e1 !important;
    }


    .about-three-col-innnercol p {
      font-size: 18px;
      color: #181818;
      font-weight: 400;
      font-family: NeueHaasUnica !important;
      line-height: 200%;
      opacity: 1 !important;
      -webkit-transform: translateY(0);
          -ms-transform: translateY(0);
              transform: translateY(0);
      -webkit-animation-duration: 0.5s;
              animation-duration: 0.5s;
    }

    .about-margin72 {
      margin-top: 35px;
      padding: 0.962rem 2.22rem 0.702rem 2.22rem;
    }

    .about-button12 {
      margin-top: 35px;
      padding: 0.862rem 2.22rem 0.702rem 2.22rem;
    }

    .about-big-para72 {
      margin-top: 15px;
      padding: 0.962rem 2.22rem 0.702rem 2.22rem;
    }

    .bg-custom-darkgrey {
      background-color: #f0f0f0;
    }


    /*project overview-page*/


    .padding-lr {
      padding-right: 0 !important;
      padding-left: 0;
      position: relative !important;
    }

    .proj-over-imgstyle {
      position: relative;
      margin-top: 0;
      color: black;
      width: auto;
    }

    .proj-over-single {
      padding-bottom: 10px;
      padding-right: 0 !important;
      padding-left: 0 !important;
    }


    .text-custom-black {
      color: #181818;
    }

    .button-81 {
      margin-bottom: 0.5rem !important;
      white-space: nowrap;
      background: transparent;
      -webkit-backface-visibility: hidden;
      backface-visibility: hidden;
      border-radius: 0.375rem;
      border-style: solid;
      border-width: 0.0625rem;
      -webkit-box-sizing: border-box;
      box-sizing: border-box;
      color: #181818;
      cursor: default !important;
      display: inline-block;
      font-family: Circular, Helvetica, sans-serif;
      font-size: 0.75rem;
      font-weight: 400;
      letter-spacing: -0.01em;
      line-height: 1.3;
      padding: 0.4rem 0.8rem 0.35rem 0.8rem;
      position: relative;
      text-align: left;
      text-decoration: none;
      -webkit-transform: translateZ(0) scale(1);
      transform: translateZ(0) scale(1);
      -webkit-transition: -webkit-transform 0.2s;
      transition: -webkit-transform 0.2s;
      -o-transition: transform 0.2s;
      transition: transform 0.2s;
      transition: transform 0.2s, -webkit-transform 0.2s;
      -moz-user-select: none;
      -ms-user-select: none;
      user-select: none;
      -webkit-user-select: none;
      -ms-touch-action: manipulation;
      touch-action: manipulation;
      margin-right: 0.5rem !important;
    }

    .proj-over-imgstyle .view-all-btn {
      border-color: #181818;
    }

    .proj-over-imgstyle .view-all-btn i {
      color: #181818;
    }


    .proj-over-imgstyle .view-all-btn:hover {
      padding: 0rem 1.0725rem 0.0625rem 1.0725rem;
      border: 0.0625rem solid #181818;
      border-radius: 1.25rem;
      margin: 0rem 0.375rem;
      background: #181818 !important;
      color: white !important;
      -webkit-transition: all 0.3s ease-in-out;
      -o-transition: all 0.3s ease-in-out;
      transition: all 0.3s ease-in-out;
    }

    .view-all-btn:hover .wh-black {
      font-size: 0.9375rem;
      color: rgb(255, 255, 255) !important;
    }


    .proj-whitec:hover .view-all-btn {
      padding: 0rem 1.0725rem 0.0625rem 1.0725rem;
      border: 0.0625rem solid #181818;
      border-radius: 1.25rem;
      margin: 0rem 0.375rem;
      background: #181818 !important;
      color: rgb(255, 255, 255) !important;
      -webkit-transition: all 0.3s ease-in-out;
      -o-transition: all 0.3s ease-in-out;
      transition: all 0.3s ease-in-out;
    }


    .proj-whitec:hover .wh-black {
      font-size: 0.9375rem;
      color: rgb(255, 255, 255) !important;
    }

    .background-image-hero {
      height: 100vh;
      opacity: 1;
      -o-object-fit: cover;
      object-fit: cover;
      position: sticky;
      top: 0;
    }


    .background-image-hero-pd {
      height: 100vh;
      opacity: 1;
      -o-object-fit: cover;
      object-fit: cover;
      position: sticky;
      top: 0;
    }
    .background-video-hero-pd {
      height: 100vh;
      opacity: 1;
      -o-object-fit: cover;
      object-fit: cover;
      position: sticky;
      top: 0;
    }

    .c-pointer {
      cursor: pointer;
    }

    .w-52 {
      width: 52vw;
    }

    .mh-black {
      overflow-x: hidden !important;
      overflow-y: auto !important;
    }


    @media screen and (min-device-width: 13.125rem) and (max-device-width: 35.875rem) {
      .border-right-p2 {
        border-bottom: 2px solid black !important;
        border-right: 0px solid black !important;
      }
    }

    .service-sec-first-pt {
      padding-top: 23vh;
    }

    .service-sec-sec-pt {
      padding-top: 7vh;
    }

    .service-sec-third-pt {
      padding-top: 220px;
      margin-top: -60px;
    }
    .hidden_it {
    display: none !important; /* Use !important with caution, but it might be necessary here */
}

    .service-sec-fourth-pt {
      padding-top: 220px;
    margin-top: -99px;
  }

    .service-sec-fifth-pt {
      padding-bottom: 15vh;
      padding-top: 190px;
      margin-top: -100px;
  }

.bg-change23{
  background-color: #222;
  -webkit-transition: 350ms ease;
  -o-transition: 350ms ease;
  transition: 350ms ease;
}
/* Default state */

/* Ensure a smooth transition on color changes */


/* When rte--black is active */
.navigation--black .navigation__link::after {
  background-color: black !important; /* Change color when rte--black is active */
}

.navigation__black.active::after {
width: 100% !important;
}

.moretext.-expanded {
  display: block; /* Show the content when the '-expanded' class is added */
}
    .view-all-service-btn-last {
      padding: 8px 10px 6px 11px;
        border: 0.0625rem solid rgb(0 0 0);
      border-radius: 1.25rem;
      margin: 0rem !important;
      color: black !important;
      -webkit-transition: all 0.3s ease-in-out;
      -o-transition: all 0.3s ease-in-out;
      transition: all 0.3s ease-in-out;
    }
    .expanded, .collapsed {
      display: none;
    }

    button[aria-expanded="false"] .collapsed {
      display: inline-block;
    }

    button[aria-expanded="true"] .expanded {
      display: inline-block;
    }

    #content {
      display: none;
    }
     .up-video23{
         height: 100vh;
    object-fit: cover;
 }

.button-container {
    display: flex;
    flex-wrap: wrap;
    justify-content: center; /* Center-aligns buttons */
    gap: 10px; /* Adds space between buttons */
}

.button-transprent, .web-button {
    padding: 10px 25px 6px 25px;
    border: 1px solid black;
    border-radius: 6px; /* Optional: Rounded corners */
    font-size: 16px;
    cursor: pointer;
    white-space: nowrap; /* Prevents text from wrapping */
}



@media (max-width: 768px) {
    .button-container {
        flex-direction: column;
        align-items: center;
    }
}