body,
html {
  height: 100%;
  margin: 0;
}

.hero-image {
  height: 100%;

  background-image: url("background.jpg");
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  position: relative;
}

.hero-text {
  text-align: center;
  position: absolute;
  top: 35%;
  left: 50%;
  transform: translate(-50%, -50%);
  color: rgb(70, 50, 23);
  font-size: xx-large;
  font-family: "Franklin Gothic Medium", "Arial Narrow", Arial, sans-serif;

  h1 {
    text-transform: uppercase;
  }

  a {
    font-size: x-large;
    color: rgb(24, 70, 50);
  }  

  p {
    text-shadow: 0 0 2px #ffffff;
  }
}

img {
  width: 356px;
  height: 208px;
}