style.css

@font-face {
  font-family: "Netflix Sans Regular";
  src: url("assets/fonts/NetflixSans_W_Rg.woff2") format("woff2");
}

@font-face {
  font-family: "Netflix Sans Medium";
  src: url("assets/fonts/NetflixSans_W_Md.woff2") format("woff2");
}

#navbar {
  background-color: transparent;
}

#navbar svg {
  width: 100px;
  height: 50px;
  fill: red;
}

#hero {
  height: 600px;
  background-image: url(./assets/img/concord.jpg);
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center center;
}

#hero .inner {
  background-color: transparent;
  color: white;
  font-family: "Netflix Sans Regular";
}

#hero .gradient {
  position: absolute;
  top: 0px;
  left: 0px;
  right: 0px;
  height: 600px;
  background-image: linear-gradient(to top,rgba(0,0,0,.8) 0,rgba(0,0,0,0) 60%,rgba(0,0,0,.8) 100%);
  z-index: 1;
}

#hero .inner .title {
  position:  relative;
  font-size: 50px;
  font-weight: 700;
  line-height: 55px;
  z-index: 5;
}

#hero .inner .subtitle {
  position:  relative;
  font-size:  26px;
  font-weight: 400;
  z-index: 5;
}