body{
  grid-row-start: 1;
  grid-row-end: 8;
  grid-column-start: 1;
  grid-column-end: 8;
}
section:nth-child(n){
border:2px solid black;

  grid-column-start: 3;
  grid-column-end: 7;
  display: block;
  margin-top: 5%;
  margin-bottom: 5%;
padding: 10px;
background: linear-gradient(to top, gray, white);
}
p{
width: 100%;

}
footer{
  background-color:rgba(44,39,39,0.80)
  grid-row-start: auto;
  grid-row-end: auto;
  grid-column-start: 1;
  grid-column-end: 9;
position:inherit;

border-top:2px solid black;
padding-top:10px
}
img{
float: right;
}
header{
  
  grid-row-start: 1;
  grid-row-end: 2;
  grid-column-start: 2;
  text-align:center;
  grid-column-end: 8;
  padding: 10px;
  font: 20px trebuchet ms, sans-serif;
  text-shadow: 0.5px 0.75px #333333;
}
nav{
  background-color: rgba(180, 17, 172, 0.3);
  grid-row-start: 2;
  grid-row-end: 4;
  grid-column-start: 2;
  grid-column-end: 8;
  padding: 3px;
    align-items: center;
  justify-content: space-between;
  padding: 1em;
  background-color: white;
}

m{
border:2px dotted gray;

  grid-column-start: 2;
  grid-column-end: 8;
  display: block;
  margin-top: 5%;
  margin-bottom: 5%;
padding: 10px;
  background-color: #D3D3D3;
text-align: center;
font: 20px Roboto;
}
#bottom{
margin: 2px;
}
#wrapper{
  display:grid;
  grid-auto-rows: minmax(0px, auto);
  grid-template-columns:minmax(0px, 1fr) repeat(6, minmax(0, 175px)) minmax(0px, 1fr);
background: linear-gradient(to top, gray, white);
}
.navbar {
overflow: hidden;
background-color: #333333;
font-family: Arial;
}
.navbar a {
float: left;
font-size: 16px;
color: white;
text-align: center;
padding: 14px 16px;
text-decoration: none;
}
.navbar a:hover{
background-color: red;
}
@media only screen and (max-width: 992px) {
#wrapper{
    grid-template-columns:minmax(0px, 1fr) repeat(6, minmax(0, 128px)) minmax(0px, 1fr);
}

}
@media only screen and (max-width: 768px) {
#wrapper{
    grid-template-columns: 0 repeat(6, minmax(0, %16.66)) 0
}

}