body {
  font-family: "Raleway";
  color: #656364;
}
h2 {
  line-height: 1;
}
.infografia2-header {
  background-image: url(./images/leche2.jpg);
  height: 65vh;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: bottom;
}

.infografia2-align-header {
  display: flex;
  align-items: flex-end;
  padding: 4rem;
}

.infografia2-titulo-contenedor {
  display: flex;
}

.infografia2-titulo-contenedor > div {
  flex-basis: calc(80% - 1rem);
}

.infografia2-titulo-contenedor > img {
  position: absolute;
  right: 70px;
  margin-top: -80px;
  width: 30%;
}

.infografia2-tipos-productos-lacteos {
  color: #30816e;
  font-size: 50px;
  padding-top: 55px;
  margin: 0;
}
.infografia2-caracteristicas-productos-lacteos {
  color: #7dd857;
  font-size: 50px;
  margin-top: 0px;
}

.infografia2-tipos-items {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.infografia2-tipos-items > p,
.infografia2-tipos-items > div {
  flex-basis: calc(50% - 1rem);
}

.infografia2-img-derecha {
  display: flex;
  justify-content: end;
}

.infografia2-leche-como-alimento {
  display: flex;
  margin: 50px 0;
  justify-content: start;
}

.infografia2-leche-como-alimento img {
  width: 50%;
  /*z-index: -1;*/
}

.infografia2-leche-como-alimento div {
  color: #30816e;
  text-align: start;
  margin-left: -90px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.infografia2-leche-como-alimento div > h2 {
  color: #18993f;
  margin: 0;
  text-align: start;
  font-size: 60px;
}

.infografia2-leche-como-alimento-parrafo {
  font-weight: 700;
  color: #2f806d;
  background: #b7e485;
  border: solid 1px #2f806d;
  border-radius: 60px;
  margin-top: 64px;
  padding: 14px;
}

.infografia2-leche-como-alimento-parrafo h3 {
  font-size: 30px;
  margin-bottom: 0;
  padding: 12px;
}
.infografia2-composicion-nutricional-titulo {
  color: #2f806d;
  font-size: 43px;
  line-height: 1;
}
.infografia2-composicion-nutricional-items {
  display: flex;
  justify-content: space-between;
}
.infografia2-composicion-nutricional-items > div {
  flex-basis: calc(45% - 1rem);
  display: flex;
  align-items: center;
  justify-content: flex-end;
}
.infografia2-composicion-nutricional-items > div > p {
  flex-basis: calc(25% - 1rem);
  margin: 0 12px;
  text-align: center;
}
.infografia2-linea {
  border-top: solid #b7e485 3px;
  flex-basis: calc(45% - 1rem);
  margin: 0 12px;
}

.infografia2-composicion-nutricional-items-p {
  flex-basis: calc(60% - 1rem);
}

.infografia2-tipos-titulo {
  font-weight: 700;
  font-size: 34px;
  width: max-content;
  background-color: #18993f;
  color: #fff;
  padding: 15px 30px;
  border-radius: 32px;
  border: solid 1px #496d54;
}
.infografia2-interes {
  color: #7bd856;
  background-color: #5a9d8d;
  text-align: center;
  padding: 12px;
  margin: 12px;
}

.infografia2-interes button {
  background-color: #2c816e;
  color: #fff;
  border: none;
  padding: 9px;
}

.infografia2-interes p {
  font-size: 18px;
  font-weight: 600;
}

.infografia2-interes-contenedor {
  display: flex;
  justify-content: center;
}

@media only screen and (max-width: 1028px) {
  .infografia2-titulo-contenedor > div {
    flex-basis: calc(60% - 1rem);
  }
  .infografia2-composicion-nutricional-items > div > p {
    font-size: 27px;
  }
  .infografia2-tipos-productos-lacteos {
    color: #30816e;
    font-size: 33px;
    padding-top: 0px;
    margin: 0;
  }
  .infografia2-caracteristicas-productos-lacteos {
    color: #7dd857;
    font-size: 33px;
  }

  .infografia2-leche-como-alimento div {
    margin-left: -70px;
  }

  .infografia2-leche-como-alimento div > h2 {
    font-size: 46px;
  }
}

@media only screen and (max-width: 768px) {
  .infografia2-titulo-contenedor > div {
    flex-basis: calc(60% - 1rem);
  }
  .infografia2-tipos-productos-lacteos {
    color: #30816e;
    font-size: 33px;
    padding-top: 0px;
    margin: 0;
  }
  .infografia2-caracteristicas-productos-lacteos {
    color: #7dd857;
    font-size: 33px;
  }

  .infografia2-leche-como-alimento div {
    color: #30816e;
    text-align: start;
    margin-left: -60px;
    display: flex;
    flex-direction: column;
    justify-content: center;
  }

  .infografia2-leche-como-alimento div > h2 {
    color: #18993f;
    margin: 0;
    text-align: start;
    font-size: 40px;
  }
  .infografia2-composicion-nutricional-items {
    flex-direction: column;
  }
  .infografia2-linea {
    display: none;
  }
  .infografia2-composicion-nutricional-items > div {
    justify-content: flex-start;
  }
}

@media only screen and (max-width: 428px) {
  .infografia2-tipos-productos-lacteos {
    color: #30816e;
    font-size: 27px;
    padding-top: 0px;
    margin: 0;
  }
  .infografia2-caracteristicas-productos-lacteos {
    color: #7dd857;
    font-size: 27px;
    margin-top: 0px;
  }
  .infografia2-titulo-contenedor {
    flex-direction: column;
  }
  .infografia2-titulo-contenedor > img {
    position: relative;
    right: 0;
    margin-top: 0;
    width: 100%;
  }

  .infografia2-tipos-items {
    flex-wrap: wrap;
  }
  .infografia2-tipos-items > p,
  .infografia2-tipos-items > div {
    flex-basis: calc(100% - 1rem);
  }
  .infografia2-tipos-items > div,
  .infografia2-tipos-items > img {
    display: none;
  }
  .infografia2-leche-como-alimento {
    margin: 0;
    flex-direction: column;
  }

  .infografia2-leche-como-alimento div {
    margin-left: 0px;
  }

  .infografia2-leche-como-alimento div > h2 {
    font-size: 30px;
    margin: 0px;
  }

  .infografia2-leche-como-alimento img {
    width: 100%;
    z-index: -1;
  }
  .infografia2-factores-predisponentes {
    margin-top: 15px;
  }
  .infografia2-composicion-nutricional-items {
    flex-direction: column;
  }
  .infografia2-composicion-nutricional-titulo {
    color: #2f806d;
    font-size: 30px;
    line-height: 1;
  }
  .infografia2-tipos-titulo {
    font-size: 20px;
  }
  .infografia2-interes-contenedor {
    flex-wrap: wrap;
  }
  .infografia2-linea {
    display: none;
  }
  .infografia2-composicion-nutricional-items > div {
    justify-content: center;
  }
}
