* {
    box-sizing: border-box;
}

:root  {
    --color0: #e8ec0b;
    --color1: #f9e93a81;
    --color2: #f3e760;
    --color3: #fcf8d6;
    --color4: #f8f7e6;
    --letras1: black;
}

body {
    padding: 0px;
    margin: 0px;
    font-family: Arial, Helvetica, sans-serif;
    background-color: var(--color4);
}

header {
    display: grid;
    grid-template-columns: 20% 80%;
    background-color: var(--color0);
}

header img {
    max-width: 100%;
}
header nav ul {
    list-style: none;
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    margin-top: 100px;
}
header nav ul li a {
    text-decoration: none;
    color: var(--letras1);
    font-size: 1.4em;
}
header nav ul li a:hover {
    background-color: var(--color2);
}
main {
    display: grid;
    grid-template-columns: 80% 20%;
}

main div {
    display: grid;
    grid-template-rows: auto auto auto;
    gap: 5px;
}
main fieldset {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    max-height: 30px;
    padding: 0px;
}
main fieldset form {
    margin: 1px solid black;
}
main fieldset button {
    text-align: center;
    margin: 1px solid black;
}
main>div>section {
    display: grid;
    grid-template-columns: 1fr 1fr;
    max-width: 100%;
}
main div section article {
    max-width: 100%;
    max-height: 100%;
}
main section article div {
    padding: 10px;
}
main section article div img {
    max-width: 100%;
    max-height: 60%;
}

aside {
    background-color: var(--letras1);
    color: var(--color3);
    max-width: 100%;
    max-height: 100%;
    padding: 0px;
    margin: 0px;
}
aside nav ul {
    list-style: none;
    text-align: center;
    margin-top: 200px;
}
aside nav ul li {
    padding: 10px;
    font-size: 1.2em;
    margin: 20px;
    max-height: 100%;
}
aside nav ul li a {
    color: var(--color4);
    text-decoration: none;
}
aside nav ul li a:hover {
    color: var(--color2);
}

footer {
    background-color: var(--color0);
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
}
footer ul {
    list-style: none;
}
footer ul li {
    padding: 10px;
    text-align: center;
}
footer ul li a {
    text-decoration: none;
    color: var(--letras1);
    font-size: 0,8em;
}
footer ul li a:hover {
    color: var(--color4);
    text-decoration: underline;
}
footer ul li p {
    font-size: 0.8em;
}
footer>:last-child {
    margin-top: 50px;
}
footer>:first-child {
    margin-top: 70px;
}
footer div {
    text-align: center;
}
footer div img {
    max-width: 60%;
    margin-top: 100px;
}
a {
    margin: auto;
    margin-top: 10px;
    margin-bottom: 10px;
    padding: 5;
    background-color: var(--color0);
    color: var(--letras1);
}