/*general*/
*{
    box-sizing: border-box;
    
}
#container{
    margin: auto;
    max-width: 1300px;
    width: 95%;
}

/*color de fondo*/
h1, article{
    background-color: rgb(240, 240, 240);
}
main>article, footer{
    background-color: rgb(205, 205, 205);
}

/*links*/
a{
    font-family: "Nunito Sans", Helvetica, Arial, sans-serif;
    font-size: 0.75rem;
    border: 1px solid black;
    padding: 0.3rem 0.5rem;
    margin: 0.5rem 0.5rem 0.5rem 0rem;
    text-decoration: none;
}
a:link, a:visited{
    color: rgb(0, 0, 0);
}
/*En el momento de separar a:link de a:visited, se sobreescriba uno sobre el otro y no funcionaba 
como tocaría. Decidimos dejarlos juntos, aunque eso suponga que mantengan el mismo color.*/
a:hover, a:active{
    color:rgb(115, 0, 255);
}

/*estructura & flexbox*/
nav{
    margin: 0rem 0rem 0.6rem 0rem;
}
/*En el caso de poner "margin-top" en el "article" del "main" (con esto=margin: 0rem 0rem 0.6rem), no genera 
un resultado satisfactorio, asique por eso nox hemos decantado por generarlo a partir del selector "nav".*/
article{
    margin: 0.4rem 0rem;
    overflow: hidden;
    max-width: 620px;
}
/*si no poníamos este valor de width/max-width, no mostraba la separación del gap entre elemementos. 
Hemos decidido dejar esta medida máxima para que no se junte más a partir de esos píxeles.*/
main>article{
    width: 100%;
    max-width: 1366px;
}
main>div{
    display: flex;
    align-items: stretch;
    justify-content: space-between;
    row-gap: 1rem;
    clear: both;
}
img{
    max-width: 100%;
    height: auto;
    padding: 0rem 0.9rem 0rem 0.625rem;    
}
#unico img{
    float: left;
    margin: 0rem;
}

/*texto*/
h1, h2, p, footer{
    font-family: "Nunito Sans", Helvetica, Arial, sans-serif;
}
h1{
    font-size: 1.7rem;
    font-weight: 800;
    padding: 0.6rem 1rem 0.6rem;
}
h2{
    font-size: 1.05rem;
    font-weight: 800;
    padding: 0rem 0rem 0rem 0.625rem;
    margin: 0.7rem 0.5rem 0.3rem 0rem;
}
p{
    font-size: 0.72rem;
    padding: 0rem 0.625rem 0.625rem;
}
footer{
    font-size: 0.72rem;
    text-align: center;
    padding: 0.01rem 0rem 0rem;
    margin: 0.3rem 0rem;
}


