/*
	README

	Modify this file as much or as little as needed.

	This file is shared across all CCL widgets in the Slider 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.
*/

.core-hero-image .img-cont:after {
	content: "";
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: linear-gradient(to top, rgba(0,0,0,0.85) 0%, rgba(0,0,0,0) 40%);
	pointer-events: none;
}

.core-hero-image .slide p {
	font-size: var(--text-base);
	font-weight: normal;
}

.core-hero-image .read-more {
	font-weight: 700;
	color: var(--text-color);
}

/*--Customization--*/
/*--GENERAL--*/
/*--HEADER--*/
/*--IMAGE--*/
.core-hero-image .img-cont:after {
	display: none;
}
.core-hero-image .inner:after {
	content: "";
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: linear-gradient(to top, rgba(0, 0, 0, 0.85) 0%, rgba(0, 0, 0, 0) 40%);
	pointer-events: none;
	z-index: 0;
	border-radius: var(--rounded-md);
}
/*--CONTENT--*/
.core-hero-image .content-section {
	z-index: 1;
}
/*--BUTTON--*/
.core-hero-image .shared-play-button {
	background: var(--white);
	color: var(--blue-22);
}
/*--ARROW--*/

@media screen and (min-width:40em) {
	/*--GENERAL--*/
	.core-hero-image .slide {
		padding: 20px 20px 5px;
	}
	/*--HEADER--*/
	/*--IMAGE--*/
	.core-hero-image.hide-content .inner:after {
		content: none;
	}
	.core-hero-image .img-cont:after {
		display: none;
	}
	.core-hero-image .slide .img-cont {
		border-radius: var(--rounded-md);
	}
	/*--CONTENT--*/
	.core-hero-image .slide .slide-title {
		font-size: 30px;
	}
	.core-hero-image .slide.overlap-image p {
		font-size: 14px;
		width: 80%;
	}
	/*--BUTTON--*/
	/*--ARROW--*/
}

@media screen and (min-width:64em) {
	/*--GENERAL--*/
	/*--HEADER--*/
	/*--IMAGE--*/
	/*--CONTENT--*/
	/*--BUTTON--*/
	/*--ARROW--*/
}