/*
*Stylesheet fuer https://www.ennac.de/
*
*@author Eva Feldmann
*@link https://www.bbdf.design
*@copyright Copyright 2018, BBDF Design & Medien
*/
/*Fonts*/
/* pt-sans-regular - latin */
@font-face {
	font-family: 'PT Sans';
	font-style: normal;
	font-weight: 400;
	src: url('../fonts/pt-sans-v17-latin-regular.eot'); /* IE9 Compat Modes */
	src: local(''),
		 url('../fonts/pt-sans-v17-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
		 url('../fonts/pt-sans-v17-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
		 url('../fonts/pt-sans-v17-latin-regular.woff') format('woff'), /* Modern Browsers */
		 url('../fonts/pt-sans-v17-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
		 url('../fonts/pt-sans-v17-latin-regular.svg#PTSans') format('svg'); /* Legacy iOS */
  }
  
  /* pt-sans-italic - latin */
  @font-face {
	font-family: 'PT Sans';
	font-style: italic;
	font-weight: 400;
	src: url('../fonts/pt-sans-v17-latin-italic.eot'); /* IE9 Compat Modes */
	src: local(''),
		 url('../fonts/pt-sans-v17-latin-italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
		 url('../fonts/pt-sans-v17-latin-italic.woff2') format('woff2'), /* Super Modern Browsers */
		 url('../fonts/pt-sans-v17-latin-italic.woff') format('woff'), /* Modern Browsers */
		 url('../fonts/pt-sans-v17-latin-italic.ttf') format('truetype'), /* Safari, Android, iOS */
		 url('../fonts/pt-sans-v17-latin-italic.svg#PTSans') format('svg'); /* Legacy iOS */
  }
  
  /* pt-sans-700italic - latin */
  @font-face {
	font-family: 'PT Sans';
	font-style: italic;
	font-weight: 700;
	src: url('../fonts/pt-sans-v17-latin-700italic.eot'); /* IE9 Compat Modes */
	src: local(''),
		 url('../fonts/pt-sans-v17-latin-700italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
		 url('../fonts/pt-sans-v17-latin-700italic.woff2') format('woff2'), /* Super Modern Browsers */
		 url('../fonts/pt-sans-v17-latin-700italic.woff') format('woff'), /* Modern Browsers */
		 url('../fonts/pt-sans-v17-latin-700italic.ttf') format('truetype'), /* Safari, Android, iOS */
		 url('../fonts/pt-sans-v17-latin-700italic.svg#PTSans') format('svg'); /* Legacy iOS */
  }
  
  /* pt-sans-700 - latin */
  @font-face {
	font-family: 'PT Sans';
	font-style: normal;
	font-weight: 700;
	src: url('../fonts/pt-sans-v17-latin-700.eot'); /* IE9 Compat Modes */
	src: local(''),
		 url('../fonts/pt-sans-v17-latin-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
		 url('../fonts/pt-sans-v17-latin-700.woff2') format('woff2'), /* Super Modern Browsers */
		 url('../fonts/pt-sans-v17-latin-700.woff') format('woff'), /* Modern Browsers */
		 url('../fonts/pt-sans-v17-latin-700.ttf') format('truetype'), /* Safari, Android, iOS */
		 url('../fonts/pt-sans-v17-latin-700.svg#PTSans') format('svg'); /* Legacy iOS */
  }
  

/*--------------------------------------
Allgemeine Angaben
----------------------------------------*/
.headerweite {
		height: 100%;
}



html, body {
	font-family: 'PT Sans', Arial, sans-serif; 
	font-size: 1em; 
	font-weight: 400;
	line-height: 160%;
	color: #8a8391;
	width: 100%;
}

.seite {
	position: relative;
	padding: 0 0 3.5em 0;
	width:100%;
}

section {
	position: relative;
	/*min-height:100vh;*/
	width: 100%;
transition: all 1000000s ease;
-webkit-transition: all 1000000s ease;
-moz-transition: all 1000000s ease;
-o-transition: all 1000000s ease;
}

h1, h2, h3, h4{
	font-size: 1.3em;
	line-height: 130%;
	color: #26bbe3;
	margin: 0 6% 0 6%;
}



h1 {
	text-transform: uppercase;
	font-weight: bold;
	margin-bottom: 1em;
	padding-top: 1.4em;
}

h1#team {
	padding-top:1.4em;
	margin-bottom: 0;

}

h2 {
	font-weight: 400;
	margin-top: 1.3em;
	margin-bottom: 0.5em;
}

.karriere h2 {
	margin-top: 0em;
}

h3, h4 {
	font-weight: bold;
	font-size: 1em;
	margin-bottom: 0;
}

p, .textbox img:not(.teambild), .karriere a {
	margin: 0 6% 1em 6%;
}

.karriere a:not(.button) {
	color: #0b9533;
}

.karriere a:not(.button):hover {
	text-decoration:underline;
}

.abstandUnten {

	display: block;
}

@media screen and (min-width:1000px) {
.abstandUnten {
	margin-bottom: 2rem;

}
}

.textbox .abstandUnten img {
	margin-bottom:0;
}

a {
	text-decoration: none;
	color: inherit;
}

.energie a {
	text-decoration: underline;
}

.energie a:hover {
	color: #0b9533;
}

.liste {
	position: relative;
	padding-right: 6%;
	margin-left:6%;
	padding-left: 1.2em;
	margin-bottom: 2rem;
}

.impressum ul li ul li {
	margin: 0 6% 0 6%;
}
.titelbild {
	width: 100%;
	height: auto;
	z-index: 10;
	position: relative;
}

.energie .titelbild {
	margin-top: 0;
}

.pfeilicon {
	background-image: url('../images/icon/pfeil.svg');
	width: 3em;
	height: 3em;
	margin: -2em auto 0 auto;
	z-index: 999;
	position: relative;
	cursor: pointer;

}

.pfeiliconlink {
	width: max-content;
	display: block;
	margin: auto!important;
}

.grayout {
	background-color: black;
	display: none;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 1010;
}

.grayout.active {
	display: block;
	opacity: 0.5;
}

/*--------------------------------------
Header
----------------------------------------*/

header {
	position: fixed;
	width: 100%;
	height: 50px;
	z-index: 1020;
	background-color:#fff;
	float: left;
	box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.1);
}

header.open {
	height:70% !important;
	transition:.8s;
	
}

#logo {
	float: left;
	width: 140px;
	margin: 11px 0 0 6%;
}

#logo img {
	width: 100%;
	height: auto;
}

#header-right {
	float:right;
	width:285px;
	margin-right: 6%;
}


@media screen and (min-width: 750px) {
header.big #stellenanzeige {

	margin: 37px 25px 0 0;
	transition: all 0.5s ease;
	-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
}
}

header #stellenanzeige {
	position: relative;
	width: max-content;
	display: inline-block;
	margin: 13px 25px 0 0;
	font-size: 20px;
	color:#0b9533;
	transition: all 0.5s ease;
	-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
}

@media screen and (max-width:560px) {
	header #stellenanzeige {
		display:none;
	}

	#header-right {
		float:right;
		width:max-content;

	}
}

/*--------------------------------------
Navi
----------------------------------------*/
nav {
	float: left;
	width: 100%;
	position: relative;
	top: 45%;
	-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
transform: translateY(-50%);
}

nav ul{
	text-align: center;
	width: 100%;
	text-transform: uppercase;
	font-family: 'Signika Negative', Tahoma, sans-serif;
	font-size: 1.2em;
	display: none;
	list-style: none;
}

nav ul li{
	width: 100%;
	line-height: 200%;
}


.icon {
	width: 22px;
	height: 22px;
	float: right;
	margin: 15px 0 0 0;
	display: inline-block;
	cursor: pointer;
	transition: all 0.5s ease;
	-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
}

.hamburger {
	width: 22px;
	height: 3px;
	position: relative;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	background: #000;
	transition: all 0.5s ease;
	-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
}

.hamburger:before, .hamburger:after {
	content: '';
	position: absolute;
	width: 22px; 
	height: 3px;
	background: #000;
	transition: all 0.5s ease;
	-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
}

.hamburger:before {
	top: -8px;
	transition: all 0.5s ease;
	-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
}

.hamburger:after {
	top: 8px;
	transition: all 0.5s ease;
	-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
}

.icon.active .hamburger {
	background: none;
}

.icon.active .hamburger:before {
	transform: rotate(45deg);
	-webkit-transform:  rotate(45deg);
	-ms-transform: rotate(45deg);
	top: 0px;
}

.icon.active .hamburger:after {
	transform: rotate(135deg);
	-webkit-transform: rotate(135deg);
	-ms-transform: rotate(135deg);
	top: 0px;
}



/*--------------------------------------
Startseite
----------------------------------------*/
#home {
	background-image: url('../images/startseite-ennac-hochformat-klein.jpg');
	background-size: cover;
	background-position: bottom;
	color: #545353;
	text-align: center;
	margin-bottom: 1em;
	padding: 0;
}


#home strong {
	font-weight: bold;
}

.scrollicon {
	position: relative;
	display: block;
	width: 30px;
	height: 30px;
	background-image: url('../images/icon/startpfeil-grau.svg');
	background-repeat: no-repeat;
	margin: 8% auto;
}
 .einleitung {
	position: relative;
	top: 4em;
	display: block;
	width: 100%;
	height: 100vh;
	margin: 0 auto;
	/*transition: all 1000000s ease;
-webkit-transition: all 1000000s ease;
-moz-transition: all 1000000s ease;
-o-transition: all 1000000s ease;*/
 }
 
 .einleitung p {
	 margin-bottom:1em;
 }
 

/*--------------------------------------
Leistung
----------------------------------------*/

.leistung li:first-of-type {
	display: none;
}

/*--------------------------------------
Referenzen
----------------------------------------*/
.referenzliste {
	position:relative;
	list-style: none;
	/*margin-left: 0;*/
	width:88%;
	margin:auto;
	height: auto;
}

.referenz {
	position:relative;
	margin-bottom: 1.5em;
	height: 120px;
	overflow: hidden;
	/*cursor: pointer;*/

}


.referenz.open {
	height: auto;
	overflow: visible;

	background-color: black;
	padding-bottom: 0.6em;
}


.referenz img {
	position: relative;
	width: 100%;
	height: auto;
	bottom: 0;
	margin: 0;
	padding: 0;
}

h4 {
	font-weight: bold;
	color: #26bbe3;

	margin: 0.8em 3% 0.6em 3%;
}

dt {
	font-weight: bold;
	margin-top: 0.4em;
	color: white;
	margin: 0.4em 3% 0em 3%;

}

dd {
	color: white;
	margin: 0em 3% 0.4em 3%;

}

.anfrageinfo {
	position: absolute;
	font-weight: bold;
	font-size: 1.2em;
	text-align: center;
	padding: 0 8%;
	height: 120px;
	top: 22%;
	line-height: 120%;
}

.referenz:last-of-type {
	background-color: #E8E6E9
}

.referenz:last-of-type img {
	opacity: 0;
}

a.link:hover {
	color: #0b9533;
}

.zurueck::before {
	content: "➜";
	width:20px;
	height:20px;
	display:inline-block;
	margin-right:5px;
	transform:rotate(180deg);
	top: 5px;
position: relative;

}

.vorwaerts::before {
	content: "➜";
	width:20px;
	height:20px;
	display:inline-block;
	margin-right:5px;
	position: relative;

}


.referenz.open:last-of-type {

	height: 120px;
	overflow: hidden;

	padding-bottom: 0em;
}

.bild {
	position: relative;
	height: 100%;
	line-height: 0;
}

.infoicon {
	position: absolute;
	width: 30px;
	height: 30px;
	background-image: url('../images/icon/info.svg');
	z-index: 1000;
	bottom: 0px;
	right: 0px;
	cursor: pointer;
}
 .referenz.open .infoicon {
	background-image: url('../images/icon/info-closed.svg');
}


/*--------------------------------------
Team
----------------------------------------*/

.teambild {
	width: 100%;
	height: auto;
	margin: 0.5em 0 0.3em 0;
}

.team .liste {
	overflow: hidden;
	list-style: none;
	padding-left: 0;
}

.team .liste li {
	margin-bottom: 0.7rem;
}


.teambereich {
	display: flex;
	flex-wrap:wrap;
	justify-content: space-between;
	width: 88%;
	margin: 0 auto 1rem;
}

.teambereich h2 {
	width: 100%;
}

.teambereich p {
	margin: 0;
}

.teambereich p:last-of-type {
	margin: 0 0 1rem 0;
}

.teambereich div {
	width: 100%;
}

.teambereich h2 {
	margin: 0em;
}

.mitarbeiter h2 {
	margin-top: 0.5em;

}


/*--------------------------------------
Karriere
----------------------------------------*/

.button {
	display:inline-block;
	padding:10px 20px;
	background:#0b9533;
	color: white;
	cursor:pointer;
	}

.button:hover {
	
	background:#096e25;
	
	}



	.karriere h3 {
		font-size: 1.15em;
		font-weight:normal;
	}

	.karriere h4 {
		font-size: 1em;
		font-weight:normal;
		margin:0;
	}

	.kurzinfo {
		margin-top:0.3em;
	}

	.single .kurzinfo {
		margin-top:1em;
	}

	.stellenausschreibung {
		margin-bottom:2em;
		margin-left:6%;
		margin-right: 6%;
		padding-bottom:2em;
		border-bottom: dotted 2px #26bbe3;
		display:block;
	}

	.textbox > .stellenausschreibung:not(.stellenausschreibung.single) {
		margin-top:2em;
	}

	.textbox > .stellenausschreibung.single {
		margin-top:0;
	}

	.stellenausschreibung:last-child {
		border-bottom: none;
	}

	.stellenausschreibung a, .stellenausschreibung p, .stellenausschreibung h2, .stellenausschreibung h3 {
		margin-left:0;
		margin-right:0;
	}

	.stellenausschreibung.single h2 { 
		margin-top:0.8em;
		margin-bottom:0;
	}

	.textbox img.stellenanzeigetitelbild {
			margin: 0 0 1em;
			width: 100%;
			height: auto;
	}

	.kasten {
			background-color: #26bae311;
			padding: 1.5em 2em;
			margin: 1.5em 0em 1.5em 0em;
	}

	.kasten:first-of-type {
		margin-top: 2em;
}

	.kasten ul {
		padding-left:1em;
	}
/*--------------------------------------
Kontakt
----------------------------------------*/
input[type="button"] {
padding:10px;
border-radius:none;
background:#0b9533;
color: white;
cursor:pointer;
border:none;
outline:none;
box-shadow:none;
}
#googlemaps {
	position: absolute;
	width: 100%;
	height: 100%;
}

#mapsWrapper {
	position: relative;
	min-height: 40vh;
	width: 100%;
	z-index: 20;
	bottom: -0.5em;
	margin-top: 1em;
	background-image:url(../images/googlemaps.jpg);
	background-size:cover;
}

#mapsWrapper a:hover {
	color:#0b9533
}

#mapsWrapper > div {
	display: flex; 
	justify-content: center; 
	height:100%;
	align-items: flex-end;
	padding-bottom: 2em;
	padding-top:2em;
}

#mapsWrapper > div > div{
	display: flex; 
	flex-direction: column; 
	gap: 20px;
	width: 80%;
    max-width: 700px;
    background-color: white;
    padding: 20px;
}
#mapsWrapper > div > div > div {
	text-align: center;
}

#adresse::before {
	position: relative;
	display: block;
	content:url(../images/icon/adresse.svg);
	width: 1.8em;
	height: 1.8em;
	float: left;
	margin: 0 0.5em 0 0;
	top: 0.8em;
}


#telefon::before {
	position: relative;
	display: block;
	content:url(../images/icon/telefon.svg);
	width: 1.8em;
	height: 1.8em;
	float: left;
	margin: 0 0.5em 0 0;
}

#webkontakt::before {
	position: relative;
	display: block;
	content:url(../images/icon/email.svg);
	width: 1.8em;
	height: 1.8em;
	float: left;
	margin: 0 0.5em 0 0;
	top: 0.8em;
}

.kontakt {
	padding-bottom: 0;
}
.kontakt h2 {
	font-size: 1em;
	font-weight: bold;
	color: #8a8391;
	margin-bottom:1em;
}
/*--------------------------------------
Footer
----------------------------------------*/


footer {
	background-color: #4d4d4d;
	color: #fff;
	font-size: 0.8em;
	line-height: 160%;
}

footer p {
	padding-top: 2em;
	padding-bottom: 2em;
	margin-bottom: 0;
}

	
/*--------------------------------------
Impressum
----------------------------------------*/
.impressum h3, .impressum h4{
	color: #8a8391;
}

.impressum .textbox {
		margin-bottom: 4em;
}
	

@media (orientation: landscape) {
	/*--------------------------------------
Startseite
----------------------------------------*/
#home {
	background-image: url('../images/startseite-ennac-querformat-klein.jpg');
	background-position: 0px 80%;
}


header.open {
	height:100% !important;
	transition:.8s;
}

.scrollicon {
	margin: 0 auto;
}

}

@media screen and (min-width: 430px) {

.anfrageinfo {
	padding: 0 19%;
}


}

@media screen and (min-width: 500px) {


	
	.teambereich div {
		width: 48.5%;
	}
	
	}

@media screen and (min-width: 682px) and (orientation: landscape) {
		/*--------------------------------------
Startseite
----------------------------------------*/


.einleitung {
	top: 5em;
}

#home {
	background-position: 0px 100%;
}	

.scrollicon {
	margin: 8% auto;

}


}

@media screen and (min-width: 682px) and (orientation: portrait) {
		/*--------------------------------------
Startseite
----------------------------------------*/


.einleitung {
	top: 6em;
}

}




@media screen and (min-width: 682px) {
	
.seite {
	padding: 0 0 0em 0;
}


section {
	overflow: hidden;
}	




.titelbild {
	margin-top: 3em;
}



/*--------------------------------------
Referenzen
----------------------------------------*/
.referenzliste {
	position:relative;
	list-style: none;
	/*margin-left: 0;
	padding: 0 6% 0 6%;*/
	height: auto;
}

.referenz {
	position:relative;
	margin-bottom: 1.5em;
	margin-left: 4%;
	height: auto;
	overflow: hidden;
	/*cursor: pointer;*/
	width: 48%;
	float: left;
}

.referenz.open {
	height: auto;
	overflow: hidden;

	background-color: transparent;
	padding-bottom: 0;
}

.referenz:nth-of-type(2n-1) {
	margin-left: 0;
}
.referenz:last-of-type {
	cursor: default;
}

.referenz:hover > .info {
	display: block;
	width: 100%;
}

.refrenzseite {
	display: block;
	height: auto;
	width:100%;
	position: relative;
}

.info {
	position: absolute;
	top: 0;
	left: 0;
	padding: 0.8rem 1rem;
	color: white;
	background-color: rgba(0, 0, 0, 0.8);
	display: none;
	height: 100%;
	box-sizing: border-box;
	line-height:125%;
}

.info h4 {
	color: #26bbe3;
}
.infoicon {
	display: none;
}



.anfrageinfo {
	font-size:1.4em;
	top: 35%;
	padding: 0 3%;
}




/*--------------------------------------
Kontakt
-----------------------------------------*/

#mapsWrapper {
	margin-top: 2em;
}
	
}
@media screen and (min-width: 682px) and (max-width: 750px) {
	.einleitung {
	font-size: 1em;

}


}

@media screen and (min-width: 750px) and (orientation:portrait) {

		/*--------------------------------------
Startseite
----------------------------------------*/


.einleitung {
	font-size: 1.5em;
	width: 100%;
	line-height: 130%;
	margin: 0 auto;
}
}




@media screen and (min-width: 750px) {
/*--------------------------------------
Header
----------------------------------------*/

header {
	height: 50px;
	box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.1);
	transition: height 0.5s ease;
	-webkit-transition: height 0.5s ease;
	-moz-transition: height 0.5s ease;
	-o-transition: height 0.5s ease;
}

header.big {
	height: 100px;
	transition: height 0.5s ease;
	-webkit-transition: height 0.5s ease;
	-moz-transition: height 0.5s ease;
	-o-transition: height 0.5s ease;
}

header.big #logo {
	width: 300px;
	margin: 20px 0 0 6%;
	transition: all 0.5s ease;
	-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
}

#logo {
	float: left;
	width: 140px;
	margin: 11px 0 0 6%;
	transition: all 0.5s ease;
	-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
}

#header-right {
	width:300px;
}

/*--------------------------------------
Navi
----------------------------------------*/

header.big .icon {
	width: 40px;
	height: 40px;
	margin-top: 30px;
	transition: all 0.5s ease;
	-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
}

header.big .hamburger {
	width: 40px;
	height: 5px;
	transition: all 0.5s ease;
	-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
}

header.big .hamburger:before, header.big .hamburger:after {
	width: 40px; 
	height: 5px;
	transition: all 0.5s ease;
	-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
}

header.big .hamburger:before {
	top: -15px;
	transition: all 0.5s ease;
	-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
}

header.big .hamburger:after {
	top: 15px;
	transition: all 0.5s ease;
	-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
}

.icon {

    margin: 15px 0 0 0;
}

		/*--------------------------------------
Startseite
----------------------------------------*/


.einleitung {
	
	top:8rem;
}

/*--------------------------------------
Team
----------------------------------------*/


.teambereich {
	width: 88%;
	justify-content:flex-start;
}

.teambereich div {
	width: 32%;
	margin-right:1.5%;
}

.teambereich div:nth-of-type(3n) {
	margin-right:0%;
}

}


@media screen and (min-width: 850px) and (orientation: landscape) {
	/*--------------------------------------
Startseite
----------------------------------------*/



#home {
background-image: url('../images/startseite-ennac-querformat-mittel.jpg');
}

.einleitung {
/*top: 8rem;*/
margin: 0 0 0 auto;
width:60%;
text-align:left;
}
}


@media screen and (min-width: 1124px) and (orientation: portrait) {
		/*--------------------------------------
Startseite
----------------------------------------*/

#home {
	background-image: url('../images/startseite-ennac-hochformat.jpg');
}

.einleitung {
	top: 20vh;
	margin: 0 0 0 auto;
}
.einleitung p {
	margin-bottom:2em;
}

	
}


@media screen and (min-width: 1124px) {
	
/*--------------------------------------
Allgemeine Angaben
----------------------------------------*/
	



section .titelbild {
	display: none;
}

section {
	min-height:100vh;
}

.seite, #home, #impressum {
	padding: 0 0 0 0;
	margin: 0 0 1.5em 0;
	background-color: #E8E6E9;
	overflow: hidden
}


.energie, .leistung, .team, .kontakt {
	background-size: cover;
	position: relative;
	width: 100%;
	height: auto;
	background-position: center;
	background-repeat: no-repeat;
}
.energie {
	background-image: url('../images/energie-nachhaltigkeit-mittel.jpg');
}

.leistung {
	background-image: url('../images/leistungen-mittel.jpg');
}

.team:not(.team.karriere) {
	background-image: url('../images/team-mittel.jpg');
	background-position: bottom;
}

.team.karriere {
	background-image: url('../images/karriere-mittel.jpg');
	background-position: top;
	margin-bottom:0;
	min-height:calc(100vh - 71px);
}

.kontakt {
	background-image: url('../images/kontakt-mittel.jpg');
}

h1 {
	color: #fff;
	text-align: center;
	margin-bottom: 2em;
	padding-top: 3em;
}

h1#team {
	padding-top:6em;
	margin-bottom: 2em;

}

h1, h2 {
	font-size: 2em;
}


h2 {
	font-weight: 400;
	margin-top: 1.3em;
	margin-bottom: 0.5em;
}

.stellenausschreibung.single h2 { 
	margin-top:0.5em;
}

.energie h2 {

	height: 83.2px;
}

h3, h4 {
	font-weight: bold;
	font-size: 1em;
	margin-bottom: 0.6em;
}

.karriere h3 {
	font-size: 1.4em;
}

.karriere h4 {
	font-size: 1.1em;
}

.single .kurzinfo {
	margin-top:1.5em;
}

.pfeilicon {
	display: none;
}

.pfeilicon-desktop {
	background-image: url('../images/icon/pfeil.svg');
	width: 3em;
	height: 3em;
	margin: -1.2em auto 2em auto;
	z-index: 999;
	position: relative;
	display: block;
}


.content {
	position: relative;
	display: flex;
	height: 100%;
	/*width: 88%;*/
	width:80%;
	max-width: 1400px;
	margin: 0 auto;
	justify-content:space-between; 
}

.headerweite {
	position: relative;
	height: 100%;
	/*width: 88%;*/
	width:80%;
	max-width: 1400px;
	margin: 0 auto;
}

header.big #logo {
	margin-left: 0;

}

#header-right {
	margin-right:0;
}

#logo {
	margin-left: 0;
}
.icon {

    margin: 15px 0 0 0;
}
.textbox {
	position: relative;
	float: left;
	width: 32%;
	background-color: #fff;
	margin-bottom: 8em;
	z-index: 30;
}

.textbox p:last-of-type:not(.karriere .textbox p:last-of-type) {
	margin-bottom: 3em;
}

.textbox p:last-of-type.kleinerAbstand {
	margin-bottom:1rem;
}



/*--------------------------------------
Team
----------------------------------------*/
.team .textbox {
	position: relative;
	width: 100%;
	margin: 0 auto 8em auto;
}

.team:not(.team.karriere) h2 {
	margin: 0 0 0.5em 0;
}
.mitarbeiter h2 {
	margin-left: 0;
}



/*--------------------------------------
Kontakt
----------------------------------------*/

#mapsWrapper {
	position: absolute;
	min-height: 50vh;
	width: 100%;
	z-index: 20;
	bottom: 0px;
	height: 50vh;
}



.kontakt .textbox {
	position: relative;
	width: 32%;
	margin: 0 auto;
	padding-bottom: 2em;
}

.kontakt .textbox p{
	margin-bottom: 1em;
}
#kontaktdaten{
	width: 210px;
	margin: 0 auto 1.5em auto;
}


.kontakt {
	margin: 0;
}


/*--------------------------------------
Leistungen
----------------------------------------*/

.liste {
	padding: 0 0 3em 0;
	margin:0 0 8em 0;
	display: block;
	}
	
.leistung li {
		padding-left: 0;
		margin: 0 6% 0 10%;
}	

.leistung li:first-of-type {
	list-style: none;
	padding-left: 0;
	margin: 0;
	display: block;
}
/*--------------------------------------
Referenzen
----------------------------------------*/
.referenzliste {
	position:relative;
	list-style: none;
	max-width: 1400px;
	margin: 0 auto 6em;
	/*padding: 0 6% 0 6%;*/
	height: auto;
	overflow: hidden;
	width:80%;

}

.referenz {
	position:relative;
	margin-bottom: 1.5em;
	margin-left: 2%;
	height: auto;
	overflow: hidden;
	/*cursor: pointer;*/
	width: 32%;
	float: left;
}

.referenz:nth-of-type(2n-1) {
	margin-left: 2%;
}

.referenz:nth-of-type(3n-2) {
	margin-left: 0;
}

.referenz:last-of-type img {
	opacity: 1;
}

.referenz.open:last-of-type {

	height: 100%;

}

/*--------------------------------------
Footer
----------------------------------------*/

footer {
	text-align: center;
}



/*--------------------------------------
Impressum
----------------------------------------*/


#impressum .content {
    position: relative;
    display: block;
    height: 100%;
    width: 88%;
    max-width: 1400px;
    margin: 0 auto;
    justify-content: inherit;
}	

#impressum .content p {
    margin: 0 6% 1.5em 6%;
}

#impressum h1 {
    margin: 2em 0 2em 0 ;
	padding-top: 3em;

}
#impressum .content h2 {
    margin: 2em 6% 1em 6%;
	font-size: 1.5em;
}

#impressum {
	margin: 0;
}

h3 {
	margin: 0 6% 0 6%;
}
.impressum h4 {
	margin: 0 6% 0 6%;
}
.impressum {
	margin-bottom: 2em;
}

.impressum .textbox {
	width: 100%;
}



}

@media screen and (min-width: 1250px) and (orientation:landscape) {
	/*--------------------------------------
Startseite
----------------------------------------*/


.einleitung {
top: 20vh;
}

}

@media screen and (min-width: 1250px)

{

	#home {
		background-image: url('../images/startseite-ennac-querformat-gross.jpg');
	}
	
	.energie {
		background-image: url('../images/energie-nachhaltigkeit-gross.jpg');
	}
	
	.leistung {
		background-image: url('../images/leistungen-gross.jpg');
	}
	
	.team:not(.team.karriere) {
		background-image: url('../images/team-gross.jpg');
	}

	.team.karriere {
		background-image: url('../images/karriere-gross.jpg');
	}
	
	.kontakt {
		background-image: url('../images/kontakt-gross.jpg');
	}



/*--------------------------------------
Team
----------------------------------------*/

.team .textbox {
	margin-bottom: 10em;
}
.teambereich {
	width: 88%;
}

.teambereich div {
	width: 19%;
	margin-right:1%;
}

.teambereich div:nth-of-type(3n) {
	margin-right:1%;
}
.teambereich div:nth-of-type(5n) {
	margin-right:0%;
}

}


@media screen and (min-width: 1498px) {

	
.einleitung {
	font-size: 1.5em;
	line-height: 130%;
}

/*--------------------------------------
Referenzen
----------------------------------------*/


.referenz {
	position:relative;
	margin-bottom: 1.5em;
	margin-left: 1%;
	height: auto;
	overflow: hidden;
	/*cursor: pointer;*/
	width: 24%;
	float: left;
}


.referenz:nth-of-type(3n-2) {
	margin-left: 1%;
}

.referenz:nth-of-type(4n-3) {
	margin-left: 0;
}
.referenz:nth-of-type(2n-1) {
    margin-left: 1%;

/*.headerweite {
		max-width: 1400px;
		margin: 0 auto;
		width: 100%;
}*/


}


}

@media screen and (min-width: 1600px) {

	
	.einleitung {
		font-size: 1.5em;
		line-height: 130%;
	}
}
@media screen and (min-width: 1600px) and (min-height:820px){

	.einleitung {
		font-size: 2em;
		line-height: 130%;
	}
	
#logo, header.big #logo {
	margin-left: 0;
}	
	
#header-right {
	margin-right: 0;

}
	
.icon {
	margin-right: 0;
}	

/*--------------------------------------
Team
----------------------------------------*/

.team .textbox {
	margin-bottom: 12em;
}

}



@media (pointer: coarse) {
	
.section {
	transition: all 1000000s ease;
-webkit-transition: all 1000000s ease;
-moz-transition: all 1000000s ease;
-o-transition: all 1000000s ease;
}

.infoicon {
	display: block;
}

.referenz:hover > .info {
	display: none;
}

.referenz.open > .info {
	display: block;
}
}