@charset "utf-8";

/*===========================================================================
Stylesheet für die PoCul-Seite
Stand: in der Mache schwitzt die Würze
Datei: bildschirm.css
Datum: 16.Dezember2008
Autor: daweeda
Aufbau: 1. Kalibrierung und allgemeine Styles
		2. Styles für Layoutbereich
		3. Sonstige Styles
============================================================================*/




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

/* Kalibrierung der wichtigsten Abstände */
* {padding: 0; margin: 0; }
h2, h3, h4, p, ul { margin-bottom: 1em; }  /* Abstand nach unten */
ul ul { margin-bottom: 0; } /* Verschachteelte Listen ohne Abstand */
li { margin-left: 1em; } /* Abstand von lins */



/* Allgemeine Selektoren */
html { height: 101%; } /* erzwingt Scrollbar im Firefox */


body { /* Gestalte das HTML-Elemente mit dem Namen body */
	color: black; /* Schriftfarbe */
	/*background-image: url(images/blass.jpg); */
	background-color: #8c8c8c; /* Hintergrundfarbe */
	font-family: Arial, Helvetica, sans-serif;
	font-size: small;
}

h1 { font-size: 150%; }
h2 { font-size: 130%; }


/* Hyperlinks allgemein */
a { text-decoration: none; outline: none; }

a:link { color:#9966FF; }
a:visited { color: #9966FF; }

a:hover, 
a:focus {
	border-bottom: 1px solid black;
}

a:active {
	color: white;
	background-color: black;
}


/* Allgemeine Klassen und IDs */
.skiplink {
	position: absolute;
	top: -2000px;
	left: -3000px;
	width: 0px;
	height: 0px;
	overflow: hidden;
	display: inline;
}

#logo {
	color: black;
	background-color: white;
}



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

#wrapper { /* Gestalte das HTML-Element mit id="wrapper" */
	color: black;
	background-color: white;
	width: 720px; /* Breite des Inhaltsbereichs*/
	margin-top: 10px; 
	margin-right: auto;
	margin-bottom: 10px;
	margin-left: auto;
}


#kopfbereich {
position: relative;
	color: black;
	background-color: black;
/*	background-image: url(images/AUGENzug.png);*/
	background-color: #9966FF;
	padding-top: 20px;
	padding-right: 20px;
	padding-bottom: 0;
	padding-left: 20px;
}
	#kopfbereich p {
	position: absolute;
	top: 21px;
	right: 234px;
	font-weight: bolder;
	font-size: 24px;
	padding: 5px 0 5px 0;
	margin-bottom: 0;
	width: 305px;
	}

#navibereich {
/* Fixieren position: fixed; */
	text-align: right; /* rechtsbündig */
	color: black;
	background-color: #9966FF;
	padding: 5px 10px 4px 10px;
	border-bottom: 1px solid #8c8c8c;
}

		#navibereich ul { margin-bottom: 0; }
		#navibereich li {
			display: inline; /* li nebeneinander anzeigen */
			list-style-type: none; /* ohne Aufzählungspunkte */
			margin: 0;
		}
		#navibereich a {
			color: white;
			background-color: black;
			padding: 4px 8px 4px 8px;
			border: 1px solid #8c8c8c;
		}
		#navibereich a:visited { color: white; }
		#navibereich a:hover { background-color: white; color: black;}
		#navibereich a:focus,
		#startseite #navi01 a,
		#buecherseite #navi02 a,
		#strelaseite #navi03 a,
		#aposeite #navi04 a,
		#serviceseite #navi05 a,
		#impressumseite #navi06 a {
			color: black;
			background-color: white;
			border-bottom-color: white; /* Rahmenlinie weiss */
		}
		#navibereich a:active {
			color: white;
			background-color: #9966FF;
		}

#textbereich {
	padding-top: 20px;
	padding-right: 10px;
	padding-bottom: 20px;
	padding-left: 20px;
	/*border-bottom: 1px dotted #333333;*/
}
	#textbereich a { 
		border-bottom: 1px solid #9966FF;
		color: #9966FF;
	}
	#textbereich a:hover,
	#textbereich a:focus {
		border-bottom: 1px solid black;
		color: black;
	}
	#textbereich a:active {
	color: white;
	background-color: black;
}

#einundhalb {
	line-height: 1.5;
}

/* #unterlegt {
background-color: #9966FF;
}
*/

#fussbereich {
	padding-top: 10px; /* unterhalb der Rahmenlinie */
	padding-right: 20px;
	padding-bottom: 10px;
	padding-left: 20px;
	border-top: 1px solid #8c8c8c; /* Rahmenlinie oben */
	margin-top: 20px; /* Außenabstand oben oberhalb der Linie */
	/*text-align: left;*/
	position: relative;
}

.bildlinks {
float:left;
padding: 3px;
/*border: 5px solid #ccc;*/
margin-right: 10px;
margin-bottom: 10px;
}


.bildrechts {
float:right;
padding: 3px;
/*border: 5px solid #ccc;*/
margin-bottom: 10px;
margin-left: 10px;
}




ul li { list-style: none; }

#skipoben {
	position: absolute;
	left: 632px;
	top: 10px;
	width: 120px;
	height: 14px;
}



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

/* das KOntaktformular */
kontaktform {
background-color: #eee;
width: 370px;
padding: 20px;
border: 1px solid #8c8c8c;
}
label { /* Beschirftung auf eigener Zeile */
display: block;
cursor: pointer; /* Mauszeiger wird zur Hand */
}
input#absender,
textarea {
width: 300px;
border: 1px solid #8c8c8c;
margin-bottom: 1em;
}
textarea {
height: 7em;
}
input#absender:focus,
textarea:focus {
background-color: #9966FF;
}

/*#kopfbereicher {
position: relative;
	color: black;
	background-color: black;
    background-image: url(images/AUGENzug.png);
	background-color: #9966FF;
	padding-top: 20px;
	padding-right: 20px;
	padding-bottom: 0;
	padding-left: 20px;
}
*/
/*====================================================
		E N D E   D E S   S T Y L E S H E E T S 
====================================================*/