/*	Slider		---------------------------------------------------------------------------------------------------- */

:root {
	/* Rückfalllösung für ältere Browser */
	--slider-hoehe:100vh;
}

/* Sichtbare Höhe bei eingeblendeten Browserleisten */
@supports (height:100svh) {
	:root {
		--slider-hoehe:100svh;
	}
}

.flex-container a:active,
.flexslider a:active,
.flex-container a:focus,
.flexslider a:focus  {outline: none;}
.slides,
.flex-control-nav,
.flex-direction-nav {margin: 0; padding: 0; list-style: none; overflow: hidden; }

.flexslider .slides > li {-webkit-backface-visibility: hidden; }
.flexslider .slides li img {
    position:relative;
    display: block;
    width:100%;
	height:var(--slider-hoehe);
    object-fit: cover; 
	object-position:center center;
    line-height:0;
    border:none;
    overflow:hidden;
    margin:0 auto;
    padding:0;
    background-color: var(--blau);
    background-position: center center;
    z-index:1;
}

.flex-pauseplay span {text-transform: capitalize;}

.slides:after {content: ""; display: block; clear: both; visibility: hidden; line-height: 0; height: 0;}
.no-js .slides > li:first-child {display: block;}

.flexslider .slides li {
	position:relative;
	width:100%;
	height:100%;
	overflow:hidden;
	margin:0;
	padding:0;
}
.flex-viewport { max-height: 2000px; -webkit-transition: all 1s ease; -moz-transition: all 1s ease; -o-transition: all 1s ease; transition: all 1s ease; }
.loading .flex-viewport { max-height: 300px; }
.flexslider .slides { width:auto; height:auto; zoom:1; overflow:hidden; }
.carousel li { margin: 0; }

div.flexslider {
	position: relative;
	display: block;
	width:100%;
	height:var(--slider-hoehe);
	background-color:var(--off);
	margin:0;
	padding:0;
	overflow:hidden;
}

/*	Navi		---------------------------------------------------------------------------------------------------- */

.flex-direction-nav a {
	position: absolute;
	width: auto;
	height: auto;
	margin: 0;
	padding:0;
	display: block;
	color:var(--off);
	top: 50vh;
	bottom: 50vh;
	cursor: pointer;
	opacity: 0;
	transition: all .3s ease;
	font-family: FontAwesome;
	font-size: 50px;
	line-height: normal;
	text-align:center;
	text-decoration: none;
}
.flex-direction-nav a:hover { color:var(--gelb); }
.flex-direction-nav .flex-next { right: 10px; }
.flex-direction-nav .flex-prev { left: 10px; }
.flex-direction-nav .flex-next:before { font-family: 'Font Awesome 7 Free'; font-weight: normal; content: "\f054"; }
.flex-direction-nav .flex-prev:before { font-family: 'Font Awesome 7 Free'; font-weight: normal; content: "\f053"; }
.flexslider:hover .flex-next, .flexslider:hover .flex-prev {opacity: 0.5; }
.flexslider:hover .flex-next:hover, .flexslider:hover .flex-prev:hover {opacity:0.7;}
.flex-direction-nav .disabled {opacity:.3 !important; cursor:default;}

.flex-control-nav {width:100%; position:absolute; margin:0 auto; padding:0; bottom:210px; text-align:center; }
.flex-control-nav li { margin:0 0.5em; display:inline-block; }

.flex-control-paging li a {
	position: relative;
	display: block;
	width: 40px;
	height: 40px;
	padding: 0;
	margin: 0;
	font-family: 'Font Awesome 7 Free';
	font-size: 0;
	font-style: normal;
	font-weight: 900;
	font-synthesis: none;
	line-height: 40px;
	text-align: center;
	background-color:rgb(var(--off-rgb) / 0.60);
	color:var(--orange);
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	border-radius: 50%;
	overflow: hidden;
	cursor: pointer;
}

.flex-control-paging li a::before {
	content: "";
	display: inline-block;
	width: 24px;
	height: 24px;
	border-radius: 50%;
	background:
		radial-gradient(
			circle at 0 50%,
			transparent 7px,
			var(--off) 8px,
			var(--off) 9px,
			transparent 10px
		),
		radial-gradient(
			circle at 100% 50%,
			transparent 7px,
			var(--off) 8px,
			var(--off) 9px,
			transparent 10px
		),
		var(--gelb);
	vertical-align: middle;
	transform: rotate(30deg);
	-webkit-transition: .5s;
	transition: .5s;
}
.flex-control-paging li a:hover::before {
	background-color:var(--orange);
	transform: rotate(180deg);
	-webkit-transition: .5s;
	transition: .5s;
}
.flex-control-paging li a.flex-active::before {
	background-color:var(--gruen);
}

.flex-control-paging li a.flex-active { 
	background-color:var(--off);
	cursor: default;
}
.flex-control-paging li a.flex-active:hover { background-color:var(--off); color:var(--gelb); }

a.slide_thumb { outline: none; }


/*	Text		---------------------------------------------------------------------------------------------------- */

div.flexslider .slides li a.text { 
	position:absolute;
	display: block;
    top: auto;
    bottom: 0;
	width:100%;
	height:200px;
	overflow: hidden;
	padding:0;
	margin:0;
	background-color:rgb(var(--off-rgb) / 0.75);
    -webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box;
	-webkit-transition: .5s;
	transition: .5s;
	z-index:2;
}
div.flexslider .slides li a.text h1 {
	font-family: 'Poppins Light', Helvetica Neue, Arial, Helvetica, sans-serif;
	font-size: 60px;
	text-transform: uppercase;
	color:var(--gruen);
	letter-spacing: 1em;
	text-align: center;
	padding:0; 
	margin-top:20px;
	border-bottom: none;
	-webkit-transition: .5s;
	transition: .5s;
}
div.flexslider .slides li a.text p {
	font-family: 'Poppins Bold', Helvetica Neue, Arial, Helvetica, sans-serif;
	font-size: 25px;
	color:var(--blau);
	padding:0 20px; 
	margin:0;
	text-align: center;
	line-height: 1;
}
div.flexslider .slides li a.text p i {
	padding:0 0 0 10px; 
	margin:0;
	font-size: 1.5em;
	vertical-align: -5px;
	color:var(--orange);
	-webkit-transition: .5s;
	transition: .5s;
}
div.flexslider .slides li a.text:hover { 
	background-color:rgb(var(--off-rgb) / 0.95);
	-webkit-transition: .5s;
	transition: .5s;
}
div.flexslider .slides li a.text:hover p i {
	padding-left:30px;
	color:var(--gelb);
	-webkit-transition: .5s;
	transition: .5s;
}



@media only screen and (max-width: 1920px) {

/*	Navi		---------------------------------------------------------------------------------------------------- */



/*	Text		---------------------------------------------------------------------------------------------------- */


div.flexslider .slides li a.text h1 {
	font-size: 50px;
}

}


@media only screen and (max-width: 1600px) {

/*	Navi		---------------------------------------------------------------------------------------------------- */



/*	Text		---------------------------------------------------------------------------------------------------- */


div.flexslider .slides li a.text h1 {
	font-size: 45px;
}

}


@media only screen and (max-width: 1280px) {

/*	Navi		---------------------------------------------------------------------------------------------------- */



/*	Text		---------------------------------------------------------------------------------------------------- */


div.flexslider .slides li a.text h1 {
	font-size: 40px;
	letter-spacing: 0.75em;
}
div.flexslider .slides li a.text p {
	font-size: 22px;
}
	
}




@media only screen and (max-width: 1024px) {

/*	Slider		---------------------------------------------------------------------------------------------------- */

/*
@media only screen and (max-width:1024px) {

	:root {
		--slider-hoehe:calc(100vh - 20px);
	}

	@supports (height:100svh) {
		:root {
			--slider-hoehe:calc(100svh - 20px);
		}
	}

}
*/

/*	Navi		---------------------------------------------------------------------------------------------------- */

.flex-control-nav {
	bottom: 150px;
}

/*	Text		---------------------------------------------------------------------------------------------------- */


div.flexslider .slides li a.text { 
	height:150px;
}
div.flexslider .slides li a.text h1 {
	font-size: 32px;
}
div.flexslider .slides li a.text p {
	font-size: 20px;
}
div.flexslider .slides li a.text:hover p i {
	padding-left:20px;
}

}


@media only screen and (max-width: 768px) {

/*	Navi		---------------------------------------------------------------------------------------------------- */

.flex-control-nav {
	bottom: 120px;
}


/*	Text		---------------------------------------------------------------------------------------------------- */


div.flexslider .slides li a.text { 
	height:120px;
}
div.flexslider .slides li a.text h1 {
	font-size: 28px;
}
div.flexslider .slides li a.text p {
	font-size: 18px;
	padding:0 15px; 
}

}

@media only screen and (max-width: 640px) {

/*	Navi		---------------------------------------------------------------------------------------------------- */

.flex-control-nav {
	bottom: 120px;
}


/*	Text		---------------------------------------------------------------------------------------------------- */


div.flexslider .slides li a.text { 
	height:120px;
}
div.flexslider .slides li a.text h1 {
	font-size: 25px;
	letter-spacing: 0.5em;
	margin-top:10px;	
}
div.flexslider .slides li a.text p {
	font-size: 16px;
	padding:0 10px; 
}
div.flexslider .slides li a.text p i {
	font-size: 1.25em;
	vertical-align: -3px;
}

}

@media only screen and (max-width: 480px) {

/*	Navi		---------------------------------------------------------------------------------------------------- */

.flex-control-nav {
	bottom: 100px;
}


/*	Text		---------------------------------------------------------------------------------------------------- */


div.flexslider .slides li a.text { 
	height:100px;
}
div.flexslider .slides li a.text h1 {
	font-size: 20px;
	hyphens: auto;
	word-wrap: break-word;	
}
div.flexslider .slides li a.text p {
	font-size: 15px;
}

}
