#alt-caption {
  position: absolute;
  z-index: 300;
  bottom: 0;
  left: 0;
}

.cycle-slideshow {
  overflow: hidden;
  background-size: cover;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  width: 100%;
  position: initial !important;
}

.cycle-slideshow > a {
  bottom: 0;
  width: 100%;
}

.cycle-slideshow img {
  object-fit: cover;
  height: 100%;
}

.cycle-prev,
.cycle-next {
  background: rgba(var(--c-neutral-lightest), 0.3);
  width: 40px;
  height: 60px;
  position: absolute;
  left: 0;
  top: 50%;
  margin-top: -30px;
  z-index: 300;
  cursor: pointer;
  transition: all 0.3s ease 0s;
  -webkit-transition: all 0.3s ease 0s;
  -moz-transition: all 0.3s ease 0s;
}

.cycle-next {
  left: inherit;
  right: 0;
}

@media (hover: hover) {

  .cycle-prev:hover,
  .cycle-next:hover {
    background: rgba(var(--c-neutral-lightest), 0.7);
  }
}

.cycle-prev-arrow,
.cycle-next-arrow {
  width: 15px;
  height: 25px;
  margin: 18px 13px 0 13px;
}

.cycle-svg {
  fill: none;
  stroke: rgb(var(--c-neutral-lightest));
  stroke-width: 2;
}

.cycle-slideshow #pager {
  position: absolute;
  left: 0;
  z-index: 310;
  line-height: 20px;
  height: 20px;
  bottom: 0;
}

.cycle-slideshow #pager span {
  background: rgba(var(--c-neutral-lightest), 0);
  width: 15px;
  height: 15px;
  border-radius: 15px;
  font-size: 0;
  display: inline-block;
  margin-right: 1rem;
  position: relative;
  cursor: pointer;
}

.cycle-slideshow #pager span.cycle-pager-active,
.cycle-slideshow #pager span:hover {
  background: rgba(var(--c-neutral-lightest), 0.5);
}

.cycle-slideshow #pager span::after {
  top: 4px;
  left: 4px;
  content: '';
  position: absolute;
  width: 7px;
  height: 7px;
  border-radius: 10px;
  background: rgb(var(--c-neutral-lightest));
}

.header__image {
  height: 100%;
  width: 100%;
  overflow: hidden;

  picture {
    height: 100%;
    width: 100%;
  }

  & video {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }

  &::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 100;
    background: rgb(var(--c-neutral));
    mix-blend-mode: multiply;
    opacity: 0.65;
  }

  &.-left {
    & video,
    & img {
      object-position: left center;
    }
  }

  &.-right {
    & video,
    & img {
      object-position: right center;
    }
  }

  &.-top {
    & video,
    & img {
      object-position: center top;
    }
  }

  &.-bottom {
    & video,
    & img {
      object-position: center bottom;
    }
  }

  &.-bottom.-left {
    & video,
    & img {
      object-position: left bottom;
    }
  }

  &.-bottom.-right {
    & video,
    & img {
      object-position: right bottom;
    }
  }

  &.-top.-left {
    & video,
    & img {
      object-position: left top;
    }
  }

  &.-top.-right {
    & video,
    & img {
      object-position: right top;
    }
  }
}

/* =============================================================================
   Media Queries
   ========================================================================== */

@media (min-width: 800px) {
  div.header__text.-bottom {
    display: block;
  }
}

@media (min-width: 1024px) {

  .cycle-prev,
  .cycle-next {
    width: 60px;
    height: 90px;
    margin-top: -45px;
  }

  .cycle-prev-arrow,
  .cycle-next-arrow {
    width: 20px;
    height: 45px;
    margin: 23px 20px 0 20px;
  }

  .cycle-prev-arrow svg,
  .cycle-next-arrow svg {
    enable-background: new 0 0 20.1 40.4;
    width: 20px;
    height: 40px;
  }

  .cycle-slideshow #pager span {
    width: 25px;
    height: 25px;
    border-radius: 15px;
  }

  .cycle-slideshow #pager span::after {
    top: 6px;
    left: 6px;
    width: 12px;
    height: 12px;
  }
}