/* ==================================================================================
Stylesheet
Datei: style3.css
Aufbau 1. Kalibrierung und allgemeine Selektoren, Seiteneinteilung
       2. Styles für den Layoutbereich
===================================================================================== */

/* =============================================================
   1. Kalibrierung und allgemeine Styles und Seiteneinteilung
   ============================================================= */

html {height: 101%;} 

body {
	font: 100% Tahoma, Verdana, Arial, Helvetica, sans-serif;
	background-color: #FFFFCC;
	margin:1%;
        

}

h1,h2, {
	font-family: Tahoma; Georgia, serif;
	font-weight:normal;
	
}

h1 {
	font-size: 150%;
	margin-bottom:1.5em;
	color:#CC0000;
}

h2 {
	font-size: 120%;
	margin-bottom:1.5em;
	color:#000000;
}

h3 {
	font-size: 100%;
	margin-bottom:1em;
	color:#000000
}
h4 {
	font-size: 82%;
	margin-bottom:1em;
	color:#000000
}

/* ================================================
   2. Styles für den Layoutbereich und Hyperlinks
   ================================================ */

#header {
	background:#FFFFCC url(images/bg_head_farbverlauf.gif);
	margin:0;
	padding:0;
	height:162px;
}

#content {
background-color:#FFFFCC;
color:#000000;
width: 75%;
float:right;
margin:0px;
padding:0px;
}
#nav {
background: url(images/bg_strich_farbe_4.gif) 80% 0% repeat-y;
	position:absolute;	
	width:20%;
	margin:0px 0;
	padding:0px 0;
}

#nav ul {
	list-style:none;
	margin:0;
	padding:0;
}


#nav li {
	margin:0;
	padding:0;
}

#nav a:link, #nav a:visited {
	display:block;
	margin:10px 0;
	padding:0.75em 0.75em 0.75em 1.5em;
	border:1px solid #667553;
	background:#FFFFCC url(images/br_reecke_pinsel.gif) bottom right no-repeat;
	height:1em;
	color:#FFFFCC;
	}
	
html>body #nav a:link, html>body #nav a:visited  {
	height:auto;
}
	
#nav a:hover {
	background-image:url(images/br_reecke_pinsel.gif);
}
#nav a:link, #nav a:visited {
	display:block;
	margin:10px 0;
	padding:0.75em 0.75em 0.75em 1.5em;
	border:1px solid #667553;
	height:1em;
	background:#FFFFCC bottom right no-repeat;
	color:#000000;
}

#nav a:hover {
	background-image:url(images/br_reecke_pinsel.gif);
}

#galerie li
{
list-style-type: none;
float: left;
margin: 0 10px 10px 0;
text-align: center;
font-weight: bold;
position: relative;
}

#galerie img
{
width: 427px;
height: 395px;
display: block;
padding: 3px;
border: 1px solid #8B0000;
}

#galerie a .gross
{
display: none;
}

#galerie a:hover .gross
{
width: 517px;
height: 559px;
display: block;
position: absolute;
top: -50px;
left: -50px;
z-index: 1;
background: #fff;
}

/*--Spezialangaben für den Internet Explorer 7--*/
*+html #galerie a:hover { z-index: 1;}
*+html #galerie li{position: static;}
*+html #galerie a {position: relative;}

/*--Spezialangaben für den Internet Explorer 6--*/
*html #galerie a:hover {display: block; z-index: 1;}
*html #galerie li{position: static;}
*html #galerie a {position: relative;} 

#galerie2 li
{
list-style-type: none;
float: left;
margin: 0 10px 10px 0;
text-align: center;
font-weight: bold;
position: relative;
}

#galerie2 img
{
width: 245px;
height: 143px;
display: block;
padding: 3px;
border: 1px solid #8B0000;
}

#galerie2 a .gross
{
display: none;
}

#galerie2 a:hover .gross
{
width: 490px;
height: 287px;
display: block;
position: absolute;
top: -50px;
left: -50px;
z-index: 1;
background: #fff;
}

/*--Spezialangaben für den Internet Explorer 7--*/
*+html #galerie2 a:hover { z-index: 1;}
*+html #galerie2 li{position: static;}
*+html #galerie2 a {position: relative;}

/*--Spezialangaben für den Internet Explorer 6--*/
*html #galerie2 a:hover {display: block; z-index: 1;}
*html #galerie2 li{position: static;}
*html #galerie2 a {position: relative;} 


/* ================================================
   Ende des Stylesheets
   ================================================ */