[Projeto] Desafio página produtos e contato responsivas.

Em ambas as páginas eu tive uma certa dificuldade para em fim conseguir, mas na de produtos eu bati cabeça bem mais. Não sei se no espaçamento fiz o que de fato era pra ser feito, mas no resultado final ficou bom. Segue meu código: Ps: As vezes dá um bug no layout da página de produtos e fica tudo desconfigurado de novo, mas só cliquei em outra aba e voltei e estava tudo normal, não entendi o que aconteceu.

@media screen and (max-width: 480px) {
    .caixa, .principal, .conteudo-beneficios, .mapa-conteudo, .video {
        width: auto;
    }

    h1 {
        text-align: center;
    }

    nav{
        position: static;
        text-align: center;
    }

    .lista-beneficios, .imagembeneficios{
        width: 100%;
        margin-bottom: 30px;
    }

    form {
        text-align: center;
    }

    .input-padrao{
    margin: 1em auto;
    }

    table{
        margin: 2em auto;
    }

    .produtos{
        width: auto;
    }

    .produtos li {
        display: block;
        width: 80%;
        margin: 0 10% 30px;
    }
}