@media (max-width: 1770px) {
  .about-us-heading-div h1 {
    font-size: 80px;
  }

  .aboutus-initiatives-div h2 {
    font-size: 80px;
  }

  .aboutus-initiatives-div p {
    font-size: 26px;
  }

  .about-us-third-div p {
    font-size: 26px;
  }

  .about-us-second-cotent p {
    font-size: 26px;
  }

  .introwrap p {
    font-size: 60px;
  }

  .about-us-fourth-div a img {
    left: 12%;
  }

  .footer-col2 h2 {
    font-size: 35px;
  }

  /* jerry */
  /* 
  canvas {
    width: 650px !important;
    height: 650px !important;
  } */
}

@media (max-width: 1700px) {
  .accordion-header {
    gap: 8rem;
  }
}

@media (max-width: 1600px) {
  .accordion-header {
    gap: 6rem;
  }

  .sign-intro strong {
    font-size: 75px;
  }

  .works-section h2 {
    font-size: 80px;
  }

  .company-container h1 {
    font-size: 90px;
  }

  .services-banner-text h1 {
    font-size: 150px;
  }

  .services-bs-card-one h1 {
    font-size: 3rem;
  }

  .services-bs-card-one p {
    font-size: 20px;
  }

  .services-bs-card-one ul li {
    font-size: 20px;
  }

  .services-bs-card-one img {
    width: 100%;
  }

  .services-bs-card1 {
    gap: 2rem;
  }

  .services-bs-card-one {
    width: calc(33.33% - 1.34rem);
  }

  .footer-col2 {
    width: calc(100% - 500px + 4rem);
  }

  .footer-flex {
    gap: 4rem;
  }

  .service-col1 {
    /* width: calc(43.3% - 0.5rem); */
    width: calc(59.3% - 0.5rem);
  }

  .service-col2 {
    width: calc(56.7% - 0.5rem);
  }

  .service-inner div a p {
    font-size: 18px;
  }

  .service-inner2 div:nth-child(2) a {
    font-size: 18px;
  }

  .service-inner3 a {
    font-size: 45px;
  }

  .service-inner div a {
    padding: 1rem 1.5rem;
  }

  .sign-intro {
    padding: 6rem 0;
  }

  .footer-col2 {
    gap: 3rem;
  }

  .formfield label {
    top: 40px;
    font-size: 20px;
  }

  .formleft input {
    padding: 2rem;
    font-size: 20px;
  }

  .home-project-work h3 {
    font-size: 24px;
    width: 25%;
  }

  .home-works-types {
    width: 75%;
  }

  .banner-texts span {
    font-size: 22px;
  }

  .projects-detail-container {
    width: 80%;
  }

  .projects-detail-two p {
    font-size: 26px !important;
  }

  .projects-detail-two h1 {
    font-size: 34px !important;
  }

  .project-details-image-holder {
    width: 80%;
  }

  .projects-inner-slider-flex h2 {
    font-size: 30px;
  }

  .work-banner-col2 p {
    font-size: 170px;
  }

  #scrollText3 {
    top: 70%;
  }

  .footer-col2 {
    padding: 3rem 0 4rem 0;
  }

  .about-us-fourth-div a img {
    left: 13%;
  }

  .border1 {
    width: 80%;
  }

  .text-inner-p {
    width: 80%;
  }

  .text-inner-p p {
    font-size: 26px !important;
  }

  .work-mobile-view-flex1 {
    width: 80%;
  }

  .services-bs {
    padding: 0;
  }

  .b-and-d h2 {
    font-size: 20px;
  }

  .header-menu-two {
    gap: 3rem;
  }

  .header-menu-two-inner {
    width: calc(25% - 2.25rem);
  }

  .dropdown-toggle {
    font-size: 20px;
  }
}

/* jerry */

@media (max-width: 1560px) {
  .accordion-header {
    gap: 4rem;
  }

  .contactformfield label {
    font-size: 16px;
  }

  .contactsendbtn p {
    font-size: 18px;
  }

  .address-part span {
    font-size: 16px;
  }

  .address-part address {
    font-size: 16px;
  }

  .link-part a {
    font-size: 16px;
  }

  .link-part {
    gap: 1rem;
  }

  .contact-form {
    gap: 3rem;
  }

  .contactformleft input {
    font-size: 18px;
  }
}

/* jerry */

@media (max-width: 1440px) {
  .footerformfield label {
    font-size: 16px;
  }

  .footerformfield label[for="message"] {
    right: -4%;
  }

  .footerformleft input {
    padding: 2rem;
  }

  .footersendbtn p {
    font-size: 16px;
  }

  .h2-flex h2 {
    font-size: 70px;
  }

  .menu-f a {
    font-size: 18px;
  }

  .dropdown-content a {
    font-size: 16px;
  }

  .tab-btn {
    font-size: 16px;
  }

  .allworks-link a {
    font-size: 40px;
  }

  .accordion-header {
    gap: 2rem;
  }

  .banner-link-container a {
    font-size: 3rem;
  }

  .home-works-section {
    padding: 11rem 0 5rem 0;
  }

  .home-works-section h2 {
    font-size: 100px;
  }

  .career-head h1 {
    font-size: 36px;
  }

  .about-us-heading-div h1 {
    font-size: 56px;
  }

  .about-us-second-cotent p {
    font-size: 24px;
  }

  .about-us-third-div p {
    font-size: 24px;
  }

  .about-us-fourth-div p {
    font-size: 24px;
  }

  .about-us-fourth-div div p {
    font-size: 38px;
  }

  .text-overlay h2 {
    font-size: 46px;
  }

  .text-overlay p {
    font-size: 24px;
  }

  .aboutus-initiatives-div p {
    font-size: 24px;
  }

  .aboutus-initiatives-div h2 {
    font-size: 56px;
  }

  #footer-h2 {
    font-size: 40px;
  }

  .introwrap p {
    font-size: 45px;
  }

  .abt-circle-image {
    position: relative;
  }

  .home-project-work h3 {
    font-size: 20px;
  }

  .home-works {
    width: calc(50% - 1rem);
  }

  .home-works-flex {
    gap: 2rem;
  }

  .service-inner3 a p {
    font-size: 50px;
  }

  .about-us-fourth-div p {
    font-size: 26px;
  }

  .aboutus-initiatives-div {
    width: 70%;
  }

  /* .initiatives-image-div img {
    width: 15.3%;
  } */

  .about-us-fourth-div div img {
    top: 68%;
    left: 13.5%;
  }

  .banner-texts span {
    font-size: 18px;
  }

  .blog-inner-card-container {
    gap: 10rem;
  }

  .blog-inner-cards {
    width: calc(33.33% - 6.67rem);
  }

  #scrollText2 {
    top: 20%;
  }

  #scrollText3 {
    top: 55%;
  }

  .about-us-fourth-div a img {
    left: 8%;
    top: 66%;
    width: 65px;
    transform: rotate(4deg);
  }

  .works {
    width: calc(50% - 2.67rem);
  }

  .services-banner-text {
    background-size: 300px;
  }

  .services-bs-card1 {
    background-size: 300px;
  }

  .services-bs-card2 {
    background-size: 300px;
  }

  .services-bs-card3 {
    background-size: 300px;
  }

  .services-bs-card4 {
    background-size: 300px;
  }

  .services-bs-card5 {
    background-size: 300px;
  }

  .sig-service-box-container {
    gap: 1rem;
  }

  .sig-box-link {
    width: calc(25% - 0.75rem);
  }

  .sig-service-list li {
    font-size: 14px;
  }
}

@media (max-width: 1368px) {
  .join-four h3 {
    font-size: 32px;
  }

  .applying p:nth-child(2) {
    font-size: 24px;
  }

  img.arrow {
    width: 3rem;
  }

  .service-inner3 a p {
    font-size: 40px;
  }

  .works-types div {
    gap: 0.4rem;
  }

  /* .works-types div p {
    width: calc(33.3% - 0.25rem);
  } */

  .abt-circle-image {
    width: 400px;
  }

  .sign-intro strong {
    font-size: 60px;
  }

  .pagelinks h2 {
    font-size: 20px;
  }

  /* jerry */

  canvas {
    width: 390px !important;
    height: 390px !important;
  }

  .work-banner-col2 p {
    font-size: 150px;
  }
}

@media (max-width: 1320px) {
  .header-icons {
    gap: 2rem;
  }

  .service-col1 {
    /* width: calc(44.4% - 0.5rem); */
    width: calc(61.5% - 0.5rem);
  }

  .service-col2 {
    width: calc(55.6% - 0.5rem);
  }

  .service-inner2 div:nth-child(2) {
    padding: 1rem 0;
  }

  .sign-intro strong {
    font-size: 45px;
  }

  .footer-col2 h2 {
    font-size: 32px;
  }

  .home-works-section h2 {
    font-size: 80px;
  }
}

@media (max-width: 1280px) {
  .accordion-header {
    gap: 10rem;
  }

  .blog-card-container {
    padding-top: 20rem;
  }

  .career-head h1 {
    font-size: 30px;
  }

  .join-four h3 {
    font-size: 26px;
  }

  .paddings {
    padding: 3rem 0;
  }

  #footer-h2 {
    font-size: 30px;
  }

  .service-inner3 a p {
    font-size: 30px;
  }

  .footer-col2 {
    width: calc(100% - 400px + 4rem);
    gap: 2.5rem;
  }

  .formfield label {
    top: 42px;
    font-size: 18px;
  }

  .formleft input {
    padding: 2rem;
    font-size: 18px;
  }

  .service-inner2 div:nth-child(2) a {
    font-size: 17px;
  }

  .service-inner3 a {
    font-size: 40px;
  }

  .service-inner div a p {
    font-size: 17px;
  }

  .service-inner div a img {
    width: 30px;
  }

  .company-container p {
    font-size: 20px;
  }

  .content-div1 p {
    text-align: unset;
  }

  .services-bs-card1 {
    padding: 3rem;
  }

  .services-bs-card {
    flex-direction: column;
    gap: 2rem;
  }

  .services-bs-card-one {
    width: 50%;
  }

  .services-bs-card2 .services-bs-card-one ul {
    align-items: flex-end;
  }

  .services-bs-card2 .services-bs-card-one p {
    text-align: right;
  }

  .services-bs-card2 .services-bs-card-one h1 {
    text-align: right;
  }

  .services-bs-card2 .services-bs-card-one h2 {
    text-align: right;
  }

  .services-bs-card4 .services-bs-card-one ul {
    align-items: flex-end;
  }

  .services-bs-card4 .services-bs-card-one p {
    text-align: right;
  }

  .services-bs-card4 .services-bs-card-one h2 {
    text-align: right;
  }

  .services-bs-card-one img {
    width: 30%;
  }

  .services-bs-card1 {
    align-items: flex-start;
  }

  .services-bs-card2 {
    align-items: flex-end;
  }

  .services-bs-card3 {
    align-items: flex-start;
  }

  .services-bs-card4 {
    align-items: flex-end;
  }

  .services-bs-card5 {
    align-items: flex-start;
  }

  .services-bs-card1 .services-bs-card-one:nth-child(2) {
    display: flex;
    align-items: center;
  }

  .services-banner-text h1 {
    font-size: 100px;
  }

  .services-bs-card1 > .services-bs-card-one:first-child {
    padding: 0;
  }

  .services-bs-card1 > .services-bs-card-one:nth-child(3) {
    padding: 0;
  }

  .project-work {
    align-items: unset;
    flex-direction: column;
    gap: 1rem;
  }

  .works-types {
    width: 100%;
  }

  .introwrap p {
    font-size: 40px;
  }

  .project-work h3 {
    width: 100%;
  }

  .work-banner-col2 p {
    font-size: 140px;
  }

  .banner-link-container a {
    font-size: 3rem;
  }

  .abt-circle-image {
    width: 300px;
  }

  .home-works-types div p {
    font-size: 12px;
  }

  .about-us-heading-div h1 {
    font-size: 48px;
  }

  .about-us-fourth-div p {
    font-size: 21px;
  }

  .about-us-fourth-div div p {
    font-size: 34px;
  }

  .text-overlay h2 {
    font-size: 36px;
  }

  .text-overlay p {
    font-size: 22px;
  }

  .aboutus-initiatives-div h2 {
    font-size: 46px;
  }

  .aboutus-initiatives-div p {
    font-size: 22px;
  }

  .about-us-third-div p {
    font-size: 22px;
  }

  .about-us-second-cotent p {
    font-size: 22px;
  }

  .about-us-heading-div {
    width: 90%;
  }

  .about-us-second-div {
    width: 90%;
    padding: 3rem 0;
  }

  .about-us-third-div {
    width: 90%;
  }

  .about-us-fourth-div {
    width: 60%;
  }

  .projects-detail-container {
    width: 90%;
  }

  .project-details-image-holder {
    width: 90%;
  }

  .banner-texts {
    flex-direction: row;
    flex-wrap: wrap;
    gap: 1rem;
    align-items: center;
  }

  .banner-texts span {
    width: calc(33.33% - 1.5rem);
  }

  .banner-texts span::before {
    content: " ";
    position: absolute;
    width: 17px;
    height: 17px;
    top: 25%;
    left: 0;
    background-color: #fe0d0d;
    border-radius: 50px;
  }

  .banner-texts span:nth-child(1) {
    padding-left: 2.2rem;
  }

  .projects-detail-section {
    padding: 3rem 0;
  }

  .projects-detail-two p {
    font-size: 20px !important;
  }

  .projects-detail-one {
    padding-bottom: 3rem;
  }

  .projects-detail-two h1 {
    font-size: 30px !important;
  }

  .projects-detail-container {
    padding-bottom: 3rem;
  }

  .article-inner-cotents-container {
    padding-left: 0rem;
  }

  .article-inner-grey ul li {
    font-size: 18px;
  }

  .article-inner-contents div h3 {
    font-size: 22px;
  }

  .article-inner-cotents-container h4 {
    font-size: 22px;
  }

  .works {
    width: calc(50% - 2rem);
  }

  .border1 {
    width: 90%;
  }

  .text-inner-p {
    width: 90%;
  }

  .text-inner-p p {
    font-size: 20px !important;
  }

  .work-mobile-view-flex1 {
    width: 90%;
  }

  /* jerry */

  .contactformleft input {
    font-size: 16px;
  }

  .link-part {
    width: 50%;
  }

  .address-part {
    width: 50%;
  }

  .blog-card-odd {
    width: 50%;
  }

  .blog-card-odd > a {
    transform: unset !important;
  }

  .b-and-d-banner-pagelinks {
    gap: 2rem 0;
    flex-wrap: wrap;
  }

  .b-and-d {
    width: calc(50% - 0rem);
  }

  .b-and-d-banner-pagelinks .b-and-d:nth-child(3) {
    justify-content: flex-start;
  }

  .brand-last {
    font-size: 24px;
  }

  .menu-f {
    gap: 1rem;
    flex-direction: column;
    align-items: flex-start;
    display: none;
  }

  .header-menu-one {
    flex-direction: column;
    align-items: flex-start;
    gap: 1rem;
  }

  .menu-dropdown.active .dropdown-toggle span {
    color: #fe0d0d;
  }

  .menu-dropdown.active .menu-arrow {
    border-right: 2px solid #fe0d0d;
    border-bottom: 2px solid #fe0d0d;
  }

  .dropdown-content {
    align-items: flex-start;
  }

  .header-menu-two {
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 1rem;
  }

  .menu-f a {
    font-size: 16px;
  }

  .dropdown-toggle {
    font-size: 18px;
    justify-content: space-between;
  }

  .menu-f-responsive {
    display: flex;
    flex-direction: column;
    gap: 1rem;
  }

  .sig-box-link {
    width: calc(50% - 0.5rem);
  }

  .header-menu {
    padding: 8rem 1.5rem 3rem 1.5rem;
  }
}

@media (max-width: 1150px) {
  .sign-intro {
    padding: 3rem 0;
  }

  .home-works {
    width: 100%;
  }

  .blog-card-container div {
    width: 50%;
  }

  .blog-section-text h1 {
    font-size: 150px;
  }

  .blog-inner-card-container {
    gap: 5rem;
  }

  .blog-inner-cards {
    width: calc(33.33% - 1.67rem);
  }

  .blog-inner-cards h2 {
    font-size: 16px;
  }

  .blog-inner-cards h3 {
    font-size: 16px;
  }
}

@media (max-width: 1024px) {
  .footerformfield label[for="message"] {
    right: -3%;
  }

  .footerformleft {
    width: 85%;
  }

  .footersendbtn {
    width: 15%;
  }

  .allworks-link a {
    font-size: 30px;
  }

  .h2-flex h2 {
    font-size: 50px;
  }

  .home-works-section {
    padding: 10rem 0 3rem 0;
  }

  .blog-card-container {
    padding-top: 15rem;
  }

  .service-inner3 a:nth-child(1) {
    align-items: center;
  }

  .mask {
    display: none;
  }

  .footer-logo1 img {
    filter: invert(var(--filter-invert));
  }

  .footer-col3 {
    transform: translateY(-40px);
  }

  .footer-col3 .footline {
    background-color: var(--black);
  }

  .copy-right p {
    color: var(--black);
  }

  .footer-col3 #footer-h2 {
    display: none;
  }

  .aboutus-initiatives-div h2 {
    font-size: 36px;
  }

  .aboutus-initiatives-div p {
    font-size: 20px;
  }

  .about-us-second-cotent p {
    font-size: 20px;
  }

  .about-us-third-div p {
    font-size: 20px;
  }

  .about-us-fourth-div p {
    font-size: 19px;
  }

  .about-us-fourth-div div p {
    font-size: 28px;
  }

  .about-us-heading-div h1 {
    font-size: 36px;
  }

  .service-inner3 a p {
    font-size: 28px;
  }

  .text-overlay h2 {
    font-size: 32px;
  }

  .sign-intro strong {
    font-size: 40px;
  }

  .sign-intro {
    padding: 3rem 0;
  }

  #scrollText2 {
    font-size: 30px;
  }

  #scrollText3 {
    font-size: 30px;
  }

  .works-section {
    padding: 3rem 0;
  }

  .works-section h2 {
    font-size: 50px;
  }

  .works-section .custom-container {
    gap: 5rem;
  }

  .service-section {
    padding: 3rem 0;
  }

  .service-flex {
    flex-direction: column;
  }

  .service-col1 {
    width: 100%;
  }

  .service-col2 {
    width: 100%;
  }

  .services-bs-card {
    padding: 3rem;
  }

  .services-banner-text {
    background-size: 300px;
  }

  .services-bs-card1 {
    background-size: 300px;
    background-position: right;
  }

  .services-bs-card2 {
    background-size: 300px;
    background-position: left;
  }

  .services-bs-card3 {
    background-size: 300px;
    background-position: right;
  }

  .services-bs-card4 {
    background-size: 300px;
    background-position: left;
  }

  .services-bs-card5 {
    background-size: 300px;
    background-position: right;
  }

  .company-container {
    padding: 3rem 0;
  }

  .company-container h1 {
    font-size: 60px;
  }

  .services-bs-card-one img {
    width: 43%;
  }

  .services-bs {
    background-size: 40%;
  }

  .services-bs-card-one {
    width: 70%;
  }

  .work-banner-col2 p {
    font-size: 100px;
  }

  .banner-link-container a {
    font-size: 2rem;
  }

  .banner-link-container {
    gap: 2rem;
    padding: 3rem;
  }

  .work-banner-col1 {
    display: none;
  }

  .work-banner-col2 {
    width: 100%;
    height: 410px;
  }

  .work-banner-col3 {
    width: 100%;
    border-radius: unset;
  }

  .work-banner-col2 p:nth-child(1) {
    left: -10%;
    animation: expandAndCollapse1 5s linear infinite;
  }

  .work-banner-col2 p:nth-child(2) {
    left: -10%;
    animation: expandAndCollapse2 5s linear infinite;
  }

  .work-banner-col2 p:nth-child(3) {
    left: -10%;
    animation: expandAndCollapse3 5s linear infinite;
  }

  .work-banner-col2 p:nth-child(4) {
    left: -10%;
    animation: expandAndCollapse4 5s linear infinite;
  }

  .work-banner-col2 p:nth-child(5) {
    left: -10%;
    animation: expandAndCollapse5 5s linear infinite;
  }

  .work-banner-col2 p:nth-child(6) {
    left: -10%;
    animation: expandAndCollapse6 5s linear infinite;
  }

  @keyframes expandAndCollapse1 {
    8% {
      left: -10%;
    }

    42% {
      left: -10%;
    }

    58% {
      left: -10%;
    }

    92% {
      left: -10%;
    }
  }

  @keyframes expandAndCollapse2 {
    8% {
      left: -10%;
    }

    42% {
      left: 0;
    }

    58% {
      left: 0;
    }

    92% {
      left: -10%;
    }
  }

  @keyframes expandAndCollapse3 {
    8% {
      left: -10%;
    }

    42% {
      left: 10%;
    }

    58% {
      left: 10%;
    }

    92% {
      left: -10%;
    }
  }

  @keyframes expandAndCollapse4 {
    8% {
      left: -10%;
    }

    42% {
      left: 20%;
    }

    58% {
      left: 20%;
    }

    92% {
      left: -10%;
    }
  }

  @keyframes expandAndCollapse5 {
    8% {
      left: -10%;
    }

    42% {
      left: 30%;
    }

    58% {
      left: 30%;
    }

    92% {
      left: -10%;
    }
  }

  @keyframes expandAndCollapse6 {
    8% {
      left: -10%;
    }

    42% {
      left: 40%;
    }

    58% {
      left: 40%;
    }

    92% {
      left: -10%;
    }
  }

  .footer-col2 {
    width: calc(100% - 400px + 2rem);
    gap: 0rem;
  }

  .footer-flex {
    gap: 3rem 2rem;
    margin-bottom: 2rem;
  }

  .formfield label {
    top: 32px;
    font-size: 18px;
  }

  .formleft input {
    padding: 2rem;
  }

  .footer-col2 h2 {
    font-size: 22px;
  }

  .about-us-fourth-div div img {
    top: 66%;
    left: 7.9%;
    width: 50px;
    transform: rotate(4deg);
  }

  .project-inner-slider {
    flex-direction: column;
  }

  .projects-inner-slider-flex {
    width: 100%;
  }

  .projects-inner-slider-flex h2 {
    margin-bottom: 3%;
  }

  .projects-inner-allworks-link img {
    width: 6%;
  }

  .article-inner-con-steps-flex {
    flex-direction: column !important;
  }

  .article-steps-left {
    width: 100%;
  }

  .article-steps-right {
    width: 100%;
  }

  .blog-inner-card-container {
    gap: 2rem;
  }

  .blog-inner-cards {
    width: calc(33.33% - 1.33rem);
  }

  .introwrap p {
    font-size: 36px;
  }

  /* jerry */

  .contact-flex {
    flex-direction: column-reverse;
  }

  .contact-form {
    width: 100%;
  }

  .round-wid {
    width: 100%;
  }

  canvas {
    width: 500px !important;
    height: 500px !important;
  }

  .join-three-one {
    width: 100%;
  }

  .join-three-flex {
    flex-wrap: wrap;
  }

  .join-three-flex {
    gap: 3rem;
  }

  .join-three-two {
    width: 100%;
  }

  .applying-positions-sec {
    width: calc(50% - 1rem);
  }

  .join-four .paddings {
    padding: 1rem 0;
  }

  .join-three {
    padding: 1rem 0;
  }

  .applying p:nth-child(2) {
    font-size: 20px;
  }

  .join-four h3 {
    font-size: 22px;
  }

  .join-three-one p {
    font-size: 18px;
  }

  .career-details h1 {
    font-size: 30px;
  }

  .career-details h2 {
    font-size: 24px;
  }

  h2.job {
    font-size: 30px;
  }

  .apply {
    margin: 0;
  }

  .apply input {
    width: 100%;
  }

  .apply textarea {
    width: 100% !important;
  }

  .about-us-fourth-div a img {
    left: 10%;
    top: 69%;
    width: 50px;
    transform: rotate(2deg);
  }

  .about-us-fourth-div a p {
    font-size: 30px;
  }

  .works-types div p {
    font-size: 13px;
  }

  .b-and-d {
    width: 100%;
  }

  .b-and-d-banner-pagelinks .b-and-d:nth-child(2) {
    justify-content: flex-start;
  }

  .b-and-d h2 {
    font-size: 18px;
  }

  .visual-section {
    padding-bottom: 3rem;
  }

  .visual-content {
    flex-direction: column;
    gap: 40px;
    padding: 3rem 0;
  }

  .visual-content img {
    width: 100%;
    order: 1;
    border-radius: 20px;
  }

  .visual-text {
    width: 100%;
    order: 2;
  }

  .visual-heading h1 {
    font-size: 56px;
  }

  .visual-text h2 {
    font-size: 38px;
    margin-bottom: 20px;
  }

  .visual-text h3 {
    font-size: 28px;
    margin-bottom: 20px;
  }

  .visual-text p {
    font-size: 18px;
    line-height: 1.6;
  }

  .page-end-btn {
    display: flex;
    gap: 2rem;
    flex-direction: column;
  }

  .visual-btn {
    font-size: 18px;
  }

  p.visual-bold-p {
    font-size: 26px;
  }

  .brand-last {
    font-size: 20px;
  }
}

@media (max-width: 900px) {
  .footer-flex {
    flex-direction: column-reverse;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 2rem;
    height: unset;
  }

  .footer-col1 {
    width: 100%;
  }

  .footer-col2 {
    width: 100%;
    padding: 0 0 0 2rem;
  }

  #container-social {
    width: 350px;
    height: 350px;
  }

  h2 {
    font-size: 32px;
  }

  .introwrap p {
    font-size: 30px;
  }

  .abt-circle-image {
    transform: translate(80px, 30px);
  }

  .home-works-section h2 {
    font-size: 50px;
  }

  .allworks-link img {
    width: 40px;
  }

  .about-us-second-cotent {
    width: 80%;
    margin-left: 0%;
  }

  .about-us-fourth-div {
    width: 90%;
  }

  .aboutus-initiatives-div {
    width: 90%;
    gap: 2rem;
  }

  .about-us-initiatives-section {
    padding: 3rem 0;
  }

  .banner-texts span {
    width: calc(50% - 1.5rem);
  }

  .article-inner-grey {
    width: 100%;
  }

  .article-inner-div-container h2 {
    font-size: 22px;
  }

  .works {
    width: 100%;
  }

  .about-us-fourth-div a img {
    width: 70px;
  }

  .work-mobile-view-sec1:nth-child(1) {
    width: calc(60% - 1rem);
  }

  .work-mobile-view-sec1:nth-child(2) {
    width: calc(40% - 1rem);
  }

  .work-mobile-view-flex1 {
    gap: 2rem;
  }
}

@media (max-width: 800px) {
  .blog-section-text h1 {
    font-size: 60px;
  }

  .blog-card-container {
    padding-top: 12rem;
  }

  .about-us-second-cotent p {
    font-size: 18px;
    padding-bottom: 2rem;
  }

  .about-us-third-div p {
    font-size: 18px;
  }

  .introwrap p {
    font-size: 26px;
  }

  #scrollText2 {
    font-size: 22px;
    top: 15%;
  }

  #scrollText3 {
    font-size: 23px;
    top: 40%;
  }

  .sign-intro {
    height: 70vh;
  }

  .works a {
    width: 100%;
  }

  .works-banner-container {
    flex-direction: column;
  }

  .work-banner-col1 {
    display: none;
  }

  .pagelinks {
    align-items: center;
    width: calc(50% - 0.25rem);
    gap: 0.5rem;
    justify-content: center;
  }

  .banner-pagelinks {
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 0.5rem;
  }

  .text-overlay p {
    font-size: 20px;
  }

  .banner-pagelinks .pagelinks:nth-child(4) {
    width: 100%;
    justify-content: center;
  }

  .about-us-third-div p {
    width: 100%;
  }

  .about-us-third-div img {
    width: 100%;
  }

  .about-us-second-cotent {
    width: 100%;
  }

  .text-overlay p {
    font-size: 19px;
  }

  .about-us-image1 {
    width: 45%;
  }

  .about-us-image2 {
    width: 53%;
    transform: translate(-45px, 33px);
  }

  .about-us-fourth-div {
    flex-direction: column;
  }

  .about-us-fourth-div p {
    width: 100%;
    text-align: center;
  }

  .about-us-fourth-div div {
    width: 36%;
  }

  .about-us-fourth-div div img {
    width: 78px;
    transform: rotate(8deg);
  }

  .aboutus-initiatives-div h2 {
    font-size: 40px;
  }

  .aboutus-initiatives-div p {
    font-size: 18px;
  }

  .initiatives-image-div img {
    width: 20%;
  }

  .projects-inner-allworks-link a {
    font-size: 30px;
  }

  .blog-inner-card-container {
    flex-direction: column;
    gap: 3rem;
  }

  .blog-inner-cards {
    width: 100%;
  }

  .recent-articles-heading h3 {
    font-size: 26px;
  }

  .banner-link-container {
    flex-direction: row;
    flex-wrap: wrap;
  }

  .banner-link-container a {
    font-size: 1.3rem;
  }

  .services-bs-card-one {
    width: 90%;
  }

  .about-us-fourth-div a img {
    left: 11%;
  }

  /* jerry */

  .contact-form h1 {
    font-size: 28px;
  }

  .sig-box-link {
    width: 100%;
  }
}

@media (max-width: 700px) {
  .about-us-fourth-div a img {
    width: 55px;
    left: 10.4%;
  }
}

@media (max-width: 600px) {
  .accordion-header {
    gap: 5rem;
  }

  .blog-section-text {
    top: 12%;
  }

  .service-inner4 {
    flex-direction: column;
  }

  .service-inner4 div:nth-child(1) {
    width: 100%;
  }

  .service-inner4 div:nth-child(2) {
    width: 100%;
  }

  .about-us-fourth-div div p {
    font-size: 20px;
  }

  #footer-h2 {
    font-size: 22px;
    padding: 0;
  }

  .header-logo img {
    width: 70px;
  }

  .header-logo2 img {
    width: 100px;
  }

  .header-logo video {
    width: 80px;
  }

  .hamburger {
    height: 25px;
    width: 60px;
  }

  .line1 {
    width: 50px;
  }

  .line2 {
    width: 40px;
  }

  .line3 {
    width: 55px;
  }

  .dropdown-toggle {
    font-size: 16px;
  }

  .menu-f a {
    font-size: 16px;
  }

  .homepage-banner {
    padding-top: 5rem;
  }

  #mode-button {
    width: 25px;
    height: 25px;
  }

  .banner-pagelinks {
    padding: 2rem 0 0 0;
    flex-direction: column;
  }

  .pagelinks {
    width: 100%;
  }

  .pagelinks h2 {
    font-size: 15px;
  }

  .works-types div p {
    width: 100%;
  }

  .project-work .works-types div.work-div p {
    width: 100%;
  }

  .works-types div {
    flex-direction: column;
  }

  #scrollText2 {
    font-size: 20px;
  }

  #scrollText3 {
    font-size: 20px;
  }

  .abt-circle-image {
    transform: translate(50px, 0px);
  }

  .abt-circle-image {
    width: 250px;
  }

  .works-types div:nth-child(2) p:nth-child(1) {
    width: 100% !important;
  }

  .works-types div:nth-child(2) p:nth-child(2) {
    width: 100% !important;
  }

  .works-types div:nth-child(3) p {
    width: 100%;
  }

  .works-section .custom-container {
    gap: 3rem;
  }

  .service-inner {
    flex-direction: column;
  }

  .service-inner div {
    width: 100%;
  }

  .service-inner2 {
    flex-direction: column;
  }

  .service-inner2 div:nth-child(1) {
    width: 100%;
  }

  .service-inner2 div:nth-child(2) {
    width: 100%;
    padding: 2rem 0;
  }

  .service-inner3 {
    flex-direction: column;
  }

  .service-inner3 div:nth-child(1) {
    width: 100%;
    padding: 2rem 0;
  }

  .service-inner3 div:nth-child(2) {
    width: 100%;
  }

  .service-inner2 div:nth-child(2) img {
    width: 90%;
  }

  .company-content .content-div1 {
    flex-direction: column;
  }

  .content-div1 p {
    width: 100%;
  }

  .content-div1 div {
    width: 100%;
  }

  .company-container p {
    font-size: 18px;
  }

  .showimg {
    width: 300px;
  }

  .services-banner-text h1 {
    font-size: 60px;
  }

  .services-bs {
    background-size: 100%;
  }

  .services-bs-card-one img {
    width: 55%;
  }

  .services-bs-card-one h2,
  .services-bs-card-one h1 {
    font-size: 2rem;
  }

  .services-bs-card-one p {
    font-size: 18px;
  }

  .services-bs-card-one ul li {
    font-size: 16px;
  }

  .services-bs-card1 {
    background-size: 200px;
    background-attachment: unset;
    background-image: url(../images/services/servicesball.svg);
  }

  .services-bs-card2 {
    background-size: 200px;
    background-attachment: unset;
    background-image: url(../images/services/servicesball.svg);
  }

  .services-bs-card3 {
    background-size: 200px;
    background-attachment: unset;
    background-image: url(../images/services/servicesball.svg);
  }

  .services-bs-card4 {
    background-size: 200px;
    background-attachment: unset;
    background-image: url(../images/services/servicesball.svg);
  }

  .services-bs-card5 {
    background-size: 200px;
    background-attachment: unset;
    background-image: url(../images/services/servicesball.svg);
  }

  #hamburger.active .line1 {
    transform: rotate(45deg) translate(3px, 13px);
    width: 40px;
  }

  #hamburger.active .line3 {
    transform: rotate(-45deg) translate(4px, -15px);
    width: 40px;
  }

  .dropdown-content a {
    font-size: 14px;
  }

  .home-works-section .custom-container {
    gap: 2rem;
  }

  .home-project-work {
    flex-direction: column;
    gap: 0.7rem;
  }

  .home-project-work h3 {
    width: 100%;
  }

  .home-works-types {
    width: 100%;
  }

  .home-works-types div {
    justify-content: flex-start;
  }

  .about-us-heading-div h1 {
    font-size: 28px;
  }

  .about-us-heading-div {
    padding: 3rem 0;
  }

  .about-us-second-cotent p {
    font-size: 18px;
  }

  .about-us-third-div p {
    font-size: 18px;
  }

  .project-inner-slider {
    padding-top: 3rem;
  }

  .projects-inner-slider-flex h2 {
    font-size: 24px;
  }

  .project-inner-slider {
    gap: 3rem;
  }

  .projects-inner-allworks-link img {
    width: 10%;
  }

  .blog-card-container div a {
    max-width: 200px;
  }

  .blog-card-container h2 {
    font-size: 16px;
  }

  .blog-card-container h3 {
    font-size: 16px;
  }

  .article-inner-grey {
    padding: 1rem 1rem;
  }

  .article-inner-grey ul li {
    font-size: 16px;
  }

  .article-inner-contents div h3 {
    font-size: 20px;
  }

  .article-inner-contents div p {
    font-size: 16px;
  }

  .article-inner-contents-ul li {
    margin-left: 1rem;
    font-size: 16px;
  }

  .article-inner-con-ul-num li {
    margin-left: 1rem;
    font-size: 16px;
  }

  .article-inner-cotents-container h4 {
    font-size: 20px;
  }

  .article-inner-contents {
    gap: 2rem;
  }

  .blog-inner-card-container {
    padding: 3rem 0;
  }

  .recent-articles-heading h3 {
    font-size: 20px;
  }

  .recent-articles-heading div a {
    gap: 0.5rem;
    font-size: 20px;
  }

  .recent-articles-heading div a img {
    width: 30px;
  }

  .applying-positions-sec {
    width: 100%;
  }

  .footer-col2 {
    padding: 0;
  }

  .inner-text-width {
    width: 100%;
  }

  .career-head h1 {
    font-size: 24px;
  }

  .careerbtn {
    width: 30%;
  }

  .apply-form {
    margin: 1rem 0;
  }

  ul.redarrow-list li {
    font-size: 18px;
  }

  .career-details p {
    font-size: 18px;
  }

  ul.redarrow-list {
    padding-left: 20px;
  }

  .paddings {
    padding: 3rem 0 0 0;
  }

  .work-mobile-view-flex1 {
    flex-direction: column;
    gap: 3rem;
  }

  .work-mobile-view-sec1:nth-child(1) {
    width: 100%;
  }

  .work-mobile-view-sec1:nth-child(2) {
    width: 100%;
  }

  .services-banner-text {
    padding: 10rem 0;
  }

  .b-and-d {
    justify-content: center;
  }

  .b-and-d-banner-pagelinks .b-and-d:nth-child(2) {
    justify-content: center;
  }

  .b-and-d-banner-pagelinks .b-and-d:nth-child(3) {
    justify-content: center;
  }

  .services-bs-card {
    padding: 2rem;
  }

  .visual-heading {
    padding: 3rem 0;
  }

  .visual-heading h1 {
    font-size: 38px;
    line-height: 1.2;
  }

  .visual-content {
    gap: 25px;
    padding: 2rem 0;
  }

  .visual-text h2 {
    font-size: 30px;
  }

  .visual-text h3 {
    font-size: 20px;
    line-height: 1.4;
  }

  .visual-text p {
    font-size: 16px;
    margin-bottom: 18px;
    line-height: 1.2;
  }

  p.visual-bold-p {
    font-size: 22px;
    line-height: 1.4;
  }

  .visual-btn {
    min-width: 90%;
    height: 50px;
    font-size: 16px;
  }

  .visual-read-more-btn {
    font-size: 16px;
  }

  .brand-last {
    font-size: 18px;
  }
}

@media (max-width: 450px) {
  .accordion-header,
  .header-icons {
    gap: 2rem;
  }

  #scrollText3 {
    top: 45%;
  }

  .blog-card-container div {
    width: 100%;
  }

  .blog-card-odd:nth-child(5n + 1),
  .blog-card-odd:nth-child(5n + 2) {
    width: 100%;
  }

  .blog-card-container div a {
    max-width: unset;
    width: 100%;
  }

  .blog-card-container {
    padding-top: 10rem;
  }

  .text-overlay p {
    font-size: 18px;
  }

  .text-overlay h2 {
    font-size: 20px;
  }

  .aboutus-initiatives-div h2 {
    font-size: 28px;
  }

  .aboutus-initiatives-div p {
    font-size: 16px;
  }

  .sign-intro strong {
    font-size: 30px;
  }

  .services-bs {
    background-size: 70%;
  }

  .services-bs-card-one img {
    width: 75%;
  }

  .home-works-section h2 {
    font-size: 30px;
  }

  .allworks-link img {
    width: 30px;
  }

  .home-works-types div {
    flex-direction: column;
  }

  .home-works-types div p {
    width: 100%;
  }

  .home-works-types div:nth-child(2) p:nth-child(1) {
    width: 100% !important;
  }

  .home-works-types div:nth-child(2) p:nth-child(2) {
    width: 100% !important;
  }

  .home-works-flex {
    gap: 3rem;
  }

  .home-works-types div:nth-child(3) p {
    width: 100%;
  }

  .about-us-heading-div h1 {
    font-size: 30px;
  }

  .about-us-fourth-div p {
    font-size: 16px;
  }

  .initiatives-image-div {
    gap: 2rem;
  }

  .banner-texts span {
    width: 100%;
  }

  .projects-detail-two h1 {
    font-size: 22px !important;
  }

  .projects-detail-two p {
    font-size: 16px !important;
  }

  .blog-card-container {
    gap: 3rem 0;
  }

  .blog-card-btm {
    justify-content: flex-start;
  }

  .blog-card-container .blog-card-even {
    padding-top: 4rem;
  }

  .blog-section-text h1 {
    font-size: 50px;
  }

  .work-banner-col2 p:nth-child(1) {
    left: -20%;
    animation: expandAndCollapse1 5s linear infinite;
  }

  .work-banner-col2 p:nth-child(2) {
    left: -20%;
    animation: expandAndCollapse2 5s linear infinite;
  }

  .work-banner-col2 p:nth-child(3) {
    left: -20%;
    animation: expandAndCollapse3 5s linear infinite;
  }

  .work-banner-col2 p:nth-child(4) {
    left: -20%;
    animation: expandAndCollapse4 5s linear infinite;
  }

  .work-banner-col2 p:nth-child(5) {
    left: -20%;
    animation: expandAndCollapse5 5s linear infinite;
  }

  .work-banner-col2 p:nth-child(6) {
    left: -20%;
    animation: expandAndCollapse6 5s linear infinite;
  }

  @keyframes expandAndCollapse1 {
    8% {
      left: -20%;
    }

    42% {
      left: -20%;
    }

    58% {
      left: -20%;
    }

    92% {
      left: -20%;
    }
  }

  @keyframes expandAndCollapse2 {
    8% {
      left: -20%;
    }

    42% {
      left: -7%;
    }

    58% {
      left: -7%;
    }

    92% {
      left: -20%;
    }
  }

  @keyframes expandAndCollapse3 {
    8% {
      left: -20%;
    }

    42% {
      left: 0%;
    }

    58% {
      left: 0%;
    }

    92% {
      left: -20%;
    }
  }

  @keyframes expandAndCollapse4 {
    8% {
      left: -20%;
    }

    42% {
      left: 10%;
    }

    58% {
      left: 10%;
    }

    92% {
      left: -20%;
    }
  }

  @keyframes expandAndCollapse5 {
    8% {
      left: -20%;
    }

    42% {
      left: 20%;
    }

    58% {
      left: 20%;
    }

    92% {
      left: -20%;
    }
  }

  @keyframes expandAndCollapse6 {
    8% {
      left: -20%;
    }

    42% {
      left: 30%;
    }

    58% {
      left: 30%;
    }

    92% {
      left: -20%;
    }
  }

  .text-inner-p p {
    font-size: 16px !important;
  }
}