/* fuentes importadas*/
@import url('https://fonts.googleapis.com/css2?family=Roboto+Slab&display=swap'); 
@import url('https://fonts.googleapis.com/css2? family= Roboto+Slab & family= Sansita+Swashed:wght@300 & display=swap');
@import url('https://fonts.googleapis.com/css2?family=Arvo&display=swap');

* { 
color: brown;
background-color: black;
font-family: 'Roboto Slab', serif; 
width: 100%;
}

body{
    margin: 0;
}

header {
    background-color: #77215d;
    text-align: center;
    color: rosybrown;
    font-size: xx-large;
    margin-bottom: 0.5cm;
    font-family: 'Arvo', serif;
    width: 100%;
    position: fixed;
    top: 0;
}

/* diseño del nav*/
h1 {
font-size: 50px;
text-align: center;
color:#c22a44;
}

/* organización textos e imagen*/
.presentación{
    width: 57vw;
    display: flex;
    margin: auto; /*margen exterior*/
    align-items: center;
    justify-content: space-between;
    border-style: dashed; 
    border-color:#77215d; 
    }

.primer_parrafo {
    font-family: 'Sansita Swashed', cursive; 
    color: #77215d;
    font-size: 20px;
    margin-bottom: 0.5cm;
}

.segundo_parrafo {
    font-family: 'Sansita Swashed', cursive;
    color: #77215d;
    font-size: 20px;
    margin-top: 0.5cm;
}

.tercer_parrafo {
    font-family: 'Sansita Swashed', cursive;
    color: #77215d;
    font-size: 20px;
    margin-top: 0.5cm;
}

.foto{
    width:40%; 
    display: flex;
}

.texto{
    width: 40%;
}

.pie{
    text-align: center;
    background-color: #77215d;
    color: rosybrown;
    font-size: xx-large;
    margin-top: 1cm;
    font-family: 'Arvo', serif;
    width: 100%;
    position: fixed;
    bottom: 0;
}