.hero {
  height: 500px;
  display: flex;
  justify-content: center;
  align-items: end;
  margin-top: 2rem;
}

.hero-home-caption {
  background: #FFF;
  opacity: 0;
  display: flex;
  justify-content: end;
  align-content: center;
  width: 100%;
}

.hero-caption-text {
  padding: 4px 40px;
  font-style: italic;
  margin-bottom: 0;
}

.hero-home:hover .hero-home-caption {
  opacity: 0.9;
  text-align: justify;
  color: #000000;
}

@media (min-width: 1200px) {
  .hero {
    margin-left: auto;
    margin-right: auto;
    width: 1200px;
    /*height: 200px;*/
  }
}

@media (min-width: 768px) {
  .hero.hero-home {
    height: 500px;
  }
}

@media (min-width: 902px) {
  .hero.hero-home {
    height: 700px;
  }
}

@media (min-width: 1200px) {
  .hero.hero-home {
    height: 900px;
    max-width: 1400px;
  }
}

.hero-index-url {
  background-image: url("../../assets/img/new-york-times-image.webp");
}

.resources-image-url {
  background-image: url("../../assets/img/Harry-Belafonte-tease.jpg");
}

.legacy-image-url {
  background-image: url("../../assets/img/BlacKkKlansman.webp");
}

.enjoy-image-url {
  background-image: url("../../assets/img/whistle.webp");
  background-position: top;
}

.community-betty-url {
  background-image: url("../../assets/img/betty-onstage-screenshot.webp");
  background-position: top;
}

.community-paul-url {
  background-image: url("../../assets/img/paul-books.jpg");
  background-position: top;
}

.community-sharon-url {
  background-image: url("../../assets/img/CTV-photos.webp");
  background-position: right!important;
}

.community-judy-url {
  background-image: url("../../assets/img/judy/wow.webp");
  background-position: center;
}

.community-tiziano-url {
  background: url("../../assets/img/tiziano_and_all_1976.webp") top / cover;
}

.community-ake-url {
  background: url("../../assets/img/Globen-2003-March%206.webp") top / cover;
}

.community-home-url {
  background: url("../../assets/img/quebec.webp") top / cover;
}

.hero-comments-url {
  background: url("../../assets/img/legacy-cropped.webp") center / cover;
}

.hero-background-image {
  background-repeat: no-repeat;
  background-position: 30%;
  background-size: cover;
  top: 100%;
}