body {
	overflow-x: hidden;
	overflow-y:auto;
	/* background-image:url('../images/hg_firma_winzig.jpg'); */
	/* background-size:contain; */
	/* background-repeat:no-repeat; */
	background: linear-gradient(0deg, rgba(0,0,0,0.0) 0%, rgba(0,0,0,0.2) 70%, rgba(0,0,0,0.5) 100%);
}

#navi_opener {
	width:30px;
	position:absolute;
	top:40px;
	right:20px;
	cursor:pointer;
}
#head-slogan {
	font-family: "NeueHaasUnicaPro-Bold";
	color:#FFFFFF;
	font-size:15px;
	position:absolute;
	top:40px;
	right:80px;
}
#logo-top {
	height:70px;
	position:absolute;
	left:20px;
	top:25px;
}
#startslider {
	background-image: url('../images/slider-elektro-braeuning-firma-0.jpg');
}
#startslider a {
	color:#FFFFFF;
}
#startslider .slider-content button:hover {
	background-color:#FFFFFF;
	cursor:pointer;
}
.erklaerung a, .erklaerung a:hover {
	color:#FFFFFF;
}

.container-fluid {
	padding:0px !important;
}





#matrix > div:hover {
	transition:0.5s;
	background-color:#F0F0F0;
}



#matrix > div:nth-child(1) {
	border-right: 1px dotted #979797;
	border-bottom: 1px dotted #979797;
}
#matrix > div:nth-child(2) {
	border-bottom: 1px dotted #979797;
}
#matrix > div:nth-child(3) {
	border-right: 1px dotted #979797;
	border-bottom: 1px dotted #979797;
}
#matrix > div:nth-child(4) {
	border-bottom: 1px dotted #979797;
}
#matrix > div:nth-child(5) {
	border-right: 1px dotted #979797;
	border-bottom: 1px dotted #979797;
}
#matrix > div:nth-child(6) {
	border-bottom: 1px dotted #979797;
}
#matrix > div:nth-child(7) {
	border-right: 1px dotted #979797;
}
#matrix > div:nth-child(8) {

}


.content-container {
	max-width:100%;
	/*background-color:none;*/
	margin-left:auto;
	margin-right:auto;
	padding-left:20px;
	padding-right:20px;
}


h1 {
	font-size:51px !important;
	color:#4a4a4a;
	line-height:35px !important;
	font-family: "NeueHaasUnicaPro-Light";
	margin-top:0px;
	font-weight:normal;
	text-align:center;
}

h2 {
	font-family: "NeueHaasUnicaPro-Bold";
	text-align:center;
}




footer {
	height:475px;
	background-color: #393c3e;
}
#absatz2 {
	padding-bottom:100px;
}

body {
	margin:0px;
}

p {
	margin-bottom:0px !important;
}

p.erlaeuterung {
	font-size:17px !important;
	line-height:27px !important;
	font-family: "NeueHaasUnicaPro-Regular" !important;
}

p.erlaeuterung strong {
	font-family: "NeueHaasUnicaPro-Italic" !important;
}
#matrix_logo:hover {
	cursor:pointer;
}


/* MOLEKÜL1 */

	#matrix_logo {
		height:105px;
	}
	#matrix_einleitung {
		font-size:19px !important;
		line-height:30px !important;
		margin-top:25px;
		width: 100%;
	}
	#matrix {
		margin-top:50px;
	}
	#matrix > div > img {
		height:72px;
	}
	#content-100 h2 {
		font-size:15px;
		line-height:16px;
		margin-bottom:0px;
	}


#footer-logo {
	width:250px;
	height:auto;
}
#footer-anrufen {
	width:220px;
	height:45px;
	background:rgba(255,255,255,0.55);
	font-family: "NeueHaasUnicaPro-Bold";
	font-size:18px;
	line-height:28px;
	text-align:center;
	color:#4a4a4a;
	border:none;
	border-radius:3px;
	margin-top:50px;
	margin-bottom:25px;
}
#footer-mail {
	width:220px;
	height:45px;
	background-color:rgba(255,255,255,0.55);
	font-family: "NeueHaasUnicaPro-Bold";
	font-size:18px;
	line-height:28px;
	text-align:center;
	color:#4a4a4a;
	border:none;
	border-radius:3px;
	margin-bottom:75px;
}
#footer-links {
	color:#FFFFFF;
	font-family: "NeueHaasUnicaPro-Regular";
	font-size:17px;
	line-height:26px;
	text-align:center;
	margin-bottom:50px;
}



.job_button_rot {
	font-family: "NeueHaasUnicaPro-Bold";
	background-color:#E21B28;
	color:#FFFFFF;
	width: 220px;
	height: 45px;
	border-radius: 3px;
	border:none;
	font-size: 18px;
}
.job_button_rot:hover {
	background-color: #BD141F;
}
.job_button_rot a {
	color:#FFFFFF;
}
.job_button_rot a:hover {
	color:#FFFFFF;
	text-decoration:none;
}
.firma-header-modul {
	flex-wrap: wrap;
	justify-content: space-between;
	margin-top:75px;
	transition:0.8s;
}
.firma-header-modul img {
	height:100%;
}
.zitat-firma {
	justify-content:flex-start;
}
#anfuehrungszeichen-firma {
	width:28px;
	height:auto;
	align-self:flex-start;
	margin-top:8px;
	margin-right:15px;
	transition:0.8s;
}
#ingo-firma {
	max-width:650px;
	width:245px;
	order:1;
	margin-left:auto;
	margin-right:auto;
	margin-bottom:10px;
	transition:0.8s;
}
#zitat-firma {
	order:2;
	max-width:670px;
}
#zitat-firma p {
	font-family: "NeueHaasUnicaPro-Regular";
	font-size:19px;
	line-height:30px;
}
#zitat-firma p span {
	font-family: "NeueHaasUnicaPro-Regular";
	font-size:17px;
	line-height:30px;
	padding-top:5px;
	display:block;
}
.firma-header-modul>a {
	order:3;
	margin-left:auto;
	margin-right:auto;
}
#polaroid-firma {
	/* order:3; */
	width:100%;
	margin-top:10px;
	max-width:345px;
	transition:0.8s;
	margin-left:10px;
	/* margin-right:auto; */
	height:auto !important;
}
.bildermodul a {
	position:relative;
}
.image-overlay {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  height: 100%;
  width: 100%;
  opacity: 0;
  transition: 0.7s ease;
  background-color: rgba(0,0,0,0.5);
}
.image-overlay:hover {
	opacity: 1;
}
.lupe {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  text-align: center;
}

/* ----------------------------------- MIN 320 ----------------------------------------- */
@media (min-width: 320px) {
	.content-container {
		padding-left:20px;
		padding-right:20px;
	}

	#matrix_logo {
		height:105px;
	}
	#matrix_einleitung {
		font-size:19px !important;
		line-height:30px !important;
		margin-top:25px;
		width: 100%;
	}
	#matrix {
		margin-top:50px;
	}
	#matrix > div > img {
		height:72px;
	}

}

/* ----------------------------------- MIN 360 ----------------------------------------- */
@media (min-width: 360px) {
	.content-container {
		padding-left:20px;
		padding-right:20px;
	}

	#matrix_logo {
		height:120px;
	}
	#matrix_einleitung {
		font-size:19px !important;
		line-height:30px !important;
		margin-top:34px;
		width: 100%;
	}
	#matrix {
		margin-top:50px;
	}
	#matrix > div > img {
		height:81px;
	}
	#content-100 h2 {
		font-size:17px;
		line-height:18px;
		margin-bottom:0px;
	}

	#logo-top {
		left:25px;
	}
}

/* ----------------------------------- MIN 375 ----------------------------------------- */
@media (min-width: 375px) {
	.content-container {
		padding-left:25px;
		padding-right:25px;
	}

	#matrix_logo {
		height:125px;
	}
	#matrix_einleitung {
		font-size:19px !important;
		line-height:30px !important;
		margin-top:34px;
		width: 100%;
	}
	#matrix {
		margin-top:50px;
	}
	#matrix > div > img {
		height:85px;
	}


}

/* ----------------------------------- MIN 480 ----------------------------------------- */
@media (min-width: 400px) {
	#anfuehrungszeichen-firma {
		width:38px;
	}
}

/* ----------------------------------- MIN 568 ----------------------------------------- */
@media (min-width: 568px) {

	.content-container {
		padding-left:35px;
		padding-right:35px;
	}

	h1 {
		font-size:30px !important;
		line-height:40px !important;
	}

	#navi_opener {
		right:40px;
	}
	#head-slogan {
		right:100px;
	}
	.firma-header-modul {
		margin-top:100px;
	}
	#anfuehrungszeichen-firma {
		width:45px;
	}
	.firma-header-modul>a {
		margin-left:0px;
		margin-right:0px;
	}
	#polaroid-firma {
		order:2;
		width:41vw;
		margin-top:-150px;
		max-width:325px;
		margin-left:0px;
		margin-right:0px;
	}
	#zitat-firma {
		order:3;
	}
	#ingo-firma {
		margin-left:0px;
	}
	body {
		overflow-x: hidden;
		overflow-y:auto;
			/* background: linear-gradient(0deg, rgba(0,0,0,0.0) 0%, rgba(0,0,0,0.2) 40%, rgba(0,0,0,0.3) 60%, rgba(0,0,0,0.5) 100%); */
	}
}

/* ----------------------------------- MIN 667 ----------------------------------------- */
@media (min-width: 667px) {
	.content-container {
		padding-left:40px;
		padding-right:40px;
	}


}

/* ----------------------------------- MIN 768 ----------------------------------------- */
@media (min-width: 768px) {

	.content-container {
		padding-left:50px;
		padding-right:50px;
	}

	#matrix_einleitung {
		font-size:19px !important;
		line-height:30px !important;
		margin-top:25px;
		width: 100%;
	}
	#matrix > div > div {
		height:80px;
		margin-top:25px;
		margin-bottom:15px;
	}
	#matrix {
		margin-top:95px;
	}

	#matrix > div {
		height:435px;
		cursor:pointer;
	}
	#matrix > div p {
		font-size:17px;
		line-height:24px;
		padding-left:15px;
		padding-right:15px;
		height:106px;
	}
	#matrix > div > img {
		height:100px;
	}
	#matrix > div:nth-child(1) {
		border-right: 1px dotted #979797;
		border-bottom: 1px dotted #979797;
	}
	#matrix > div:nth-child(2) {
		border-right: 1px dotted #979797;
		border-bottom: 1px dotted #979797;
	}
	#matrix > div:nth-child(3) {
		border-bottom: 1px dotted #979797;
		border-right:none;
	}
	#matrix > div:nth-child(4) {
		border-right: 1px dotted #979797;
		border-bottom: 1px dotted #979797;
	}
	#matrix > div:nth-child(5) {
		border-right: 1px dotted #979797;
		border-bottom: 1px dotted #979797;
	}
	#matrix > div:nth-child(6) {
		border-bottom: 1px dotted #979797;
	}
	#matrix > div:nth-child(7) {
		border-right: 1px dotted #979797;
	}
	#matrix > div:nth-child(8) {
		border-right: 1px dotted #979797;
	}

	footer {
		height:300px;
	}
	#footer-anrufen, #footer-mail {
		display:none;
	}
	#footer-logo {
		margin-bottom:65px;
		width:250px;
		margin-top:25px;
	}
	.s1 {
		padding:30px !important;
		width:auto !important;
		height:auto !important;
		margin-top:0px;
		margin-bottom:0px;
		padding-bottom:60px;
		max-width:760px;
	}


	#logo-top {
		left:50px;
		top:40px;
		height:75px;
	}
	#polaroid-firma {
		width:42.3vw;
		max-width:375px;
	}

}


/* ----------------------------------- MIN 992 ----------------------------------------- */
@media (min-width: 800px) {
	#ingo-firma {
		width:30.6vw;
		max-width:285px;
	}
}

@media (min-width: 960px) {
	#ingo-firma {
		margin-left: 70px;
	}
}

@media (max-width:991px) {
	#matrix > div p {
		display:none;
	}
	#matrix > div {
		height:223px;
		cursor:pointer;
	}
	#matrix > div > img {
		/*height:90px;*/
	}
	#content-100 h2 {
		/*font-size:20px;
		line-height:22px;
		margin-bottom:0px;*/
	}
	#matrix > div > div {
		height:auto;
		margin-top:25px;
		margin-bottom:15px;
	}
}

/* ----------------------------------- MIN 992 ----------------------------------------- */
@media (min-width: 992px) {

	#matrix_einleitung {
		font-size:19px !important;
		line-height:30px !important;
		margin-top:25px;
		width: 700px;
	}
	#matrix > div > div {
		height:80px;
		margin-top:25px;
		margin-bottom:15px;
	}
	#matrix {
		margin-top:130px;
	}

	#matrix > div {
		height:435px;
		cursor:pointer;
	}
	#matrix > div p {
		font-size:17px;
		line-height:24px;
		padding-left:15px;
		padding-right:15px;
		height:146px;
	}
	#matrix > div > img {
		height:100px;
	}
	body {
		overflow-x: hidden;
		overflow-y:auto;
			/* background: linear-gradient(0deg, rgba(0,0,0,0.0) 0%, rgba(0,0,0,0.2) 40%, rgba(0,0,0,0.3) 60%, rgba(0,0,0,0.5) 100%); */
	}

}

/* ----------------------------------- MIN 1024 ----------------------------------------- */
@media (min-width: 1024px) {
	.content-container {
		padding-left:60px;
		padding-right:60px;
	}

	#matrix_einleitung {
		font-size:19px !important;
		line-height:30px !important;
		margin-top:25px;
		width: 700px;
	}
	#matrix > div > div {
		height:80px;
		margin-top:25px;
		margin-bottom:15px;
	}
	#matrix {
		margin-top:100px;
	}

	#matrix > div {
		height:435px;
		cursor:pointer;
	}
	#matrix > div p {
		font-size:17px;
		line-height:24px;
		padding-left:15px;
		padding-right:15px;
		height:146px;
	}
	#matrix > div > img {
		height:100px;
	}

	#footer-logo {
		margin-bottom:56px;
		width:270px;
	}


	#logo-top {
		left:60px;
	}
	#polaroid-firma {
		width:36.6vw;
		max-width:400px;
	}
	#ingo-firma {
		width:27.8vw;
		max-width:315px;
	}

}


/* ----------------------------------- MIN 1103 ----------------------------------------- */
@media (min-width: 1103px) {

}

/* ----------------------------------- MIN 1194 ----------------------------------------- */
@media (min-width: 1194px) {
	.content-container {
		padding-left:60px;
		padding-right:60px;
	}

}

/* ----------------------------------- MIN 1230 ----------------------------------------- */
@media (min-width: 1230px) {

}

/* ----------------------------------- MIN 1280 ----------------------------------------- */
@media (min-width: 1280px) {
	.content-container {
		padding-left:100px;
		padding-right:100px;
	}

	#matrix_einleitung {
		font-size:19px !important;
		line-height:30px !important;
		margin-top:25px;
		width: 800px;
	}
	#matrix > div > div {
		height:80px;
		margin-top:25px;
		margin-bottom:15px;
	}
	#matrix {
		margin-top:130px;
	}

	#matrix > div {
		height:435px;
		cursor:pointer;
	}
	#matrix > div p {
		font-size:18px;
		line-height:26px;
		padding-left:15px;
		padding-right:15px;
		height:106px;
	}
	#matrix > div > img {
		height:100px;
	}

	footer {
		height:350px;
	}
	#footer-logo {
		margin-bottom:80px;
		width:275px;
	}
	#polaroid-firma {
		width:31.2vw;
		max-width:460px;
	}
	#ingo-firma {
		width:24.6vw;
		max-width:375px;
	}

}

/* ----------------------------------- MIN 1366 ----------------------------------------- */
@media (min-width: 1366px) {
	.content-container {
		padding-left:0px;
		padding-right:0px;
		max-width:1400px;
	}

	#matrix_einleitung {
		font-size:20px !important;
		line-height:30px !important;
		margin-top:25px;
		width: 800px;
	}
	#matrix > div > div {
		height:80px;
		margin-top:25px;
		margin-bottom:15px;
	}
	#matrix {
		margin-top:130px;
	}
	#matrix > div {
		height:435px;
		cursor:pointer;
	}
	#matrix > div p {
		font-size:18px;
		line-height:26px;
		padding-left:15px;
		padding-right:15px;
		height:106px;
	}


}



/* ----------------------------------- MIN 1680 ----------------------------------------- */
@media (min-width: 1680px) {
	#ingo-firma {
		width:22.3vw;
		max-width:375px;
	}
}

/* ----------------------------------- MIN 1920 ----------------------------------------- */
@media (min-width: 1920px) {
	.content-container {
		width:1400px !important;
		padding-left:0px;
		padding-right:0px;
	}

	#matrix_einleitung {
		font-size:20px !important;
		line-height:30px !important;
		margin-top:25px;
		width: 900px;
	}
	#matrix > div > div {
		height:80px;
		margin-top:25px;
		margin-bottom:15px;
	}
	#matrix {
		margin-top:130px;
	}

	#matrix > div {
		height:435px;
		cursor:pointer;
	}
	#matrix > div p {
		font-size:18px;
		line-height:26px;
		padding-left:15px;
		padding-right:15px;
		height:106px;
	}

	footer {
		height:500px;
	}
	#footer-logo {
		margin-bottom:170px;
		margin-top:70px;
		width:300px;
	}
	#footer-links {
		font-size:18px;
	}
	body {
		overflow-x: hidden;
		overflow-y:auto;
			/* background: linear-gradient(0deg, rgba(0,0,0,0.0) 0%, rgba(0,0,0,0.2) 40%, rgba(0,0,0,0.3) 60%, rgba(0,0,0,0.5) 100%); */
	}
}

/* ----------------------------------- MIN 2068 ----------------------------------------- */
@media (min-width: 2068px) {
	#polaroid-firma {
		max-width:485px;
	}

}

/* ----------------------------------- MIN 2550 ----------------------------------------- */
@media (min-width: 2550px) {
	.content-container {
		width:1400px;
	}

	#matrix_einleitung {
		font-size:21px !important;
		line-height:31px !important;
		margin-top:25px;
		width: 900px;
	}


	#matrix > div > div {
		height:80px;
		margin-top:20px;
		margin-bottom:15px;
	}
	#matrix {
		margin-top:130px;
	}

	#matrix > div {
		height:435px;
		cursor:pointer;
	}
	#matrix > div p {
		padding-left:15px;
		padding-right:15px;
		height:106px;
		font-size:18px;
		line-height:26px;
	}


}
