@import url('https://fonts.googleapis.com/css2?family=Encode+Sans+SC:wght@300&display=swap');
@import url('https://fonts.googleapis.com/css?family=Rubik:300,700');
@import url('https://fonts.googleapis.com/css2?family=Red+Hat+Display&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Otomanopee+One&display=swap');


*{
    padding: 0;
    margin: 0;
}

/*HEADER*/

.header{
    background-color: lightgray;
    text-align: center;
    /*position: fixed;*/
}

.lista{
    height: 10vh;
    width: 100vw;
    position: sticky;
    top: 0;
    box-shadow: 10px 5px 15px 2px rgb(185, 182, 182);
}

.lista ul{
    width: 100vw;
    display: flex;
    justify-content: space-evenly;
    height: 8vh;
    padding-top: 1vh;
    align-items: center;
}

.nav-a{
    color: #000000;
    text-decoration: none;
    font-size: 2.5vmin;
    font-family: 'Rubik', sans-serif;
    transition: all 0.3s ease 0s;
}

.nav-a:hover{
    color: #ad8a2a;
}

/*FIN DEL HEADER*/

/*MAIN*/

.section1{
    background-color: lightgray;
    height: 100vh;
    align-content: center;
}

.div1{
    height: 85%;
    display: flex;
    justify-content: space-between;
    align-items: center;
}


.text-presentacion{
    margin-top: 2vh;
    margin-left:3vh;
    margin-right: 3vh;
    font-family: 'Encode Sans SC', sans-serif;
    font-size: 3vmin;
    text-align: justify;
    border: 2px solid rgb(109, 99, 76);
    border-radius: 15px;
    padding: 3vmin;
}

.subtitulo{
    font-family:'Rubik', sans-serif;
    font-size: 12vmin;
    color: rgb(109, 99, 76);
    text-align: center;
    border-bottom: 14px double rgb(133, 127, 115);
    padding-top: 2vh;
    margin-bottom: 0;
    padding-bottom: 0;
}

.img-presentacion{
    height: 60vmin;
    margin-right: 2vh;
    margin-top: 2vh;
    border-radius: 3vh;
}



.section2{
    height: 100vh;
    background-color: rgb(143, 142, 142);
}

.div2{
    height: 73%;
    display: flex;
    flex-direction: row-reverse;
    justify-content: space-between;
    align-items: center;
}


.text-mppei{
    margin-top: 2vh;
    margin-left:3vh;
    margin-right: 3vh;
    font-family: 'Encode Sans SC', sans-serif;
    font-size: 3vmin;
    text-align: justify;
    border: 2px solid rgb(109, 99, 76);
    border-radius: 15px;
    padding: 3vmin;
}

.subtitulo{
    font-family:'Rubik', sans-serif;
    font-size: 12vmin;
    color: rgb(109, 99, 76);
    text-align: center;
    border-bottom: 14px double rgb(133, 127, 115);
    padding-top: 2vh;
    margin-bottom: 0;
    padding-bottom: 0;
}

.img-mppei{
    height: 40vmin;
    margin-right: 2vh;
    margin-top: 2vh;
}

.section3{
    background-color: lightgray;
    height: 100vh;
    align-content: center;
}

.div3{
    height: 80%;
    display: flex;
    justify-content: space-between;
    align-items: center;
}


.text-datos-personales{
    margin-top: 2vh;
    margin-left:3vh;
    margin-right: 3vh;
    font-family: 'Encode Sans SC', sans-serif;
    font-size: 3vmin;
    text-align: justify;
    border: 2px solid rgb(109, 99, 76);
    border-radius: 15px;
    padding: 3vmin;
}

.datos-personales-a{
    color: #000000;
    text-decoration: none;
    font-family: 'Encode Sans SC', sans-serif;
    transition: all 0.3s ease 0s;
}

.datos-personales-a:hover{
    color: #ad8a2a;
    text-decoration: underline #ad8a2a;
    transition: all 0.3s ease 0s;
}

.subtitulo{
    font-family:'Rubik', sans-serif;
    font-size: 12vmin;
    color: rgb(109, 99, 76);
    text-align: center;
    border-bottom: 14px double rgb(133, 127, 115);
    padding-top: 2vh;
    margin-bottom: 0;
    padding-bottom: 0;
}

.img-datos-personales{
    height: 40vmin;
    margin-right: 2vh;
    margin-top: 2vh;
}

.section4{
    height: 90vh;
    background-color: rgb(143, 142, 142);
}

.div4{
    height: 80%;
    display: flex;
    flex-direction: column-reverse;
    justify-content: center;

}

.div_fotomontaje{
    align-self: center;
}

.fotomontaje{
    height: 40vh;
}


.text-expectativas{
    margin-top: 2vh;
    margin-left:3vh;
    margin-right: 3vh;
    font-family: 'Encode Sans SC', sans-serif;
    font-size: 3vmin;
    text-align: justify;
    border: 2px solid rgb(109, 99, 76);
    border-radius: 15px;
    padding: 3vmin;
}

.subtitulo{
    font-family:'Rubik', sans-serif;
    font-size: 12vmin;
    color: rgb(109, 99, 76);
    text-align: center;
    border-bottom: 14px double rgb(133, 127, 115);
    padding-top: 2vh;
    margin-bottom: 0;
    padding-bottom: 0;
}

.img-expectativas{
    height: 40vmin;
    margin-right: 2vh;
    margin-top: 2vh;
}

.section-flecha{
    display: flex;
    flex-direction: row-reverse;
    height: 10vh;
    background-color: rgb(143, 142, 142);
}

.flecha-arriba{
    height: 6vh;
    margin-right: 2vh;
}

/*FIN DEL MAIN*/

/*FOOTER*/

.footer{
    background-color: rgb(82, 82, 82);
    height: 12vh;
    display: flex;
    justify-content: space-between;
    box-shadow: 10px 5px 15px 2px rgb(185, 182, 182);

}

.lista-footer-uno{
    list-style: none;
    margin-left: 3vh;
    align-self: center;
}

.lista-footer-dos{
    list-style: none;
    margin-right: 2vh;
}

.lista-texto-cole{
    font-size: 2.5vh;
    color: white;
    font-family: 'Rubik', sans-serif;
    text-align: center;
    margin-bottom: 1vh;
}

.lista-texto{
    font-size: 2.5vh;
    color: white;
    font-family: 'Rubik', sans-serif;
    text-align: center;
}

.lista-texto-numero{
    font-size: 5vh;
    color: white;
    font-family: 'Otomanopee One', sans-serif;
    text-align: center;
}