@charset "UTF-8";

/*
  Hero slider, powered by Swiper (https://swiperjs.com) instead of the
  original Slider Revolution plugin. Reuses .revolution-slider-container
  and .slider-content-box from style.css so the look stays consistent;
  this file only adds what Swiper's own markup needs.
*/

.hero-slider {
  position: relative;
  height: 600px;
}

.hero-slider .swiper-slide {
  height: 600px;
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
  display: flex;
  align-items: center;
}

.hero-slider .swiper-pagination {
  z-index: 10;
}

/* the announcement banner right after the slider had a lot of top padding
   left over from the old layout; trim it so the slider and the page below
   it sit closer together */
.hero-slider + .theme-page .announcement {
  padding-top: 10px;
}

.hero-slider .slider-content-box {
  margin-left: 6%;
}

.hero-slider .swiper-pagination-bullet {
  background: #fff;
  opacity: 0.7;
}

.hero-slider .swiper-pagination-bullet-active {
  background: #2c79c1;
  opacity: 1;
}

.hero-slider .swiper-button-prev,
.hero-slider .swiper-button-next {
  color: #2c79c1;
}

.hero-slider .swiper-button-prev:after,
.hero-slider .swiper-button-next:after {
  font-size: 24px;
}

@media (max-width: 767px) {
  .hero-slider {
    height: 420px;
  }
  .hero-slider .swiper-slide {
    height: 420px;
  }
  .hero-slider .slider-content-box {
    width: 90%;
    margin-left: 5%;
  }
}