/*
	README

	This file should only be used to style structure of the widget. It should not
	contain fonts or theme styling. Use the shared_theme.css for that purpose.

	If simply theming the CCL, leave this file alone.

	If your design is very customized, edit this file as needed. 
*/

.core-hero-image {
	position: relative;
}
.ccl-widget.core-hero-image .slide .featured {
	position: absolute;
	top: auto;
    right: 0;
    bottom: 0;
	left: auto;
    z-index: 10;
}

.core-hero-image.hide-content .img-cont:after {
	content: none;
}

.core-hero-image .content-section {
	padding: var(--space-8) var(--space-12);
	width: 100%;
	max-width: var(--width-comfortable);
	display: flex;
	justify-content: space-between;
	flex-direction: column;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--space-3);
	position: absolute;
	left: 50%;
	transform: translateX(-50%);
	text-align: center;
}

.core-hero-image .slide-title {
	font-size: var(--text-2xl);
	margin-bottom: var(--space-2);
	line-height: var(--leading-tight);
}


.core-hero-image .title-desc-container { max-width: var(--width-comfortable); }

.core-hero-image .credits {
	flex-grow: 1;
	text-align: right;
}