.hero-image {
  background-image: url("/images/socialmedia2.png"); /* The image used */
  background-color: #cccccc; /* Used if the image is unavailable */
  height: calc(100vw / 2); /* You must set a specified height */
  max-height: 450px;
  background-position: left; /* Center the image */
  background-repeat: no-repeat; /* Do not repeat the image */
  background-size: cover; /* Resize the background image to cover the entire container */
}

.project-video {
  width: 100%;
  height: calc(100vw / 2);
  max-height: 500px;
}