@font-face {
    font-family: 'Aller Display';
    src: url('../fonts/Aller/AllerDisplay.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'Aller Regular';
    src: url('../fonts/Aller/Aller_Std_Rg.ttf') formar('truetype');
    font-weight: normal;
    font-style: normal;
}
.portada-avisop{
    width: 100%;
    height: auto;
}
.portada-avisop img{
    width: 100%;
    height: auto;
    object-fit: contain;
    display: block;
}
.info{
    width: 100%;
    height: auto;
    margin-top: 50px;
    display: flex;
    flex-direction: column;
}
.info h2{
    font-family: 'Aller Display';
    color: #aad159;
    text-align: center;
    font-size: 52.64px;

}
.info-ph{
    margin: 50px 50px;
}

.parrafo-etica {
    text-align: justify;
    text-justify: inter-word;
    text-indent: 100px; /* Sangría solo en la primera línea */
    margin-bottom: 25px;
    font-size: 32.2px;

}

.inicio-parrafo {
    font-family: 'Aller Regular', sans-serif;
    color: #002060;
    display: inline;
}

.info-ph2{
    font-family: 'Aller Regular';
    text-align: justify;
    margin: 50px 0 30px 160px;
    font-size: 32.2px;
    color: #002060;
}


.letras-paren {
  list-style: none; /* quitamos el estilo por defecto */
  counter-reset: letra; /* inicializamos el contador */
}

.letras-paren li {
  counter-increment: letra; /* incrementa el contador por cada <li> */
    position: relative;
    text-indent: 40px;
    padding-left: 185px;
    text-align: justify;
    margin: 50px 0 50px 0;
}

.letras-paren li::before {
    content: counter(letra, lower-alpha) ") ";
    position: absolute;
    left: 150px;
    color: #002060; /* opcional para darle estilo */
    font-weight: bold;
}
.info-ph2 li{
    margin: 50px 0 50px 0;
}
.info-ph3{
    font-family: 'Aller Regular';
    font-size: 32.2px;
}
.info-ph3 h3{
    top: 50px;
    text-align: center;
    color: #002060;

}
.ph3-inf1{
    margin:50px 0;
    color: #002060;
}
.ph3-inf2{
    width: 100%;
    max-width: 850px;
    color: #002060;
    font-weight: bold;
}

@media (max-width: 768px) and (min-width: 320px) {
    .info
    .info-ph {margin:15px 50px;}
    .info h2 {font-size: 1rem; text-align: center; margin: 0 0 15px 5px;}
    .parrafo-etica {font-size: 1rem; text-indent: 1rem;}
    .info-ph2{margin: 50px 0 30px 50px;}
    .info-ph2 li {margin: 40px 0 40px 0; font-size: 1rem;}
    .letras-paren li{text-indent: 5px; padding-left: 15px;}
    .letras-paren li::before {left: -5px;}
    .info-ph3 h3{font-size: 1rem; text-align: center;}
    .ph3-inf1{font-size: 1rem; margin: 20px 0;  text-align: left;}
    .ph3-inf2{font-size: 1rem;}
}