@import url('https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300..800;1,300..800&family=Protest+Guerrilla&display=swap');

* {
    margin:0;
    padding: 0;
}

/* Estructura semantica */ 

header {
    width: 60rem;
    background-color: aliceblue;
    margin: auto;

}
section {
    width: 60rem;
    margin: auto;
}
 footer {
    width: 60rem;
    margin: auto;
 }
/* -------------------------------*/

body {
    background-color: rgba(228, 219, 98, 0.411);
    font-family: "Open Sans", sans-serif;
}

h1 {
    color: rgb(226, 107, 43);
    font-family: "Protest Guerrilla", sans-serif;
    font-size: 5rem;

}
footer {
    font-size: 0.6rem;
    background-color: rgb(71, 71, 71);
    color: aliceblue;
}

article {
    background-color: #ccc;
}

article ul {
    display: grid;
    grid-template-columns: auto auto auto;
    justify-content: space-evenly;
}

article ul li img { width: 8rem;
        border-width: 0.2rem;
        border-style: solid;
        border-color: rgb(235, 235, 15);
        border-radius: 4rem;
}

ul {
    list-style-type: none;
    
}
li {
    background-color: brown;
    width: 8rem;
    margin: 1rem;
    padding: 1.5rem;
    border: solid 0.2rem rgb(170, 126, 212);
    

}
nav { background-color: black; color: aliceblue;
height: 4rem;}
nav a { color: #ccc;
    font-size: 1.3rem;
    display: inline;
background-color: brown;
padding: 1rem;
margin: 1rem;
}