@media screen and (max-width: 768px) {
  #about-us-hero-container {
    .hero-mobile {
      background-color: #e9e8e3 !important;
    }
    .content {
      flex-direction: column !important;
      text-align: center;
      align-items: center;
      justify-content: center;
      margin-top: 90%;

      .hero-text-left {
        text-align: center;
      }

      .title,
      .subtitle {
        text-align: center !important;
        max-width: 70%;
      }

      .subtitle {
        max-width: 90%;
        padding-left: 0px;
      }
    }
  }

  .establish-section {
    margin-top: 0px;

    .establish {
      padding-top: 0px !important;
      min-height: 70vh;
      display: flex;
      align-items: center;
      justify-content: center;

      h1 {
        max-width: 80%;
        font-family: var(--primary-font) !important;
      }

      .date {
        font-size: var(--text-large) !important;
      }
    }

    .establish h1,
    h2,
    span {
      white-space: wrap;
      font-size: var(--text-xlarge) !important;
    }
  }

  .team-section {
    min-height: 70vh;
    margin-top: 0px;

    h1 {
      text-align: center !important;
      font-size: var(--text-xlarge);
      padding-top: 15vh;
      max-width: 60%;
    }

    .timeline-section h1 {
      padding-top: 15vh !important;
      font-size: var(--text-xlarge);
    }

    .team-carousel-container .name {
      text-align: center;
    }

    .team-carousel-container .title {
      text-align: center;
    }

    .mobile-navigation .nav-button {
      top: 0px;
      scale: 0.5;
      z-index: 999;
    }

    .mobile-navigation .left {
      left: -5% !important;
    }

    .mobile-navigation .right {
      left: 80% !important;
    }
  }

  .timeline-container {
    .mountain {
      display: none;
    }

    .title {
      font-size: var(--text-regular);
    }
  }

  .global-reach {
    min-height: 60vh !important;
    h1 {
      text-align: center;
      font-size: var(--text-xlarge);
      padding-top: 10rem !important;
    }

    .map {
      scale: 0.3;
      margin-top: -20vh;
    }
  }

  .choose-us {
    h1 {
      font-size: var(--text-xlarge);
      max-width: 70%;
      text-align: center;
    }

    .carousel-container .carousel {
      gap: 0px;
    }

    .carousel-container {
      scale: 1;

      .text-box {
        height: 300px;
        width: 230px;
        position: relative;
        z-index: 99;

        h2 {
          font-size: var(--text-regular);
        }

        h3 {
          font-size: var(--text-small);
        }
      }

      .right {
        right: 240px;
        bottom: -150vh;

        height: 260px;
      }

      .left {
        left: 240px;
        bottom: -150vh;
        height: 260px;
      }

      .nav-button {
        scale: 0.6;
      }
    }
  }
}
