/* Homepage slider */
.homepage-slider {
  height: 270px;
  background-color: #484545;
}

.homepage-slider__track,
.homepage-slider__list {
  height: 100%;
}

.homepage-slider__slide {
  height: 100%;
  overflow: hidden;
}

@media screen and (min-width: 992px) {
  .homepage-slider .splide__slide {
    opacity: .5;
    transition: opacity ease-in-out .1s;
  }

  .homepage-slider .splide__slide.is-visible {
    opacity: 1;
  }
}

.homepage-slider__slide .homepage-slider__link {
  display: block;
  height: 100%;
}

.homepage-slider__slide .homepage-slider__content {
  display: flex;
  flex-direction: column;
  height: 100%;
}

.homepage-slider__slide .homepage-slider__header {
  flex: 0 0 70%;
  max-height: 70%;
}

@media screen and (min-width: 576px) {
  .homepage-slider__slide .homepage-slider__header {
    flex: 0 0 60%;
    max-height: 60%;
  } 
}

@media screen and (min-width: 992px) {
  .homepage-slider__slide .homepage-slider__header {
    flex: 0 0 70%;
    max-height: 70%;
  } 
}

.homepage-slider__slide .homepage-slider__thumbnail {
  position: relative;
  height: 100%;
  overflow: hidden;
}

.homepage-slider__slide .homepage-slider__thumbnail img {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
}

@media screen and (min-width: 576px) {
  .homepage-slider__slide .homepage-slider__thumbnail img {
    width: auto;
    height: 100%;
  }
}

.homepage-slider__slide .homepage-slider__body {
  flex: 0 0 30%;
  max-height: 30%;
}

@media screen and (min-width: 576px) {
  .homepage-slider__slide .homepage-slider__body {
    flex: 0 0 40%;
    max-height: 40%;
  }
}

@media screen and (min-width: 992px) {
  .homepage-slider__slide .homepage-slider__body {
    flex: 0 0 30%;
    max-height: 30%;
  }
}

.homepage-slider__slide .homepage-slider__title {
  box-sizing: border-box;
  height: 100%;
  padding: 5px 10px;
  color: #FFFFFF;
}

.homepage-slider .splide__arrow {
  height: 3em;
  width: 3em;
  opacity: 1;
  background-color: #66aad1;
  transition: opacity ease-in-out .3s;
}

.homepage-slider .splide__arrow:hover {
  opacity: .8;
}

.homepage-slider .splide__arrow svg path {
  fill: #FFFFFF;
}

.scroll-nav {display: none;}