/* Viola Holtzmann Grafik & Typografie - www.viola-holtzmann.de */

/* GerŸst */

body {
height:100%;
margin: 0;
padding: 0; 
}

#container {  
position:absolute;
left:50%;
width:800px;
height:100%;
margin-top:0;
margin-left:-400px;
overflow:auto;
background: #e5e5e5;
}

#header {  
top: 0;
width: 555px;
height: 145px; 
position : absolute;
background: #ffff66 url(logo-gelb.gif) no-repeat bottom right;
z-index : 3;
}

#tuerkis {
top: 0;
left: 555px;
width : 245px;
height: 100%;
position : absolute;
background: #7fcccc url(logo-tuerkis.gif) no-repeat;
z-index : 1;
      }

#hauptmenue {
margin-left: 75px;
margin-top: 35px;
z-index : 4;
      }

#untermenue  {
margin-left: 35px;
margin-top: 150px;
z-index : 4;
      }

#untermenue h1 {
margin-left: 0px;
      }

#grau {  
position : absolute;
top: 145px;
width: 555px;
height:73%;
background: url(logo-grau.gif)  no-repeat top right;
z-index : 1;
} 

/*Wenn grau auf position : absolute; gesetzt wird, addieren Netscape 7 PC, Moz 1.2.1 Mac, IE 5.2 Mac und iCab 3.0.3 Mac bei einer height:100%; die 145px (egal ob top: 145px; oder margin-top: 145px; unten hinzu und es entsteht ein wei§er Balken. Wenn man position : absolute; weglŠsst, stimmt im IE 5 PC die Positionierung von grau nicht mehr: er beginnt dann ganz oben... text scrollt nur mit Height-Angabe. Workaround: Spielerei mit den height-Angaben von grau und text...*/

#text {  
margin-top: 20px;
left: 0px;
width: 500px;
height:98%;
background: transparent;
z-index : 1;
overflow: auto;
}

#copyright {  
position:absolute;
left:50%;
margin-left:405px;
width:50px;
height:20px;
bottom:5px;
	z-index : 4;
}

/* Textformatierung */

body { 
font-family : Avantgarde, "Lucida Grande", Arial, Helvetica, sans-serif; 
font-size : 12px; 
line-height: 18px;
color: #000000;
 }

h2 {
margin-left : 30px;
font-size : 16px;
font-weight: bold;
margin-bottom : -5px;
 }

h3 {
margin-left : 30px;
font-size : 14px;
font-weight: bold;
margin-bottom : -5px;
 }

h4 {
margin-left : 30px;
font-size : 12px;
font-weight: bold;
 }

p {
margin-left : 30px;
margin-right : 60px;
margin-bottom : 20px;
}

a:link, a:visited {
text-decoration: none;
color: #000;
}

a:hover, a:active {
text-decoration: none;
color: #333;
}

#container {  
text-align : left;
}

#header h1 {  
margin-left: 30px;
margin-top: 105px; 
height:17px;
background: transparent url(header.gif) no-repeat  0% 0%;
}

#header h1 span {
display : none;
      }

#header h2 {
display : none;
      }

#tuerkis {  
font-weight: bold;
}

/*#text ul {
margin-left:0px;
      }*/

#text li {
list-style-type: circle;
padding:0px;
margin-left:15px;
      }

#text h1 {
margin-top: 15px; 
margin-bottom: 30px; 
margin-left : 30px;
font-size : 18px;
font-weight: bold;
line-height: 21px;
 }

#untermenue h1 {
font-size : 18px;
font-weight: bold;
line-height: 21px;
 }

#grau a:link, #grau a:visited, #grau a:hover, #grau a:active {
text-decoration: underline;
}

.bildlinks {
float:left; 
margin : 0px 10px 0 0;
}