/*--------------- BROWSER-RESET ---------------*/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline; }
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }
body { line-height: 1; }
ol, ul { list-style: none; }
blockquote, q { quotes: none; }
blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; }
table { border-collapse: collapse; border-spacing: 0; }
* { margin: 0; padding: 0;}
	
	
/*--------------- GRUNDEINSTELLUNGEN / ALLE VIEWPORTS ---------------*/	


/*----- HTML + BODY -----*/	

html, body 	{ background: url(../gfx/bg.html); background-repeat: repeat; font-family: 'Open Sans', sans-serif; background-color: white;
			  color: rgb(0,89,127); font-size: 12px; line-height: 14px; font-weight: normal;
			  height: 100%; width: 100%; position: relative; }
			  		
#completeWrapper { width: 100%;
				min-height: 100%; height: auto !important; height: 100%;
				margin-top: -10px; }


/*----- KOPFBEREICH -----*/	

header 	{ height: 225px; width: 100%;
		background-color: rgb(0,89,127); background-image: url(../gfx/header.jpg); background-repeat: no-repeat; background-position: 0 center;
		position: relative; }		
			  
#headInfoWrapper 	{ width: 1000px; height: 100%;
					margin: 0 auto; }
					
#headInfo	{ background-color: rgba(0,89,127,0.75);
			height: 155px; width:225px;
			margin-left:750px; padding-left: 25px; padding-top: 70px; }
					
#headerWrapper { width: 1000px; height: 100%; margin: 0 auto; }

#logo	{ width: 334px; height: 74px;
		position: absolute; top: 70px; left: 100px; }
			
#imgLogo	{ width: 334px; height: 74px; }

#logo a		{ width: 100%; height: 100%;
			display: block; }

					
/*----- NAVIGATIONSBEREICH -----*/	

#navSpalte	{ background-color: rgb(100,164,192);
			height: 50px; width: 100%;
			overflow: hidden;}
			
nav		{ width: 700px; height: 100%;
		float: left;
		background-color: white; }
			
#navInfo	{ background-color: rgb(55,143,175);
			height: 100%; width: 250px;
			margin-left: 50px;
			float: left; }
			
#navWrapper	{ height: 100%; width: 1000px;
			margin: 0 auto; }
			
#navigation { height: 100%; width: 100%;
			list-style: none;
			float: left; }
			
#navigation li { text-align: center;
				background-color: rgb(100,164,192);
				float: left;
				height: 100%; width: 25%;
				line-height: 50px; }
				
#navigation #activeLink	{ height: 80%; }
						
#navigation #activeLink a	{ color: white; }
						
#navigation li:hover	{ background-color: rgb(55,143,175); }
				
#navigation li a	{ display: block;
					width: 100%; height: 100%; }
					
#impressum 	{ font-size: 12px;
			width: 100%; height: 100%;
			display: block;
			line-height: 50px;
			padding-left: 25px;	}
					

/*----- CONTENTBEREICH -----*/	

#wrapper	{ background-color: transparent;
			margin: 0 auto;
			min-height: 600px;
			width: 1000px;
			float: none;
			clear: both; }
			
#content 	{ width: 100%;
			float: left;
			background-color: transparent;
			overflow: auto;
			margin-bottom: 25px; }
			
#container { width: 700px; height: 100%;
			background-color: white;
			overflow: auto; }
			
#headline	{ background-color: transparent;
			height: 105px; width: 100%;
			border-bottom: 2px solid rgb(0,89,127); }
			
#text		{ height: 100%;
			background-color: transparent;
			margin-top: 50px;
			padding-left: 50px; padding-right: 50px;
			overflow: auto; }

#text p		{ color: rgb(75, 75, 75); font-size: 16px; line-height: 24px;
			margin-top: 12px; }
			
#info 		{ width: 250px; height: 100%;
			background-color: rgb(0,89,127); background-color: rgba(0,89,127,0.25);
			float: right;
			padding-top: 100px;
			margin-left: 50px; }
			

/*----- FOOTERBEREICH -----*/	
			
			
#footer		{ background-color: rgb(100,164,192);
			width: 100%; height: 10px;
			float: none;
			clear: both; }
			
#footerInfo	{ width: 250px; height: 100%;
			background-color: rgb(55, 143, 175);
			margin-left: 750px; }
			
#footerWrapper	{ width: 1000px; height: 100%;
				margin: 0 auto; }
				
/*----- FOTOS ETC. -----*/	
	
#info #jb_logo	{ margin-left: 25px;
				  width: 60%; }
			
#info #innung_logo	{ margin-top: 25px; margin-left: 25px;
					  width: 60%; }
			
#info .bsp_bad	{ width: 100%; }
			
#info #second { margin-top: 12px; }

.bildText { width: 100%;
		   display: block; float: left;
		   margin-top: 25px; }
		   
#text .bildText 	{ display: block; 
			      	  float: left; }
		   
#wartung 	{ width: 60%;
			  border: 1px solid rgb(0,89,127);
			  padding: 10px; }
		
#heizung 	{ width: 75%;
			  border: 1px solid rgb(0,89,127);
			  padding: 10px; }

					
a	{ text-decoration: none;
	color: rgb(0,89,127); font-size: 14px; }
			  
			

/*----- TEXTAUSZEICHNUNGEN ETC. -----*/	

#impressum_text .imp_strong 	{ font-size: 8px; line-height: 8px; }
			
#impressum_text .imp	{ font-size: 8px; line-height: 8px; }
			
#impressum_text em { font-style: italic; font-size: 8px; line-height: 8px; }
				
#impressum_text .imp_link { font-style: italic; font-size: 8px; line-height: 8px; }
			
strong { font-weight: bold; }
				
.abstand 	{ margin-bottom: 25px; }
			
#impressum_text h5 { font-size: 10px; line-height: 12px; font-weight: bold; }
				
h3				{ font-size: 24px; line-height: 105px; font-weight: normal;
				padding-left: 50px; }
				
h4				{ font-size: 24px; line-height: 28px; font-weight: normal; color: rgb(168, 208, 145); }
				
h5				{ font-size: 30px; line-height: 34px; font-weight: bold; color: rgb(168, 208, 145); }
				
h6	a			{ font-size: 16px; line-height: 20px; font-weight: normal; color: white; }
				
h6 a:hover		{ color: rgb(168, 208, 145); }
				
.textListe { list-style-type:square;
			color: rgb(75, 75, 75); font-size: 16px; line-height: 24px;
			margin-top: 12px; }
			
.textListe li { margin-bottom: 12px; }
				


/*MEDIA QUERRIE ANGABE*/ /*--------------- < 1100px ---------------*/	

@media screen and (max-width: 1100px) {	


/*----- KOPFBEREICH -----*/	

#headerWrapper { width: 825px; }
				
#logo		{ width: 275px; height: 63px;
			position: absolute; top: 70px; left: 100px; }
			
#imgLogo	{ width: 275px; height: 63px; }

#headInfoWrapper 	{ width: 825px; }
					
#headInfo			{ width:200px;
					margin-left:600px;
					padding-left: 25px; padding-top: 70px; }
			

/*----- NAVIGATIONSBEREICH -----*/	

nav			{ width: 550px; }
			
#navInfo	{ width: 225px;
			margin-left: 50px; }
			
#navWrapper	{ width: 825px; }
			
#impressum 		{ font-size: 12px; }


/*----- CONTENTBEREICH -----*/	

#wrapper	{ width: 825px; }
			
#content 	{ width: 550px; }

#container { width: 550px; }
					
#info 		{ width: 225px; 
			margin-left: 50px; }
			

/*----- FOOTERBEREICH -----*/	
		
#footerInfo	{ width: 225px;
			margin-left: 600px; }
			
#footerWrapper	{ width: 825px; }


/*----- FOTOS, TEXTE, ETC. -----*/	
		
h3				{ font-size: 22px; line-height: 105px;
				padding-left: 50px; }
				
h4				{ font-size: 20px; line-height: 24px; }
				
h5				{ font-size: 26px; line-height: 30px; }
				
h6	a			{ font-size: 12px; line-height: 16px; }
				
a			{ font-size: 12px; }

.abstand 	{ margin-bottom: 12px; }
						
}


/*MEDIA QUERRIE ANGABE*//*--------------- < 875px ---------------*/	

@media screen and (max-width: 875px) {	


/*----- KOPFBEREICH -----*/	

#headerWrapper { width: 600px; }
				
#logo		{ width: 225px; height: 52px; 
			position: absolute; top: 50px; left: 100px; }
			
#imgLogo	{ width: 225px; height: 52px; }

#headInfoWrapper 	{ width: 600px; }
					
#headInfo			{ width:138px; height: 175px;
					margin-left:450px;
					padding-left: 12px; padding-top: 50px; }


/*----- NAVIGATIONSBEREICH -----*/	
			
nav			{ width: 400px; }
			
#navInfo	{ width: 150px;
			margin-left: 50px; }
			
#navWrapper	{ width: 600px; }

#impressum 		{ font-size: 9px;
				padding-left: 12px; }


/*----- CONTENTBEREICH -----*/	

#wrapper	{ width: 600px; }
			
#content 	{ width: 400px; }
			
#container { width: 400px; }
						
#info 		{ width: 150px;
			margin-left: 50px; }
			
#headline	{ background-color: transparent;
			height: 75px;
			border-bottom: 1px solid rgb(0,89,127); }
			

/*----- FOOTEREREICH -----*/	
			
#footerInfo	{ width: 150px;
			margin-left: 450px; }
			
#footerWrapper	{ width: 600px; }


/*----- FOTOS, TEXTE, ETC. -----*/	
				
h3				{ font-size: 16px; line-height: 80px;
				padding-left: 50px; }
				
h4				{ font-size: 16px; line-height: 20px; }
				
h5				{ font-size: 22px; line-height: 26px; }
				
h6	a			{ font-size: 10px; line-height: 14px; }
				
a			{ font-size: 10px; }
			
#info #jb_logo	{ margin-left: 12px; }

#info #innung_logo	{margin-left: 12px; margin-top: 12px; }

.abstand 	{ margin-bottom: 5px; }
			
}	

/*MEDIA QUERRIE ANGABE*//*--------------- < 640px ---------------*/	

@media screen and (max-width: 640px) {	


/*----- KOPFBEREICH -----*/	

header			{ height: 150px; }

#headerWrapper { width: 400px; }
				
#logo		{ width: 150px; height: 35px;
			position: absolute; top: 50px; left: 25px; }
			
#imgLogo	{ width: 150px; height: 35px; }

#headInfoWrapper 	{ width: 400px; }
					
#headInfo			{ width: 88px; height: 100px;
					margin-left:300px;
					padding-left: 12px; padding-top: 50px; }
			

/*----- NAVIGATIONSBEREICH -----*/	

nav			{ width: 275px; }
			
#navSpalte	{ height: 25px; }
			
#navInfo	{ width: 100px; margin-left: 25px; }
			
#navWrapper	{ width: 400px; }

#impressum 		{ font-size: 6px; line-height: 25px; }


/*----- CONTENTBEREICH -----*/	

#wrapper	{ width: 400px; }
			
#content 	{ width: 275px; }
			
#container { width: 275px; }
			
#info 		{ width: 100px;
			margin-left: 25px; 
			padding-top: 25px; }
			
#headline	{ background-color: transparent;
			height: 55px; width: 100%;
			border-bottom: 1px solid rgb(0,89,127); }

			
/*----- FOOTERBEREICH -----*/	
		
#footerInfo	{ width: 100px;
			margin-left: 300px; }
			
#footerWrapper	{ width: 400px; }


/*----- FOTOS, TEXTE, ETC. -----*/	
			
h3				{ font-size: 14px; line-height: 60px; font-weight: normal;
				padding-left: 25px; }
				
h4				{ font-size: 8px; line-height: 14px; }
				
h5				{ font-size: 10px; line-height: 14px; }
				
h6	a			{ font-size: 6px; line-height: 10px; }
				
a			{ font-size: 8px; }

#info #jb_logo	{ margin-left: 12px; }

#info #innung_logo	{margin-left: 12px; margin-top: 12px; }

#navigation li { line-height: 25px; }
								
#text p		{ font-size: 10px; line-height: 18px;
			margin-top: 9px; }
			
#text		{ height: 100%;
			background-color: transparent;
			margin-top: 25px;
			padding-left: 25px; padding-right: 25px;
			overflow: auto; }
			
.abstand 	{ margin-bottom: 0px; }

}	

/*MEDIA QUERRIE ANGABE*//*--------------- < 480px ---------------*/	

@media screen and (max-width: 480px) {	


/*----- KOPFBEREICH -----*/	

header			{ height: 100px; }

#headerWrapper { width: 320px; }
				
#logo		{ width: 150px; height: 35px;
			position: absolute; top: 25px; left: 25px; }
			
#imgLogo	{ width: 150px; height: 35px; }

#headInfoWrapper 	{ width: 320px; }
					
#headInfo			{ width: 80px; height: 75px;
					margin-left: 240px;
					padding-left: 6px; padding-top: 25px; }
			

/*----- NAVIGATIONSBEREICH -----*/	

nav			{ width: 240px; }
			
#navSpalte	{ height: 100px; }
			
#navInfo	{ width: 100px; margin-left: 25px; }
			
#navWrapper	{ width: 320px; height: 25px; }

#navigation li { height: 25px; float: none; width: 100%; border-bottom: 1px solid rgb(0,89,127); }

#navigation #activeLink	{ height: 100%; }

#impressum 		{ font-size: 6px; line-height: 25px; }

#navInfo	{ height: 125px; width: 80px;
			margin-left: 0px;
			float: right; }


/*----- CONTENTBEREICH -----*/	

#wrapper	{ width: 320px; }
			
#content 	{ width: 240px; }
			
#container { width: 240px; }
			
#info 		{ width: 80px;
			margin-left: 0px; 
			padding-top: 12px; }
			
#headline	{ background-color: transparent;
			height: 45px; width: 100%;
			border-bottom: 1px solid rgb(0,89,127); }

			
/*----- FOOTERBEREICH -----*/	
		
#footerInfo	{ width: 80px;
			margin-left: 240px; }
			
#footerWrapper	{ width: 320px; }


/*----- FOTOS, TEXTE, ETC. -----*/	
			
h3				{ font-size: 14px; line-height: 50px; font-weight: normal;
				padding-left: 25px; }
				
h4				{ font-size: 8px; line-height: 14px; }
				
h5				{ font-size: 10px; line-height: 14px; }
				
h6	a			{ font-size: 6px; line-height: 10px; }
				
a			{ font-size: 8px; }

#info #jb_logo	{ margin-left: 6px; }

#info #innung_logo	{margin-left: 6px; margin-top: 6px; }

#navigation li { line-height: 25px; }
								
#text p		{ font-size: 10px; line-height: 18px;
			margin-top: 9px; }
			
#text		{ height: 100%;
			background-color: transparent;
			margin-top: 12px;
			padding-left: 25px; padding-right: 25px;
			overflow: auto; }
			
.abstand 	{ margin-bottom: 0px; }

}