@media screen and (max-width: 600px) {
    .content {
        grid-template-columns: auto;
    }


    
    .content .title {
        margin: auto;
    }



    .content .caracteristicas {
        margin: auto;
    }
}

@media screen and (max-width: 760px) {
    div.structure {
        grid-template-columns: 1fr;
        grid-template-areas: 
            "header"
            "sidenav"
            "content"
            "anuncios"
            "footer"
        ;
    }



    .header {
        grid-template-columns: auto;
        justify-content: center;
    }

    .header .logo {
        margin-bottom: 20px;
    }

    .header nav ul li + li {
        margin-left: 10px;
    }

    .header nav ul li a {
        font-size: 1em;
    }



    .sidenav {
        position: relative;
        padding: 0 30px;
        overflow-x: auto; /* O overflow indica o que estoura o container é o auto indica para colocar uma barra de rolagem */
    }

    .sidenav::before {
        content: '→';
        position: absolute;
        top: 5px;
        right: 30px;
        color: rgba(0, 0, 0, .3);
        animation: arrow .5s ease-in 0s infinite alternate;
    }

    @keyframes arrow {
        from {
            right: 30px;
        }

        to {
            right: 20px;
        }
    }


    .sidenav ul {
        display: flex;
    }

    .sidenav ul li {
        flex: 1 0 60px;
    }

    .sidenav ul li a {
        width: 100px;
        margin: 30px 30px 30px 0;
    }
}

@media screen and (max-width: 1200px) {
    .structure {
        /* grid-template-columns: minmax(160px, 1fr) 3fr;
        grid-template-areas: 
            "header header"
            "sidenav content"
            "sidenav anuncios"
            "footer footer"
        ; */

        grid: /* Atalho para o código de cima */
            "header header"
            "sidenav content"
            "sidenav anuncios"
            "footer footer"
            / minmax(160px, 1fr) 3fr
        ;
    }
}