html{
  background-color: black;
  font-family: "helvetica neue", sans-serif;
}
body {
  margin-left:100px;
  margin-right: 175px;
}
.content {
  margin-left:475;
}
h1 {
  color:red;
  font-size: 28pt;
  text-align:center;
}
h2 {
  color:white;
  font-size: 18pt;
  font-weight:bold;
  text-align: center;
}
h3 {
  color:rgb(167, 4, 4);
  font-size: 18pt;
  margin-bottom: 4px;
}

a {
  color:white;
}

a:hover{
  color: rgb(206, 0, 0)
}
p {
  color:white;
  font-size:12pt;
  font-weight:normal;
  margin: 2px;
}
img{
  width: 30%;
  height: auto;
  padding-left: 10px;
}

 /* Add media queries for responsiveness - when the screen is 500px wide or less, stack the links on top of each other */ 
 @media screen and (max-width: 1100px) {
  body {
    margin-left:10px;
    margin-right: 10px;
  }
 }
 @media screen and (max-width: 805px) {
  .content {
      margin-left:150px;
      margin-top:-150px
  }
  
}