@charset "UTF-8";
/* CSS Document */

/*

 Theme Name: Elektro Niemann
 Theme URI: https://www.elektro-niemann.de
 Description: Ein responsives Design, optimiert für 1920x1080p.
 Author: Sicko Janßen
 Author URI: http://eilinghoff.de

 */
/* open-sans-300 - latin */
@font-face {
	font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
	font-family: 'Open Sans';
	font-style: normal;
	font-weight: 300;
	src: url('fonts/open-sans-v34-latin-300.eot'); /* IE9 Compat Modes */
	src: url('fonts/open-sans-v34-latin-300.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
		 url('fonts/open-sans-v34-latin-300.woff2') format('woff2'), /* Super Modern Browsers */
		 url('fonts/open-sans-v34-latin-300.woff') format('woff'), /* Modern Browsers */
		 url('fonts/open-sans-v34-latin-300.ttf') format('truetype'), /* Safari, Android, iOS */
		 url('fonts/open-sans-v34-latin-300.svg#OpenSans') format('svg'); /* Legacy iOS */
  }
  
  /* open-sans-regular - latin */
  @font-face {
	font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
	font-family: 'Open Sans';
	font-style: normal;
	font-weight: 400;
	src: url('fonts/open-sans-v34-latin-regular.eot'); /* IE9 Compat Modes */
	src: url('fonts/open-sans-v34-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
		 url('fonts/open-sans-v34-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
		 url('fonts/open-sans-v34-latin-regular.woff') format('woff'), /* Modern Browsers */
		 url('fonts/open-sans-v34-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
		 url('fonts/open-sans-v34-latin-regular.svg#OpenSans') format('svg'); /* Legacy iOS */
  }
  
  /* open-sans-700 - latin */
  @font-face {
	font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
	font-family: 'Open Sans';
	font-style: normal;
	font-weight: 700;
	src: url('fonts/open-sans-v34-latin-700.eot'); /* IE9 Compat Modes */
	src: url('fonts/open-sans-v34-latin-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
		 url('fonts/open-sans-v34-latin-700.woff2') format('woff2'), /* Super Modern Browsers */
		 url('fonts/open-sans-v34-latin-700.woff') format('woff'), /* Modern Browsers */
		 url('fonts/open-sans-v34-latin-700.ttf') format('truetype'), /* Safari, Android, iOS */
		 url('fonts/open-sans-v34-latin-700.svg#OpenSans') format('svg'); /* Legacy iOS */
  }
  
  /* open-sans-800 - latin */
  @font-face {
	font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
	font-family: 'Open Sans';
	font-style: normal;
	font-weight: 800;
	src: url('fonts/open-sans-v34-latin-800.eot'); /* IE9 Compat Modes */
	src: url('fonts/open-sans-v34-latin-800.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
		 url('fonts/open-sans-v34-latin-800.woff2') format('woff2'), /* Super Modern Browsers */
		 url('fonts/open-sans-v34-latin-800.woff') format('woff'), /* Modern Browsers */
		 url('fonts/open-sans-v34-latin-800.ttf') format('truetype'), /* Safari, Android, iOS */
		 url('fonts/open-sans-v34-latin-800.svg#OpenSans') format('svg'); /* Legacy iOS */
  }

.mobile-info{
	color: black;
	font-size: 13px;
	font-style:italic;
	display: none;
}

.anchor{
	position:absolute;
	top:-150px;
	height:1px;
	width:100%;
	left:0;
}

 #cta-apply{
	width: auto;
	display: block;
	text-align: center;
	padding: 20px 10px;
	text-decoration: none;
	font-weight: 700;
	transition: all 0.7s;
	font-size: 20px;
	position: fixed;
	bottom: 50px;
	right: 50px;
	background-color: #FFE300;
	z-index: 1;
	opacity: 0;
}

.appear{
	opacity: 1 !important;
}

.benefits ul{
	display:flex;
	justify-content: flex-start;
	flex-wrap:wrap;
}

.benefits ul li{
	margin:20px;
}


#cta-apply:hover{
	background-color: black;
	color: white;
}
  

.btn-cta{
	display: inline-block;
	padding: 10px;
	background-color: white;
	text-decoration: none;
	font-weight: 700;
	transition: all .7s;
}

.btn-cta-yellow{
	display: inline-block;
	padding: 10px;
	background-color:#FFE300;
	text-decoration: none;
	font-weight: 700;
	transition: all .7s;
	color: black;
}

.btn-cta-yellow:hover{
	background-color: #000000;
	color: white;
}

.btn-cta:hover{
	background-color: black;
	color: white;
}

.stoerer{
	position: fixed;
	top: calc(754px - 310px);
	padding: 0;
	right: 0;
	z-index: 10;
	transition: all .7s;
}

.stoerer a{
	font-weight: 400;
}

.stoerer a strong{
	text-decoration: underline;
}

.kacheln-content h4{
	margin: 0 0 10px 0;
	font-size: 20px;
}

.kachel-content{
	background-color: #FFE619 ;
	padding: 10px;
	height:275px;
}

.kacheln-content img{
	width: 100%;
	display: block;
	height: 300px;
	object-fit: cover;
}

.kacheln-content article{
	width: 32%;
	margin: 10px 0;
}

.kacheln-content .flex{
	flex-wrap: wrap;
	gap:2%;
	justify-content: flex-start;
}

.sub-rec article{
	width: calc(50% - 120px);
	padding: 30px 60px !important;
}

.sub-rec figure{
	z-index: 1;
}

.overlay-spacer{
	width: 50%;
}


.sub-rec video{
	width: 100%;
}

.head-front{
	width: 100%;
}

.featured .flex{
	flex-wrap: wrap;
}

.hide-persona{
	right: -110% !important;
}

.stoerer article{
	background-color: #FFE619;
	padding: 60px 50px 60px 120px;
	max-height: 100px;
}

.stoerer{
	align-items: end;
}

.stoerer figure img{
	height: 100%;
	width: auto;
	display: block;
}

.stoerer figure{
	position: relative;
	right: 0;
}

.stoerer a{
	text-decoration:none;
}

html{
	scroll-behavior: smooth;
}

.stoerer:hover{
	transform: translateX(0);
}

.toggle_piktos img{
	height: 75px;
	margin: 0 auto 10px; 
	display: block;
	transition: all 0.4s;
}

.open-toggle .mehr-erfahren img{
	transform: rotate(180deg);
}

.mehr-erfahren img{
	height: 50px;
}

.mehr-erfahren{
	text-align: center;
	position: absolute;
	width: 100%;
	bottom: 0;
	background: rgb(255,255,255);
	background: linear-gradient(0deg, rgba(255,255,255,1) 0%, rgba(255,255,255,1) 52%, rgba(255,255,255,0) 90%); 
	padding: 10px 0 0;
	cursor: pointer;
}

.toggle_piktos .flex{
	flex-wrap: wrap;
}

.toggle_piktos article{
	width: 30%;
	margin: 30px 0;
}

.toggle_piktos{
	padding-bottom: 0;
}

.toggle-content-shade{
	position: relative;
	max-height: 120px;
	overflow: hidden;
	transition: all 0.4s;
}

#ausbildung{
	position: absolute;
	height: 1px;
	visibility: hidden;
	opacity: 0;
	width: 100%;
	top: -250px;
	left: 0;
}

.paralax-overlay .wrapper{
	position: relative;
}

.stoerer p{
	margin: 0;
	text-align: center;
	font-weight: 800;
}

body{
	margin: 0;
	padding: 0;
	font-family: 'Open Sans', sans-serif;
}

header{
	font-family: 'Open Sans', sans-serif;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	background-color: white;
	border-bottom: solid 4px #FFE619;
	height: 150px;
	transition: all 0.4s;
	z-index: 999;
}

.toggle-content{
	max-height: 0;
	overflow: hidden;
	transition: 0.7s;
}

.toggle h3{
	background-color: #FFE619;
	color: black;
	padding: 10px;
	cursor: pointer;
	margin: 10px 0;
	transition: all 0.4s;
	font-weight: 400;
	position: relative;
	border-left: solid 4px #FFE619; 
}

.toggle h3::after{
	content: url("img/dropdown.svg");
	position: absolute;
	top: 15px;
	right: 15px;
}

.toggle h3:hover{
	-webkit-box-shadow: 5px 5px 15px 5px rgba(0,0,0,0.08); 
	box-shadow: 5px 5px 15px 5px rgba(0,0,0,0.08);
	border-left: solid 4px black; 
	
}

.open-toggle{
	max-height: 1000px!important;
}

.toggle-pikto-cnt .open-toggle{
	padding-bottom: 50px;
}

.current_page_item > a {
	font-weight: 700;	
}

.zwischenueberschrift, .zwischenueberschrift h3{
	margin: 0;
}
.single img{
	max-height: 45vh;
	object-fit: cover;	
}

.stellen-wall{
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	padding: 25px 0;
}

.paralax-overlay ul{
	color: white;	
}

a{
	color: black;
}

.button{
	background-color: black;
	text-decoration: none;
	padding: 10px 15px;
	color: white;
	transition: all 0.7s;
}

.button:hover{
	background-color: white;
	color: black;
}

.main-article-divided .button:hover{
	background-color: black;
	color: white;
}

.main-article-divided{
	position:relative;
}

.main-article-divided .button{
	background-color: #FFE61C;
	color: black;
}

.paralax-overlay .button{
	background-color: #FFE61C;
	color: black;
}

.paralax-overlay .button:hover{
	background-color: black;
	color: white;
}

.paralax-overlay a{
	color: white;
}

.stellen-wall article{
	width: 30%;
	margin: 20px 0;
	background-color: white;
	transition: all 0.4s;
}

.stellen-wall article:hover{
	-webkit-box-shadow: 5px 5px 15px 5px rgba(0,0,0,0.15); 
	box-shadow: 5px 5px 15px 5px rgba(0,0,0,0.15);
}

.stellen-wall h4{
	color: black;
	text-decoration: none;
}

.stellen-wall a{
	text-decoration: none;
}

.stellen-wall img{
	width: 100%;
	display: block;
	height: 250px;
	object-fit: cover;
}

.bewerbung{
	background-color: #FFE619;}

.bewerbung a{
	width: calc(100% - 20px);
	display: block;
	text-align: center;
	padding: 20px 10px;
	text-decoration: none;
	font-weight: 700;
	transition: all 0.7s;
	font-size: 20px;
}

.bewerbung a:hover{
	background-color: black;
	color: white;
}

.benefit img{
	height: 100px;
	width: auto;
	transition: all .4s;
}

.benefit:hover img{
	height: 110px;
}

.benefit:hover figure{
	background-color: #FFE300;
}

.benefit{
	text-align: center;
	margin: 10px 0;
	width: 32%;
}

.benefit figure p{
	text-align: center;
}

.benefits .flex {
	flex-wrap: wrap;
}

.benefit figure {
box-shadow: 1px 1px 4px 0px rgba(0,0,0,0.05);
-webkit-box-shadow: 1px 1px 4px 0px rgba(0,0,0,0.05);
-moz-box-shadow: 1px 1px 4px 0px rgba(0,0,0,0.05);
	padding: 50px;
	margin-bottom: 10px;
	height: 160px;
	cursor: pointer;
	transition: all 0.7s;
	position: relative;
	background-color: white;
}

.benefit figure::after{
	content: "";
	background-image: url(img/dropdown.svg);
	position: absolute;
	height: 13px;
	width: 30px;
	left: 0;
	right: 0;
	bottom: 10px;
	margin: 0 auto;
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
}


.benefit figure:hover{
	box-shadow: 1px 1px 4px 0px rgba(0,0,0,0.3);
-webkit-box-shadow: 1px 1px 4px 0px rgba(0,0,0,0.3);
-moz-box-shadow: 1px 1px 4px 0px rgba(0,0,0,0.3);
}

.benefit article {
	max-height: 0;
	overflow: hidden;
	transition: all 0.7s;
	margin-bottom: 10px;
}

.current_page_item > a, .current-page-ancestor > a{
	font-weight: bold;
}

.wrapper{
	width: 1400px;
	margin: 0 auto;
}

.flex{
	display: flex;
	justify-content: space-between;
}

nav ul{
	margin: 0;
	padding: 0;
}

nav ul li{
	display: inline;
	position: relative;
}

nav ul li ul{
	height: 0;
	overflow: hidden;
	background-color: white;
	width: 0;
	transition: all 0.4s;
	border-left: solid 4px #FFE619;
	position: absolute;
	top: 51px;
	left: 0;
	max-height: 400px;
	max-width: 500px;
	opacity: 0;
}

nav ul li a:hover{
	text-decoration: underline;
}

nav ul li ul li a:hover{
	text-decoration: underline;
}

nav ul li ul li:last-of-type{
	margin: 10px 10px 0 0;
}

nav ul li:hover ul{
	height: auto;
	width: auto;
	opacity: 1;
}

nav ul li ul li{
	display: block;
	margin: 10px 10px 10px 0;
	padding: 10px 10px 10px 20px;
	border-bottom: solid 2px #FFE619;
}

nav ul li a{
	text-decoration: none;
	font-size: 18px;
	color: #000000;
	position: relative;
	transition: all .4s;
	font-weight: 400;
	display: inline-block;
	margin: 0 10px;
	padding: 5px;
}

.active{
	font-weight: 800;
}

.center{
	align-items: center;
}

#contacts{
	justify-content: flex-end;
	transition: all 0.4s;
	overflow: hidden;
}

.logo-shrink{
	width: 200px!important;
}

#logo img{
	transition: all 0.4s;
	width: 300px;
}

.hide-contacts{
	height: 0;
	margin: 0;
	padding: 0;
}

#contacts a{
	text-decoration: none;
	font-weight: 400;
	color: #7F7F7F;
	font-size: 16px;
}

#contacts p{
	font-weight: 800;
	color: #7F7F7F;
	font-size: 16px;
	margin: 0;
	line-height: initial;
}

#contacts p:first-of-type{
	margin-right: 20px;
}

hr{
	margin: 25px 0;
	color: #E1E1E1;
	border: none;
	background-color: #E1E1E1;
	height: 4px;
}

.shrink{
	height: 90px;
}

.single-content{
	flex-wrap: wrap;
}

.single-content article{
	width: calc(100% - (20px + 17%));
	margin: 5px 0;
	padding: 5px 20px;
}

.single-content aside{
	width: calc(100% - 40px);
	margin: 20px 0;
	padding: 5px 20px;
}

.single-content aside:first-of-type{
	margin: 50px 0 20px;
}

.single-content .flex{
	flex-wrap: wrap;
	justify-content: flex-start;
}


.single-content .wrapper{
	width: 1200px;
	-webkit-box-shadow: 5px 5px 15px 5px rgba(0,0,0,0.06); 
	box-shadow: 5px 5px 15px 5px rgba(0,0,0,0.06);
}

.single-content .benefits{
	padding: 20px;
	width: calc(1200px - 40px);
	background-color: #FFE619;
}

.single-content .benefits figure{
	margin: 10px!important;
	display: flex;
	justify-content: flex-start;
	align-items: flex-start;
	width: calc(25% - 20px);
}

.single-content h2{
	font-size: 22px;
	margin: 5px 0;
}

.single-content h3{
	font-size: 20px;
	margin: 5px 0;
}

.single-content h4{
	font-size: 18px;
	margin: 5px 0;
}

.single-content .benefits p{
	margin: 0;
	text-align: left;
}

.single-content .benefits a{
	font-size: 18px;
	margin:0;
	font-weight: bold;
	text-align: left;
	text-decoration: none;
	padding: 10px;
	background-color: white;
}

.single-content .cta{
	padding: 20px;
	width: calc(100% - 40px);
}

.single-content .cta a{
	color: #000000;
	background-color: #FFE300;
	text-decoration: none;
	font-weight: 700;
	padding: 10px;
	display: inline-block;
	transition: all .7s;
}

.single-content .cta a:hover{
	background-color: black;
	color: white;
}


.fixed{
	position: fixed;
	bottom: 50px;
	right: 50px;
}


.single-content .benefits img{
	margin:5px 10px 0 0;
}

main{
	padding-top: 154px;
	transition: all 0.4s;
}

.rahmenplan{
	padding: 20px;
	width: calc(100% - 40px);
}

.rahmenplan img{
	width: 100%;
	height: auto;
}

.geteilter-artikel-plain article{
	width: 48%;
}

.slider img{
	width: 100%;
	height: auto;
	display: block;
	max-height: 600px;
	object-fit: cover;
}

.slider{
	border-bottom: solid black 10px;
	overflow: hidden;
}

.metaslider a{
	white-space: nowrap;
	text-decoration: none;
	color: white;
	width: auto;
}

strong{
	font-weight: bold;
}
.metaslider .flexslider{
	margin: 0!important;
}
.slide-up{
	padding-top: 150px;
}

p{
	color: #000000;
	font-size: 18px;
	font-family: 'Open Sans', sans-serif;
	line-height: 25px;
	text-align: justify;
}

h1{
	font-size: 24px;
}

.template h2{
	font-size: 20px;
	border-bottom: solid 4px #FFE619;
	display: inline-block;
	padding-bottom: 20px;
	margin: 10px 0;	
	font-weight: 700;
}

.kachel-content p{
	text-align: left;
	overflow-wrap: break-word;
}

h2{
	font-size: 20px;
	border-bottom: solid 4px #FFE619;
	display: inline-block;
	padding-bottom: 10px;
	font-weight: 400;
	margin-bottom: 40px;
}

section{
	padding: 50px 0;
}

.slider{
	padding: 0;
}

.full-article a:last-of-type{
	background-color: black;
	color: white;
	text-decoration: none;
	padding: 10px 20px;
	margin: 20px 0;
	display: inline-block;
	transition: all 0.4s;
}

.full-article a:last-of-type:hover{
	background-color: #FFE619;
	color: black;
}

.shrink nav ul li{
	padding-bottom: 69px;
}

.shrink nav ul li ul{
	top: 58px;
}

.shrink nav ul li ul li{
	padding: 10px 10px 10px 20px;
	margin: 10px 0 0 0;
}

.leistungskacheln .flex{
	flex-wrap: wrap;
}

.leistungskacheln article{
	width: 33.33%;
	position: relative;
	overflow: hidden;
	top: 200px;
	opacity: 0;
	transition: all 1.5s;
}

.leistungskacheln article:nth-of-type(2){
	transition: all 1.6s;
}

.leistungskacheln article:nth-of-type(3){
	transition: all 1.7s;
}

.leistungskacheln article:nth-of-type(4){
	transition: all 1.8s;
}


.leistungskacheln article:nth-of-type(5){
	transition: all 1.9s;
}

.leistungskacheln article:nth-of-type(5){
	transition: all 1.9s;
}

.leistungskacheln article:nth-of-type(6){
	transition: all 1.9s;
}


.slide-in-content{
	top: 0!important;
	opacity: 1!important;
	right: 0!important;
}

.kachel:hover .leistungsbanner{
	background-color: #FFE61C;
}

.kachel:hover .leistungsbanner p{
	color: black;
}

.leistungskacheln img{
	width: 100%;
	display: block;
	object-fit: cover;
	transition: all 0.7s;
	height: 100%;
}

.leistungsbanner{
	position: absolute;
	bottom: 0;
	width: 100%;
	background-color: rgba(0,0,0,0.75);
	text-align: center;
}

.einsatz video{
	height: 400px;
	width: 100%;
	object-fit: cover;
}

.leistungsbanner p{
	color:white;
	font-size: 18px;
	margin: 10px 0;
	text-align: center;
}

.featured article{
	width: 45%;
}

.featured figure{
	width: 45%;
}

.featured img, .featured video{
	width: 100%;
	height: 100%;
	object-fit: cover;
	aspect-ratio: 16/9;
}



.featured a{
	display: inline-block;
	padding: 10px 15px;
	background-color: #FFE619;
	text-decoration: none;
	color: black;
	transition: all 0.7s;
}

.main-article-divided img{
	max-width: 100%;
	max-height: 50vh;
}

.featured a:hover{
	background-color: black;
	color:white;
}

.featured{
	margin: 30px 0;
	position: relative;
	transition: all 1.4s;
}


.leistungskacheln{
	padding: 0;
	display: flex;
	flex-wrap: wrap;
}

.leistungskacheln aside{
	background-color: #FFE61C;
	display: flex;
	align-items: center;
	justify-content: center;
	border-bottom: none;
	width: 100%;
	padding: 20px 0;
}

.leistungskacheln aside h3{
	font-size: 30px;
	margin: 0;
}

.recruiting{
	display: flex;
}


.recruiting figure{
	width: 50%;
}


.recruiting figure img{
	width: 100%;
	display: block;
}

.recruiting article{
	width: calc(50% - 60px);
	background-color: #FFE300;
	padding: 30px;
	position: relative;
	left: -30px;

}

.recruiting .flex{
	align-items: center;
}

.recruiting a:last-of-type{
	color: white;
	display: inline-block;
	background-color: black;
	padding: 10px 15px;
	text-decoration: none;
}

.kontakt-banner{
	background-color: #FFE61C;
	padding: 50px 0;
}

.contacts a{
	margin: 0 10px;
}

.cta-kontakt-banner a{
	display: block;
	border: solid 2px black;
	color: black;
	text-decoration: none;
	padding: 10px 15px;
	font-size: 20px;
}

.einsatzbereiche{
	padding: 0;
	position: relative;
}

.einsatzbereiche .flex{
	flex-wrap: wrap;
}

.einsatz{
	width: calc(25% - 4px);
	position: relative;
	border: solid 2px white;
	overflow: hidden;
}

.einsatz:hover .einsatzbanner{
	opacity: 1;	
}

.einsatzbanner{
	position: absolute;
	height: 100%;
	width: 100%;
	opacity: 0;
	top: 0;
	left: 0;
	display: flex;
	justify-content: center;
	align-items: center;
	transition: all 0.4s;
	 background: rgb(255,230,25);
background: linear-gradient(315deg, rgba(255,230,25,1) 0%, rgba(255,230,25,0.4023810207676821) 100%); 
}

.einsatzbanner p{
	font-size: 20px;
	font-weight: bold;
	text-align: center;
}

.einsatz img{
	width: 100%;
	height: 100%;
	display: block;
	object-fit: cover;
	transition: all 0.25s;
}

.einsatz:last-of-type img{
	width: 100%;
	max-height: 400px;
}

.einsatz:last-of-type{
	width: 100%;
}

.einsatzbereiche-stoerer{
	position: absolute;
	top: 49%;
	left: 0;
	right: 0;
	margin: 0 auto;
	z-index: 9;
	width: 340px;
}

.einsatzbereiche-stoerer h3{
	background-color: #FFE619;
	border: solid 4px white;
	color: black;
	padding: 25px 50px;
	font-size: 30px;
	text-align: center;
	margin: 0;
}

footer{
	padding: 50px 0 0 0;
}

footer .flex{
	flex-wrap: wrap;
	align-items: center;
}

footer h4{
	width: 100%;
}

.kooperationen{
	margin: 10px 0;
	justify-content: flex-start;
}

.wp-video{
	margin: 18px 0;
}

footer .footer-links img{
	height: 30px !important; 
	width: auto !important;
	margin-right: 10px;
}


footer .flex a{
	width: 16%;
	margin: 20px 0;
}

.black-links{
	background-color: black;
	color: white;
	padding: 50px 0;
}

.black-links a{
	color: white;
	text-decoration: none;
}

.black-links ul{
	margin: 0;
	padding: 0;
	padding-left: 25px;
	list-style-image: url("img/list-point-footer.svg");
}

.black-links li{
	margin: 10px 0;
}

.testimonials .flex{
	gap: 15px;
	flex-wrap: wrap;
}

.testimonials{
	padding: 75px 0;
}

.testimonials article{
	padding: 10px;
	background-color: white;
	-webkit-box-shadow: 5px 5px 15px 5px rgba(0,0,0,0.05); 
	box-shadow: 5px 5px 15px 5px rgba(0,0,0,0.05);
	flex: 1;
	border-left: solid 4px #FFE619;
}

.toggles .wrapper{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}

.toggle{
	width: 49%;
}


main ul li{
	margin: 10px 0;
	font-size: 18px;
	text-align: justify;
}

main ol li{
	text-align: justify;
		margin: 10px 0;
	font-size: 18px;
}
.black-links ul li:first-of-type{
	font-weight: bold;
	padding-left: 0;
	margin-bottom: 20px;
	font-size: 20px;
	list-style-image: none;
	list-style-type: none;
	position: relative;
	left: -25px;
}

.footer-links a{
	padding: 0 5px;
}

.main-article-divided article{
	width: 48%;
}

.gelber-banner-text-bild{
	background-color: #FFE61C;
	padding: 30px 0;
	position: relative;
	margin: 50px 0;
	top: 20px;
	opacity: 0;
	transition: all 1s;
}

.gelber-banner-text-bild .flex{
	align-items: center;
}

.gelber-banner-text-bild figure{
	position: relative;
	top: -100px;
	width: 43%;
	border-left: solid 3px white;
	border-bottom: solid 3px white;
}

.gelber-banner-text-bild article{
	width: 48%;
}

.gelber-banner-text-bild img{
	display: block;
	width: 100%;
}

.gelber-banner-bild-text{
	background-color: #FFE61C;
	padding: 30px 0;
	position: relative;
	margin: 70px 0;
	top: 20px;
	opacity: 0;
	transition: all 1s;
}

.gelber-banner-bild-text .flex{
	align-items: center;
}

.gelber-banner-bild-text figure{
	position: relative;
	top: -100px;
	width: 43%;
	border-left: solid 3px white;
	border-bottom: solid 3px white;
}

.gelber-banner-bild-text article{
	width: 48%;
}

.gelber-banner-bild-text img{
	display: block;
	width: 100%;
}

.full-artile-page{
	padding: 50px 0;
	width: 1400px;
	margin: 0 auto;
}

.full-artile-page .wrapper{
	width: 70%;
	margin: 0;
}

figure{
	margin: 0!important;
}

.einsatzbereiche-paralax{
	background-attachment: fixed;
	background-repeat: no-repeat;
	padding: 0;
	margin: 100px 0 0 0;
	background-size: cover;
}

.paralax-overlay{
	height: 100%;
	padding: 150px 0;
	 background: rgb(0,0,0);
	background: radial-gradient(circle, rgba(0,0,0,0.4) 0%, rgba(0,0,0,0.2) 100%); 
}

.paralax-overlay p, .paralax-overlay h3{
	color: white;
}

.kacheln-page{
	padding: 0;
	margin-bottom: 100px;
}

.kacheln-page article{
	position: relative;
	flex: 1;
	overflow: hidden;
	aspect-ratio: 4/3;
}

.kachel-page-banner{
	position: absolute;
	bottom: 0;
	width: 100%;
	left: 0;
	text-align: center;
	background-color: rgba(0,0,0,0.75);
}

.kachel-page-banner p{
	color: white;
	margin: 10px 0;
	text-align: center;
}

.kacheln-page article:hover .kachel-page-banner{
	background-color: rgba(255,230,28,0.75);
}

.kacheln-page article:hover .kachel-page-banner p{
	color: black;
}

.kacheln-page img{
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: all 0.25s;
	max-height: 400px;
}

.banner-bild-artikel{
	background-color: #FFE61C;
	padding: 0;
	margin: 100px 0;
	position: relative;
}

.mitarbeiter-zitate .flex{
	flex-wrap: wrap;
}

.mitarbeiter-zitate{
	padding: 0;
}

.mitarbeiter-foto{
	width: 150px;
	max-height: 150px;
	margin: 0 auto;
	border-radius: 75px;
	overflow: hidden;
}

.mitarbeiter-foto img{
	width: 100%;
}

.mitarbeiter-zitate h3{
	text-align: center;
}

.mitarbeiter-zitate p{
	font-size: 15px;
	color: #2b2b2b;
}

.mitarbeiter-zitate h4{
	text-align: center;
	position: relative;
}

.mitarbeiter-zitate h4::after{
	content: "";
	width: 50%;
	margin: 20px auto;
	display: block;
	background-color: #FFE619;
	height: 4px;
}

.mitarbeiter-zitate article{
	background-color: white;
	padding: 20px;
	position: relative;
	width: 28%;
	margin: 20px 0;
	border: solid lightgrey 1px;
	max-height: 50vh;
	overflow: scroll;
}

.mitarbeiter-zitate article::-webkit-scrollbar {
	display: none;
}

.mitarbeiter-zitate article {
	-ms-overflow-style: none;  /* IE and Edge */
	scrollbar-width: none;  /* Firefox */
  }

.banner-bild-artikel img{
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;	
}

.banner-bild-artikel figure{
	width: 60%;
}

.banner-bild-artikel article{
	width: 40%;
	display: flex;
	align-items: center;
}


.banner-artikel-bild{
	background-color: #FFE61C;
	padding: 0;
	margin: 100px 0;
}

.banner-artikel-bild img{
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	
}
.banner-artikel-bild figure{
	width: 60%;
}

.banner-artikel-bild article{
	width: 40%;
	display: flex;
	align-items: center;
}

.wrap{
	width: 90%;
	margin: 0 auto;
}

.pikto-links a{
	text-decoration: none;
}

.pikto-links p{
	text-decoration: none;
	font-weight: bold;
	text-align: center;
	margin: 20px 0;
}

.pikto-links article{
	-webkit-box-shadow: 5px 5px 15px 5px rgba(0,0,0,0.15); 
box-shadow: 5px 5px 15px 5px rgba(0,0,0,0.15);
	flex:1;
	margin:20px;
	text-align: center;
	padding: 20px;
	position: relative;
	right: 200px;
	opacity: 0;
	transition: all 1s;
}

.pikto-links article:nth-of-type(2){
		transition: all 1.1s;

}

.pikto-links article:nth-of-type(3){
		transition: all 1.2s;

}

.pikto-links article:nth-of-type(4){
		transition: all 1.3s;
}

.pikto-links article:nth-of-type(5){
		transition: all 1.4s;
}

footer hr{
	height: 1px;
}

.kooperationen img{
	width: 100%;
	height: 110px;
	object-fit: contain;
	max-width: 150px;
}

#nav-btn{
	display: none;
}

.overlay-slider{
	position: absolute;
	left: 10%;
	max-width: 30%;
	top:50%;
	background-color: rgba(255,255,255,0.75);
	padding: 20px;
	transform: translateY(-50%);
}

.slide-168 .overlay-slider{
	left: unset;
	right: 10%;
}

.overlay-slider h3{
	margin: 5px 0;
}

.overlay-slider a{
	display: inline-block;
	margin: 10px 0 0;
	padding: 5px;
	color: white;
	background-color: black;
	transition: all .4s;
}

.overlay-slider a:hover{
	background-color: #FFE300;
}


@media only screen and (max-width:1660px){
	.einsatzbereiche-stoerer{
		top: 43%;
	}
	
}

@media only screen and (max-width:1480px){
	.stoerer{
		bottom: 0;
		position: fixed;
	}
}


@media only screen and (max-width:1450px){
	.einsatzbereiche-stoerer{
		top: 39%;
	}
	
	.wrapper, .full-artile-page, .single-content .wrapper{
		width: 1050px;
	}

	.single-content .benefits figure{
		width: calc(30% - 10px);
	}

	.single-content .benefits{
		width: calc(1050px - 40px);
	}
	
	nav ul li{
		margin: 0 10px;
	}
	
	nav ul li:first-of-type{
		margin: 0 10px 0;
	}
	
	nav ul li:last-of-type{
		margin: 0 0 0 10px;
	}

	.overlay-slider p, .overlay-slider a{
		font-size: 15px;
		line-height: 20px;
	}

	.overlay-slider{
		padding: 10px;
		max-width: 50%;
	}
}

@media only screen and (max-width:1064px){
	.wrapper, .full-artile-page{
		width: 90%;
	}

	.mitarbeiter-zitate article{
		width: calc(48% - 40px);
	}

	.single-content .wrapper{
		width: 90%;
	}

	.single-content .benefits figure{
		width: calc(48% - 10px);
	}

	.single-content .benefits{
		width: calc(100% - 40px);
	}

	.full-artile-page .wrapper{
		width: 100%;
	}

	.stoerer{
		bottom: 49px;
	}

	.benefit figure::after {
		display: none;
	}

	.benefit figure p{
		font-size: 16px;
	}

	.benefit, .stellen-wall article{
		width: 48%;
	}


	.recruiting article{
		width: calc(100% - 30px);
		left: 0;
		padding: 15px;
	}
	.recruiting figure{
		width: 100%;
	}

	.geteilter-artikel-plain article{
		width: 100%;
	}


	.kacheln-content article{
		width: calc(48% - 7.5px);
	}
	
	.hide-contacts{
		height: auto;
	}
	
	#logo{
		z-index: 999;
	}
	
	.gelber-banner-text-bild figure{
		width: 50%;
	}
	
	.kontakt-banner .flex{
		align-items: center;
	}
	
	.cta-kontakt-banner a{
		font-size: 18px;
	}
	
	h1{
		font-size: 20px;
	}
	
	h2{
		font-size: 18px;
		margin: 5px 0 18px;
	}
	
	h3{
		font-size: 17px;
	}
	
	.slider{
		border-bottom: solid black 4px;
	}
	
	.einsatzbereiche-stoerer h3{
		border-left: none;
		border-right: none;
		padding: 15px 0;
		font-size: 25px;
	}
	
	.flex{
		flex-wrap: wrap;
	}
	
	.einsatzbereiche-stoerer{
		position: relative;
		width: auto;
	}
	
	.einsatzbanner{
		height: auto;
		opacity: 1;
		top: unset;
		bottom: 0;
		background:linear-gradient(315deg, rgba(255, 230, 25, 0.83) 0%, rgba(255, 230, 25, 0.83) 100%);
	}
	
	.leistungskacheln article{
		width: 50%;
	}
	
	section, .full-artile-page{
		padding: 25px 0;
	}
	
	#nav-btn{
		display: block;
		z-index: 999;
	}
	
	.slide-in-nav{
		right: 0!important;
	}
	
	#logo img{
		width: 200px;
	}
	
	header{
		height: 80px;
	}
	
	main{
		padding-top: 80px;
	}
	
	.slide-up{
		padding-top: 80px;
	}
	
	.einsatz{
		width: calc(50% - 4px);
	}
	
	.shrink{
		height: 80px;
	}
	
	#contacts{
		position: fixed;
		bottom: 0;
		width: 100%;
		left: 0;
		background-color: white;
		border-top: solid 3px #ffe619;
		padding: 10px 0;
		justify-content: center;
	}
	
	#contacts a, #contacts p{
		font-size: 18px;
	}
	
	nav{
		position: fixed;
		top: 0;
		right: -100%;
		transition: all 0.7s;
		width: 75%;
		border-left: solid 4px #FFE619; 
		height: 100%;
		background-color: white;
		display: flex;
		align-items: center;
	}
	
	nav ul li{
		display: block;
		padding: 10px 0;
	}
	
	nav ul li ul{
		height: auto;
		position: relative;
		top: 0;
		left: 0;
		opacity: 1;
		max-height: unset;
		max-width: unset;
		width: auto;
		border: none;
	}
	
	nav ul{
		padding: 0 5px;
	}
	
	nav ul li ul li{
		border-bottom: solid 1px lightgray;
		padding: 10px 0;
		margin: 10px 10px 10px 0;
	}
	
	nav ul li ul li:last-of-type, nav ul li ul li:first-of-type{
		margin: 10px 0 0 0;
	}
	
	.shrink nav ul li ul li{
		padding: 10px 0;
	}
	
	.shrink nav ul li ul{
		top: 0;
	}
	
	.shrink nav ul li{
		padding: 10px 0;
	}
}

@media only screen and (max-width:900px){
	.gelber-banner-text-bild article{
		width: 100%;
		margin-bottom: -70px;
	}
	
	.gelber-banner-text-bild figure{
		width: 100%;
		top: 100px;
	}
	
	.gelber-banner-text-bild{
		margin: 25px 0 100px;
	}
	
	.gelber-banner-bild-text{
		margin: 200px 0 25px 0;
	}
	
	.gelber-banner-bild-text article{
		width: 100%;
		margin-top: -70px;
	}
	
	.gelber-banner-bild-text figure, .banner-bild-artikel figure, .banner-bild-artikel article, .banner-artikel-bild article, .banner-artikel-bild figure{
		width: 100%;
	}
	
	.banner-bild-artikel img, .banner-artikel-bild img{
		max-height: 250px;
	}
	
	.banner-artikel-bild{
		margin: 50px 0;
	}
	
	.einsatzbereiche-paralax{
		background-position: center;
	}

	.ms-layer{
		height: 50vh !important;
	}

	.ms-layer video, .ms-layer img{
		height: 100% !important;
		object-fit: cover !important;
	}
	
}

@media only screen and (max-width:768px){
	.featured article, .featured figure{
		width: 100%;
		margin: 10px 0;
	}
	
	p, main ul li{
		font-size: 16px;
	}
	
	.sub-rec article{
		padding: 10px !important;
		width: calc(100% - 20px);
	}

	.benefit img{
		max-width: 100%;
		object-fit: contain;
	}

	#cta-apply{
		padding: 10px;
		bottom: 60px;
	}

	.stoerer figure{
		display: none;
	}

	.stoerer p{
		font-size: 16px;
	}

	.toggle, .testimonials article{
		width: 100%;
		flex: unset;
	}

	.stoerer article{
		padding: 30px;
	}

	.overlay-spacer{
		width: 100%;
	}
	
	.main-article-divided article{
		width: 100%;
		margin: 10px 0;
	}
	
	.paralax-overlay{
		padding: 70px 0;
	}
	
	.einsatzbereiche-paralax{
		margin: 25px 0 0 0;
	}
	
	.kacheln-page article{
		flex-basis: 50%;
	}
	
	.einsatz{
		width: 100%;
		border:none;
	}
	
	#contacts p:first-of-type{
		margin-right: 5px;
	}
	
	.einsatzbanner p{
		font-size: 16px;
	}
	
	.einsatz img, .einsatz:last-of-type img{
		max-height: 300px;
	}
	
	.featured{
		margin: 15px 0;
	}
	
	.einsatzbereiche-stoerer h3{
		font-size: 20px;
		border:none;
	}

	.kacheln-content article{
		width: 100%;
	}
}

@media only screen and (max-width:620px){
	.leistungskacheln article{
		width: 100%;
	}
	
	
	.mobile-info{
		display: block;
	}
	
	.benefits{
		position: relative;
	}
	
	
	/*
	.benefits::after{
		background-image: url('img/scroller-show.svg');
		display: block;
		content: '';
		position: absolute;
		right: 30px;
		bottom: -10px;
		width: 30px;
		height: 30px;
		background-size: contain;
		background-repeat: no-repeat;
	}
	*/
	
	.benefit article p, .benefit article a{
		text-align:left;
	}
	
	.kooperationen img{
		max-width:100%;
	}
	
	.rahmenplan, .single-content .cta, .single-content .benefits{
		padding: 5px 10px;
		width: calc(100% - 20px);
	}
	
	.single-content aside{
		margin: 5px 0;
		padding: 5px 10px;
		width: calc(100% - 20px);
	}
	
	.single-content aside:first-of-type{
		margin: 10px 0;
	}
	
	.single-content ul{
		padding-left: 25px;
	}
	
	.single-content article{
		width: calc(100% - 20px);
		padding: 5px 10px;
	}
	
	.single-content p{
		text-align: left;
	}
	
	.single-content h1{
		font-size: 18px;
		margin: 10px 0;
	}
	
	.single-content h3{
		font-size: 16px;
	}
	
	.benefits .flex{
		flex-wrap: nowrap;
		overflow-x: scroll;
		overflow-y: hidden;
	}
	
	.benefit{
		width: auto;
		margin: 0 10px;
	}
	
	.kooperationen img{
		width: 100px;
	}

	#contacts{
		display: none;
	}
	
	.black-links{
		padding: 50px 0 100px;
	}
	
	.fixed{
		bottom: 50px;
		right: 5%;
	}

	.bewerbung a{
		padding: 10px;
		font-size: 16px;
	}

	main ul li{
		overflow-wrap: break-word;
	}

	.single-content .benefits figure{
		width: calc(100% - 10px);
	}

	.mitarbeiter-zitate article{
		width: 100%;
	}

	.stoerer{
		display: none;
	}

	#cta-apply{
		right: 5%;
		bottom: 80px;
	}

	.leistungskacheln article, .leistungskacheln img{
		height: 200px;
	}

	.kacheln-page article{
		flex-basis: 100%;
	}

	.leistungsbanner p, #contacts a, #contacts p{
		font-size: 16px;
	}

	footer .footer-links img{
		margin: 15px;
	}
	
	#logo img{
		width: 115px !important;
	}
	
	.leistungskacheln aside h3{
		font-size: 18px;
	}
	
	.black-links ul li:first-of-type{
		left: 0;
	}
	
	.black-links-content{
		width: 50%;
	}
	
	header, .shrink{
		height: 50px;
	}
	
	.slide-up, main{
		padding-top: 50px;
	}
	
	#logo img{
		width: 100px;
	}
	
	footer .flex a{
		width: 32%;
	}

	.overlay-slider{
		max-width: 90%;
		left: 5%;
	}

	.slide-168 .overlay-slider{
		right: 5%;
		left: unset;
	}
	
}

@media only screen and (max-width:500px){
	nav{
		width: calc(100% - 3px);
	}
	
	.flex-control-nav, .flex-direction-nav{
		display: none !important;
	}
	
	.contacts, .cta-kontakt-banner{
		width: 100%;
		margin: 10px 0;
		text-align: center;
	}
		
	.black-links-content{
		width: 100%;
		margin: 10px 0;
	}
	
	.black-links ul{
		list-style-image: none;
		list-style-type: none;
	}
	
	nav{
		right: -110%;
	}
	
	.all-benefits ul li{
		font-size: 14px;
	}

	.stellen-wall article{
		width: 100%;
	}

	.benefit figure{
		padding: 20px;
	}

	.benefit figure p{
		overflow-wrap: break-word;
		font-size: 15px;
	}

	.benefit article p, .benefit article a{
		font-size: 15px;
	}

	.benefit img, .benefit:hover img{
		height: 60px;
	}

	.kachel-content{
		height: auto;
	}
	
}