@media (min-width: 1920px) and (max-width: 2560px) {
    *,
    .container {
      box-sizing: border-box;
    }
    .container {
      width: 100%;
      max-width: 1300px;
      margin: 0 auto;
      padding-top: 10px;
      padding-right: 10px;
    }
  }
  @media (max-width: 1100px) {
    .swiper-wrapper {
      display: block !important;
    }
    .services-main-wrapper {
      height: auto !important;
    }
    .swiper-slide {
      overflow: scroll;
    }
  }
  @media (max-width: 1440px) {
    .brand-num a,
    .choose-txt span,
    .choose-txt span h2 {
      line-height: 60px;
      font-family: Graphik;
      font-weight: 200;
    }
    .row-one {
      padding: 0px 0px;
    }
    section.service-detail-sliders {
      padding-bottom: 0px;
    }
    .accordion-faq-new {
      max-height: 380px !important;
      overflow: auto;
    }
    .contact-left-section h1,
    .contact-left-section p,
    .contact-left-section span {
      font-size: 19px;
      margin-bottom: 10px;
    }
    .c-num,
    .w-app,
    .w-mail {
      display: flex;
      padding: 0px 0px;
    }
    .c-num a,
    .w-app a,
    .w-mail a {
      font-size: 18px;
    }
    .ul-brand {
      padding-top: 15px;
    }
    .nav-section ul li {
      width: 100%;
      margin-bottom: 50px;
    }
    .footer-bottom-inner h3 {
      margin-bottom: 15px;
    }
    .num-top6 {
      position: absolute;
      top: 20px;
      left: 220px;
    }
    .header-social-section ul li a {
      font-size: 30px;
      line-height: 37px;
    }
    .nav-section {
      width: 50%;
      padding-top: 100px;
      position: relative;
    }
    .creative-section h2,
    .creative-section p {
      text-align: center;
      font-weight: 200;
      font-size: 51px;
    }
    .creative-section h3 {
      text-align: center;
      font-weight: 200;
      font-size: 63px;
    }
    .hme-category img {
      max-height: 560px;
    }
    .categories-wrapper .categories {
      width: 75%;
    }
    .contact-left-section h1 {
      font-size: 60px;
    }
    .star-rate p {
      font-size: 13px;
    }
    .container,
    .container-serv {
      width: 90%;
      box-sizing: border-box;
      padding-left: 40px;
      padding-right: 40px;
    }
    .about-fourth-section-video {
      width: 530px;
      height: 530px;
    }
    .categories-wrapper-t .categories {
      width: 90%;
    }
    .brand-num a {
      font-size: 60px;
      color: #0fd0dc;
      padding-left: 30px;
    }
    .ux-vertical-tabs .tabs button {
      padding: 15px 50px 15px 0;
    }
    .choose-txt span,
    .choose-txt span h2 {
      font-size: 51px;
      color: #fefefe;
      display: inline-block;
    }
    .about-first-section-content h2,
    .about-first-section-content h3 {
      font-size: 45px;
      line-height: 55px;
      margin-bottom: 20px;
    }
    .about-first-section-content h1 {
      font-size: 45px;
      line-height: 55px;
    }
    .about-first-section-content p {
      font-size: 22px;
      line-height: 30px;
    }
    .banner-roster-image {
      position: absolute;
      max-width: 155px;
      left: 15%;
      top: 14%;
    }
    .banner-second-image {
      position: absolute;
      max-width: 110px;
      right: 32%;
      top: 15%;
    }
    .project-image-main img {
      width: 100%;
      height: 560px;
    }
    .social-image-main ul li:nth-child(4) img {
      width: 300px;
      height: 262px;
    }
    .approach-text span,
    .approach-text span h2 {
      font-size: 51px;
    }
    span.acco-num {
      font-size: 25px;
    }
  }
  @media screen and (min-width: 1135px) {
    .banner-first-image {
      position: absolute;
      max-width: 220px;
      left: 24%;
      top: 18%;
    }
    .banner-vr-image {
      position: absolute;
      max-width: 141px;
      left: 18%;
      top: 55%;
    }
  }
  @media (min-width: 768px) and (max-width: 991px) {
    .num-top,
    .num-top6 {
      top: 9px;
      position: absolute;
    }
    .num-top6 {
      left: 156px;
    }
    .num-top {
      left: 155px;
    }
    .banner-first-image {
      position: absolute;
      max-width: 140px;
      left: 10%;
      top: 30%;
    }
    .card-text p {
      font-size: 20px;
    }
    .logo_hover {
      position: relative;
      width: 90%;
    }
    .project-image-main img {
      width: 100%;
      height: 560px;
    }
    .contact-left-section h2,
    .contact-left-section p.lets-connect {
      font-size: 60px;
      line-height: 76px;
    }
    .container-serv {
      width: 100%;
      padding-left: 0;
      padding-right: 0;
    }
    .service-icon {
      width: 50px;
      margin-right: 25px;
      margin-left: 25px;
    }
    .banner-second-image {
      position: absolute;
      max-width: 100px;
      right: 15% !important;
      top: 30% !important;
    }
    .banner-third-image {
      position: absolute;
      max-width: 100px;
      left: 10%;
      top: 60%;
    }
    .banner-fourth-image {
      position: absolute;
      max-width: 120px;
      right: 8%;
      top: 63%;
    }
    .banner-marine-image {
      position: absolute;
      max-width: 150px;
      left: 7%;
      top: 60%;
    }
    .third-banner-tender {
      position: absolute;
      max-width: 140px;
      right: 10%;
      top: 67%;
    }
    .banner-vr-image {
      position: absolute;
      max-width: 141px;
      left: 10%;
      top: 70%;
    }
    .second-banner-helmat {
      position: absolute;
      max-width: 100px;
      right: 13%;
      top: 70%;
    }
    .chat-call {
      position: fixed;
      bottom: 19%;
    }
    .chat-mail {
      position: fixed;
      bottom: 12%;
    }
  }
  @media (max-width: 769px) {
    div#delay3 img {
      height: 528px;
    }
    .get-group {
      width: 100%;
    }
    .get-form span {
      color: #b3f52b;
      font-family: ContaxSans55;
      margin-bottom: 10px;
      font-size: 38px;
      line-height: 20px;
      font-weight: 900;
    }
    .error-txt h1 {
      font-size: 26px;
      font-weight: 400;
      line-height: 44px;
      letter-spacing: 0em;
      text-align: center;
      width: 100%;
      margin: 0 auto;
    }
    .speciality-circle {
      width: 55px;
      height: 55px;
      background-color: #b3f52b;
      border-radius: 50%;
      animation: rotateText 5s infinite linear;
      box-shadow: -4px -2px 8px 0px #c4c4c4;
      position: absolute;
      top: 0px;
      left: 10px;
      transform: translateX(-50%);
      z-index: 10;
    }
    .speciality-page p {
      margin: 0 auto;
      font-size: 37px;
      font-weight: 500;
      display: block;
      font-family: Graphik;
      text-transform: capitalize;
    }
    .error-icons a {
      width: 35px;
      height: 35px;
    }
    .error-img {
      width: 50%;
    }
    .error-txt {
      width: 50%;
    }
    @keyframes slideUpDown {
      0%,
      100% {
        transform: translateY(0%);
      }
      60% {
        transform: translateY(-5%);
      }
      100% {
        transform: translateY(0%);
      }
    }
    .round-texts {
      width: 100%;
      padding-left: 0px;
    }
    .special-left {
      width: 100%;
    }
    .special-right .bullet-list {
      margin-left: 25px;
    }
    .special-right .bullet-list li {
      text-align: justify;
    }
    .special-right {
      width: 100%;
      padding-top: 0px;
    }
    .round-texts p {
      font-weight: 600;
      font-size: 26px;
      color: #000;
      font-family: Graphik;
      line-height: 40px;
      text-align: left;
    }
    .row-one {
      flex-wrap: wrap;
    }
    .expert-img-slide {
      width: 100%;
    }
    .expert-img-slide-2 {
      width: 100%;
      padding-top: 0px;
    }
    .expert-row {
      width: 100%;
    }
    .devlop-content-1 img {
      padding-right: 0px;
    }
    .devlop-content-2 img {
      padding-left: 0px;
    }
    .row-one {
      padding: 0px 0px;
    }
    .contact-form-section,
    .contact-left-section,
    .container,
    .footer-box,
    .header-main,
    .logo,
    .w-50,
    .w-50.me,
    footer,
    header {
      box-sizing: border-box;
    }
    .eye,
    .eye1 {
      rotate: none !important;
      transform: none !important;
    }
    .about-first-section,
    .partner-list-main ul li:nth-child(7) img,
    .partner-list-main ul li:nth-child(8) img,
    .project-image-main img {
      width: 100%;
      height: auto;
    }
    .partner-list-main ul li:nth-child(7) img {
      width: 80%;
      height: auto;
    }
    .partner-list-main ul li {
      width: 50% !important;
    }
    .btn-with-txt {
      font-size: 16px;
    }
    .about-saturn-image,
    .blog-date,
    .blog-list-main a:hover .hover-reveal,
    .blog-title-main h2,
    .blog-title-main h3,
    .blog-title-main span,
    .blog-title-main-listing h1,
    .blog-title-main-listing h3,
    .contact-left-section br,
    .contact-left-section p.lets-connect br,
    .container-text,
    .container-text.left-to-right,
    .d-none,
    .expertise-second-content-box a::after,
    .main-wrk-text.marquee_2 span,
    .marquee.mb-n,
    .nav-img img,
    .nav-text,
    .social-image-main ul li:first-child,
    .social-image-main ul li:nth-child(10),
    .social-image-main ul li:nth-child(11),
    .social-image-main ul li:nth-child(2),
    .social-image-main ul li:nth-child(8),
    .social-image-main ul li:nth-child(9),
    .social-title::after,
    .ux-text h2,
    .ux-vertical-tabs.lg-view,
    .work-connect-logo-content h2 br,
    .work-connect-logo-content p br,
    .work-detail-banner h2,
    div#wrk-slider2,
    h1.p-heading,
    p.p-heading,
    section.banner-section .owl-nav {
      display: none;
    }
    article.wrapper {
      transform: rotate(0);
      white-space: nowrap;
    }
    .footer-box p {
      padding-bottom: 0;
      padding-top: 0;
    }
    .choose-txt span h2 {
      font-size: 40px;
      line-height: 45px;
      display: inline;
    }
    .choose-txt span {
      font-size: 40px;
      line-height: 47px;
      display: inline-block;
    }
    .about-second-section-inner .marquee {
      height: auto;
      line-height: 120px;
      overflow: initial !important;
      width: 100%;
    }
    .ux-text h3 {
      font-size: 18px;
      font-family: Graphik;
      font-weight: 400;
      margin-bottom: 15px;
      color: #fff;
    }
    .swiper-slide.slide2.about-second-section .container {
      width: 100%;
      max-width: 100%;
    }
    .marquee-left-side {
      width: 100% !important;
    }
    .about-second-section-inner {
      position: relative;
      display: flex;
      flex-direction: column;
    }
    .marquee__group span {
      font-size: 3rem;
    }
    .service-icon {
      width: 50px;
      margin-right: 25px;
      margin-left: 25px;
    }
    .container-serv {
      width: 100%;
      padding-left: 0;
      padding-right: 0;
    }
    .work-slider-section {
      display: block;
    }
    .abt-hover img,
    .footer-box:first-child,
    .footer-box:nth-child(2),
    .footer-box:nth-child(3),
    .logo_hover img,
    .swiper-slide.slide4.about-fourth-section .container,
    .work-listing-main ul li,
    section.partner-section .container,
    section.services-main-wrapper .container {
      width: 100%;
    }
    .patner-title-main {
      text-align: left;
      margin-left: 26px;
    }
    .w-100 {
      width: 100%;
      display: flex;
      flex-wrap: wrap;
    }
    .w-100 a:nth-child(2) {
      width: 60%;
    }
    .w-100 a:nth-child(3) {
      width: 40%;
    }
    .container {
      width: 95%;
      padding: 0 15px;
    }
    .ux-vertical-tabs.sm-vew {
      display: inline-block;
      padding-bottom: 20px;
      width: 100%;
    }
    .services-main-wrapper {
      min-height: 100vh !important;
    }
    .ux-vertical-tabs.sm-vew .tabs button.active,
    .ux-vertical-tabs.sm-vew .tabs button:hover {
      background: linear-gradient(
        90deg,
        #3b3174 33%,
        rgba(100, 80, 152, 0.02594541234462533) 100%
      );
    }
    .about-first-section-content h1,
    .about-first-section-content h3 {
      font-size: 30px;
      line-height: 40px;
    }
    .ux-vertical-tabs .btn-with-txt {
      margin-top: 0px;
      color: #fafafa;
      font-weight: 500;
      margin-bottom: 5px;
    }
    .ux-vertical-tabs .btn-with-txt .btn-creative {
      background-color: #785ca6;
    }
    .ux-vertical-tabs .maincontent {
      padding: 0;
    }
    .maincontent .ux-text {
      padding-top: 20px;
      padding-left: 10px;
      padding-right: 10px;
    }
    .header-main {
      width: 100%;
      position: absolute;
      z-index: 99;
      top: 0;
      left: 0;
      padding: 15px 0 0;
    }
    .logo {
      width: 50%;
      float: left;
    }
    .menu-icon {
      margin-top: 15px;
    }
    .logo img {
      max-height: 70px;
    }
    #menu-active img {
      max-height: 50px;
    }
    .work-connect-inner-section {
      width: 100%;
      display: flex;
      flex-wrap: wrap;
      align-items: start;
    }
    .first-banner h2,
    .first-banner span {
      color: #fff;
      opacity: 0.3;
      font-weight: 900;
      position: absolute;
      top: 20% !important;
    }
    h1.lets-connect.sm-none {
      display: none;
    }
    .blog-section-image,
    .footer-box.d-flex {
      display: flex;
      justify-content: center;
    }
    .approach-text span h2,
    .blog-title-main .sub-title {
      display: inline;
    }
    .footer-box {
      border-bottom: 2px solid #222;
      width: 100%;
      padding-bottom: 10px;
      padding-top: 14px;
      padding-right: 0;
    }
    .about-section-inner,
    .partner-list-main {
      margin-top: 20px;
    }
    .w-50 {
      width: 50%;
    }
    .w-50.me {
      margin-left: 50px;
    }
    .footer-bottom-inner h3 {
      font-size: 28px;
    }
    a.t-top {
      padding-top: 10px;
    }
    .footer-box ul {
      width: 70%;
    }
    .ul-brand {
      padding-top: 0;
      width: 100% !important;
    }
    .chat-whatsapp {
      bottom: 5%;
      right: 25px;
    }
    .chat-mail {
      position: fixed;
      bottom: 14% !important;
      right: 25px;
    }
    .chat-call {
      position: fixed;
      bottom: 23%;
      right: 25px;
    }
    .about-section {
      padding: 50px 0;
      min-height: auto !important;
    }
    .about-section-inner h2 {
      font-size: 40px;
      line-height: 53px;
    }
    .about-section-inner p {
      font-size: 20px;
      line-height: 30px;
      margin-right: 10px;
      padding-right: 0;
      padding-bottom: 40px;
      text-align: justify;
    }
    .hand-image {
      top: -60px;
    }
    .project-image-title h3,
    .project-image-title span {
      font-size: 22px;
      line-height: 15px;
    }
    .about-content {
      flex-wrap: wrap;
    }
    .footer-box ul li a {
      line-height: 28px;
    }
    .footer-eye {
      max-height: 260px;
    }
    .footer-logo-section {
      padding: 30px 0 10px;
    }
    p.lets-connect.sm-none {
      display: none;
    }
    p.lets-connect.lg-none {
      font-size: 35px;
      line-height: 33px;
      font-family: ContaxSans55;
      font-weight: 500;
      margin-bottom: 15px;
      color: #b3f52b;
      padding-bottom: 20px;
    }
    h2.lets-connect.lg-none {
      font-size: 38px;
      line-height: 50px;
      font-family: ContaxSans55;
      font-weight: 900;
      margin-bottom: 15px;
      color: #b3f52b;
      padding-bottom: 20px;
    }
    .get-form form {
      gap: 25px;
    }
    .contact-first-section {
      margin-top: 15%;
      display: flex;
      flex-direction: column;
    }
    .contact-left-section {
      width: 100%;
      order: 2;
      padding-top: 40px;
      padding-bottom: 30px;
    }
    .services-tittles p {
      text-align: justify !important;
    }
    .form-group-btn {
      width: 100%;
      height: auto;
      text-align: center;
    }
    .contact-form-section {
      width: 100%;
      margin-left: 0;
      padding-top: 35px;
      order: 1;
    }
    .contact-left-section h2,
    .contact-left-section p.lets-connect {
      font-size: 35px;
      line-height: 33px;
      font-family: ContaxSans55;
      font-weight: 500;
      margin-bottom: 15px;
    }
    .c-num a,
    .w-app a,
    .w-mail a {
      font-size: 15px;
    }
    .contact-left-section h1,
    .contact-left-section p,
    .contact-left-section span {
      font-size: 16px;
      margin-bottom: 10px;
    }
    section.faq-txt {
      padding: 0px 0px;
    }
    .contact-left-section iframe {
      width: 100% !important;
    }
    .form-display {
      color: #373737;
      font-family: Graphik;
      font-size: 17px;
      font-weight: 400;
    }
    section.service-detail-sliders h3 {
      font-family: Graphik;
      font-size: 21px;
    }
    .owl-carousel.owl-theme.s-slid .b-slide-text span {
      font-size: 20px;
      line-height: 123%;
      font-weight: 500;
    }
    section.ecom-detail-sliders .beranding-text h3 {
      font-size: 20px;
      line-height: 123%;
      font-weight: 500;
    }
    .c-num p {
      padding-right: 20px;
    }
    header {
      top: 10px;
    }
    .banner-title,
    .expertise-second-content {
      padding-top: 50px;
    }
    .Portfolio-frame span {
      font-weight: 600;
      font-size: 26px;
      color: #000;
      font-family: Graphik;
      line-height: 40px;
    }
    .snip-figure a {
      transform: none;
      color: #ffffff;
      margin: 0 auto;
      width: 100%;
    }
    .snip-figure figcaption a {
      top: 50% !important;
    }
    .faq-accordion {
      max-height: 560px;
      overflow-y: auto;
    }
    a.link-a {
      z-index: 99 !important;
      position: absolute;
      top: 0px;
    }
    .snip-figure h2 {
      text-align: center;
    }
    .frame-group {
      display: flex;
      width: 100%;
      flex-wrap: wrap;
      min-height: 580px;
    }
    .service_head {
      margin-top: 133px;
      margin-left: 25px;
    }
    .work-listing-main ul {
      width: 100%;
      height: auto;
      display: flex;
      flex-direction: column;
    }
    .work-tab-menu ul {
      width: 100%;
      display: flex;
      flex-wrap: nowrap;
      overflow: scroll;
    }
    .work-connect-logo-content {
      padding-left: 10px;
    }
    .work-connect-logo-content h2 {
      font-size: 20px;
      line-height: 30px;
      margin-bottom: 25px;
    }
    .work-connect-logo-content p {
      font-size: 28px;
      line-height: 30px;
      margin-bottom: 25px;
    }
    .work-brand-section h2 {
      font-size: 34px;
      line-height: 45px;
    }
    .approach-text span,
    .approach-text span h2 {
      font-size: 40px;
      line-height: 47px;
    }
    .work-brand-section {
      width: 100%;
      padding: 37px 0;
    }
    .wrk-first-section-left,
    .wrk-first-section-right {
      padding-right: 0;
      width: 100%;
      box-sizing: border-box;
    }
    .work-connect-section {
      width: 100%;
      padding-top: 12px;
    }
    .work-tab-menu ul li {
      list-style: none;
      padding: 0 15px 15px;
      box-sizing: border-box;
    }
    .partner-list-main ul li {
      width: 33.3%;
      margin-right: 0;
      margin-bottom: 0;
      padding-top: 10px;
      padding-bottom: 20px;
      box-sizing: border-box;
    }
    a.let-btn span {
      width: 80px;
      height: 80px;
      position: absolute;
      background-color: #b3f52b;
      -webkit-border-radius: 100%;
      -moz-border-radius: 100%;
      border-radius: 100%;
      right: 12px;
      top: 138px;
    }
    .snip-figure {
      max-height: 290px !important;
    }
    .work-detail-banner {
      width: 100%;
      margin-top: 105px;
    }
    .home-content-section.blog-top p.sub-title {
      text-align: center;
    }
    .wrk-first-section-left h2 {
      padding-right: 40px;
    }
    .wrk-first-content {
      padding-top: 70px;
    }
    .wrk-first-section-left {
      display: flex;
      order: 2;
      padding-top: 40px;
    }
    .wrk-first-section-right {
      order: 1;
    }
    .lg-none,
    .mb-view {
      display: inline-block;
    }
    .wrk-detail-first-image img,
    .wrk-detail-fourth-image img,
    .wrk-detail-second-image img,
    .wrk-detail-third-image img {
      height: auto;
    }
    .wrk-detail-first-image,
    .wrk-detail-fourth-image,
    .wrk-detail-second-image,
    .wrk-detail-third-image {
      margin-top: 50px;
    }
    .wrk-first-section-left p {
      padding-top: 15px;
    }
    .expertise-content {
      margin-left: 0;
    }
    .expertise-section {
      padding: 80px 0 100px;
    }
    #wrk-slider2 .main-wrk-text img {
      width: 140px;
      height: 140px;
      position: absolute;
      top: 20px;
      left: 202px;
    }
    .main-wrk-text span {
      padding-left: 164px;
    }
    .owl-carousel.wrk-slider .main-wrk-text img {
      max-width: 130px;
      height: 130px;
    }
    .approach-text p,
    .choose-txt p {
      font-size: 20px;
      line-height: 30px;
      text-align: justify;
    }
    .accordion-scent .accordion-content-scent p {
      font-size: 17px;
      line-height: 189.5%;
    }
    span.acco-num {
      font-size: 15px;
    }
    .expertise-second-content-box a {
      font-weight: 400;
      margin-left: 0 !important;
    }
    .expertise-content p {
      margin-top: 30px;
      font-size: 18px;
      line-height: 35px;
      color: #000;
      font-family: Graphik;
      font-weight: 300;
    }
    .expertise-second-content-box {
      margin-bottom: 0;
    }
    .patner-title-second .trust-part span,
    .patner-title-second h2 span {
      font-weight: 500;
      font-size: 54px;
      line-height: 63px;
    }
    .patner-title-second .trust-part,
    .patner-title-second h2 {
      font-size: 50px;
      line-height: 70px;
      color: #0cbdcb;
    }
    .partner-section {
      padding: 70px 0 0;
    }
    .patner-title-second {
      margin-top: 40px;
    }
    .creative-section h2,
    .creative-section p {
      font-size: 40px;
    }
    .social-title .span-us,
    .social-title h2 span,
    .social-title h4 span {
      font-weight: 500;
      font-size: 70px;
      line-height: 30px;
    }
    .social-title h2,
    .social-title span {
      font-family: Graphik;
      font-weight: 300;
      font-size: 70px;
      line-height: 90px;
      color: #0cbdcb;
    }
    .social-section {
      padding: 90px 0;
    }
    .social-image-main {
      overflow: hidden;
      width: 100%;
      height: auto;
    }
    .count-expertise {
      font-size: 10px;
    }
    .all-expertise-btn-container {
      margin-top: 30px;
      text-align: center;
    }
    .expertise-second-content-box a {
      font-size: 20px;
      line-height: 43px;
      margin-right: 50px;
    }
    .blog-title {
      width: 100%;
      padding-right: 0px;
      padding-bottom: 20px;
      box-sizing: border-box;
    }
    span.date-sapn {
      display: block !important;
    }
    .blog-content {
      width: 100% !important;
      padding-right: 0;
      box-sizing: border-box;
    }
    .social-image-main ul li:nth-child(4) img {
      width: 300px;
      height: auto;
    }
    .social-image-main ul li:nth-child(5) img {
      width: 153px;
      height: auto;
    }
    .social-image-main ul li:nth-child(6) img {
      width: 291px;
      height: auto;
    }
    .social-image-main ul li:nth-child(7) img {
      width: 230px;
      height: auto;
    }
    .blog-section-listing,
    .blog-section-listing-main {
      border-top: 0 solid #fff;
      margin-top: 30px;
      box-sizing: border-box;
    }
    .blog-section-image img {
      border-radius: 4%;
    }
    .blog-list-main {
      padding: 25px 0 10px;
      border-bottom: none;
      border: none;
    }
    .social-image-main ul li:nth-child(3) {
      width: 16%;
      margin-left: -4%;
      margin-top: 12%;
      z-index: 3;
    }
    .social-image-main ul li:nth-child(4) {
      width: 41%;
      margin-left: 6%;
      margin-top: 4%;
      z-index: 1;
    }
    .social-image-main ul li:nth-child(5) {
      width: 22%;
      margin-left: 43%;
      margin-top: 14%;
      z-index: 2;
    }
    .social-image-main ul li:nth-child(6) {
      width: 39%;
      margin-left: 58%;
      margin-top: 10%;
      z-index: 1;
    }
    .social-image-main ul li:nth-child(7) {
      width: 22%;
      margin-left: 90%;
      margin-top: 15%;
      z-index: 3;
    }
    .first-banner h2,
    .first-banner span {
      font-size: 105px;
    }
    .banner-first-image {
      position: absolute;
      max-width: 150px;
      left: 15%;
      top: 24%;
    }
    .banner-second-image {
      max-width: 70px;
      right: 10%;
      top: 20%;
    }
    .banner-third-image {
      position: absolute;
      max-width: 85px;
      left: 9%;
      top: 55%;
    }
    .banner-fourth-image {
      max-width: 120px;
      right: 8%;
      top: 55%;
    }
    .hover-outer,
    .nav-image-section {
      display: none !important;
    }
    .banner-second-image .hover-outer {
      width: 96px;
      top: -17%;
      left: -20%;
    }
    .banner-first-image .hover-outer {
      width: 115px;
      top: -56%;
      left: 13%;
    }
    .banner-roster-image {
      max-width: 110px;
      left: 10%;
      top: 28%;
    }
    .second-banner-clock {
      max-width: 95px;
      right: 10%;
      top: 26%;
    }
    .banner-vr-image {
      max-width: 120px;
      left: 10%;
      top: 64%;
    }
    .second-banner-helmat {
      max-width: 90px;
      right: 10%;
      top: 55%;
    }
    .second-banner-helmat .hover-outer {
      width: 125px;
      top: -20%;
      left: -17%;
    }
    .second-banner-clock .hover-outer {
      width: 119px;
      top: -10%;
      left: -14%;
    }
    .banner-roster-image .hover-outer {
      width: 120px;
      top: -2%;
      left: -6%;
    }
    .banner-vr-image .hover-outer {
      width: 135px;
      top: -12%;
      left: -6%;
    }
    .third-banner-card {
      max-width: 110px;
      right: 10%;
      top: 28%;
    }
    .banner-marine-image {
      max-width: 130px;
      left: 9%;
      top: 55%;
    }
    .third-banner-tender {
      max-width: 115px;
      right: 6%;
      top: 55%;
    }
    .third-banner-card .hover-outer {
      width: 120px;
      top: -1%;
      left: -3%;
    }
    .third-banner-tender .hover-outer {
      width: 115px;
      top: -21%;
      left: 3%;
    }
    .banner-marine-image .hover-outer {
      width: 125px;
      height: auto;
      position: absolute;
      top: 17%;
      left: 7%;
    }
    .banner-six-image {
      max-width: 70%;
    }
    .nav-section ul li a {
      font-size: 26px;
      line-height: 32px;
    }
    .nav-section {
      width: 50%;
      padding-top: 100px;
      position: relative;
    }
    .menu-close::after,
    .menu-number,
    div#menu-close span {
      position: absolute;
    }
    .nav-section ul li {
      margin-bottom: 20px;
    }
    .menu-number {
      left: 0;
      top: 9px;
    }
    .header-social-section h2 {
      font-size: 26px;
      line-height: 12px;
    }
    .header-social-section ul li a {
      font-size: 26px;
      line-height: 19px;
    }
    .header-social-section {
      padding-top: 306px;
    }
    .menu-close::after {
      content: "";
      width: 60px;
      height: 100px;
      left: 0;
      top: 6px;
      background-image: url(../images/menu-close1.png);
      background-repeat: no-repeat;
    }
    .menu-container .logo-innerpage {
      top: 50px;
    }
    .menu-close {
      padding-left: 65px;
    }
    .work-listing-main ul li img {
      width: 100%;
      background-size: cover;
    }
    .footer-logo h2,
    .footer-logo p {
      padding-top: 50px;
      text-align: center;
      padding-left: 0 !important;
    }
    .connect-btn {
      margin-top: 180px;
    }
    .about-content {
      width: 100%;
      margin-top: 40px;
      display: flex;
      justify-content: center;
      align-items: center;
      padding-bottom: 115px;
    }
    .about-first-section-image {
      width: 100%;
      padding: 100px 30px;
      box-sizing: border-box;
    }
    .about-first-section-content,
    .about-third-image {
      width: 100%;
      padding-left: 0;
      box-sizing: border-box;
    }
    .about-first-section-content {
      padding-bottom: 50px;
    }
    .main-wrk-text {
      padding-bottom: 40px;
      font-size: 150px;
      padding-top: 51px;
    }
    .about-work-slider-section {
      position: absolute;
      left: 0;
      transform: rotate(0);
      width: 100%;
      padding-bottom: 64px;
    }
    .about-second-section-content {
      width: 100%;
      float: left;
      padding-right: 0;
      box-sizing: border-box;
      padding-top: 25px;
      padding-bottom: 20px;
    }
    .marquee span img {
      -webkit-transform: rotate(0);
      -moz-transform: rotate(0);
      -o-transform: rotate(0);
      -ms-transform: rotate(0);
      transform: rotate(0);
    }
    .about-second-section-content p {
      font-size: 22px;
      line-height: 36px;
    }
    .about-second-section {
      background: #000;
      display: flex;
      align-items: start;
    }
    .swiper-slide {
      height: auto !important;
      padding-bottom: 30px;
      overflow: hidden;
    }
    .about-fourth-section-content {
      width: 100%;
      padding-top: 40px;
      position: relative;
      z-index: 99;
      order: 2;
    }
    .lg-img-none {
      order: 1;
    }
    .about-third-section-content {
      padding-top: 30px;
      padding-bottom: 50px;
      width: 100%;
      order: 2;
    }
    .about-third-image {
      order: 1;
      padding-top: 50px;
      padding-bottom: 50px;
    }
    .about-first-section-content h2 {
      font-family: ContaxSans55;
      color: #000;
      font-size: 40px;
      line-height: 50px;
      margin-bottom: 24px;
    }
    .about-second-section-content h2 {
      font-size: 40px;
      line-height: 50px;
      margin-bottom: 30px;
    }
    .about-third-section-content h2 {
      font-size: 60px;
      line-height: 65px;
      font-weight: 500;
      font-family: ContaxSans55;
      color: #fff;
    }
    .about-fourth-section-inner {
      padding-top: 30px;
    }
    .about-fourth-section-content h2 {
      font-size: 40px;
      line-height: 50px;
    }
    .about-fourth-section-video {
      width: 368px;
      height: 368px;
      box-sizing: border-box;
      position: static;
      padding-top: 1px;
      overflow: hidden;
      background-color: #ddd;
      -webkit-border-radius: 0;
      -moz-border-radius: 0;
      border-radius: 100%;
      margin: 0 auto;
    }
    .swiper-slide.slide2.about-second-section {
      overflow: hidden !important;
    }
    .side-bar {
      top: 0;
      left: 0;
      height: 0;
      color: #fff;
      writing-mode: horizontal-tb;
      text-orientation: sideways-left;
    }
    @keyframes marquee {
      from {
        transform: translateX(-100%);
      }
      to {
        transform: translateX(0);
      }
    }
    @keyframes marquee_2 {
      from {
        transform: translateX(0);
      }
      to {
        transform: translateX(-100%);
      }
    }
    div#delay3 img {
      width: 491px;
      height: auto;
    }
    .logo_hover {
      position: relative;
      width: 90px;
      height: 90px;
      display: block;
      justify-content: center;
      align-items: center;
      margin-top: 60px;
    }
    .abt-hover {
      width: 200px;
      height: auto;
      position: absolute;
      top: -40px;
      right: inherit;
      left: -53px;
    }
    .mob-sc a {
      margin-bottom: 10px;
    }
    .footer-box p {
      line-height: 28px;
      text-decoration: none !important;
    }
    .btn-with-txt .btn-creative {
      position: absolute;
      right: 0;
    }
    .work-brand-section h1,
    .work-brand-section span {
      font-size: 40px;
      line-height: 54px;
    }
    .blog-section-image.mb-view img {
      width: 100%;
    }
    [data-aos] {
      opacity: 1 !important;
      transform: none !important;
      transition: none !important;
    }
    .right-faqs {
      width: 100%;
      padding-top: 0px;
    }
    .left-imgs {
      width: 100%;
      display: flex;
      flex-direction: column;
      gap: 50px;
      order: 2;
      padding-top: 55px;
      padding-bottom: 20px;
    }
    .faq-img {
      display: flex;
      flex-wrap: wrap;
    }
    .card-img {
      width: 55%;
      display: flex;
      justify-content: center;
    }
    .card-text {
      width: 100%;
      padding-top: 20px;
    }
    .right-faqs h1 {
      font-family: Graphik;
      font-size: 32px;
    }
    .card-btn {
      width: 100%;
      padding-top: 25px;
      text-align: center;
    }
    .d-card {
      display: flex;
      flex-wrap: wrap;
    }
    .left-imgs img {
      width: 100%;
    }
    .blog-date {
      display: block;
      width: 100%;
    }
    .blog-date span {
      display: none;
    }
    .work-listing-main ul li img {
      height: auto !important;
    }
  }
  @media (max-width: 500px) {
    .first-banner h2,
    .first-banner span {
      font-size: 75px;
      line-height: 70px;
      top: 100px !important;
      position: absolute;
    }
    .first-banner h2 {
      z-index: 999;
    }
    .banner-first-image {
      position: absolute;
      max-width: 145px;
      left: 5%;
      top: 30%;
    }
    .banner-second-image {
      position: absolute;
      max-width: 60px;
      right: 10%;
      top: 28%;
    }
    .banner-third-image {
      position: absolute;
      max-width: 85px;
      left: 9%;
      top: 61%;
    }
    .banner-fourth-image {
      max-width: 120px;
      right: 8%;
      top: 61%;
    }
    .hover-outer {
      display: none !important;
    }
    .banner-second-image .hover-outer {
      width: 96px;
      top: -17%;
      left: -20%;
    }
    .banner-first-image .hover-outer {
      width: 115px;
      top: -56%;
      left: 13%;
    }
    .banner-roster-image {
      position: absolute;
      max-width: 110px;
      left: 10%;
      top: 28%;
    }
    .second-banner-clock {
      max-width: 95px;
      right: 10%;
      top: 26%;
    }
    .banner-vr-image {
      max-width: 120px;
      left: 10%;
      top: 60%;
    }
    .second-banner-helmat {
      max-width: 90px;
      right: 10%;
      top: 62%;
    }
    .second-banner-helmat .hover-outer {
      width: 125px;
      top: -20%;
      left: -17%;
    }
    .second-banner-clock .hover-outer {
      width: 119px;
      top: -10%;
      left: -14%;
    }
    .banner-roster-image .hover-outer {
      width: 120px;
      top: -2%;
      left: -6%;
    }
    .banner-vr-image .hover-outer {
      width: 135px;
      top: -12%;
      left: -6%;
    }
    .third-banner-card {
      max-width: 95px;
      right: 6%;
      top: 27%;
    }
    .banner-marine-image {
      max-width: 130px;
      left: 9%;
      top: 58%;
    }
    .logo_hover img {
      width: 100%;
    }
    .third-banner-tender {
      max-width: 115px;
      right: 6%;
      top: 69%;
    }
    .third-banner-card .hover-outer {
      width: 120px;
      top: -1%;
      left: -3%;
    }
    .third-banner-tender .hover-outer {
      width: 115px;
      top: -21%;
      left: 3%;
    }
    .banner-marine-image .hover-outer {
      width: 125px;
      height: auto;
      position: absolute;
      top: 17%;
      left: 7%;
    }
    .banner-six-image {
      max-width: 100%;
      margin-top: 0;
    }
    .about-section {
      min-height: auto;
    }
    .creative-top-image {
      width: 189px;
      position: absolute;
      left: -62px;
      top: 95px;
    }
    .creative-section {
      padding: 50px 0 45px;
    }
    .creative-section h2,
    .creative-section h3,
    .creative-section p {
      font-size: 24px;
      line-height: 32px;
    }
    .creative-bottom-image {
      width: 175px;
      position: absolute;
      right: -68px;
      bottom: -36px;
    }
    .expertise-section {
      padding: 50px 0 0;
    }
    .sub-title {
      font-size: 17px;
    }
    .expertise-content p {
      margin-top: 25px;
      font-size: 20px;
      line-height: 30px;
      text-align: justify;
    }
    .expertise-second-content-box a {
      font-size: 21px;
      margin-right: 25px;
    }
    .expertise-second-content-box a::after {
      right: -45px;
    }
    .abt-hover {
      width: 230px;
      height: auto;
      position: absolute;
      top: -50px;
      right: inherit;
      left: -70px;
    }
    .about-content {
      padding-bottom: 115px;
    }
    .our-special {
      display: flex;
      flex-wrap: wrap;
      width: 100%;
    }
  }
  @media (max-width: 400px) {
    .first-banner h2,
    .first-banner span {
      font-size: 55px;
      line-height: 60px;
    }
  }
  @media only screen and (max-width: 1024px) and (min-width: 770px) {
    .footer-bottom-inner,
    header {
      width: 100%;
      box-sizing: border-box;
    }
    .footer-bottom-inner,
    .swiper-slide,
    header {
      box-sizing: border-box;
    }
    header {
      top: 0;
      position: fixed;
      padding: 20px;
      z-index: 99;
    }
    .services-main-wrapper {
      padding: 0 20px;
      box-sizing: border-box;
    }
    .footer-bottom-inner {
      padding-left: 30px;
      display: flex;
      flex-wrap: wrap;
    }
    .lg-none {
      display: none;
    }
    .about-fourth-section-video {
      width: 550px;
      height: 550px;
    }
    .about-work-slider-section {
      position: absolute;
      left: -146px;
    }
    .swiper-wrapper {
      display: flex !important;
    }
    .swiper-slide {
      padding-left: 20px;
      padding-right: 20px;
    }
    .about-second-section-content p {
      font-size: 26px;
      line-height: 35px;
    }
  }
  @media (max-width: 600px) {
    .image-overlay {
      display: none;
    }
    .work-listing-main ul li img {
      height: auto;
    }
    .owl-carousel .owl-item .project-image-main img {
      border-radius: 4%;
      display: block;
      margin-right: 5%;
      margin-left: 5%;
      box-sizing: border-box;
      width: 90%;
    }
    .project-image-title {
      padding: 20px 60px 30px;
      box-sizing: border-box;
    }
    .project-image-title .btn-creative {
      position: absolute;
      right: 32px;
      top: -20px;
    }
    .social-image-main {
      overflow: hidden;
      width: 100%;
      height: auto;
      min-height: 230px;
    }
    .first-banner span {
      font-size: 75px;
      line-height: 70px;
      position: absolute;
      top: 100px;
      z-index: 10;
    }
    .agency-image.aos-init.aos-animate img {
      width: 700px;
      height: auto;
    }
    .footer-logo img {
      margin: 0 auto;
    }
  }
  .work-listing-main ul li img {
    background-repeat: no-repeat;
    background-size: cover;
  }
  
  
@media (min-width: 1920px) and (max-width: 2560px)  {
  *{
box-sizing: border-box;
  }
   .container{
    width: 100%;
    max-width: 1300px;
    margin: 0 auto;
   box-sizing: border-box;
   padding-top: 10px;
   padding-right: 10px;
}

}

@media (max-width:1440px){
 
      .container {
          width: 90%;
          box-sizing: border-box;
          padding-left: 40px;
          padding-right: 40px;
      }
   
}





@media only screen and (max-width: 1024px) and (min-width: 770px){
  header {
  top: 0px; 
  position: fixed;
  width: 100%;
  padding: 20px;
  box-sizing: border-box;
  z-index: 99;
  }

  .services-main-wrapper {
  padding: 0 20px 0 20px;
  box-sizing: border-box;
  
}
  .footer-bottom-inner {
  width: 100%;
  padding-left: 30px;
  box-sizing: border-box;
  display: flex;
  flex-wrap: wrap;
      }
  .lg-none{
      display: none;
  }

.about-fourth-section-video {
  width: 550px;
  height: 550px;
}
.about-work-slider-section {
  position: absolute;
  left: -146px;
}
.swiper-wrapper {
  display: flex !important; 
}

.swiper-slide {
  padding-left: 20px;
  padding-right: 20px;
  box-sizing: border-box;

}
.about-second-section-content p {
  font-size: 26px;
  line-height: 35px;
}
}

@media (max-width:769px) {

  .container {
      width: 95%;
      box-sizing: border-box;
      padding: 0 15px;
  }
  .contact-form {
    width: 100%;
}
.box-round p {
  color: #fff;
  width: 100%;
  font-size: 18px;
}
h3 {
  color: #B3F52B;
  font-family: 'Graphik';
  font-size: 28px;
}
.service {
  width: 100%;
  padding-bottom: 60px;
}
.input-submit {
  padding-top: 2px;
  padding-bottom: 50px;
}
.round-img {
  background-color: #B3F52B;
  width: 80px;
  height: 80px;
}
.protfolio-01 {
  width: 100%;
  padding-right: 0px;
  padding-bottom: 10px;
}
.protfolio-02 {
  width: 100%;
  padding-left: 0px;
  padding-top: 10px;
}
.address-01 {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding-bottom: 25px;
}
.address-02 {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding-bottom: 25px;
}
.social-01 ul {
  display: flex;
  flex-wrap: wrap;
}
.social-01 ul li {
  width: 50%;
}
footer ul li {
  text-align: center;
}
.languages-row ul li:not(hr):nth-of-type(2) {
  width: 100%;
}
.languages-row ul li:not(hr):nth-of-type(3) {
  width: 100%;
}
.languages-row ul li:not(hr):nth-of-type(4) {
  width: 100%;
}
.language-04 {
  position: absolute;
  top: 42px;
  right: -80px;
  width: 46%;

}
.languages-row img {
  width: 45%;
}
.languages-row ul li h4 {
  font-family: 'Graphik';
  color: #fff;
  font-size: 20px;
  line-height: 30px;
  text-transform: capitalize;
  padding: 20px 0px;
  font-weight: 500;
}
input.btn {
  font-size: 18px;
}
}
.work-brand-section span {
  display: block !important;
}