@charset "UTF-8";
/* Einfache fließende Medien
   Hinweis: Für fließende Medien müssen Sie die Attribute 'height' und 'width' des Medium aus dem HTML-Code entfernen
   http://www.alistapart.com/articles/fluid-images/ 
*/
img, object, embed, video {
	max-width: 100%;
}
/* IE 6 unterstützt keine maximale Breite, verwenden Sie daher eine Standardbreite von 100% */
.ie6 img {
	width:100%;
}

html {
	height:100%;
	width:100%;
}

body {
	background-color:#5e5e5e;
	font-family: 'titillium_webregular', sans-serif;
	font-size:16px;
}

/*
	Dreamweaver-Eigenschaften für fließende Raster
	----------------------------------
	dw-num-cols-mobile:		5;
	dw-num-cols-tablet:		8;
	dw-num-cols-desktop:	10;
	dw-gutter-percentage:	25;
	
	Idee durch den Artikel "Responsive Web Design" von Ethan Marcotte 
	http://www.alistapart.com/articles/responsive-web-design
	
	und "Golden Grid System" von Joni Korpi
	http://goldengridsystem.com/
*/

/* Layout für Mobilgeräte: 480 px oder weniger. */


a.nav:link { font-family: 'titillium_webregular', sans-serif; color: #ffffff; font-size: 16px; line-height:30px; text-decoration: none; text-align:left; transition: .5s background-color; }
a.nav:visited { font-family: 'titillium_webregular', sans-serif; color: #ffffff; }
a.nav:hover { font-family: 'titillium_webregular', sans-serif; color: #000000; }
a.nav:active { font-family: 'titillium_webregular', sans-serif; color: #000000; }

a.navphoto:link { font-family: 'titillium_websemibold', sans-serif; color: #AAAAAA; font-size: 26px; line-height:30px; text-decoration: none; text-align:left; transition: .5s background-color; }
a.navphoto:visited { font-family: 'titillium_websemibold', sans-serif; color: #AAAAAA; }
a.navphoto:hover { font-family: 'titillium_websemibold', sans-serif; color: #ffffff; }
a.navphoto:active { font-family: 'titillium_websemibold', sans-serif; color: #ffffff; }

a.navu:link { font-family: 'titillium_webregular', sans-serif; color: #BBBBBB; display:block; float:left; font-size: 16px; line-height:30px; width:260px; margin-left:10px; margin-right:10px;  text-decoration: none; text-align:left; transition: .5s background-color; }
a.navu:visited { font-family: 'titillium_webregular', sans-serif; color: #AAAAAA; }
a.navu:hover { font-family: 'titillium_webregular', sans-serif; color: #ffffff; }
a.navu:active { font-family: 'titillium_webregular', sans-serif; color: #ffffff; }

a.navua:link { font-family: 'titillium_webregular', sans-serif; color: #ffffff; display:block; float:left; font-size: 16px; line-height:30px; width:260px; margin-left:10px; margin-right:10px;  text-decoration: none; text-align:left; transition: .5s background-color; }
a.navua:visited { font-family: 'titillium_webregular', sans-serif; color: #ffffff; }
a.navua:hover { font-family: 'titillium_webregular', sans-serif; color: #ffffff; }
a.navua:active { font-family: 'titillium_webregular', sans-serif; color: #ffffff; }

a.navm:link { font-family: 'titillium_webregular', sans-serif; color: #5e5e5e; font-size: 22px; background-color:#ffffff; display: block; width:auto; padding-left:20px; padding-right:20px; margin-top:15px; text-decoration: none; text-align:left; transition: .5s background-color; }
a.navm:visited { color: #5e5e5e; }
a.navm:hover { color: #000000; }
a.navm:active { color: #000000; }

a.navms:link { font-family: 'titillium_webregular', sans-serif; color: #5e5e5e; font-size: 18px; background-color:#ffffff; display: block; width:auto; padding-left:20px; padding-right:20px; margin-left:20px; text-decoration: none; text-align:left; transition: .5s background-color; }
a.navms:visited { color: #5e5e5e; }
a.navms:hover { color: #000000; }
a.navms:active { color: #000000; }

a.tel:link { font-family: 'titillium_webregular', sans-serif; color: #c31924; font-size: 16px; text-decoration:none; }
a.tel:visited { font-family: 'titillium_webregular', sans-serif; color: #c31924; }
a.tel:hover { font-family: 'titillium_webregular', sans-serif; color: #000000; }
a.tel:active { font-family: 'titillium_webregular', sans-serif; color: #000000; }

a.mail:link { font-family: 'titillium_webregular', sans-serif; color: #c31924; font-size: 16px; text-decoration:none; }
a.mail:visited { font-family: 'titillium_webregular', sans-serif; color: #c31924; }
a.mail:hover { font-family: 'titillium_webregular', sans-serif; color: #000000; }
a.mail:active { font-family: 'titillium_webregular', sans-serif; color: #000000; }

a.impress:link { font-family: 'titillium_webregular', sans-serif; color: #FFFFFF; background-color:#555555; font-size: 16px; text-decoration:none; transition: .5s background-color; padding:10px; padding-left:20px; padding-right:20px; margin-left:5px; clear:none; float:left; 
-moz-box-shadow:0px 2px 3px #333333; /* Firefox */
-webkit-box-shadow:0px 2px 3px #333333; /* Chrome, Safari */
-khtml-box-shadow:0px 2px 3px #333333; /* Konqueror */
box-shadow:0px 2px 3px #333333; /* CSS3 */ 
background-image: -webkit-linear-gradient(top left, #999999 25%, #666666 100%); 
background-image: -moz-linear-gradient(right bottom, #999999 25%, #666666 100%); 
background-image: -o-linear-gradient(#999999 25%, #666666 100%); 
background-image: linear-gradient(#999999 25%, #666666 100%); }
a.impress:visited { font-family: 'titillium_webregular', sans-serif; color: #FFFFFF; background-color:#555555; }
a.impress:hover { font-family: 'titillium_webregular', sans-serif; color: #000000; background-color:#FFFFFF;
background-image: -webkit-linear-gradient(top left, #BBBBBB 25%, #999999 100%); 
background-image: -moz-linear-gradient(right bottom, #BBBBBB 25%, #999999 100%); 
background-image: -o-linear-gradient(#BBBBBB 25%, #999999 100%); 
background-image: linear-gradient(#BBBBBB 25%, #999999 100%); } }
a.impress:active { font-family: 'titillium_webregular', sans-serif; color: #000000; background-color:#FFFFFF; }

.scrollToTop{
	width:26px; 
	height:26px;
	padding:10px; 
	text-align:center; 
	background: whiteSmoke;
	font-weight: bold;
	color: #444;
	text-decoration: none;
	position:fixed;
	bottom:45px;
	right:25px;
	display:none;
	background: url('images/scroll-top.png') no-repeat;
	background-size:contain;
	z-index:4;
}
.scrollToTop:hover{
	text-decoration:none;
}

.thumb {
	border:none;
	text-decoration:none;
    }
	
.thumb:hover {
        zoom: 1;
        filter: alpha(opacity=40);
        opacity: 0.4;
     -webkit-transition: opacity .50s;
        -moz-transition: opacity .50s;
        -ms-transition: opacity .50s;
        -o-transition: opacity .50s;
        transition: opacity .50s;
    }

figure figcaption {
	background-color:#c31924;
	background-image:url(images/header.png);
	background-position:center;
	background-size:200%;
	background-repeat:no-repeat;
  padding: 5%;
  color: #cccccc;
  font-size:12px;
}

figure:hover figcaption {
  color: #FFFFFF;
  font-size:12px;
}

h1 {
	font-family: 'titillium_webregular', sans-serif;
	font-size:20px;
	color:#FFFFFF;
	margin-top:0px;
	margin-bottom:0px;
}	
	
h3 {
	font-family: 'titillium_websemibold', sans-serif;
	font-size:20px;
	margin-bottom:10px;
	color:#5e5e5e;
	margin-top:0px;
}
p.bildunterschrfit {
	font-style: italic;
	background-color: #FFFFFF; 
	margin: 0px; 
	padding-top: 10px;
}

  
.gridContainer {
	margin-left: auto;
	margin-right: auto;
	width: 91.36%;
	padding-left: 1.82%;
	padding-right: 1.82%;
}
#LayoutDiv1 {
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: block;
}
#LayoutDiv2 {
	background-color:#000;
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: block;
}
#Bild {
	background-color:#C00;
	background-image:url(images/thumb_hg.jpg);
	background-repeat:no-repeat;
	background-size:contain;
	clear: none;
	float: left;
	margin-left: 0;
	width: 48%;
	display: block;
	margin:1%;
}
#Bildleistung {
	background-color:#C00;
	background-image:url(images/pfeil_hg.jpg);
	background-repeat:no-repeat;
	background-size:contain;
	clear: none;
	float: left;
	margin-left: 0;
	width: 48%;
	display: block;
	margin:1%;
}
#Titelbild {
	clear: both;
	float: left;
	background-image:url(images/Titelbild.jpg);
	background-repeat:no-repeat;
	background-position:center;
	background-size:cover;
	margin-left: 0;
	width: 100%;
	height:200px;
	display: block;
}
#Titelbild2 {
	clear: both;
	float: left;
	background-color:#C00;
	background-image:url(images/thumb_hg.jpg);
	background-repeat:no-repeat;
	background-position:center;
	background-size:cover;
	margin-left: 4%;
	width: 92%;
	height:200px;
	display: block;
}
#Titelbild:hover {
        zoom: 1;
        filter: alpha(opacity=40);
        opacity: 0.4;
     -webkit-transition: opacity .50s;
        -moz-transition: opacity .50s;
        -ms-transition: opacity .50s;
        -o-transition: opacity .50s;
        transition: opacity .50s;
    }
#Inhalt {
	background-color:#CCCCCC;
	width: 100%;
	display: block;
	padding-bottom:50px;
}
#Header {
	background-color:#c31924;
	clear: both;
	float: left;
	background-image:url(images/header.png);
	background-repeat:no-repeat;
	background-position:center;
	background-size:740px 60px;
	margin-left: 0;
	height:60px;
	width: 100%;
	display: block;
	z-index:1;
}
#Header2 {
	background-color:#ffffff;
	clear: both;
	float: left;
	margin-left: 0;
	height:35px;
	width: 100%;
	display: block;
}
#Headerschatten {
	clear: both;
	float: left;
	margin-left: 0;
	height:15px;
	width: 100%;
	display: block;
	background:-moz-linear-gradient(bottom,#CCCCCC,#999999); /* Firefox */
background:-webkit-gradient(linear,left top,left bottom,from(#999999),to(#CCCCCC)); /* Chrome, Safari */
filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr='#999999',endColorstr='#CCCCCC'); /* Internet Explorer */
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr=#999999, endColorstr=#CCCCCC)";
background-image: -ms-linear-gradient(top, #999999 0%, #CCCCCC 100%);
	margin-bottom:10px;
}
#Header3 {
	background-color:#5e5e5e;
	clear: both;
	float: left;
	margin-left: 0;
	padding-top:20px;
	padding-bottom:25px;
	width: 100%;
	display: none;
	z-index:2;
}
#Header4 {
	background-color:#ffffff;
	clear: both;
	float: left;
	margin-left: 0;
	height:5px;
	width: 100%;
	display: none;
	z-index:3;
}
#Logo {
	margin-top:15px;
	width:170px;
}
#Kopf {
	clear: both;
	float: left;
	margin-left: 0;
	height:90px;
	margin-top:-90px;
	width: 100%;
	display: block;
}
#Firmenname {
	display: none;

}
ul#Navigation {
	clear: both;
	float: left;
	margin-left: 250px;
	margin-top:-50px;
	height:50px;
	display: none;
	margin-bottom:0px
  }
  ul#Navigation li {
    list-style: none; display: inline; margin: 0; padding: 0;
  }

  ul#Navigation a, ul#Navigation span {
    font-family: 'titillium_webregular', sans-serif; color: #5e5e5e; font-size: 20px; background-color:#ffffff; display: block; float: left; height:38px; width:auto; padding-top:12px; padding-left:18px; padding-right:18px; text-decoration: none; text-align:center; transition: .5s background-color;
  }
  ul#Navigation a:hover, ul#Navigation span {
    color: white; background-color: #5e5e5e;
  }
  ul#Navigation div {
     clear: left;
  }
  

#NaviM {
	clear: both;
	float: left;
	margin-top:53px;
	width:48px;
	margin-right:3%;
	position:absolute;
	right:0;
	display: block;
	-moz-border-radius:3px 3px 3px 3px; /* Firefox */
-webkit-border-radius:3px 3px 3px 3px; /* Chrome, Safari */
-khtml-border-radius:3px 3px 3px 3px; /* Konqueror */
border-radius:3px 3px 3px 3px; /* CSS3 */
behavior:url(border-radius.htc); /* Internet Explorer */
	transition: .3s background-color;

}

#footer {
	clear: both;
	float: left;
	background-color:#5e5e5e;
	background-image:url(images/footer2.png);
	background-repeat:no-repeat;
	background-position:top center;
	background-size:740px;
	margin-left: 0;
	height:120px;
	width: 100%;
	display: block;


}
#Impressum {
	background-color:#FFFFFF;
	clear: none;
	float: left;
	margin-left: 0;
	width: 90%;
	display: block;
	padding:5%;
	margin-top:4%;
}
#Impressumkontakt {
	background-color:#FFFFFF;
	clear: none;
	float: left;
	margin-left: 0;
	width: 90%;
	padding:5%;
	margin-top:4%;
	display: block;
}
#Datenschutz {
	background-color:#FFFFFF;
	clear: none;
	float: left;
	margin-left: 0;
	width: 90%;
	display: block;
	padding:5%;
	margin-top:4%;
}
#Willkommen {
	background-color:#FFFFFF;
	clear: none;
	float: left;
	margin-left: 0;
	width: 90%;
	display: block;
	padding:5%;
	margin-top:4%;
}
#Ausbildung {
	background-color:#FFFFFF;
	clear: none;
	float: left;
	margin-left: 0;
	width: 90%;
	display: block;
	padding-left:5%;
	padding-right: 5%;
	margin-top:4%;
}
#Ausbildungrubrik {
	background-color:#FFFFFF;
	clear: none;
	float: left;
	margin-left: 0;
	width: 94%;
	height:auto;
	display: block;
	padding:3%;
	margin-top:5%;
}
#Ausbildungbild1 {
	background-color:#C00;
	background-image:url(images/thumb_hg.jpg);
	background-repeat:no-repeat;
	background-size:contain;
	background-position: center;
	clear:none;
	float:left;
	margin-left: 0;
	width: 100%;
	height: 450px;
	display: block;
	margin-left:0%;
	margin-top: 5%;
	position: relative;
}
#Ausbildungbild2 {
	background-color:#C00;
	background-image:url(images/thumb_hg.jpg);
	background-repeat:no-repeat;
	background-size:contain;
	background-position: center;
	clear:none;
	float:left;
	margin-top: 5%;
	margin-left: 0;
	width: 100%;
	height: auto;
	display: block;
	position: relative;
}
#Photovoltaik {
	background-color:#FFFFFF;
	clear: none;
	float: left;
	margin-left: 0;
	width: 88%;
	display: block;
	padding-left:5%;
	padding-right: 5%;
	margin-top:1%;
	margin-left:1%;
	margin-bottom:3%;
}
#PhotovoltaikStart {
	background-color:#c31924;
	background-image:url(images/header.png);
	clear: none;
	float: left;
	text-align: center;
	margin-left: 0;
	width: 94%;
	height:auto;
	display: block;
	padding:3%;
	margin-top:4%;
	margin-bottom:1%;
	color: #FFFFFF;
	font-family: 'titillium_websemibold', sans-serif;
	font-size: 26px;
}
#Leistungen {
	background-color:#c31924;
	background-image:url(images/header.png);
	background-position:center;
	background-size:700px 300px;
	background-repeat:no-repeat;
	clear: none;
	float: left;
	margin-left: 0;
	width: 90%;
	padding:5%;
	margin-top:4%;
	display: block;
}
#Uebersicht-l {
	width: 100%;
}
#Uebersicht-r {
	width: 100%;
}
#Uebersicht1 {
	background-color:#FFFFFF;
	clear: both;


	float: left;


	margin-left: 0;


	width: 100%;


	display: none;


}
#Uebersicht2 {
	background-color:#FFFFFF;
	clear: both;


	float: left;


	margin-left: 0;


	width: 100%;


	display: none;


}
#Uebersicht3 {
	background-color:#FFFFFF;
	clear: both;


	float: left;


	margin-left: 0;


	width: 100%;


	display: none;


}
#Uebersicht4 {
	background-color:#FFFFFF;
	clear: both;


	float: left;


	margin-left: 0;


	width: 100%;


	display: none;


}
#UebersichtText1 {
	background-color:#c31924;
	background-image:url(images/uebersicht_geschichte_2021.jpg);
	background-position:right;
	background-size:contain;
	background-repeat:no-repeat;
	clear: both;
	float: left;
	margin-left: 0;
	display: block;
	width: 90%;
	padding:5%;
	padding-top:13%;
	padding-bottom:13%;
	margin-top:4%;
}
#UebersichtText2 {
	background-color:#c31924;
	background-image:url(images/uebersicht_leistungen_2021.jpg);
	background-position:right;
	background-size:contain;
	background-repeat:no-repeat;
	clear: both;
	float: left;
	margin-left: 0;
	display: block;
	width: 90%;
	padding:5%;
	padding-top:13%;
	padding-bottom:13%;
	margin-top:2%;
}
#UebersichtText3 {
	background-color:#c31924;
	background-image:url(images/uebersicht_ausbildung_2021.jpg);
	background-position:right;
	background-size:contain;
	background-repeat:no-repeat;
	clear: both;
	float: left;
	margin-left: 0;
	display: block;
	width: 90%;
	padding:5%;
	padding-top:13%;
	padding-bottom:13%;
	margin-top:2%;
}
#UebersichtText4 {
	background-color:#c31924;
	background-image:url(images/uebersicht_kontakt_2021.jpg);
	background-position:right;
	background-size:contain;
	background-repeat:no-repeat;
	clear: both;
	float: left;
	margin-left: 0;
	display: block;
	width: 90%;
	padding:5%;
	padding-top:13%;
	padding-bottom:13%;
	margin-top:2%;
}
#NaviMopen {
		background-color:#FFFFFF;
		position:absolute;
		margin-top:95px;
	
	margin-left: 0;
	width: 90%;
	padding:5%;
	display: none;
-moz-box-shadow:0px 7px 7px #333333; /* Firefox */
-webkit-box-shadow:0px 7px 7px #333333; /* Chrome, Safari */
-khtml-box-shadow:0px 7px 7px #333333; /* Konqueror */
box-shadow:0px 7px 7px #333333; /* CSS3 */

}
#NaviMopenU {
		margin-left: 0;
		width: 100%;
		margin-bottom:30px;
		display: none;
		


}
#Titelbildhg {
	background-color:#FFFFFF;
		clear: both;
		float: left;
		margin-left: 0;
		height:200px;
		width: 100%;
		padding-top:4%;
		padding-bottom:4%;
		display: block;		


}
#Karte {
	background-color:#FFFFFF;
		clear: both;
		float: left;
		margin-left: 0;
		height:auto;
		width: 90%;
		padding:5%;
		display: block;		
}
#google {
		height:200px;
		width: 88%;
		padding-left:6%;
		padding-right:6%;		
}
#Kontakt {
		clear: both;
		float: left;
		margin-left: 0;
		width: 100%;
		display: block;
}
#Kontaktm {
	background-color:#FFFFFF;
	color:#000000;
	line-height:26px;
		clear: none;
		float: left;
		margin-left: 0;
		width: 88%;
	display: block;
	margin-bottom:15px;
	padding:6%;
		
}
#Bild2 {
	background-color:#C00;
		clear: none;
	float: left;
	margin-left: 0;
	width: 48%;
	display: block;
	margin:1%;
}
#Bild3 {
	background-color:#C00;
		clear: none;
	float: left;
	margin-left: 0;
	width: 48%;
	display: none;
	margin:1%;
}

#GeschichteText {
	font-size:13px;
		clear: none;
	float: left;
	width: 40%;
	display: block;
	padding:2%;
	padding-right:6%;
	margin:1%;
	margin-left:-49%;
}

#GeschichteBg {
	background-color:#FFFFFF;
		clear: none;
	float: left;
	margin-left: 0;
	width: 48%;
	display: block;
	margin:1%;
}
.ecke{
	width:auto;
	padding:10px;
    background:#c31924;
	background-image:url(images/ecke.svg);
	background-repeat:no-repeat;
	background-position:bottom right;
	margin-left:1%;
	margin-top:1%;
	margin-bottom:3%;
	display:block;
	z-index:1;
}
.ecke2{
	width:auto;
	padding:10px;
    background:#c31924;
	background-image:url(images/ecke.svg);
	background-repeat:no-repeat;
	background-position:bottom right;
	margin-top:1%;
	margin-bottom:4%;
	display:block;
	z-index:1;
}
/* Layout für Tablet-PCs: 481 bis 768 px. Erbt Stile vom: Layout für Mobilgeräte. */

@media only screen and (min-width: 581px) {

.scrollToTop{
	width:40px; 
	height:40px;
	bottom:65px;
	right:45px;
}
.scrollToTop:hover{
	text-decoration:none;
}

figure figcaption {
	font-size:16px;
}

figure:hover figcaption {
  font-size:16px;
}
	
h3 {
	font-size:20px;
	margin-bottom:20px;
	color:#5e5e5e;
	margin-top:0px;
}

.gridContainer {
	width: 93.675%;
	padding-left: 1.1625%;
	padding-right: 1.1625%;
}
#LayoutDiv1 {
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: block;
}
#LayoutDiv2 {
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: block;
}
#Bild {
	clear: none;
	float: left;
	margin-left: 0;
	width: 48%;
	display: block;
	margin:1%;
}
#Bildleistung {
	clear: none;
	float: left;
	margin-left: 0;
	width: 48%;
	display: block;
	margin:1%;
}
#Titelbild {
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	height:300px;
	display: block;
}
#Titelbild2 {
	clear: both;
	float: left;
	background-size:50%;
	margin-left: 3%;
	width: 94%;
	height:300px;
	display: block;
}
#Header {
	clear: both;
	float: left;
	background-size:985px 80px;
	margin-left: 0;
	height:80px;
	width: 100%;
	display: block;
}
#Header2 {
	clear: both;
	float: left;
	margin-left: 0;
	height:45px;
	width: 100%;
	display: block;
}
#Headerschatten {
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: block;
	margin-bottom:20px;
}
#Header3 {
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: none;
}
#Header4 {
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: none;
}
#Logo {
	margin-top:15px;
	width:250px;
}
#Kopf {
	clear: both;
	float: left;
	margin-left: 0;
	height:120px;
	margin-top:-120px;
	width: 100%;
	display: block;
}
#Firmenname {
	clear: both;
	float: left;
	align: left;
	font-size:36px;
	color:#FFF;
	height:50px;
	display: none;
	margin-top:-146px;
	margin-left:310px;
}
ul#Navigation {
	display: none;
  }
#NaviM {
	clear: both;
	float: left;
	margin-top:74px;
	width:60px;
	margin-right:2%;
	position:absolute;
	right:0;
	display: block;
}
#footer {
	height:160px;
	background-size:985px;
}
#Impressum {
	clear: none;
	float: left;
	margin-left: 0;
	width: 94%;
	display: block;
	padding:3%;
	margin-top:3%;
}
#Impressumkontakt {
	background-color:#FFFFFF;
	clear: none;
	float: left;
	margin-left: 0;
	width: 94%;
	padding:3%;
	margin-top:3%;
	display: block;
}
#Willkommen {
	clear: none;
	float: left;
	margin-left: 0;
	width: 94%;
	display: block;
	padding:3%;
	margin-top:3%;
}
#Ausbildung {
	clear: none;
	float: left;
	margin-left: 0;
	width: 94%;
	display: block;
	padding-left:3%;
	padding-right: 3%;
	margin-top:3%;
}
#Ausbildungrubrik {
	margin-top:4%;
}
#Ausbildungbild1 {
	margin-left: 0;
	width: 32%;
	height: 250px;
	margin-left:0%;
	margin-top: 4%;
}
#Ausbildungbild2 {
	margin-top: 4%;
	margin-left: 2%;
	width: 66%;
	height: 250px;
}
#Photovoltaik {
	clear: none;
	float: left;
	margin-left: 0;
	width: 92%;
	display: block;
	padding-left:3%;
	padding-right: 3%;
	margin-top:1%;
	margin-bottom:2%;
	margin-left: 1%;
}
#PhotovoltaikStart {
	margin-top:4%;
	margin-bottom:1%;
}
#Leistungen {
	background-color:#c31924;
	background-image:url(images/header.png);
	background-position:center;
	background-size:700px 300px;
	background-repeat:no-repeat;
	clear: none;
	float: left;
	margin-left: 0;
	width: 94%;
	padding:3%;
	margin-top:3%;
	display: block;
}
#Uebersicht-l {
	width: 100%;
}
#Uebersicht-r {
	width: 100%;
}
#Uebersicht1 {
	clear: none;
	float: left;
	margin-left: 0;
	width: 48%;
	display: block;
	margin-top:3%;
	margin-right:4%;
}
#Uebersicht2 {
	clear: none;
	float: left;
	margin-left: 0;
	width: 48%;
	display: block;
	margin-top:3%;
}
#Uebersicht3 {
	clear: none;
	float: left;
	margin-left: 0;
	width: 48%;
	display: block;
	margin-top:3%;
	margin-right:4%;
}
#Uebersicht4 {
	clear: none;
	float: left;
	margin-left: 0;
	width: 48%;
	display: block;
	margin-top:3%;
}
#UebersichtText1 {
	background-color:#c31924;
	background-image:url(images/header.png);
	background-position:center;
	background-size:150%;
	background-repeat:no-repeat;
	clear: both;
	float: left;
	margin-left: 0;
	width: 42%;
	display: block;
	margin-top:0%;
	margin-right:4%;
	padding-left:3%;
	padding-right:3%;
	padding-top:1%;
	padding-bottom:1%;
}
#UebersichtText2 {
	background-color:#c31924;
	background-image:url(images/header.png);
	background-position:center;
	background-size:150%;
	background-repeat:no-repeat;
	clear: none;
	float: left;
	margin-left: 0;
	width: 42%;
	display: block;
	margin-top:0%;
	padding-left:3%;
	padding-right:3%;
	padding-top:1%;
	padding-bottom:1%;
}
#UebersichtText3 {
	background-color:#c31924;
	background-image:url(images/header.png);
	background-position:center;
	background-size:150%;
	background-repeat:no-repeat;
	clear: none;
	float: left;
	margin-left: 0;
	width: 42%;
	display: block;
	margin-top:0%;
	margin-right:4%;
	padding-left:3%;
	padding-right:3%;
	padding-top:1%;
	padding-bottom:1%;
}
#UebersichtText4 {
	background-color:#c31924;
	background-image:url(images/header.png);
	background-position:center;
	background-size:150%;
	background-repeat:no-repeat;
	clear: none;
	float: left;
	margin-left: 0;
	width: 42%;
	display: block;
	margin-top:0%;
	padding-left:3%;
	padding-right:3%;
	padding-top:1%;
	padding-bottom:1%;
}
#NaviMopen {
		background-color:#FFFFFF;
		position:absolute;
		margin-top:125px;
	
	margin-left: 0;
	width: 90%;
	padding:5%;
	display: none;
-moz-box-shadow:0px 7px 7px #333333; /* Firefox */
-webkit-box-shadow:0px 7px 7px #333333; /* Chrome, Safari */
-khtml-box-shadow:0px 7px 7px #333333; /* Konqueror */
box-shadow:0px 7px 7px #333333; /* CSS3 */

}
#NaviMopenU {
		margin-left: 0;
		width: 100%;
		margin-bottom:30px;
		display: none;
		
}
#Titelbildhg {
	height:300px;
	padding-top:3%;
	padding-bottom:3%;
		
}
#Karte {
	height:auto;
	width: 94%;
	padding:3%;
}

#google {
		height:350px;
		width: 92%;	
		padding-left:4%;
		padding-right:4%;	
}

#Kontakt {
		clear: both;
		float: left;
		margin-left: 0;
		width: 100%;
		display: block;
}
#Kontaktm {
	background-color:#FFFFFF;
	color:#000000;
	line-height:26px;
		clear: none;
		float: left;
		margin-left: 0;
		width: 92%;
	display: block;
	margin-bottom:15px;
	padding:4%;
		
}

#Bild2 {
		clear: none;
	float: left;
	margin-left: 0;
	width: 48%;
	display: block;
	margin:1%;
}

#Bild3 {
		clear: none;
	float: left;
	margin-left: 0;
	width: 48%;
	display: none;
	margin:1%;
}

#GeschichteText {
	font-size:16px;
		clear: none;
	float: left;
	width: 40%;
	display: block;
	padding:2%;
	padding-right:6%;
	margin:1%;
	margin-left:-49%;
}

#GeschichteBg {
	background-color:#FFFFFF;
		clear: none;
	float: left;
	margin-left: 0;
	width: 48%;
	display: block;
	margin:1%;
}
.ecke{
	width:auto;
	padding:15px;
    background:#c31924;
	background-image:url(images/ecke.svg);
	background-repeat:no-repeat;
	background-position:bottom right;
	margin-left:1%;
	margin-top:0%;
	margin-bottom:2%;
}
.ecke2{
	width:auto;
	padding:15px;
    background:#c31924;
	background-image:url(images/ecke.svg);
	background-repeat:no-repeat;
	background-position:bottom right;
	margin-top:0%;
	margin-bottom:3%;
}
}

/* Desktoplayout: 769 bis maximal 1232 px.  Erbt Stile von: den Layouts für Mobilgeräte und Tablet-PCs. */

@media only screen and (min-width: 900px) {

a.tel:link { font-family: 'titillium_webregular', sans-serif; color: #FFFFFF; font-size: 16px; text-decoration:none; }
a.tel:visited { font-family: 'titillium_webregular', sans-serif; color: #FFFFFF; }
a.tel:hover { font-family: 'titillium_webregular', sans-serif; color: #CCCCCC; }
a.tel:active { font-family: 'titillium_webregular', sans-serif; color: #CCCCCC; }

.scrollToTop{
	width:40px; 
	height:40px;
	bottom:65px;
	right:55px;
}
.scrollToTop:hover{
	text-decoration:none;
}

figure figcaption {
	font-size:16px;
}

figure:hover figcaption {
  font-size:16px;
}

h3 {
	font-size:20px;
	margin-bottom:20px;
	color:#5e5e5e;
	margin-top:0px;
}

.gridContainer {
	width: 94.2%;
	max-width: 1232px;
	padding-left: 0.9%;
	padding-right: 0.9%;
	margin: auto;
}
#LayoutDiv1 {
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: block;
}
#LayoutDiv2 {
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: block;
}
#Bild {
	clear:none;
	float:left;
	margin-left: 0;
	width: 31%;
	display: block;
	margin:1%;
}
#Bildleistung {
	clear:none;
	float:left;
	margin-left: 0;
	width: 31%;
	display: block;
	margin:1%;
}
#Titelbild {
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	height:500px;
	display: block;
}
#Titelbild2 {
	clear: both;
	float: left;
	background-size:50%;
	margin-left: 2%;
	width: 96%;
	height:500px;
	display: block;
}
#Header {
	clear: both;
	float: left;
	background-size:1232px 100px;
	margin-left: 0;
	height:100px;
	width: 100%;
	display: block;
}
#Header2 {
	clear: both;
	float: left;
	margin-left: 0;
	height:50px;
	width: 100%;
	display: block;
}
#Headerschatten {
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: block;
	margin-bottom:30px;
}
#Header3 {
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: block;
}
#Header4 {
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: block;
}
#Logo {
	margin-top:25px;
	width:280px;
}
#Kopf {
	clear: both;
	float: left;
	margin-left: 0;
	height:150px;
	margin-top:-150px;
	width: 100%;
	display: block;
}
#Firmenname {
	clear: both;
	float: left;
	align: left;
	font-size:36px;
	color:#FFF;
	height:50px;
	display: block;
	margin-top:-120px;
	margin-left:300px;
}
ul#Navigation {
	display: block;
  }
#NaviM {
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: none;
}
#footer {
	height:200px;
	background-size:1232px;
}
#Impressum {
	clear: none;
	float: left;
	margin-left: 0;
	width: 60%;
	display: block;
	padding:3%;
	margin-top:2%;
	margin-right:2%;
}
#Impressumkontakt {
	background-color:#FFFFFF;
	clear: none;
	float:right;
	margin-left: 0;
	width: 26%;
	padding:3%;
	margin-top:2%;
	display: block;
}
#Willkommen {
	clear: none;
	float: left;
	margin-left: 0;
	width: 60%;
	height:240px;
	display: block;
	padding:3%;
	margin-top:2%;
	margin-right:2%;
}
#Ausbildung {
	clear: none;
	float: left;
	margin-left: 0;
	width: 60%;
	height:400px;
	display: block;
	padding-left:3%;
	padding-left: 3%;
	margin-top:2%;
}
#Ausbildungrubrik {
	margin-top:3%;
}
#Ausbildungbild1 {
	margin-left: 0;
	width: 32%;
	height: 400px;
	margin-left:2%;
	margin-top: 2%;
}
#Ausbildungbild2 {
	margin-top: 2%;
	margin-left: 0;
	width: 100%;
	height: auto;
}
#Photovoltaik {
	clear: none;
	float: left;
	width: 25%;
	display: block;
	padding-left:3%;
	padding-right:3%;
	padding-top: 1%;
	margin-top:1%;
	margin-left: 1%;
	margin-right: 1%;
}
#PhotovoltaikStart {
	margin-top:1%;
	margin-bottom:1%;
}
#Leistungen {
	background-color:#c31924;
	background-image:url(images/header.png);
	background-position:center;
	background-size:700px 300px;
	background-repeat:no-repeat;
	clear: none;
	float: left;
	margin-left: 0;
	width: 26%;
	height:240px;
	padding:3%;
	margin-top:2%;
	margin-bottom: 1%;
	display: block;
}
#Uebersicht-l {
	width: 50%;
	float: left;
}
#Uebersicht-r {
	width: 50%;
	float: left;
}
#Uebersicht1 {
	clear: none;
	float: left;
	margin-left: 0;
	width: 48.5%;
	display: block;
	margin-top:2%;
	margin-right:2%;
}
#Uebersicht2 {
	clear: none;
	float: left;
	margin-left: 0;
	width: 48.5%;
	display: block;
	margin-top:2%;
}
#Uebersicht3 {
	clear: none;
	float: left;
	margin-left: 0;
	width: 48.5%;
	display: block;
	margin-top:2%;
	margin-right:2%;
	margin-left:1%;
}
#Uebersicht4 {
	clear: none;
	float: left;
	margin-left: 0;
	width: 48.5%;
	display: block;
	margin-top:2%;
}
#UebersichtText1 {
	background-color:#c31924;
	background-image:url(images/header.png);
	background-position:center;
	background-size:150%;
	background-repeat:no-repeat;
	clear: both;
	float: left;
	margin-left: 0;
	width: 42.5%;
	display: block;
	margin-right:2%;
	margin-top:0%;
	padding-left:3%;
	padding-right:3%;
	padding-top:1%;
	padding-bottom:1%;
}
#UebersichtText2 {
	background-color:#c31924;
	background-image:url(images/header.png);
	background-position:center;
	background-size:150%;
	background-repeat:no-repeat;
	clear: none;
	float: left;
	margin-left: 0;
	width: 42.5%;
	display: block;
	margin-top:0%;
	padding-left:3%;
	padding-right:3%;
	padding-top:1%;
	padding-bottom:1%;
}
#UebersichtText3 {
	background-color:#c31924;
	background-image:url(images/header.png);
	background-position:center;
	background-size:150%;
	background-repeat:no-repeat;
	clear: none;
	float: left;
	margin-left: 0;
	width: 42.5%;
	display: block;
	margin-left:1%;
	margin-right:2%;
	margin-top:0%;
	padding-left:3%;
	padding-right:3%;
	padding-top:1%;
	padding-bottom:1%;
}
#UebersichtText4 {
	background-color:#c31924;
	background-image:url(images/header.png);
	background-position:center;
	background-size:150%;
	background-repeat:no-repeat;
	clear: none;
	float: left;
	margin-left: 0;
	width: 42.5%;
	display: block;
	margin-top:0%;
	padding-left:3%;
	padding-right:3%;
	padding-top:1%;
	padding-bottom:1%;
}
#NaviMopen {
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: none;
}
#NaviMopenU {
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: none;
}
#Titelbildhg {
	height:500px;
	padding-top:2%;
	padding-bottom:2%;
}
#Karte {
	height:auto;
	width: 96%;
	padding:2%;
}

#google {
		height:500px;
		width: 96%;	
		padding-left:2%;
		padding-right:2%;	
}

#Kontakt {
	color:#FFFFFF;
	line-height:26px;
		clear: none;
		float: left;
		margin-left: 0;
		width: 29%;
		height:110px;
		display: block;
	display: block;
	margin-right:2%;
	margin-top:25px;
	margin-bottom:30px;
	border-left: 1px solid #999999;
	padding-left:2%;
		
}

#Kontaktm {
	display: none;
		
}

#Bild2 {
	clear:none;
	float:left;
	margin-left: 0;
	width: 31%;
	display: none;
	margin:1%;
		
}

#Bild3 {
	clear:none;
	float:left;
	margin-left: 0;
	width: 31%;
	display: block;
	margin:1%;
		
}

#GeschichteText {
	font-size:16px;
	clear:none;
	float:left;
	width: 25%;
	display: block;
	padding:2%;
	padding-right:4%;
	margin:1%;
	margin-left:-32%;
		
}

#GeschichteBg {
	background-color:#FFFFFF;
	clear:none;
	float:left;
	margin-left: 0;
	width: 31%;
	display: block;
	margin:1%;
		
}
.ecke{
	width:30%;
	padding:15px;
    background:#c31924;
	background-image:url(images/ecke.svg);
	background-repeat:no-repeat;
	background-position:bottom right;
	margin-left:1%;
	margin-bottom:1%;
	margin-top:0%;
}
.ecke2{
	width:30%;
	padding:15px;
    background:#c31924;
	background-image:url(images/ecke.svg);
	background-repeat:no-repeat;
	background-position:bottom right;
	margin-bottom:2%;
	margin-top:0%;
	display:none;
}
}