@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%;
}

/*
	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. */

.Fheader {
	width: 100%;
	max-width: 1000px;
	display:block;
}
#FheaderLeft {
	clear: both;
	float: left;
	width: 92%;
	height:auto;
	display:none;
	padding:4% 4% 0 4%;
}
#FheaderRight {
	background-color:;
	clear: none;
	float: left;
	width: 92%;
	height:auto;
	display: block;
	padding:2% 4% 40% 4%;
}

.Ffooter {
	background-color:#E6E6E6;
	width: 100%;
	max-width: 2500px;
	display:block;
}
#FfooterD1 {
	background-color:#E6E6E6;
	clear: both;
	float: left;
	width: 92%;
	height: 33vh;
	display: block;
	padding:4% 4% 0% 4%;
}


/*andere devices nicht sichtbar*/

.Theader {
	width: 100%;
	max-width: 1000px;
	display:none;
}
.Tworks {
	background-color:#000;
	width: 100%;
	max-width: 2500px;
	display:none;
}
.Tfooter {
	background-color:#E6E6E6;
	width: 100%;
	max-width: 2500px;
	display:none;
}
.header {
	width: 100%;
	maxdisplaywidth: 1000px;
	display:none;
}
.works {
	background-color:#000;
	width: 100%;
	max-width: 2500px;
	display:none;
}
.footer {
	background-color:#E6E6E6;
	width: 100%;
	max-width: 2500px;
	display:none;
}




/* Layout für Tablet-PCs: 481 bis 768 px. Erbt Stile vom: Layout für Mobilgeräte. */
									  
					@media only screen and (min-width: 481px) {
					.Theader {
					width: 100%;
					max-width: 2500px;
					display:block;
					}
					#TheaderLeft {
					clear: both;
					float: left;
					width: 48%;
					height:auto;
					display: none;
					padding:2% 0 0 2%;
					}
					#TheaderRight {
					background-color:;
					clear: none;
					float: left;
					width: 94%;
					height:auto;
					display: block;
					padding:3% 3% 22% 3%;
					}
	
					  
					
					
					
					.Tfooter {
					background-color:#E6E6E6;
					width: 100%;
					max-width: 2500px;
					display:block;
					}
					#TfooterD1 {
					background-color:#E6E6E6;
					clear: both;
					float: left;
					width: 94%;
					height:33vh;
					display: block;
					padding:3% 3% 0 3%;
					}
					
					/*tablet und desktop invisible*/
					
					/*andere devices nicht sichtbar*/
					
					.Fheader {
					width: 100%;
					max-width: 1000px;
					display:none;
					}
					.Fworks {
					background-color:#000;
					width: 100%;
					max-width: 2500px;
					display:none;
					}
					.Ffooter {
					background-color:#E6E6E6;
					width: 100%;
					max-width: 2500px;
					display:none;
					}
					.header {
					width: 100%;
					max-width: 1000px;
					display:none;
					}
					.works {
					background-color:#000;
					width: 100%;
					max-width: 2500px;
					display:none;
					}
					.footer {
					background-color:#E6E6E6;
					width: 100%;
					max-width: 2500px;
					display:none;
					}
					
					
					
					
					}

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

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

.header {
	width: 100%;
	max-width: 2500px;
	display:block;
}
#headerLeft {
	background-color:;
	clear: both;
	float: left;
	width: 48.8%;
	height:auto;
	display: block;
	padding:1.2% 0 0 1.2%;
}
#headerRight {
	background-color:;
	clear: none;
	float: left;
	width: 47%;
	height:auto;
	display: block;
	padding:1.2% 1.8% 6% 1.2%;
}





.footer {
	background-color:#E6E6E6;
	width: 100%;
	max-width: 2500px;
	display:block;
}
#footerD1 {
	background-color:#E6E6E6;
	clear: both;
	float: left;
	width: 73%;
	height:11.5vh;
	display: block;
	padding:1% 1% 0 1%;
}


/*andere devices nicht sichtbar*/

.Fheader {
	width: 100%;
	max-width: 1000px;
	display:none;
}
.Fworks {
	background-color:red;
	width: 100%;
	max-width: 2500px;
	display:none;
}
.Ffooter {
	background-color:#E6E6E6;
	width: 100%;
	max-width: 2500px;
	display:none;
}
.Theader {
	width: 100%;
	max-width: 1000px;
	display:none;
}
.Tworks {
	background-color:#000;
	width: 100%;
	max-width: 2500px;
	display:none;
}
.Tfooter {
	background-color:#E6E6E6;
	width: 100%;
	max-width: 2500px;
	display:none;
}




}