.home-page {
  line-height: 1.3;
  color: white;
  background: -webkit-gradient(
      linear,
      left top,
      right top,
      from(rgba(0, 0, 0, 0.6)),
      to(rgba(0, 0, 0, 0.6))
    ),
    url("../images/cover.jpg");
  background: -o-linear-gradient(left, rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.6)),
    url("../images/cover.jpg");
  background: linear-gradient(to right, rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.6)),
    url("../images/cover.jpg");
  background-position: bottom right;
  height: 115vh;
  -webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 0 87%);
  clip-path: polygon(0 0, 100% 0, 100% 100%, 0 87%);
  text-shadow: 1px 1px 2px #0a1316;
}

.home-page-content {
  padding: 0 10vw 0 15vw;
  animation: 500ms ease-out 0s 1 slideUp;
}

.home-page h1 {
  font-size: 53px;
  padding-top: 35vh;
  text-transform: uppercase;
  letter-spacing: 0.02rem;
}

.line {
  height: 6px;
  background-color: #03cc85;
  margin: 2px 0 14px;
  width: 30%;
}

@media (min-width: 470px) {
  .home-page {
    background-attachment: fixed;
  }
}

@media (min-width: 768px) {
  .line {
    width: 15%;
  }
  .home-page h1 {
    font-size: 70px;
  }
  .home-page p {
    font-size: 21.5px;
  }
}

@media (min-width: 1200px) {
  .home-page h1 {
    font-size: 90px;
    padding-top: 40vh;
  }
  .home-page p {
    font-size: 27.5px;
  }
}

@keyframes slideUp {
  0% {
    transform: translateY(50px);
    opacity: 0;
  }
  100% {
    transform: translateY(0);
    opacity: 1;
  }
}
