/* ====================================================================
stylesheet für hatebier.de 
Stand: 1. Onlinefassung
Datum: 01.09.10
Autorin: Ina Hattebier

Aufbau: 1. Kalibrierung und allgemeine Styles
		2. Styles für Layoutbereiche
		3. Sonstige Styles
		
====================================================================== */

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

/* Kalibrierung der wichtigsten Abstände */

* { padding: 0; margin: 0; }

p { margin-bottom: 1em; } /* Abstand nach unten */

/* Allgemeine Selektoren */
html { height: 101%; } /* erzwingt scrollbar in Firefox */

body {
	color: #593807; /* Schriftfarbe*/
	font-family: Verdana, Helvetica, Arial, sans-serif;
	font-size: 67.5%;
	line-height: 150%;
}

h3 { 
	font-size: 100%; 
	font-weight: bold;
	margin-top: 2em; 
}


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


#wrapper {
	position: relative; /* positioniert aber bleibt im fluss */
	width: 821px; /* Breite des Inhaltsbereiches */
	margin:  82px auto 0px auto; 
}

h1, h2 { 
	visibility: hidden;
	text-align: left;
	line-height: 0; 
	position: absolute;
	left: -1000px;
	top: -1000px;
}

#containerleft {
	float: left;
	width: 566px;
	height: 570px;
}

#kopfbereich {
	width: 426px;
	height: 93px;
	margin-left: 140px;
	background-image: url(medien/kopfbild.jpg);
	background-position: right top;
	background-repeat: no-repeat;
	text-align: right;
}
#kopfbereich li {
	display: inline; /*listenpunkte nebeneinander anzeigen */
	list-style-type: none; /* ohne aufzählungspunkte */
	padding-left: 24px;
	padding-top: 5px;
	border-top: 1px solid #593807;
}

#kopfbereich ul {
	padding-top: 100px;
}

#kopfbereich a {
	color: #593807;
	text-decoration: none; outline: none; /* Unterstreichung entfernen, gepunktetes Kästchen entfernen */
} 

#kopfbereich a:hover,
#kopfbereich a:focus {
	color: #e18c00;
}

.aktuell #navi01 a,
.kunst #navi02 a,
.grafik #navi03 a,
.biografie #navi04 a,
.kontakt #navi05 a, 
.impressum #navi06 a {
	color: #e18c00;
}
 
#kopfbereich a:active { 
	color: #e18c00;
}

#inhalt {
	width: 566px;
	height: auto;
	margin-top: 60px;
	padding-left: 20px;
}
#inhalt img {
	padding-top: 0px;
}
#inhalt p {
	width: 406px;
	padding-left:140px;
}

#containerright {
	float: right;
	width: 225px;
	height: 570px;
	margin-left: 30px;
}
.aktuell #containerright {
	background-image: url(medien/kontakt.jpg);
	background-repeat: no-repeat;
}
.kunst #containerright {
	background-image: url(medien/kunst.jpg);
	background-repeat: no-repeat;
}	
.grafik #containerright {
	background-image: url(medien/papier2.jpg);
	background-repeat: no-repeat;
}	
.biografie #containerright {
	background-image: url(medien/biografie.jpg);
	background-repeat: no-repeat;
}	
.kontakt #containerright {
	background-image: url(medien/impressum.jpg);
	background-repeat: no-repeat;
}	
.impressum #containerright {
	background-image: url(medien/impressum.jpg);
	background-repeat: no-repeat;
}	

#navivertikal {
	margin-top: 150px;
}

#inhalt a { 
	text-decoration: none; outline: none; } /* Unterstreichung entfernen, gepunktetes Kästchen entfernen */
	a:link { color: #e18c00; } 
	a:visited { color: #e18c00; }
	a:hover, a:focus { color: #e18c00;
	font-weight: normal; 
}
	
#inhalt li {
	list-style-type: circle;
	list-style-position: inside;
	margin-bottom: 1em;

}


#containerright li {
	list-style-type: none; /* ohne aufzählungspunkte */
	margin-bottom: 1em;
}

#containerright a {
	color: #593807;
	display: block; /* ganze Fläche anklickbar machen */
	text-decoration: none; outline: none; /* Unterstreichung entfernen, gepunktetes Kästchen entfernen */
	letter-spacing: 0.03em;

} 

#containerright a:hover,
#containerright a:focus,
#containerright a:active {
	color: #e18c00;
}



/* ====================================================================
3. Sonstige Styles
====================================================================== */