/*
	README

	Modify this file as much or as little as needed.

	This file is shared across all CCL widgets in the Header Slideshow family. This enables the ability to
	a family of widgets in a single update without touching the structure of the widget and without needing
	to duplicate efforts across several widget-specific CSS files.
*/
.slideshow-container {
	/* width: 100%;
	height: auto;
	aspect-ratio: 1903/860; */
}

.ccl-widget.core-hero-slideshow {
	margin-bottom: 15px;
}

.ccl-widget.core-hero-slideshow .slide .img-cont::after {
	content: none;
}
.ccl-widget.core-hero-slideshow .content-section {
	bottom: 50%;
	left: 50%;
	transform: translate(-50%,50%) !important;
	text-align: center;
}
.ccl-widget.core-hero-slideshow .slide-title,
.ccl-widget.core-hero-slideshow .slide-title a {
	text-transform: uppercase;
	font-weight: 800;
	width: 100%;
	line-height: 1em;
	font-size: 26px;
}
.ccl-widget.core-hero-slideshow .slide-title:hover,
.ccl-widget.core-hero-slideshow .slide-title a:hover {
	text-decoration: none;
	color: white;
}

.ccl-widget.core-hero-slideshow .arrows .arrow-cont {
	display: block;
	position: absolute;
	z-index: 10;
	bottom: auto;
	top: 0;
	left: auto;
	width: 100%;
	height: 100%;
	pointer-events: none;
	overflow: hidden;
}
.ccl-widget.core-hero-slideshow .arrows .arrow-cont .custom-arrow {
	top: 50%;
	transform: translateY(-50%) !important;
	position: absolute !important;
	background: none;
	box-shadow: none;
}
.ccl-widget.core-hero-slideshow .arrows .arrow-cont .custom-arrow.prev {
	left: 20px;
}
.ccl-widget.core-hero-slideshow .arrows .arrow-cont .custom-arrow.next {
	right: 20px;
}

.ccl-widget.core-hero-slideshow .arrows .arrow-cont .custom-arrow img {
	width: 26px;
}

.ccl-widget.core-hero-slideshow .arrows .arrow-cont .custom-arrow.next img {
	transform: rotate(180deg);

}

.ccl-widget.core-hero-slideshow .img-cont img{
	min-height: 401px;
	width: 100%;
	height: auto;
	aspect-ratio: 343/429;
}

.ccl-widget.core-hero-slideshow .img-cont.preserve-aspect-ratio {
	height: fit-content;
	padding-bottom: 0;
}
.ccl-widget.core-hero-slideshow .img-cont.preserve-aspect-ratio img {
	aspect-ratio: unset;
}

@media (min-width: 40em) {
	.ccl-widget.core-hero-slideshow .content-section {
		left: 60px;
		transform: translateY(50%) !important;
		text-align: left;
	}
	.ccl-widget.core-hero-slideshow .slide-title,
	.ccl-widget.core-hero-slideshow .slide-title a {
		font-size: calc(26px + (60 - 26) * ((100vw - 640px) / (1024 - 640)));
	}

	.ccl-widget.core-hero-slideshow .img-cont img{
		width: 100%;
		height: auto;
		aspect-ratio: 1600/723;
	}

}

@media (min-width: 64em) {
	.ccl-widget.core-hero-slideshow {
		margin-bottom: 30px;
	}

	.ccl-widget.core-hero-slideshow .content-section {
		left: 122px;
	}

	.ccl-widget.core-hero-slideshow .slide-title,
	.ccl-widget.core-hero-slideshow .slide-title a {
		font-size: 60px;
	}

	.ccl-widget.core-hero-slideshow .arrows .arrow-cont .custom-arrow img {
		width: 32px;
		height: 49px;
	}
}
.ccl-widget.core-hero-slideshow .credits {
	position: absolute;
	bottom: 22px;
	right: 15px;
	color: #fff;
	font-size: 13px;
	line-height: 1.2em;
	text-transform: uppercase;
	font-style: italic;
	letter-spacing: 0.014em;
	padding-left: 15px;
}