#historia, #numbers {
  background-color: #f6f6f6;
}

.introQuemSomosContent {
  text-align: center;
  padding: 240px 0 180px;
}

.historiaContent, .pilaresContent, .numbersContent {
  padding: 140px 0;
}

.introQuemSomosContent h1, .historiaContent h1 {
  margin: 0 0 30px;
}

@media (min-width: 768px) {
  .historiaContent {
    text-align: left;
    display: flex;
    align-items: center;
    justify-content: space-between;
  }
}

.historiaContent img {
  width: 100%;
  margin: 40px 0 0;
}

@media (min-width: 768px) {
  .historiaContent img {
    margin: 0;
  }
}

@media (min-width: 768px) {
  .historiaContent div {
    width: 48%;
  }
}

.pilaresCard {
  border: 2px solid #02fbb2;
  border-radius: 15px;
  margin: 30px 0;
  padding: 20px;
}

.pilaresCard h1 {
  margin: 0 0 15px;
}

.pilaresCard p {
  margin: 0;
}

@media (min-width: 768px) {
  .pilaresCards {
    display: flex;
    align-items: center;
    justify-content: space-between;
  }
}

@media (min-width: 768px) {
  .pilaresCard {
    width: 31%;
  }
}

.numbersContent {
  text-align: center;
}

@media (min-width: 768px) {
  .numbersContent {
    text-align: left;
  }
}

.numbersCard {
  text-align: center;
  border: 2px solid #02fbb2;
  border-radius: 15px;
  margin: 30px 0;
  padding: 20px;
}

@media (min-width: 768px) {
  .numbersCard {
    width: 48%;
    margin: 15px 0;
  }
}

@media (min-width: 768px) {
  .numbersCard {
    width: 24%;
    margin: 0;
  }
}

.numbersCard h1 {
  font-weight: 600;
  margin: 0;
}

.numbersCard span {
  font-size: 16px;
}

@media (min-width: 992px) {
  .numbersCard span {
    font-size: 20px;
  }
}

.numbersCards {
  margin: 60px 0 0;
}

@media (min-width: 768px) {
  .numbersCards {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
  }
}