body {
  background-color: #005500;
  font-family: 'Helvetica Neue', Helvetica, sans-serif;
  font-size: 18px;
  color: black;
  max-width: 1024px;
  margin: auto;
}

a, a:visited {
  color: #001000;
  font-weight: 800;
}

h1 {
  text-align: center;
  font-size: 38px;
}

.hero {
  margin: 10vh 0 5vh 0;
  text-align: center;
}

.hero img {
  max-width: 400px;
  width: 85vw;
}

article {
  padding: 0 20px;
  text-align: justify;
}

article p {
  max-width: 600px;
  margin: auto;
}

footer {
  margin: 100px 0 0 0;
  text-align: center;
  font-size: 14px;
}

@media(min-width: 400px) {
  h1 {
    font-size: 48px;
  }
}

@media(min-width: 500px) {
  body {
    font-size: 22px;
  }
}

@media(min-width: 900px) {
  article {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
  }

  h1 {
    position: relative;
    top: 55px;
  }
}