/**
 * Swiper Custom Styles
 * - Top slideshow navigation & pagination
 */

/* ============================
   Top Slideshow - Navigation Arrows
   White circle background + #5391d7 arrow, 70% opacity
   ============================ */
.top-swiper .swiper-button-prev,
.top-swiper .swiper-button-next {
	width: 28px;
	height: 28px;
	margin-top: -14px;
	background: rgba(255, 255, 255, 0.7);
	border-radius: 50%;
	opacity: 0.7;
}
.top-swiper .swiper-button-prev:hover,
.top-swiper .swiper-button-next:hover {
	opacity: 1;
}
/* Hide Swiper default arrow icon (v12: SVG element) */
.top-swiper .swiper-button-prev svg,
.top-swiper .swiper-button-next svg {
	display: none;
}
/* Arrow via pseudo-element */
.top-swiper .swiper-button-prev::after,
.top-swiper .swiper-button-next::after {
	content: '';
	display: block;
	width: 8px;
	height: 8px;
	border-right: 2px solid #5391d7;
	border-bottom: 2px solid #5391d7;
}
.top-swiper .swiper-button-prev::after {
	transform: rotate(135deg);
	margin-left: 2px;
}
.top-swiper .swiper-button-next::after {
	transform: rotate(-45deg);
	margin-right: 2px;
}
.top-swiper .swiper-button-prev {
	left: 10px;
}
.top-swiper .swiper-button-next {
	right: 10px;
}

/* ============================
   Top Slideshow - Pagination below image
   ============================ */
.top-swiper {
	padding-bottom: 25px;
}
.top-swiper .swiper-pagination {
	bottom: 0;
	top: auto;
}
.top-swiper .swiper-pagination-bullet {
	background: #999;
	opacity: 0.5;
}
.top-swiper .swiper-pagination-bullet-active {
	background: #5391d7;
	opacity: 1;
}
