@font-face{
    font-family: 'Aller Regular';
    src: url('../fonts/Aller/Aller_Std_Rg.ttf');
    font-size: normal;
    font-weight: normal;
}
@font-face{
    font-family: 'Aller Display';
    src: url('../fonts/Aller/AllerDisplay.ttf');
    font-size: normal;
    font-weight: normal;
}
body {
    font-family: 'Aller Regular';
    margin: 0;
    padding: 0;
    background-color: #f5f5f5;
}
.content-prime{
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden;
}
.content-prime img{
    width: 100%;
    max-width: 100vw;
    object-fit: cover;
}
.cont-img-text{
    height: 100%;
    position: relative;
    text-align: center;
    max-width: 100%; /* Ancho máximo de la imagen */
    margin: 20px auto; /* Centramos el contenedor con margen automático */
    padding: 10px; /* Espaciado para evitar que la imagen esté muy pegada */ 
}
.imagen-frase {
    display: block;
    margin: 0 auto; /* Centramos la imagen horizontalmente */
    width: 100%; /* La imagen se adapta al 100% del ancho del contenedor */
    height: 230px; /* Mantiene la proporción de la imagen */
    filter: brightness(1.1) contrast(1.1); /* Ajustes para mejorar la visibilidad */
}
.parent {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: repeat(2, 1fr);
    grid-column-gap: 45px;
    grid-row-gap: 30px;
    text-align: justify;
}
.div1 {
    grid-area: 1 / 1 / 2 / 3;
    display: flex;
    background-image: url('../img/sostenibilidad/IMAGEN04.png');
    background-repeat: no-repeat;
    background-size: auto 90%;
    background-position: 3% 30%;
    justify-content: center;
    align-items: center;
    padding: 0 50px;
    background-color: #EEEEEE;
}
p{
    font-family: 'Aller Regular';
    font-size: 30.9px;
    color: #002060;
    padding: 25px 20px;
}
.div2 {
    grid-area: 2 / 1 / 3 / 2;
}
.div3 {
    grid-area: 2 / 2 / 3 / 3;
}
.div4 {
    grid-area: 3 / 1 / 4 / 2;
}
.div5 {
    grid-area: 3 / 2 / 4 / 3;
}
.div6 {
    grid-area: 4 / 1 / 5 / 2;
}
.div7 {
    grid-area: 4 / 2 / 5 / 3;
}
.div7 img{
    width: 100%;
    height: 100%;
}
.div2, .div3, .div4, .div5, .div6, .div7{
    padding: 0 50px;
}
.div-t h1{
    font-family: 'Aller Display';
    display: flex;
    text-align: center;
    color: #AAD159;
    font-size: 50px;
}
.dos, .tres, .cuatro, .cinco, .seis{
    background-repeat: no-repeat;
    background-size: auto 100%;
}
.dos{
    background-image: url('../img/sostenibilidad/1.png');
}
.tres{
    background-image: url('../img/sostenibilidad/2.png');
}
.cuatro{
    background-image: url('../img/sostenibilidad/3.png');
}
.cinco{
    background-image: url('../img/sostenibilidad/4.png');
}
.seis{
    background-image: url('../img/sostenibilidad/5.png');
}
.parent-2{
    background-color: #F5F5F5;
    width: 100vw;
    overflow: hidden;
    padding: 85px;
}
.parent-2 img{
    width: 100%;
    object-fit: cover;
}
@media (max-width:768px) and (min-width:320px){
    .imagen-frase{height: 5rem;}
    .cont-img-text{margin: 2px auto; padding: 1px;}
    .parent{grid-column-gap:4.5px ; grid-row-gap:3px; grid-template-rows: repeat(1,1fr);}
    .div1{background-size: auto 10rem; background-position: center 25px; padding: 0 15px; height: 320px; }
    p{font-size: 1rem; padding: 2.5px 2px;}
    .div-t h1{font-size: 1rem;}
    .div2, .div3, .div4, .div5, .div6, .div7{padding: 3px 11px;}
    .div7 {display: flex; align-items: center;}
    .div7 img{width:100%; height: auto; object-fit: cover;}
    .dos, .tres, .cuatro, .cinco, .seis{background-size: auto 10rem;}
    .dos, .cuatro{background-position: left top;}
    .tres, .cinco{background-position: right bottom;}
    .seis{background-position: center center;}
    .parent-2{width: 100%; padding: 8.5px;}
    .footer-copyright p{font-size: 9px;}

}