section.banner
{
  display: block;
  margin: 50px auto;
  width: 100%;
  max-width: var(--website-wrapper-width);
  padding: 0 var(--website-wrapper-padding);
}

section.banner > article
{
  text-align: left;
  padding: 50px 25% 50px 100px;
  background-color: var(--website-color-primary);
  background-size: cover;
  background-position: center;
  background-blend-mode: multiply;
}

section.banner > article > h2,
section.banner > article > p,
section.banner > article > p a
{
  text-align: left;
  color: white;
}

section.banner > article > p.button
{
  display: inline-block;
  background: white;
}

section.banner > article > p.button a
{
  color: var(--website-color-primary);
  font-size: 0.95em;
  font-weight: 700;
  text-decoration: none !important;
}

section.banner > article > p.button:hover
{
  background-color: var(--website-color-primary-light);
}

section.banner > article > p.button:hover > a
{
  color: white;
}