/*=======================================================
Stand: März 2010
datei: bildschirm.css
datum: 30.3.2010
Autor: T.Trölsch
Aufbau: 1.Kalibrierung und allg. Styles
		2.Styles für Layoutbereiche
		3.sonstige Styles
========================================*/

/*=================================
	1.Kalibrierung und allg. Styles
====================================*/
 


/*Kalibrierung wichtiger Abstände*/
*{margin: 0;}
p {color:#ffffff;font-family: Helvetica, Arial, sans-serif; font-size:12px;line-height: 1.3em;letter-spacing: 1px; font-weight: bold;}
h2,  ul, ol { margin-bottom: 1em; }/* Abstand nach unten*/
ul ul{ margin-bottom: 0;}/*Verschachtelte Listen ohne Abstand*/


/*Allgemeine Selektoren*/
body
{ /* Gestaltet das HTML-Element mit dem namen body */
	color: #FFFF99; /* Schriftfarbe */
	Background-color:#dde1ed; /*Hintergrundfarbe*/
	font-family:Helvetica,Arial, sans-serif;
	line-height: 15px;
	font-weight: bold;
	font-size:13px;

}

h1 {font-family:Verdana, sans-serif;
	font-size:18px;
   	font-weight: normal;
   	color: #006699;	}
h2 { font-size: 100%;
	text-align: center; }
h3 { font-size: 120%;
    margin-top: 30px;
    margin-right: auto;/*Abstand rechts*/
    margin-bottom: 0;
	margin-left: 200px;/*Abstand rechts*/ }
h4 { font-size: 100%;
	color: #FF8000;}
h5 { font-family:Verdana, sans-serif;
	font-size:18px;
   	font-weight: normal;
   	color: #006699;}



a:link { color: #4682b4;text-decoration:none; }
a:visited { color: #4682b4; text-decoration:none; }
a:hover, a:focus { color:white; text-decoration:none;}
a:active { color: #4682b4; text-decoration:none;}

<!--a.extra{text-decoration:none; font-size:9px; font-family:arial,sans-serif; font-weight: normal;}
a.extra:link { color: #4682b4; text-decoration:none;}
a.extra:visited { color:#4682b4; text-decoration:none; }
a.extra:hover {color:#F0ffff; text-decoration:none;}

/*Allgemeine Klassen und IDs*/



/*=================================
	2.Styles für die Layoutbereiche
====================================*/

#kopfbereich{
	background:#dde1ed url(img/kopf.jpg) no-repeat;
	width: 955px; /*Breite des Inhaltbereiches*/
	height: 120px; /*Breite des Inhaltbereiches*/
	margin-top: 20px;
	margin: 0 auto;	}


/* fotos */
     
#foto2{
    position:absolute;
    top:130px;
    left: 513px;
    width:375px;
    height:280px;
    margin:0 0 0 0;
    border:2px solid white; }
   
    #foto3{
    position:absolute;
    top:10px;
    left: 570px;
    width:358px;
    height:450px;
    margin:0 0 0 0;
    border:2px solid white;   }

  #foto4{
    position:absolute;
    top:70px;
    left: 470px;
    width:430px;
    height:284px;
    margin:0 0 0 0;
    border:2px solid white;   }
    
#foto5{
    position:absolute;
    top:20px;
    left: 570px;
    width:287px;
    height:430px;
    margin:0 0 0 0;
    border:2px solid white;   }
    
    #foto6{
    position:absolute;
    top:35px;
    left: 490px;
    width:420px;
    height:280px;
    margin:0 0 0 0;
    border:2px solid white;}
    
    
 #foto6a{
    position:absolute;
    top:360px;
    left: 400px;
    width:218px;
    height:50px;
    margin:0 0 0 0; }


  #foto7{
    position:absolute;
    top:50px;
    left: 680px;
    width:218px;
    height:300px;
    margin:0 0 0 0;
    border:2px solid white; }
    
    #foto7a{
    position:absolute;
    top:360px;
    left: 680px;
    width:218px;
    height:50px;
    margin:0 0 0 0;
     }
    
     #foto8{
    position:absolute;
    top:60px;
    left: 570px;
    width:358px;
    height:236px;
    margin:0 0 0 0;
    border:2px solid white;   }
    
    
 #foto9{
    position:absolute;
    top:30px;
    left: 580px;
    width:320px;
    height:400px;
    margin:0 0 0 0;
    border:2px solid white;   }
    
    #foto10{
    position:absolute;
    top:30px;
    left: 595px;
    width:309px;
    height:400px;
    margin:0 0 0 0;
    border:2px solid white;   }
    
       #foto11{
    position:absolute;
    top:63px;
    left: 570px;
    width:358px;
    height:306px;
    margin:0 0 0 0;
    border:2px solid white;   }
    
#foto12{
    position:absolute;
    top:30px;
    left: 570px;
    width:358px;
    height:400px;
    margin:0 0 0 0;
    border:2px solid white;   }

 #foto13{
    position:absolute;
    top:10px;
    left: 610px;
    width:260px;
    height:215px;
    margin:0 0 0 0;
    border:2px solid white;   }

 #foto14{
    position:absolute;
    top:240px;
    left: 610px;
    width:260px;
    height:180px;
    margin:0 0 0 0;
    border:2px solid white;   }    
    /*==== referenz navi klein===*/

a.link1 {
position:absolute;
top:375px;
left: 35px;
width:59px;
height:38px;
border:0px solid #000000;
background-image:url(img/plan.jpg);
}

a.link1:hover {
background-image:url(img/plan_an.jpg);
}
    
    
a.link2 {
position:absolute;
top:379px;
left: 95px;
width:23px;
height:26px;
border:0px solid #000000;
background-image:url(img/pfeil.jpg);
}

a.link2:hover {
background-image:url(img/pfeil_an.jpg);
}

a.link2a {
position:absolute;
top:100px;
left: 0;
width:130px;
height:26px;
border:0px solid #000000;
background-image:url(img/pfeila.jpg);
}

a.link2a:hover {
background-image:url(img/pfeila_an.jpg);
}

a.link2b {
position:absolute;
top:130px;
left: 0;
width:130px;
height:26px;
border:0px solid #000000;
background-image:url(img/pfeilb.jpg);
}

a.link2b:hover {
background-image:url(img/pfeilb_an.jpg);
}
 
 
    
a.link3{
position:absolute;
top:379px;
left: 10px;
width:23px;
height:26px;
border:0px solid #000000;
background-image:url(img/pfeil2.jpg);
}

a.link3:hover {
background-image:url(img/pfeil2_an.jpg);
}

a.link4{
position:absolute;
top:379px;
left: 50px;
width:60px;
height:50px;
border:0px solid #000000;
background-image:url(img/pfeil3.jpg);
}

a.link4:hover {
background-image:url(img/pfeil3_an.jpg);
}

a.link5{
position:absolute;
top:379px;
left: 50px;
width:60px;
height:50px;
border:0px solid #000000;
background-image:url(img/pfeil4.jpg);
}

a.link5:hover {
background-image:url(img/pfeil4_an.jpg);
}



/*==== wrapper===*/

#wrapper{/* Gestatltet das HTML-Element mit id="wrapper"*/
	position:relative;
	width:955px; 
	height:480px;
	background-color:#acbced;/*Hintergrundfarbe*/
	margin: 0 auto;
	padding: 0;
}


/*==== Textbereich===*/
#textbereich {
    position:absolute;
    left:60px;
	width:390px; 
	height:300px;
 	margin-top:35px;
 	padding-right:10px;
	padding-bottom:20px;	
	}
	
#textbereich1{
    position:absolute;
    left:190px;
	width:360px; 
	height:400px;
 	margin-top:30px;
 	padding-right:10px;
	padding-bottom:20px;	
	}
	
#textbereich1a{
    position:absolute;
    left:190px;
	width:350px; 
	height:400px;
 	margin-top:30px;
 	padding-right:10px;
	padding-bottom:20px;	
	}

#textbereich2{
    position:absolute;
    left:60px;
	width:380px; 
	height:400px;
 	margin-top:60px;
 	padding-right:10px;
	padding-bottom:20px;	
	}
	
#textbereich2a{
    position:absolute;
    left:60px;
	width:395px; 
	height:400px;
 	margin-top:60px;
 	padding-right:10px;
	padding-bottom:20px;	
	}

#textbereich3{
    position:absolute;
    left:60px;
	width:450px; 
	height:400px;
 	margin-top:60px;
 	padding-right:10px;
	padding-bottom:20px;	
	}
	
#textbereich3a{
    position:absolute;
    left:600px;
	width:450px; 
	height:400px;
 	margin-top:60px;
 	padding-right:10px;
	padding-bottom:20px;	
	}

#textbereich4{
    position:absolute;
    left:650px;
	width:240px; 
	height:400px;
 	margin-top:30px;
 	padding-right:10px;
	padding-bottom:20px;	
	}
	
	#textbereich5{
    position:absolute;
    left:40px;
	width:80px; 
	height:25px;
 	margin-top:30px;
 	padding-right:10px;
	padding-bottom:20px;	
	}
	
	#textbereich6{
    position:absolute;
    left:245px;
	width:180px; 
	height:25px;
 	margin-top:142px;
 		
	}
	
#textbereich7{
    position:absolute;
    left:255px;
	width:180px; 
	height:25px;
 	margin-top:275px;
 		}
 		
#textbereich7a{
    position:absolute;
    left:245px;
	width:180px; 
	height:25px;
 	margin-top:275px;
 		}
 		 		
 		
#textbereich8{
    position:absolute;
    left:250px;
	width:150px; 
	height:25px;
 	margin-top:408px;
 		} 	
 			
#textbereich9{
     position:absolute;
    left:415px;
	width:180px; 
	height:25px;
 	margin-top:142px;
 		} 
 		
 #textbereich10{
     position:absolute;
    left:580px;
	width:180px; 
	height:25px;
 	margin-top:142px;
 		} 
 
  #textbereich10a{
     position:absolute;
    left:575px;
	width:180px; 
	height:25px;
 	margin-top:142px;
 		} 	
 			
 #textbereich11{
     position:absolute;
    left:740px;
	width:180px; 
	height:25px;
 	margin-top:142px;
 		} 
 		
 #textbereich11a{
     position:absolute;
    left:825px;
	width:180px; 
	height:25px;
 	margin-top:142px;
 		}  	
 		
#textbereich11b{
     position:absolute;
    left:800px;
	width:180px; 
	height:25px;
 	margin-top:142px;
 		}  	 			
 		
 #textbereich12{
     position:absolute;
    left:410px;
	width:180px; 
	height:25px;
 	margin-top:275px;
 		} 
 		
 		
#textbereich13{
     position:absolute;
    left:555px;
	width:180px; 
	height:25px;
 	margin-top:275px;
 		} 
 		
#textbereich13a{
     position:absolute;
    left:565px;
	width:180px; 
	height:25px;
 	margin-top:275px;
 		} 
 		
 #textbereich14{
     position:absolute;
    left:640px;
	width:180px; 
	height:25px;
 	margin-top:275px;
 		} 
 		
 #textbereich14a{
     position:absolute;
    left:725px;
	width:180px; 
	height:25px;
 	margin-top:275px;
 		} 
 		
 		
#textbereich15{
      position:absolute;
    left:405px;
	width:180px; 
	height:25px;
 	margin-top:408px;
 		} 
 		
 #textbereich15a{
      position:absolute;
    left:405px;
	width:180px; 
	height:25px;
 	margin-top:408px;
 		} 		
 		
#textbereich16{
    position:absolute;
    left:565px;
	width:180px; 
	height:25px;
 	margin-top:408px;
 		} 
 		
#textbereich17{
    position:absolute;
    left:730px;
	width:180px; 
	height:25px;
 	margin-top:408px;
 		} 

#textbereich17a{
    position:absolute;
    left:795px;
	width:180px; 
	height:25px;
 	margin-top:408px;
 		}  		
 		
 		
#textbereich18{
    position:absolute;
    left:190px;
	width:360px; 
	height:400px;
 	margin-top:10px;
 	padding-right:10px;
	padding-bottom:20px;	
	}
	
	#textbereich19{
    position:absolute;
    left:180px;
	width:400px; 
	height:400px;
 	margin-top:30px;
 	padding-right:10px;
	padding-bottom:20px;	
	}
	
		#textbereich20{
    position:absolute;
    left:500px;
	width:400px; 
	height:400px;
 	margin-top:30px;
 	padding-right:10px;
	padding-bottom:20px;	
	}
	
		
		#textbereich21{
    position:absolute;
    left:180px;
	width:700px; 
	height:400px;
 	margin-top:30px;
 	padding-right:10px;
	padding-bottom:20px;	
	}

#textbereich22 {
    position:absolute;
    left:190px;
	width:390px; 
	height:400px;
 	margin-top:5px;
 	padding-right:10px;
	padding-bottom:20px;	
	}	
	
	

#textbereich a{
	border-bottom:1px dotted #FF8000;
}

#textbereich a:hover,
#textbereich a:focus {
	border-bottom: 1px solid #808080;
}



/*==== Ende Textbereich===*/




/* ====== Navibereich======*/

div#haupt {
background: white;
height: 31px;
margin-right: auto;/*Abstand rechts*/
margin-left: auto;/*Abstand rechts*/
width: 957px;
border-bottom:3px solid #cc9900;
}

ul#nav1 {
list-style: none;
}

ul#nav1, ul#nav1 li {
height: 30px;
}

ul#nav1 {
margin:0 0 0 0;
}

ul#nav1 li {
float: left;
}

/* ====== start======*/
ul#nav1 #start, ul#nav1 #start_an {
background: url(img/navi1.jpg);
width: 93px;

}

ul#nav1 #start :focus, ul#nav1 #start:hover, ul#nav1 #start:active, ul#nav1 #start_an {
background: url(img/navi1a.jpg);
}

ul#nav1 #start_an {
background-image: url(img/navi1b.jpg);
}


/* ====== hochzeiten======*/

ul#nav1 #hochzeiten, ul#nav1 #hochzeiten_an {
background: url(img/navi2.jpg);
width: 106px;

}

ul#nav1 #hochzeiten :focus, ul#nav1 #hochzeiten:hover, ul#nav1 #hochzeiten:active, ul#nav1 #hochzeiten_an {
background: url(img/navi2a.jpg);
}
ul#nav1 #hochzeiten_an {
background-image: url(img/navi2b.jpg);
}

/* ====== namen======*/

ul#nav1 #namen, ul#nav1 #namen_an {
background: url(img/navi3.jpg);
width: 157px;

}

ul#nav1 #namen :focus, ul#nav1 #namen:hover, ul#nav1 #namen:active, ul#nav1 #namen_an {
background: url(img/navi3a.jpg);
}

ul#nav1 #namen_an {
background-image: url(img/navi3b.jpg);
}

/* ====== anlaesse ======*/

ul#nav1 #anlaesse, ul#nav1 #anlaesse_an {
background: url(img/navi4.jpg);
width: 167px;

}

ul#nav1 #anlaesse :focus, ul#nav1 #anlaesse:hover, ul#nav1 #anlaesse:active, ul#nav1 #anlaesse_an {
background: url(img/navi4a.jpg);
}

ul#nav1 #anlaesse_an {
background-image: url(img/navi4b.jpg);
}

/* ====== klie ======*/

ul#nav1 #klie, ul#nav1 #klie_an {
background: url(img/navi5.jpg);
width: 115px;

}

ul#nav1 #klie :focus, ul#nav1 #klie:hover, ul#nav1 #klie:active, ul#nav1 #klie_an {
background: url(img/navi5a.jpg);
}

ul#nav1 #klie_an {
background-image: url(img/navi5b.jpg);
}
/* ====== mitarbeiter ======*/

ul#nav1 #mitarbeiter, ul#nav1 #mitarbeiter_an {
background: url(img/navi6.jpg);
width: 100px;

}

ul#nav1 #mitarbeiter :focus, ul#nav1 #mitarbeiter:hover, ul#nav1 #mitarbeiter:active, ul#nav1 #mitarbeiter_an {
background: url(img/navi6a.jpg);
}

ul#nav1 #mitarbeiter_an {
background-image: url(img/navi6b.jpg);
}


/* ====== kontakt ======*/

ul#nav1 #kontakt, ul#nav1 #kontakt_an {
background: url(img/navi7.jpg);
width: 92px;

}

ul#nav1 #kontakt :focus, ul#nav1 #kontakt:hover, ul#nav1 #kontakt:active, ul#nav1 #kontakt_an {
background: url(img/navi7a.jpg);
}

ul#nav1 #kontakt_an {
background-image: url(img/navi7b.jpg);
}

/* ====== links ======*/

ul#nav1 #links, ul#nav1 #links_an {
background: url(img/navi8.jpg);
width: 120px;

}

ul#nav1 #links :focus, ul#nav1 #links:hover, ul#nav1 #links:active, ul#nav1 #links_an {
background: url(img/navi8a.jpg);
}

ul#nav1 #links_an {
background-image: url(img/navi8b.jpg);
}


/* ====== welcome======*/

ul#nav1 #welcome, ul#nav1 #welcome_an {
background: url(img/nav1.jpg);
width: 93px;

}

ul#nav1 #welcome :focus, ul#nav1 #welcome:hover, ul#nav1 #welcome:active, ul#nav1 #welcome_an {
background: url(img/nav1a.jpg);
}

ul#nav1 #welcome_an {
background-image: url(img/nav1b.jpg);
}


/* ====== wedding ======*/

ul#nav1 #wedding, ul#nav1 #wedding_an {
background: url(img/nav2.jpg);
width: 106px;

}

ul#nav1 #wedding :focus, ul#nav1 #wedding:hover, ul#nav1 #wedding:active, ul#nav1 #wedding_an {
background: url(img/nav2b.jpg);
}
ul#nav1 #wedding_an {
background-image: url(img/nav2a.jpg);
}

/* ====== naming======*/

ul#nav1 #naming, ul#nav1 #naming_an {
background: url(img/nav3.jpg);
width: 157px;

}

ul#nav1 #naming :focus, ul#nav1 #naming:hover, ul#nav1 #naming:active, ul#nav1 #naming_an {
background: url(img/nav3a.jpg);
}

ul#nav1 #naming_an {
background-image: url(img/nav3b.jpg);
}

/* ====== occasions ======*/

ul#nav1 #occasions, ul#nav1 #occasions_an {
background: url(img/nav4.jpg);
width: 167px;

}

ul#nav1 #occasions :focus, ul#nav1 #occasions:hover, ul#nav1 #occasions:active, ul#nav1 #occasions_an {
background: url(img/nav4a.jpg);
}

ul#nav1 #occasions_an {
background-image: url(img/nav4b.jpg);
}

/* ====== about ======*/

ul#nav1 #about, ul#nav1 #about_an {
background: url(img/nav5.jpg);
width: 115px;

}

ul#nav1 #about :focus, ul#nav1 #about:hover, ul#nav1 #about:active, ul#nav1 #about_an {
background: url(img/nav5a.jpg);
}

ul#nav1 #about_an {
background-image: url(img/nav5b.jpg);
}
/* ====== coworker ======*/

ul#nav1 #coworker, ul#nav1 #coworker_an {
background: url(img/nav6.jpg);
width: 100px;

}

ul#nav1 #coworker :focus, ul#nav1 #coworker:hover, ul#nav1 #coworker:active, ul#nav1 #coworker_an {
background: url(img/nav6a.jpg);
}

ul#nav1 #coworker_an {
background-image: url(img/nav6b.jpg);
}


/* ====== contact ======*/

ul#nav1 #contact, ul#nav1 #contact_an {
background: url(img/nav7.jpg);
width: 92px;

}

ul#nav1 #contact :focus, ul#nav1 #contact:hover, ul#nav1 #contact:active, ul#nav1 #contact_an {
background: url(img/nav7a.jpg);
}

ul#nav1 #contact_an {
background-image: url(img/nav7b.jpg);
}
/* ====== link ======*/

ul#nav1 #partner, ul#nav1 #partner_an {
background: url(img/nav8.jpg);
width: 120px;

}

ul#nav1 #partner :focus, ul#nav1 #partner:hover, ul#nav1 #partner:active, ul#nav1 #partner_an {
background: url(img/nav8a.jpg);
}

ul#nav1 #partner_an {
background-image: url(img/nav8b.jpg);
}



ul#nav1 a, ul#nav1 li a, ul#nav1 li span {
display: block;
text-decoration: none;
}

ul#nav1 a {
height: 100%;
text-indent: -999em;
}

ul#nav_1 a, ul#nav_2 li a, ul#nav_2 li span {
display: block;
text-decoration: none;
}

ul#nav_1 a {
height: 100%;
text-indent: -999em;
}

/* ====== Navibereich======*/


		/* Sidebar */

#sidebar {
	float: left;
	width: 170px;
	height: 120px;
	padding-top: 20px; }

#sidebar ul {
	margin: 0;
	padding: 0 0 20px 0;
	list-style: none;}

#sidebar li {
}

#sidebar li ul {
	padding: 0px 21px 20px 15px;
}

#sidebar li li {
	border-bottom: 1px dotted white;
	padding: 5px 0px;
}


#sidebar a {
   	font-size:12px;
   	font-weight: bold;
	font-family: Verdana, sans-serif;
	text-decoration: none;
	color: #4682b4;
}

#sidebar a:hover {
	text-decoration: none;
	color:white;
}

#sidebar .current_page_item a {
		background:transparent;
		color: #FFFFFF;
		}


/*  Ende Sidebar */



/* ====== fotos======*/
div#foto {
background:transparent;
height: 100px;
margin-right: auto;/*Abstand rechts*/
margin-left: auto;/*Abstand rechts*/
width: 955px;

}

ul#foto1 {
list-style: none;
}

ul#foto1, ul#foto1 li {
height: 80px;
}

ul#foto1 {
padding:20px;
margin: 0 0 0 0px;
}

ul#foto1 li {
float: left;
margin-right: 30px;
margin-left: 40px;
}

/* ====== foto1 ======*/
ul#foto1 #bild1, ul#foto1 #bild1_an {
background: url(img/hochzeiten.jpg);
width: 80px;

}

ul#foto1 #bild1 :focus, ul#foto1 #bild1:hover, ul#foto1 #bild1:active, ul#foto1 #bild1_an {
background: url(img/hochzeiten2.jpg);}

ul#foto1 #bild1_an {
background-image: url(img/hochzeiten.jpg);
}
/* ====== foto2 ======*/

ul#foto1 #bild2, ul#foto1 #bild2_an {
background: url(img/namensgebung.jpg);
width: 80px;

}

ul#foto1 #bild2 :focus, ul#foto1 #bild2:hover, ul#foto1 #bild2:active, ul#foto1 #bild2_an {
background: url(img/namens2.jpg);}

/* ====== foto3 ======*/

ul#foto1 #bild3, ul#foto1 #bild3_an {
background: url(img/besondere.jpg);
width: 80px;

}

ul#foto1 #bild3 :focus, ul#foto1 #bild3:hover, ul#foto1 #bild3:active, ul#foto1 #bild3_an {
background: url(img/besondere2.jpg);}

/* ====== foto4 ======*/

ul#foto1 #bild4, ul#foto1 #bild4_an {
background: url(img/klie.jpg);
width: 80px;

}

ul#foto1 #bild4 :focus, ul#foto1 #bild4:hover, ul#foto1 #bild4:active, ul#foto1 #bild4_an {
background: url(img/klie2.jpg);}

/* ====== foto5 ======*/

ul#foto1 #bild5, ul#foto1 #bild5_an {
background: url(img/mitarbeiter.jpg);
width: 80px;

}

ul#foto1 #bild5 :focus, ul#foto1 #bild5:hover, ul#foto1 #bild5:active, ul#foto1 #bild5_an {
background: url(img/mitarbeiter2.jpg);}

/* ====== foto6 ======*/

ul#foto1 #bild6, ul#foto1 #bild6_an {
background: url(img/kontakt.jpg);
width: 80px;

}

ul#foto1 #bild6 :focus, ul#foto1 #bild6:hover, ul#foto1 #bild6:active, ul#foto1 #bild6_an {
background: url(img/kontakt2.jpg);}


ul#foto1 a, ul#nav2 li a, ul#foto1 li span {
display: block;
text-decoration: none;
}

ul#foto1 a {
height: 100%;
text-indent:-999em;
}

/* ====== Ende Navibereich======*/

/* ====== Referenz ======*/


a.bild1{
position:absolute;
top:30px;
left: 230px;
width:122px;
height:100px;
border:0px solid #000000;
background-image:url(img/ref3.jpg);
}

a.bild1:hover {
background-image:url(img/ref3a.jpg);
}

/* ============*/

a.bild2{
position:absolute;
top:30px;
left: 390px;
width:122px;
height:100px;
border:0px solid #000000;
background-image:url(img/hamer3b.jpg);
}

a.bild2:hover {
background-image:url(img/hamer3.jpg);
}
/* ============*/

a.bild3{
position:absolute;
top:30px;
left: 550px;
width:122px;
height:100px;
border:0px solid #000000;
background-image:url(img/hauptmann8a.jpg);
}

a.bild3:hover {
background-image:url(img/hauptmann8.jpg);
}

/* ============*/

a.bild4{
position:absolute;
top:30px;
left: 710px;
width:122px;
height:100px;
border:0px solid #000000;
background-image:url(img/ref6a.jpg);
}

a.bild4:hover {
background-image:url(img/ref6.jpg);
}

/* ============*/

a.bild5{
position:absolute;
top:165px;
left: 230px;
width:122px;
height:100px;
border:0px solid #000000;
background-image:url(img/hauptmann2b.jpg);
}

a.bild5:hover {
background-image:url(img/hauptmann2.jpg);
}

/* ============*/
a.bild6{
position:absolute;
top:165px;
left: 390px;
width:122px;
height:100px;
border:0px solid #000000;
background-image:url(img/ref8a.jpg);
}

a.bild6:hover {
background-image:url(img/ref8.jpg);
}

/* ============*/

a.bild7{
position:absolute;
top:165px;
left: 550px;
width:122px;
height:100px;
border:0px solid #000000;
background-image:url(img/hamer2b.jpg);
}

a.bild7:hover {
background-image:url(img/hamer2.jpg);
}



/* ============*/

a.bild8{
position:absolute;
top:165px;
left: 710px;
width:122px;
height:100px;
border:0px solid #000000;
background-image:url(img/ref15a.jpg);
}

a.bild8:hover {
background-image:url(img/ref15.jpg);
}

/* ============*/

a.bild9{
position:absolute;
top:300px;
left: 230px;
width:122px;
height:100px;
border:0px solid #000000;
background-image:url(img/hamer1b.jpg);
}

a.bild9:hover {
background-image:url(img/hamer1.jpg);
}

/* ============*/

a.bild10{
position:absolute;
top:300px;
left: 390px;
width:122px;
height:100px;
border:0px solid #000000;
background-image:url(img/hauptmann3a.jpg);
}

a.bild10:hover {
background-image:url(img/hauptmann3.jpg);
}

/* ============*/

a.bild11{
position:absolute;
top:300px;
left: 550px;
width:122px;
height:100px;
border:0px solid #000000;
background-image:url(img/ref12a.jpg);
}

a.bild11:hover {
background-image:url(img/ref12.jpg);
}

/* ============*/

a.bild12{
position:absolute;
top:300px;
left: 710px;
width:122px;
height:100px;
border:0px solid #000000;
background-image:url(img/hauptmann4a.jpg);
}

a.bild12:hover {
background-image:url(img/hauptmann4.jpg);
}

/* ============*/

/* ============*/

a.bild13{
position:absolute;
top:30px;
left: 230px;
width:122px;
height:100px;
border:0px solid #000000;
background-image:url(img/hauptmann5.jpg);
}

a.bild13:hover {
background-image:url(img/hauptmann5a.jpg);
}

/* ============*/

a.bild14{
position:absolute;
top:30px;
left: 390px;
width:122px;
height:100px;
border:0px solid #000000;
background-image:url(img/ref5a.jpg);
}

a.bild14:hover {
background-image:url(img/ref5.jpg);
}

/* ============*/

a.bild15{
position:absolute;
top:30px;
left: 550px;
width:122px;
height:100px;
border:0px solid #000000;
background-image:url(img/hauptmann6.jpg);
}

a.bild15:hover {
background-image:url(img/hauptmann6a.jpg);
}

/* ============*/

a.bild16{
position:absolute;
top:30px;
left: 710px;
width:122px;
height:100px;
border:0px solid #000000;
background-image:url(img/ref14a.jpg);
}

a.bild16:hover {
background-image:url(img/ref14.jpg);
}

/* ============*/

a.bild17{
position:absolute;
top:165px;
left:230px;
width:122px;
height:100px;
border:0px solid #000000;
background-image:url(img/ref7a.jpg);
}

a.bild17:hover {
background-image:url(img/ref7.jpg);
}

/* ============*/

a.bild18{
position:absolute;
top:165px;
left:390px;
width:122px;
height:100px;
border:0px solid #000000;
background-image:url(img/hauptmann7.jpg);
}

a.bild18:hover {
background-image:url(img/hauptmann7a.jpg);
}

/* ============*/

a.bild19{
position:absolute;
top:165px;
left:550px;
width:122px;
height:100px;
border:0px solid #000000;
background-image:url(img/ref9.jpg);
}

a.bild19:hover {
background-image:url(img/ref9a.jpg);
}

/* ============*/

a.bild20{
position:absolute;
top:165px;
left:710px;
width:122px;
height:100px;
border:0px solid #000000;
background-image:url(img/ref1.jpg);
}

a.bild20:hover {
background-image:url(img/ref1a.jpg);
}

/* ============*/

a.bild21{
position:absolute;
top:300px;
left:230px;
width:122px;
height:100px;
border:0px solid #000000;
background-image:url(img/ref11.jpg);
}

a.bild21:hover {
background-image:url(img/ref11a.jpg);
}

/* ============*/

a.bild22{
position:absolute;
top:300px;
left:390px;
width:122px;
height:100px;
border:0px solid #000000;
background-image:url(img/hauptmann1b.jpg);
}

a.bild22:hover {
background-image:url(img/hauptmann1.jpg);
}

/* ============*/

a.bild23{
position:absolute;
top:300px;
left:550px;
width:122px;
height:100px;
border:0px solid #000000;
background-image:url(img/ref10a.jpg);
}

a.bild23:hover {
background-image:url(img/ref10.jpg);
}

/* ============*/

a.bild24{
position:absolute;
top:300px;
left:710px;
width:122px;
height:100px;
border:0px solid #000000;
background-image:url(img/ref2a.jpg);
}

a.bild24:hover {
background-image:url(img/ref2.jpg);
}

/* ============*/


/* Logo */

#logo {
	float: right;
	height: 40px;
	margin: 20px;
	color: #000000;
}

#logo h1, #logo p {
	margin: 0;
	padding: 0;
}


#logo p {
	float: right;
	margin-right: 30px;
	padding: 20px 0 0 10px;
	font: normal 18px Georgia, "Times New Roman", Times, serif;
	font-style: italic;
	color: #5E4E38;
} 

#logo p a {
	color: #006699;
}

#logo a {
	border: none;
	background: none;
	text-decoration: none;
	color:#006699;
}


/*Anfang Galerie*/
/* The outer container with a relative position */
#gallery {width:720px; height:420px; position:relative; margin-left: 200px; background:transparent; }

/* Float the ul to the right with a width to give 3 thumbnail images per row */
#gallery ul {list-style:none; padding:0; margin:48px 0 0 0; width:381px; float:right;}

/* Place the list items inline using display:inline for IE and float:left */
#gallery ul li {display:inline; width:80px; height:80px; float:left; margin:0 0 8px 8px; border:2px solid #fff; cursor:pointer;}

/* Set up the thumbnail images as the background images */
#gallery ul li.tb1 {background:url(img/bild1.jpg);}
#gallery ul li.tb2 {background:url(img/bild2.jpg);}
#gallery ul li.tb3 {background:url(img/bild3.jpg);}
#gallery ul li.tb4 {background:url(img/bild4.jpg);}
#gallery ul li.tb5 {background:url(img/bild5.jpg);}
#gallery ul li.tb6 {background:url(img/bild6.jpg);}
#gallery ul li.tb7 {background:url(img/bild7.jpg);}
#gallery ul li.tb8 {background:url(img/bild8.jpg);}
#gallery ul li.tb9 {background:url(img/bild9.jpg);}
#gallery ul li.tb10 {background:url(img/bild10.jpg);}
#gallery ul li.tb11 {background:url(img/bild11.jpg);}
#gallery ul li.tb12 {background:url(img/bild12.jpg);}
#gallery ul li.tb13 {background:url(img/bild13.jpg);}
#gallery ul li.tb14 {background:url(img/bild14.jpg);}
#gallery ul li.tb15 {background:url(img/bild16.jpg);}
#gallery ul li.tb16 {background:url(img/bild15.jpg);}
#gallery ul li.tb17 {background:url(img/bild17.jpg);}
#gallery ul li.tb18 {background:url(img/bild18.jpg);}
#gallery ul li.tb19 {background:url(img/bild19.jpg);}
#gallery ul li.tb20 {background:url(img/bild20.jpg);}
#gallery ul li.tb21 {background:url(img/bild21.jpg);}
#gallery ul li.tb22 {background:url(img/bild22.jpg);}
#gallery ul li.tb23 {background:url(img/bild23.jpg);}
#gallery ul li.tb24 {background:url(img/bild24.jpg);}
#gallery ul li.tb25 {background:url(img/bild25.jpg);}
#gallery ul li.tb26 {background:url(img/bild26.jpg);}
#gallery ul li.tb27 {background:url(img/bild27.jpg);}
#gallery ul li.tb28 {background:url(img/bild28.jpg);}
#gallery ul li.tb29 {background:url(img/bild29.jpg);}
#gallery ul li.tb30 {background:url(img/bild30.jpg);}
#gallery ul li.tb31 {background:url(img/bild31.jpg);}
#gallery ul li.tb32 {background:url(img/bild32.jpg);}



/* Hide the full size images */
#gallery ul li span i img {display:none;}

/* set up the .click style which will be added using javascript */



/* Change the li border to white */
#gallery ul li.click {border-color: #cc9900; cursor:default;}




/* Position the span using an absolute position and specify the width and height */
#gallery ul li.click span {position:absolute; left:1px; top:48px; width:313px; height:351px; border:3px solid #cc9900;}

#gallery ul li.tb1:hover{
border:2px solid #cc9900;
}
#gallery ul li.tb2:hover{
border:2px solid #cc9900;
}
#gallery ul li.tb3:hover{
border:2px solid #cc9900;
}
#gallery ul li.tb4:hover{
border:2px solid #cc9900;
}
#gallery ul li.tb5:hover{
border:2px solid #cc9900;
}
#gallery ul li.tb6:hover{
border:2px solid #cc9900;
}
#gallery ul li.tb7:hover{
border:2px solid #cc9900;
}
#gallery ul li.tb8:hover{
border:2px solid #cc9900;
}
#gallery ul li.tb9:hover{
border:2px solid #cc9900;
}
#gallery ul li.tb10:hover{
border:2px solid #cc9900;
}
#gallery ul li.tb11:hover{
border:2px solid #cc9900;
}
#gallery ul li.tb12:hover{
border:2px solid #cc9900;
}
#gallery ul li.tb13:hover{
border:2px solid #cc9900;
}
#gallery ul li.tb14:hover{
border:2px solid #cc9900;
}
#gallery ul li.tb15:hover{
border:2px solid #cc9900;
}
#gallery ul li.tb16:hover{
border:2px solid #cc9900;
}
/* Set up the i so that it is the same size as the span BUT this has a static position so that the image can be both vertically and horizontally centered in all browsers except IE using display:table-cell */
#gallery ul li.click span i {width:310px; height:350px; display:table-cell; vertical-align:middle; text-align:center;} 

/* Make the image actual size using auto width and height */
#gallery ul li.click span i img {display:block; width:auto; height:auto; border:1px solid #fff; margin:0 auto;}

/* set up the default image */
#gallery ul li.default {width:0; height:0; border:0;}
#gallery ul li.default span {position:absolute; left:1px; top:48px; width:310px; height:350px;}
#gallery ul li.default span i {width:310px; height:350px; display:table-cell; vertical-align:middle; text-align:center;} 
/* specify the image width and height for IE6 */
#gallery ul li.default span i img {display:block; width:310px; height:350px; border:5px solid #fff; margin:0 auto;}
#gallery ul li.off {display:none;}



/*=================================
	ENDE
====================================*/