html,
body {
  margin: 0;
  padding: 0;
  overflow-x: hidden !important;
}

.main-container {
  max-width: 1400px;
  margin: 80px auto;
  padding: 10px 50px;
}

.navbar-btn {
  border: 1px solid #fff;
  text-transform: uppercase;
  color: #fff !important;
  padding: 8px 16px;
}

.navbar-links:hover {
  color: #fff !important;
}

.bg-orange {
  background: linear-gradient(270.7deg, #ae5d01 18.59%, #f9d12b 116.77%);
}

.logo-img {
  mix-blend-mode: multiply;
}

.bg-hero {
  background-color: #f9f5e8;
}

@media (max-width: 472px) {
  .navbar-btn {
    border: 1px solid #fff;
    padding: 9px;
    font-size: 13px;
  }
}

@media (max-width: 991px) {
  .navbar-links:hover {
    color: black !important;
  }
}

/* helpfull area */
.margin-b {
  margin: 80px 20px;
}

.align-center {
  text-align: center;
}

.helpful-card-icon {
  display: block;
  margin-left: auto;
  margin-right: auto;
}

.bg-hover:hover {
  background-color: #ac5201;
  color: #fff !important;
}

.text-hover:hover {
  color: #fff !important;
}

.helpful-icon3 {
  background: linear-gradient(
    180deg,
    #023947 1.53%,
    rgba(30, 42, 45, 0.4) 100%
  ) !important;
}

.helpful-icon4 {
  background: linear-gradient(
    180deg,
    #ffd0b6 1.53%,
    rgba(255, 208, 182, 0.4) 100%
  ) !important;
}

/* Prevalence  */
.prevalence {
  display: flex;
  flex-direction: column;
  gap: 50px;
  width: 650px;
  padding-right: 120px;
}

.sub-prevalence {
  display: flex;
  gap: 8px;
  align-items: flex-start;
}

.sub-prevalence h3 {
  font-size: 16px;
  font-weight: 600;
  margin-bottom: 12px;
}

@media (max-width: 576px) {
  .prevalence {
    width: 100%;
    padding-right: 0;
    padding: 20px;
  }
  .sub-prevalence {
    flex-direction: column;
  }

  .padding-4 {
    padding: 20px;
  }

  .mb-50 {
    margin-bottom: 25px !important;
  }
}

/* Our Approach */
.approach {
  border: 1px solid #ced4da;
  border-radius: 10px;
  margin-top: -8px;
  padding: 60px 8px 14px;
}

.approach-content {
  font-size: 16px;
  font-weight: 600;
}

/* Stories of change */
.soc {
  max-width: 1400px;
  margin: 0 auto;
  padding: 10px 50px;
}

.soc-content {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 65px;
  justify-content: space-between;
}

.soc-content-heading {
  width: 400px;
}

.soc-content-heading h1 {
  font-size: 34px;
  font-weight: 700;
  margin-bottom: 14px;
}

.soc-img {
  width: 100%;
}

.soc-btn-box {
  transform: translate(200px, 90px);
}

.soc-btn {
  color: #fff;
  background: #000;
  padding: 10px 20px;
  font-size: 14px;
  border-radius: 16px;
}

.soc-btn:hover {
  background-color: #fff;
  color: #000;
  border: 1px solid black;
}

.soc-row2 {
  display: flex;
  gap: 10px;
}

.soc-row3 {
  padding-top: 25px;
}

.soc-row3-content {
  margin-bottom: 50px;
}
.soc-row3-content h1 {
  font-weight: 700;
}

@media (max-width: 1399px) {
  .soc,
  .voi,
  .orchid-logos,
  .upcoming-events {
    max-width: 1200px !important;
  }

  .upcoming-events-timeline {
    top: 320px !important;
  }
}

@media (max-width: 1199px) {
  .soc,
  .voi,
  .orchid-logos,
  .upcoming-events {
    max-width: 1000px !important;
  }

  .upcoming-events-timeline {
    top: 250px !important;
  }

  .events-topic h3 {
    font-size: 20px;
  }

  .soc-row3-content {
    display: none;
  }

  .voi-content {
    padding: 30px;
  }

  .soc-content {
    gap: 25px;
  }
}

@media (max-width: 991px) {
  .soc-content {
    grid-template-columns: repeat(1, 1fr);
    max-width: 700px;
    margin: 0 auto;
  }
  .soc-row2 img {
    width: 70%;
    transform: translateX(50px);
  }

  .soc-content-heading {
    width: 100%;
  }

  .soc-btn-box {
    transform: translate(0, 30px);
    margin-bottom: 30px;
  }

  .soc-content {
    gap: 45px;
  }

  .upcoming-events-timeline {
    top: 320px !important;
  }

  .timeline-2 {
    transform: translateY(185px);
  }
}

@media (max-width: 767px) {
  .soc {
    max-width: 600px !important;
  }

  .upcoming-events-timeline {
    top: 230px !important;
  }

  .timeline-2 {
    transform: translateY(140px);
  }
}

@media (max-width: 576px) {
  .soc,
  .voi,
  .upcoming-events {
    padding: 20px !important;
  }

  .soc-content-heading h1,
  .voi-heading h1,
  .events-heading h1 {
    font-size: 28px !important;
  }

  .voi-heading {
    margin-bottom: 30px !important;
  }

  .events-topic h3 {
    font-size: 15px;
  }

  .upcoming-events-timeline {
    top: 230px !important;
  }

  .timeline-2 {
    transform: translateY(140px);
  }
}

@media (max-width: 500px) {
  .upcoming-events-timeline {
    display: none !important;
  }
}

/* Voices of Impact */
.voi {
  max-width: 1400px;
  margin: 80px auto;
  padding: 10px 50px;
}
.voi-heading {
  display: flex;
  justify-content: space-between;
  margin-bottom: 60px;
}

.voi-heading h1 {
  font-weight: 700;
}

.voi-container {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
}

.voi-content {
  box-shadow: 0px 4px 40px -10px #00000026;
  /* padding: 10px 5px 25px; */
  padding: 60px;
}

.voi-description-content {
  display: flex;
  gap: 8px;
  align-items: center;
  margin-bottom: 10px;
}

.voi-description-content img {
  width: 70px;
}

.voi-description-content h4 {
  font-size: 14px;
  font-weight: 700;
  margin-bottom: 6px;
}

.voi-description-content p {
  font-size: 12px;
}

.p-description {
  font-style: italic;
  font-size: 12px;
}

@media (max-width: 991px) {
  .voi-container {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 12px;
  }
  .voi {
    /* padding: 10px 100px; */
    max-width: 770px !important;
    margin: 50px auto;
  }

  .voi-content {
    padding: 26px;
  }
}

@media (max-width: 767px) {
  /* .voi-container {
    display: grid;
    grid-template-columns: repeat(1, 1fr);
    gap: 12px;
  } */
  .voi {
    max-width: 600px !important;
  }
}

@media (max-width: 576px) {
  .voi-container {
    grid-template-columns: repeat(1, 1fr);
    gap: 12px;
  }
}

/* Orchid logos */
.orchid-logos {
  max-width: 1400px;
  margin: 60px auto;
  padding: 10px 50px;
}

.orchid-logos-container {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  border: 1px solid #ced4da;
  padding: 50px 25px;
  justify-items: center; /* Centers the images horizontally */
  align-items: center; /* Centers the images vertically */
}

.orchid-logos-container img {
  width: 40%;
}

@media (max-width: 991px) {
  .orchid-logos {
    max-width: 770px !important;
  }
}

@media (max-width: 767px) {
  .orchid-logos {
    max-width: 600px !important;
  }
}

/* Join Our Upcoming Events  */
.upcoming-events {
  max-width: 1400px;
  margin: 60px auto;
  padding: 10px 50px;
}

.events-heading {
  text-align: center;
  margin-bottom: 24px;
}

.events-heading h1 {
  font-weight: 700;
}

.upcoming-events-description {
  display: grid;
  grid-template-columns: 60% 40%;
  gap: 4px;
}

.events-img {
  position: relative;
}

.img-left {
  width: 95%;
}

.img-right {
  width: 100%;
}

.upcoming-events-timeline {
  display: flex;
  gap: 20px;
  position: absolute;
  top: 420px;
  /* bottom: 48px; */
  left: 50px;
}

.events-topic {
  box-shadow: 0px 4px 40px -10px #00000026;
  padding: 35px 10px 40px;
  width: 95%;
}

.e-1 {
  width: 100%;
}

@media (max-width: 991px) {
  .upcoming-events {
    max-width: 770px !important;
  }
  .upcoming-events-description {
    grid-template-columns: repeat(1, 1fr);
    gap: 36px;
  }
}

@media (max-width: 767px) {
  .upcoming-events {
    max-width: 600px !important;
  }
}

@media (max-width: 485px) {
}
