html, body {
    padding: 40px;
 }

 body {
     display: grid;
     grid-template-rows: .1fr .30fr .60fr .05fr;
     grid-template-columns: 1fr;
     grid-template-areas: "header" "main" "map" "footer";
     justify-content: center;
     background-color:rgb(248, 244, 196);
     border-color: teal;
     border-style: solid;
     font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;

 }

 .header {
    justify-content: center;
    text-align: center;
    color:teal; }
    
.main {
    display: grid;
    grid-area: main;
    justify-content: center;

}
.row {
    display: flex;
  }
  
  .column {
    flex: 50%;
  }

#map {
    grid-area: map;
    height: 80vh;
}

#footer {
    grid-area: footer;
}