.sustentabilidad{text-align: center;
  background-image: url("../img/bg/olga-stalska-QaWRyEdlffY-unsplash-2.jpg");
  background-position: center;
  background-size: cover;
  position: relative;
}
.sustentabilidad .bg-opacity{
  height: 100%;
  width: 100%;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
}
.sustentabilidad .seccion_container{
  position: relative;
  z-index: 2;
}
.sustentabilidad h2, .sustentabilidad_txt{color: var(--paper);margin-bottom: 0.8em;}
.sustentabilidad_card{background-color: rgb(247, 255, 253, 75%);border-radius: 3px;text-align: start;transition: all 0.3s;cursor: pointer;}
.sustentabilidad_card:hover{background-color: rgb(210, 210, 210, 90%)}
.sustentabilidad_card p{font-size: 90%;color: var(--muted);transition: all 0.3s;}
.sustentabilidad_card:hover p{color: var(--fuente);}
.sustentabilidad_card hr{margin: 0.5em 0 !important;}
.sustentabilidad_card img{width: 10em;height: 10em;z-index: 3;}
.sustentabilidad_list{display: flex;flex-wrap: wrap;list-style: none;padding: 0;margin: 3em 0;justify-content: space-between;gap: 2em;}
.sustentabilidad_list li{display: flex;font-size: 80%;}
.sustentabilidad_info{padding: 1em 3em 1em 0}
.sustentabilidad_card_fade{
  padding: 0.5em 2em 0.5em 5em;
  margin-left: -5em;
  color: var(--paper);
}
.sustentabilidad_card_fade h5{
  font-weight: bold;
  margin: 0 1em 0 0;
}
.desarrollo_card_fade{
  background: linear-gradient(
    to right,
    #2D596B 0%,
    #2D596B 80%,
    transparent 100%
  );
}
.conservacion_card_fade{
  background: linear-gradient(
    to right,
    #43663A 0%,
    #43663A 80%,
    transparent 100%
  );
}
.apoyo_card_fade{
  background: linear-gradient(
    to right,
    #144A71 0%,
    #144A71 80%,
    transparent 100%
  );
}
.turismo_card_fade{
  background: linear-gradient(
    to right,
    #9B9E21 0%,
    #9B9E21 80%,
    transparent 100%
  );
}
.infancia_card_fade{
  background: linear-gradient(
    to right,
    #AF6035 0%,
    #AF6035 80%,
    transparent 100%
  );
}
/* =========================================================
  RESPONSIVE: MÓVILES / TABLET (≤ 959px)
  ========================================================= */
@media (max-width:959px){
    
}

/* =========================================================
  RESPONSIVE: ESCRITORIO (≥ 960px)
  ========================================================= */
@media (min-width:960px){
    .sustentabilidad{padding: 3em 11%;}
    .sustentabilidad_list li{width: 48%;}
    .infancia_card{width: 100% !important;padding: 0 2em;}
}
