/**
 * Frontend styles for Banner Slider
 *
 * @package Banner_Slider
 * @since   1.0.0
 */

/* Container - Horizontal slider */
.banner-slider-container {
	position: relative !important;
	overflow: hidden !important;
	margin: 20px 0 !important;
	/* Width is set by JavaScript - DO NOT use !important */
	/* Height will be set by the tallest image */
}

/* Wrapper - UL element that slides horizontally */
.banner-slider-container .banner-slider-wrapper,
.banner-slider-container > ul,
ul.banner-slider-wrapper {
	position: relative !important;
	list-style: none !important;
	list-style-type: none !important;
	padding: 0 !important;
	margin: 0 !important;
	white-space: nowrap !important;
	/* left is controlled by JavaScript - DO NOT use !important here */
	/* Height will be calculated by JavaScript */
}

/* Slides - LI elements positioned horizontally */
.banner-slider-container .banner-slider-wrapper .banner-slide,
.banner-slider-container > ul > li,
ul.banner-slider-wrapper > li,
li.banner-slide {
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	clear: none !important;
	list-style: none !important;
	list-style-type: none !important;
	list-style-image: none !important;
	position: absolute !important;
	top: 0 !important;
	display: block !important;
	white-space: normal !important;
}

/* Remove bullet - ALL possible pseudo-elements */
.banner-slider-container .banner-slider-wrapper .banner-slide::before,
.banner-slider-container .banner-slider-wrapper .banner-slide::after,
.banner-slider-container .banner-slider-wrapper .banner-slide::marker,
.banner-slider-container > ul > li::before,
.banner-slider-container > ul > li::after,
.banner-slider-container > ul > li::marker,
ul.banner-slider-wrapper > li::before,
ul.banner-slider-wrapper > li::after,
ul.banner-slider-wrapper > li::marker,
li.banner-slide::before,
li.banner-slide::after,
li.banner-slide::marker {
	display: none !important;
	content: none !important;
	list-style: none !important;
	list-style-type: none !important;
	list-style-image: none !important;
}

.banner-slide img {
	display: block !important;
	max-width: none !important;
	width: auto !important;
	height: auto !important;
	position: relative !important;
	margin: 0 auto !important;
	padding: 0 !important;
}

.banner-slide a {
	display: block !important;
	line-height: 0 !important;
	margin: 0 !important;
	padding: 0 !important;
}