*{
  margin: 0px;
  padding: 0px;
  font-family: "Gill Sans", "Gill Sans MT", Calibri, "Trebuchet MS", sans-serif;
}
body{
    background-color: beige;
}
header {
  background-color: black;
  color: white;
  width: 100%;
  height:75px;
}
h1{
    padding-top: 15px;
    text-align: center;
}
li{
    padding-top: 10px;
    padding-left:40px;
    margin-left:40px;
    list-style: decimal;  
}
li:hover{
    transition: calc(0.5s);
  color: darkgoldenrod;  
}
div{
    margin:20px;
    padding-right: 20px;
     width: 30%;
     height:500px;
    border: 0.5px solid black;
   
}
 a {
  text-decoration: none;
  color: black;
}
 a:hover {
  transition: calc(0.5s);
  color: darkgoldenrod;
 }
 @media screen and (max-width: 529px) {
  header{
    height:175px;
  }
  h1{
    padding-top: 35px;
  }
  div{
    width: 70%;
    height: 200px;
  }
}
@media screen and (min-width: 530px) and (max-width: 1248px) {
  header{
    height:90px;
  }
  h1{
    padding-top: 27px;
  }
  div{
    width: 55%;
    height: 250px;
  }
}

@media screen and (min-width: 1249px) {
  header{
  height:70px;
  }
  h1{
    padding-top: 14px;
  }
  div{
    width: 30%;
    height: 200px;
  }

}