#values .vision-image,
#values .mission-image {
  width: 100%;
  height: 500px;

}

@media screen and (max-width: 992px) {
    .vision-image, .mission-image {
        height: 300px;
    }
  }

#values .overlay {
  border-radius: 0 !important;
}

.template1-mission {
  z-index: 2;
  background: white;
  border-radius: var(--bs-border-radius-lg) !important;
  top: 50%;
  padding: 20px;
  filter: drop-shadow(2px 4px 6px #00000060);
  transform: translate(-100px);
  max-height: 400px;
  overflow: auto;
}

.template1-mission p {
    color: #000000 !important;
}

@media screen and (max-width: 992px) {
    .template1-mission {
        transform: translateY(-50px);
        margin: 0 10px;
        width: calc(100% - 20px);
    }
}

.template1-vision {
z-index: 2;
background: white;
border-radius: var(--bs-border-radius-lg) !important;
top: 50%;
padding: 20px;
filter: drop-shadow(2px 4px 6px #00000060);
transform: translate(100px);
max-height: 400px;
overflow: auto;
}

.template1-vision p {
    color: #000000 !important;
}

@media screen and (max-width: 992px) {
    .template1-vision {
        transform: translateY(-50px);
        margin: 0 10px;
        width: calc(100% - 20px);
    }
}


@media screen and (max-width: 992px) {
  .template2-images {
    flex-direction: column;
    position: absolute;
    z-index: 1;
    opacity: 0.12;
    top: 50%;
    transform: translate(0%, -40%) !important;
  }
}


.template3-text {
    p {
        color: #000000;
      }
}

.template3-wrap {
  padding: 0 !important;
  background: #ffffff;
  border-radius: var(--bs-border-radius-lg);
}

@media screen and (max-width: 992px) {
    .template3-wrap {
        margin: 10px;
        width: calc(100% - 20px);
    }
  }


#values .value-description {
    font-size: 1.25rem;
    overflow: unset !important;
}

@media (max-width: 992px) {
    .value-description, p {
      font-size: 1.25rem;
    }
  }

  @media (max-width: 576px) {
    .value-description, p {
      font-size: 1rem;
    }
  }


  .mission.overlay-content{
    position: relative;
    z-index: 2;
    padding-right: calc(var(--bs-gutter-x) * 0.5);
    padding-left: calc(var(--bs-gutter-x) * 0.5);
  }

  .mission.overlay-content p, .vision p {
    color: #ffffff;
    font-size: 1.25rem;

  }