/*Fuentes*/

@import url(https://fonts.googleapis.com/css2?family=Noto+Serif:wght@700&display=swap); 
@import url(https://fonts.googleapis.com/css2?family=Caveat:wght@700&display=swap);

/*General*/

*{ 
    padding: 0;
    margin: 0;
    box-sizing: border-box;
    background-color: #e49eb8;
    color:#732240;
    font-family: 'Noto Serif', serif;

}
/*Header*/ 

.header{ 
    position: fixed;  
    width: 100%;
    top: 0; 
}

.header p{
    text-align: center;
    font-size: 1vmax;
    background-color: #6fbac2
}

/*Barra de navegación*/

.nav{
    display: flex;
    justify-content: space-around;
    padding: 4vh;
}


.titulo-principal{
    font-family: 'Caveat', cursive;
    text-align: center; 
    font-size: 3vmax;
    text-decoration: underline;
}

/*Botones*/

.button {
    position: relative;
    background: none;
    border: solid 1px #8C0327;
    transition: linear 250ms;
    width: 100px;
    height: 40px;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 1rem;
}
  
.button:is(:hover,:focus) {
    color: #5fa4ac;
}
  
.button::after {
    position: absolute;
    content: '';
    inset: 0;
    z-index: -1;
    background-color: #121212;
    transform-origin: left;
    transform: scaleX(0);
    transition: linear 250ms;
}
  
.button:is(:hover, :focus)::after {
    transform: scale(1);
}
  
/*body*/

.cuerpo{
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.contenedor1{
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    align-content: center;
    position: relative;
    /*gap: 5vw;
    margin-top: 20vh;
    margin-bottom: 25vh;
    margin-left: 15vh;
    
    padding: 7vmin 2vmin;
    */
    width: 90%;
}

/*Presentación*/


.presentacion-p{
    display: flex; 
    margin: auto;
    width: 60%;
    text-align: center; 
    background-color: #6fbac2;
}



/* Foto 1 */

.foto-mia-1{
    width: 30%;
}

    
/*Footer*/

.pie{
    position: fixed;
    bottom: 0;
    width: 100vw;
    text-align: center; 
    font-size: 0.8em;
    background-color: #6fbac2
}

