html, body {
    padding: 5px;
 }

 h1 {
	font-family: Arial, Helvetica, sans-serif;
	color: darkslategrey;
    font-size: 60px;
    grid-column-start: 2;
    grid-column-end: 8;
    justify-content: left;
    line-height: 135%;
    font-weight: bold;
    margin-right: 100px;
}

h2 {
	font-family: Arial, Helvetica, sans-serif;
	color: rgb(56, 156, 151);
    font-size: 60px;
    margin-left: 30%;
    margin-right: 30%;
    line-height: 135%;
    font-weight: bold;
    justify-content: center;
    text-align: center;
}

img {  
    width: 500px;  
    grid-column-start: 1;
    grid-column-end: 1;
    height: auto;  
    justify-content: right;
    margin-left: 100px;
    }  

p {
	font-family: Georgia, 'Times New Roman', Times, serif;
    font-weight: lighter;
	color: darkslategrey;
    font-size: 24px;
    text-align: left;
    margin-left: 20%;
    margin-right: 20%;
    line-height: 200%;
    
}

ul {
    font-family: Georgia, 'Times New Roman', Times, serif;
    font-weight: lighter;
	color: darkslategrey;
    font-size: 24px;
    text-align: left;
    margin-left: 30%;
    margin-right: 20%;
    line-height: 200%; 
}

 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(250, 250, 250);
 }

 header {
    grid-area: header;
    display: grid;
    grid-template-columns: .2fr .6fr .2fr;
    background-color:rgb(250, 250, 250);
 }

.main {
    display: grid;
    background-color:rgb(250, 250, 250);
}

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

#footer {
    grid-area: footer;
}