body {
 text-align: center; 
}

.container {
  display: grid;
  grid-template-columns: 1fr 3fr 1fr;
  grid-template-rows: 1fr 4fr 1fr;
  grid-template-areas: 
    'menu menu menu'
    'lateral-esquerda conteudo-principal lateral-direita'
    'rodape rodape rodape';
  font-family: Sans-serif;
  color: #ffffff;
  height: 700px;
}

.menu {
  background-color: #283149;
  grid-area: menu;
}

.lateral-esquerda {
  background-color: #00818a;
  grid-area: lateral-esquerda;
}

.lateral-direita {
  background-color: #00818a;
  grid-area: lateral-direita;
}

.conteudo-principal {
  background-color: #404b69;
  grid-area: conteudo-principal;
}

.rodape {
  background-color: #283149;
  grid-area: rodape;
}

@media only screen and (max-width: 700px) {
  .container {
    
  }
}

@media only screen and (max-width: 500px) {
  .container {
    
  }
}