/**
 * @author Valentin Alisch <hallo@valentinalisch.de>
 * @version 1.0
 */

/* General */
[data-slider] {
	width: 100%;
	overflow: hidden;
	position: relative;
}

[data-slider--slides] {
	position: relative;
}
[data-slider--slides] > * {
	overflow: hidden;
	max-width: 100%;
}

/* Configuration */
[data-slider]:not( [data-slider--config*='"autowidth":true'] ) [data-slider--slides] > * {
	width: 100%;
}
[data-slider]:not( [data-slider--config*='"autoheight":true'] ) [data-slider--slides] > * {
	height: 100%;
}

[data-slider][data-slider--config*='"autowidth":true'] [data-slider--slides] > * {
	display: inline-block;
}

/* Horizontal */
[data-slider="horizontal"] [data-slider--slides] {
	white-space: nowrap;
}
[data-slider="horizontal"] [data-slider--slides] > * {
	display: inline-block;
	white-space: normal;
}

/* Fade */
[data-slider^="fade"] [data-slider--slides] > * {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	z-index: 1;
	opacity: 0;
}
[data-slider^="fade"] [data-slider--slides] > *.current {
	z-index: 10;
}
[data-slider^="fade"] [data-slider--slides] > *.active {
	position: relative;
	z-index: 11;
}

[data-slider="fade"] [data-slider--slides] > *,
[data-slider^="fadeboth"] [data-slider--slides] > *,
[data-slider^="fade2"] [data-slider--slides] > * {
	opacity: 0;
}

/* Vertikal */




#vals1 [data-slider--slides],
#vals3 [data-slider--slides] {
	height: 400px;
}
	#vals1 [data-slider--slides] > * img,
	#vals3 [data-slider--slides] > * img {
		height: 100%;
		object-fit: cover;
	}

/*
.slider img {
	width: auto !important;
	height: auto !important;
	display: block !important;
}
*/

.slider-navigation {
    z-index: 3;
    position: absolute;
    height: 100%;
    top: 0;
    width: 100%;
}
 
[data-slider--navigation-next], 
[data-slider--navigation-prev] {
    position: relative;
    z-index: 4;
    top: 0;
    width: 33%;
    height: 100%;
    left: 0;
    float: left;
	cursor: pointer;
}

	[data-slider--navigation-next] {
		right: 0;
		float: right;
		text-align: right;
		position: relative;
	}

	[data-slider--navigation-prev] .slider-navigation-caption img, [data-slider--navigation-next] .slider-navigation-caption img {
		top: 40% !important;
		position: relative;
		cursor: pointer;
	}

	[data-slider--navigation-next] .slider-navigation-caption img {
		right: 20px;
		left: auto;
	}

	[data-slider--navigation-next] img,
	[data-slider--navigation-prev] img {
		    height: 50px !important;
    		display: inline-block !important;
	}