#project {
  background:
    /* top, transparent black, faked with gradient */ linear-gradient(
      rgba(0, 0, 0, 0.6),
      rgba(0, 0, 0, 0.3),
      rgba(0, 0, 0, 0.9)
    ),
    /* bottom, image */
      url("https://b-737.github.io/houdtvanoud/resources/images/meet.sm.jpg");
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
}

@media (min-width: 992px) {

  #project-hero{
    margin-top: 4rem;
  }

  #project {
    background:
            /* top, transparent black, faked with gradient */ linear-gradient(
        rgba(0, 0, 0, 0.6),
        rgba(0, 0, 0, 0.3),
        rgba(0, 0, 0, 0.6)
      ),
      /* bottom, image */
        url("https://b-737.github.io/houdtvanoud/resources/images/meet-lg.jpg");
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
    /* background-position: center; */
  }

  .project img{
    max-height: 600px;
    object-fit: cover;
  }
}

.card-img-top {
  height: 15rem;
  object-fit: cover;
}