Como mostrado na aula, removi a centralização da tag main e adicionei aos elementos separadamente.
.principal{
padding: 2em 0;
font-size: 20px;
width: 940px;
margin: 0 auto;
}.mapa{
padding: 2em 0;
width: 940px;
margin: 0 auto;
}Porem, inseri o background na tag main
main{
background: linear-gradient(white,dimgray);
padding: 0 0 2em;
}Não precisei criar uma div para o mapa. Testei com outras cores e funcionou perfeitamente. PS: o padding eu coloquei para "colar" a cor de background ao rodapé.
