/***** LAYOUT.CSS **********************
****** HANSKNAPPARCHITEKTEN ************
***************************************/

/***** COLORS ************************

	GRAY		#717171
	LGRAY	#BFBFBF

**************************************/

body{
font:0.7em Verdana, Arial, Helvetica, sans-serif;
background-color:#fff;
color:#717171;
}

#info{
top:0;
left:0;
/*height:20px;*/
width:100%;
background:#eee;
position:absolute;
z-index:999999;
text-align:center;
color:#999;
}

/******NUR FÜR INDEX.HTML***********************/

#containerIndex{
width:560px;
margin:auto;
position:relative;
}

	#containerIndex #header,
	#containerIndex #content{width:560px;}
	
	#containerIndex #header{
	margin-top:50px;
	background:url(../img/hansknapp-logo.gif) no-repeat 40px 40px;
	}


	#containerIndex #content{
	background:url(../img/index-img.png) top no-repeat;
	height:320px;
	position:relative;
	}
	
		#indexNavi{position:absolute;}
		
		#indexNavi li a{
		position:absolute;
		width:36px;
		height:32px;
		display:block;
		text-decoration:none;
		}
		
		#indexNavi a span{
		width:200px;
		position:absolute;
		font-weight:bold;
		display:none;
		color:#717171;
		font-size:1em;
		}
		
		#indexNavi a:focus span,
		#indexNavi a:hover span{display:block;}
		
			.ibuero a{top:63px; left:73px; background:url(../img/bu-buero-index.gif) top left no-repeat;}
			.ibuero a:hover{background:url(../img/bu1-buero-index.gif) top left no-repeat;}
			.ibuero a span{top:-101px; left:234px;}
	
			.iprojekte a{top:63px; left:260px; background:url(../img/bu-projekte-index.gif) top left no-repeat;}
			.iprojekte a:hover{background:url(../img/bu1-projekte-index.gif) top left no-repeat;}
			.iprojekte a span{top:-101px; left:47px;}
	
			.ipartner a{top:162px; left:110px; background:url(../img/bu-partner-index.gif) top left no-repeat;}
			.ipartner a:hover{background:url(../img/bu1-partner-index.gif) top left no-repeat;}
			.ipartner a span{top:-200px; left:197px;}
	
			.ilinks a{top:96px; left:447px; background:url(../img/bu-links-index.gif) top left no-repeat;}
			.ilinks a:hover{background:url(../img/bu1-links-index.gif) top left no-repeat;}
			.ilinks a span{top:-134px; left:-140px;}
	
			.ikontakt a{top:96px; left:186px; background:url(../img/bu-kontakt-index.gif) top left no-repeat;}
			.ikontakt a:hover{background:url(../img/bu1-kontakt-index.gif) top left no-repeat;}
			.ikontakt a span{top:-134px; left:121px;}
	
			.ijobs a{top:162px; left:297px; background:url(../img/bu-jobs-index.gif) top left no-repeat;}
			.ijobs a:hover{background:url(../img/bu1-jobs-index.gif) top left no-repeat;}
			.ijobs a span{top:-200px; left:10px;}
			
			.idatenschutz a{top:196px; left:223px; background:url(../img/bu-datenschutz-index.gif) top left no-repeat;}
			.idatenschutz a:hover{background:url(../img/bu1-datenschutz-index.gif) top left no-repeat;}
			.idatenschutz a span{top:-234px; left:80px;}

	
			.isitemap a{top:196px; left:410px; background:url(../img/bu-sitemap-index.gif) top left no-repeat;}
			.isitemap a:hover{background:url(../img/bu1-sitemap-index.gif) top left no-repeat;}
			.isitemap a span{top:-234px; left:-104px;}
	
/******NUR FÜR INDEX.HTML END***********************/


#container{
width:800px;
margin:auto;
position:relative;
}

	#header{
	width:800px;
	height:80px;
	background:url(../img/hansknapp-logo.gif) no-repeat 4px 40px;
	}
	
	#header img{float:right !important;}
	
		#on,
		#ons{display:block !important;}
				
		#mainNavi{
		width:285px;
		height:25px;
		margin:35px 0 0 260px;
		float:left;
		display:inline;
		position:relative;
		}
		
			#mainNavi li{
			border:1px solid #fff;
			display:inline;
			float:left;
			}
			
			#mainNavi a{
			width:23px;
			height:23px;
			float:left;
			position:relative;
			color:#717171;
			text-decoration:none;
			}
			
			#mainNavi a span{
			width:150px;
			height:30px;
			margin-top:-20px;
			padding-top:20px;
			font-weight:bold;
			position:absolute;
			display:none;
			z-index:9;
			top:8px;
			}
			
			#mainNavi a:focus span,
			#mainNavi a:hover span{
			display:block;
			background-color:#fff;
			z-index:999;
			}
			
				/*hauptnavi*/
				#onContainerIE{
				width:285px;
				position:absolute;
				}
				
					#onContainerIE span{
					display:none;
					top:9px;
					position:absolute;
					font-weight:bold;
					padding-left:229px;
					}
								
				.home a,
				.home a:visited,
				.home a:active{background:url(../img/bu-home.gif) top left repeat-x;}
				.home a span{left:228px;}
				
				.buero a,
				.buero a:visited,
				.buero a:active{background:url(../img/bu-buero.gif) top left repeat-x;}
				.buero a span{left:203px;}
				
				.projekte a,
				.projekte a:visited,
				.projekte a:active{background:url(../img/bu-projekte.gif) top left repeat-x;}
				.projekte a span{left:178px;}
				
				.partner a,
				.partner a:visited,
				.partner a:active{background:url(../img/bu-partner.gif) top left repeat-x;}
				.partner a span{left:153px;}
				
				.links a,
				.links a:visited,
				.links a:active{background:url(../img/bu-links.gif) top left repeat-x;}
				.links a span{left:128px;}
				
				.kontakt a,
				.kontakt a:visited,
				.kontakt a:active{background:url(../img/bu-kontakt.gif) top left repeat-x;}
				.kontakt a span{left:103px;}
				
				.jobs a,
				.jobs a:visited,
				.jobs a:active{background:url(../img/bu-jobs.gif) top left repeat-x;}
				.jobs a span{left:78px;}
				
				.sitemap a,
				.sitemap a:visited,
				.sitemap a:active{background:url(../img/bu-sitemap.gif) top left repeat-x;}
				.sitemap a span{left:53px;}
																
				.datenschutz a,
				.datenschutz a:visited,
				.datenschutz a:active{background:url(../img/bu-datenschutz.gif) top left repeat-x;}
				.datenschutz a span{left:28px;}
				
				/*---*/
				
				.home a:focus,
				.home a:hover,
				#on1 a{background:url(../img/bu1-home.gif) top left no-repeat;}
				
				.buero a:focus,
				.buero a:hover,
				#on2 a{background:url(../img/bu1-buero.gif) top left repeat-x;}
				
				.projekte a:focus,
				.projekte a:hover,
				#on3 a{background:url(../img/bu1-projekte.gif) top left repeat-x;}
				
				.partner a:focus,
				.partner a:hover,
				#on4 a{background:url(../img/bu1-partner.gif) top left repeat-x;}
				
				.links a:focus,
				.links a:hover,
				#on5 a{background:url(../img/bu1-links.gif) top left repeat-x;}
				
				.kontakt a:focus,
				.kontakt a:hover,
				#on6 a{background:url(../img/bu1-kontakt.gif) top left repeat-x;}
				
				.jobs a:focus,
				.jobs a:hover,
				#on7 a{background:url(../img/bu1-jobs.gif) top left repeat-x;}
		
				.sitemap a:focus,
				.sitemap a:hover,
				#on8 a{background:url(../img/bu1-sitemap.gif) top left repeat-x;}
				
				.datenschutz a:focus,
				.datenschutz a:hover,
				#on9 a{background:url(../img/bu1-datenschutz.gif) top left repeat-x;}
		
		#subNavi{
		width:145px;
		height:20px;
		margin-top:40px;
		float:left;
		display:inline;
		}
		
			#subNavi li{
			border:1px solid #fff;
			display:inline;
			float:left;
			}
			
			#subNavi a{
			width:18px;
			height:18px;
			float:left;
			position:relative;
			color:#717171;
			text-decoration:none;
			}
			
			#subNavi a span{
			width:80px;
			font-weight:bold;
			position:absolute;
			display:none;
			top:3px;
			z-index:1;
			}

			#subNavi a:focus span,
			#subNavi a:hover span{
			display:block;
			background-color:#fff;
			z-index:999;
			}
			
				/*unternavi*/
				#onsContainerIE{
				width:125px;
				position:absolute;
				}
				
					#onsContainerIE span{
					display:none;
					top:4px;
					position:absolute;
					font-weight:bold;
					padding-left:44px;
					}
				
			.profil a,
			.profil a:visited,
			.profil a:active,
			.profilSmall a{background:url(../img/bus-profil.gif) top left repeat-x;}
			.profil a span{left:43px;}
			
			.presse a,
			.presse a:visited,
			.presse a:active,
			.presseSmall a{background:url(../img/bus-presse.gif) top left repeat-x;}
			.presse a span{left:23px;}
			
			
			.presseSmall a,
			.profilSmall a{
			width:1em;
			height:1em;
			color:#717171;
			text-decoration:none;
			float:left;
			position:relative;
			}
			.presseSmall a span,
			.profilSmall a span{
			width:350px;
			position:absolute;
			left:06px;
			top:-1px;
			cursor:pointer;
			padding-left:10px;
			}
			
			
			.profil a:focus,
			.profil a:hover,
			#ons1 a{background:url(../img/bus1-profil.gif) top left no-repeat;}
			
			.presse a:focus,
			.presse a:hover,
			#ons2 a{background:url(../img/bus1-presse.gif) top left no-repeat;}
			
			
		#header img{
		margin-top:40px;
		float:left;
		}
		
	#content{
	width:800px;
	}

/********GLOBALS*********/
#content h1{
font-size:1.1em;
font-weight:bold;
float:left;
margin-bottom:.5em;
}

#content h2.alt{
font-size:1em;
clear:both;
padding:0;
margin-bottom:.5em;
}

#content p{
margin-bottom:1em;
clear:left;
position:relative;
}

b{font-weight:bold;}

sup{
font-size:0.7em;
vertical-align:text-top;
}

ul{
clear:both;
margin-bottom:2.5em;

}

ul li{
display:block;
}