@import url("https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500;600&family=Nunito:wght@500;600;700;800&display=swap");
.hero-page.about {
  background-color: #212529;
}
.hero-page.about .hero-img {
  background: linear-gradient(0deg, rgb(33, 37, 41) 15%, rgba(33, 37, 41, 0) 60%), url("../img/kinesics_solutions_about_us_hero.jpg") center center;
  background-size: cover;
  width: 100%;
}
.hero-page.about .hero-img img {
  border-radius: unset;
  max-width: min(26em, 80%);
}
.hero-page.about p {
  max-width: 60ch;
}

.mission-vision {
  padding: 0 1em;
}
.mission-vision .container-section {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1em;
  padding: 0;
}
.mission-vision .container-section .block {
  background-color: #212529;
  border-radius: 1em;
  padding: 2em 1.25em;
  max-width: 26em;
}
.mission-vision .container-section .block img {
  background-color: white;
  max-width: 9em;
  height: 9em;
  border-radius: unset;
  padding: 1.5em;
  -o-object-fit: contain;
     object-fit: contain;
  -webkit-clip-path: circle(50%);
          clip-path: circle(50%);
  z-index: 0;
}
.mission-vision .container-section .block.mission img {
  padding: 2.3em;
}
.mission-vision .container-section .block h3 {
  padding: 0.75rem 0;
}

.more {
  background: linear-gradient(0deg, rgb(237, 237, 244) 70%, rgb(255, 255, 255) 70%);
  justify-content: center;
}

@media all and (min-width: 64em) {
  .hero-page.about {
    background-color: #212529;
  }
  .hero-page.about .hero-img {
    background: linear-gradient(0deg, rgb(33, 37, 41) 0%, rgba(33, 37, 41, 0) 65%), url("../img/kinesics_solutions_about_us_hero.jpg") center center;
    background-size: cover;
  }
  .hero-page.about p {
    text-align: center;
  }
  .mission-vision {
    padding-bottom: 5rem;
  }
  .mission-vision .container-section {
    display: flex;
    flex-direction: row;
  }
  .mission-vision .container-section .block {
    flex: 1 1 50%;
    padding: 5em;
    text-align: center;
    max-width: unset;
  }
  .mission-vision .container-section .block h3 {
    padding: 2rem 0;
  }
  .more {
    background: linear-gradient(90deg, rgba(237, 237, 244, 0.9) 50%, rgba(237, 237, 244, 0) 90%), url("../img/kinesics_solutions_laboratories.jpg") center center;
    background-size: cover;
    background-repeat: no-repeat;
    min-height: 38em;
    height: 100%;
    display: flex;
    flex-direction: row;
    align-items: center;
  }
}/*# sourceMappingURL=about-us.css.map */