#container{
  max-width: 600px;
}

body{
  font-family: MS Gothic; 
  font-size: 15px;
  background: #f7fff2;
  margin-left: 50px;
  margin-bottom: 100px;
}

hr{
  border: 1px dashed grey;
  margin-bottom: 25px;
  margin-top: 25px;
}

h1{
   color: white;
    text-shadow:
    -1px -1px 0 #000,
    1px -1px 0 #000,
    -1px 1px 0 #000,
    2px 2px 0 #000; 
}

#navbar ul{
  display: flex;
  list-style-type: none;
  justify-content: left;
  padding: 0;
}

#navbar li {
margin-right: 25px;
}

a{
  color: #004700;
  text-decoration: none;
}

a:hover{
 text-decoration: underline;
}

@media only screen and (max-width: 500px) {
  body{
    margin: 10px 10px 50px 10px;
  }
  
  #navbar ul{
    justify-content:center;
    flex-wrap: wrap;
  }
}