@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@100;400;700&display=swap');

header {
    width: 90%;
    padding: 1rem;
    display: flex;
    justify-content: space-between;
    margin: 1rem;
}

header nav ul {
    font-family: "Roboto", sans-serif;
    font-weight: 100;
    font-size: 1rem;
    list-style-position: inside;
    display: flex;
    padding: 0;
}

header nav ul li {
    padding: 0 0.5rem;
}

header nav ul li:first-child {
    margin-left: 0;
}

a {
    text-decoration: none;
    color: black;
    justify-content: space-between;
    list-style-type: none;
}

a:hover {
    color: rgb(0, 82, 27);
}

section {
    width: 90%;
    display: flex;
    justify-content: space-between;
    padding: 2%;
}

section article {
    padding: 1rem;
    margin: 1rem;
    width: 70%;
}

section article figure {
    background: rgb(0, 82, 27);
}

section figure {
    display: flex;
}

figure {
    display: block;
    margin-block-start: 1rem;
    margin-block-end: 1rem;
    margin-inline-start: 40px;
    margin-inline-end: 40px;
}

section figure img {
    width: 50%;
}

section figure figcaption {
    color: aliceblue;
    align-self: center;
    text-align: center;
    width: 50%;
    font-family: "Roboto", sans-serif;
    font-weight: 100;
    font-size: 1rem;
}

section article h1 {
    font-family: "Roboto", sans-serif;
    font-weight: 700;
    font-size: 2rem;
    color: rgb(0, 82, 27);
    margin: 1rem;
}

section article ol {
    margin: 2%;
    font-family: "Roboto", sans-serif;
    font-weight: 400;
    font-size: 1rem;
}

ul {
    font-family: "Roboto", sans-serif;
    font-weight: 100;
    font-size: 1rem;
    list-style-type: none;
}

section aside {
    margin: 1%;
    padding: 0%;
    display: block;
}

section aside h2 {
    font-family: "Roboto", sans-serif;
    font-weight: 700;
    font-size: 1.5rem;
    color: rgb(0, 82, 27);
    display: block;
}

img {
    overflow-clip-margin: content-box;
    overflow: clip;
    display: flex;
    justify-content: center;
    unicode-bidi: isolate;
}

footer {
    background: url(../img/fresas.webp);
    width: 100%;
    height: 10rem;
    background-size: cover;
}

footer p {
    text-align: center;
    font-family: "Roboto", sans-serif;
    font-weight: 700;
    font-size: 1rem;
    color: aliceblue;
    padding: 4rem;
}

.logodesktop {
    display: block;
}

.logomobile {
    display: none;
}

@media (max-width: 40rem) {
    body {
        background: rgb(191, 239, 165);
    }

    .logodekstop {
        display: none;
    }

    .logomobile {
        display: block;
        margin: auto;
    }

    .menutop {
        display: none;
    }

    section aside {
        margin: 0 auto;
        padding: 1rem;
        width: 20rem;
        background-color: rgb(6, 61, 5);
        color: aliceblue;
        border-radius: 0.5rem;
    }

    section article {
        padding: 1rem;
        margin: 1rem;
    }

    section {
        display: block;
    }
}