html {
    font-family: "Century", Helvetica, sans-serif;
}

body {
  margin: 0;
}

.main-body {
    margin: 20px;
}

.image-container {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 5px;

}

.hero {
  height: 10vh; /* Takes up 10% of the screen height */
  display: flex;
  flex-direction: row; /* Stacks H1 and P vertically */
  margin: 0 20px;
  justify-content: space-between;
  align-items: center;
  background-size: cover;
  color: black;
  /* text-shadow: 2px 2px 4px rgba(0,0,0,0.5); */ /* Makes text readable over images */
}


hr.fancy-line {
  border: 0;
  height: 3px;
  background-image: linear-gradient(to top, transparent, #747474);
  margin: 5px 0;
}