Tentei ao máximo fazer com que a página ficasse responsiva para os dispositivos....
A única coisa que eu não consegui deixar suficientemente responsivo foi o "menu" que em algumas resoluções de tela, insistiam em fica em duas linhas.
Mas o restante, ficou bem mais responsivo do que eu imaginava! :D
@media screen and (max-width: 915px) {
.caixa, .principal, .conteudo-beneficios, .mapa-conteudo, .video {
width: auto;
margin: 1.5% 1.5%;
}
h1 {
text-align: center;
}
nav {
position: static;
}
.lista-beneficios, .imagem-beneficios, .produtos, .produtos li, li img, form, .enviar, table {
width: 97%;
margin: 1.5% 1.5%;
}
}
Se alguém souber como ajustar esse único detalhe, eu agradeço!