.hero-view-mode.xlarge .hero-content {
  color: #fff;
  background: black;
  background: rgba(0, 0, 0, 0.7);
}

.hero-view-mode.xlarge .hero-content h3 {
  margin: 0;
  padding: 0;
  color: #fff;
  font-size: calc(1.425rem + 2.1vw);
}

@media (min-width: 1200px) {
  .hero-view-mode.xlarge .hero-content h3 {
    font-size: 3rem;
  }
}

.hero-view-mode.xlarge .hero-content a {
  text-decoration: none;
  color: #fff;
}

.hero-view-mode.xlarge .hero-content:hover,
.hero-view-mode.xlarge .hero-content:focus,
.hero-view-mode.xlarge .hero-content:active {
  opacity: 0.7;
}