/*
	CSS-Datei für die Website www.speleo-berlin.de
	(c) Roman Blöth Norbert Marwan

	Letzte Änderung........... :  30.01.2008
	Letzte W3C-CSS-Validierung :  30.01.2008

*/

/********************
* Grundeinstellungen:
********************/
body {
	background-color:	#000000;
	font-family:		Verdana, Helvetica, Arial, sans-serif;
	font-size:			12px;
	color:				#FFFF80;
	margin:				0px;
	line-height:		150%;
}

body.adminseite {
	background-color:	#9F8B6C;
}

div.adminseite {
	background-color:	#755C44;
}

/*****************************
* Website-spezifische Inhalte:
*****************************/

/*****************
* Identifikatoren:
*****************/
/* Enthält Navigation und Inhaltsbereich, um einen gleichmäßigen oberen Rand von beiden sicherzustellen: */
#container {
	position:			relative;
	margin:				20px auto 50px auto;
	padding:			0 0 2em;
	background-color:	#000000;
	width:				760px;
}

.adminseite#container {
	background-color:	#755C44;
}

#flashmovie {
	width:				600px;
	height:				400px;
	margin:				0 auto;
	text-align:			center;
	background:			url(img/loading.gif) no-repeat center center;
}

/* Lässt die Navigation links vom Inhaltsbereich floaten: */
#navigation {
	position:			relative;
	width:				147px;
	margin-right:		20px;
	float:				left;
}

/* Der Inhaltsbereich lässt links einen margin für die Navigation: */
#inhalt {
	margin:				0px 0px 0px 167px;
	padding:			0px 0px 0px 20px;
}

/* Das Aktualisierungsdatum auf (fast) jeder Seite: */
#aktualisierungsdatum {
	font-size:			.8em;
	font-style:			normal;
	margin:				10px 0px 15px 0px;
}

/* Die 2 linksbündigen Bilder (SCB-Logo und BHB-Titelbild) auf jedem "Abstracts"-Popup werden hiermit formatiert: */
#abstracts_links {
	padding:			5px 20px 5px 10px;
	width:				140px;
	float:				left;
	text-align:			center;
}
#abstracts_links img {
	padding:			0px 0px 15px 0px;
}

/* Der eigentliche Inhalt des abstracts-Popup lässt für die Bilderspalte 170px frei: */
#abstracts_inhalt {
	margin:				5px 10px 20px 170px;
	line-height:		1.5em;
}

/*********
* Klassen:
*********/
a.ziphot{color:#FFF; font:bold 10px arial,sans-serif; text-decoration:none;}

/* Hauptnavigation mit Rollover-Effekt: */
a.navigation_eintrag {
	width:				147px;
	display:			block;
	font-weight:		bold;
	text-decoration:	none;
	text-align:			right;
	padding:			.5em .5em .5em 0em;
}
a.navigation_angezeigt:link,
a.navigation_angezeigt:visited,
a.navigation_angezeigt:active,
a.navigation_angezeigt:hover,
a.navigation_eintrag:link,
a.navigation_eintrag:visited,
a.navigation_eintrag:active,
a.navigation_eintrag:hover {
	text-decoration:	none;
}
a.navigation_eintrag:active,
a.navigation_eintrag:hover {
	background-color:	#C5C4AF;
	color:				#000000;
	cursor:				pointer;
}
a.navigation_angezeigt {
	width:				147px;
	display:			block;
	font-weight:		bold;
	text-align:			right;
	padding:			.5em .5em .5em 0em;
	background-color:	#C5C4AF;
	color:				#000000;
}

.adminseite {
	background-color:	#755C44;
}

/* Diese Klasse trennt einzelne "Aktuelles", "Termine" und "Links"-Einträge voneinander ab: */
.eintrag {
	margin:				10px 30px 10px 40px;
}

/* Diese Klasse bettet Bilder linksbündig in den Text ein: */
.thumbnail {
	padding:			5px 15px 10px 0px;
	float:				left;
}

/* Diese Klasse bettet Bilder rechtsbündig in den Text ein: */
.thumbnail_rechts {
	padding:			5px 0px 10px 15px;
	float:				right;
}

/* Diese Klasse bettet Bilder mit rechtem und unterem margin ein (für die "Unterkünfte"-Seite): */
.thumbnail_galerie {
	padding:			0px 5px 10px 0px;
}

/* Diese Klasse formatiert den Namen eines Beitrags-Autors: */
.autor {
	margin:				10px 0px 30px 0px;
	font-style:			italic;
}

/* Diese Klasse formatiert eine auffällige, aber unaufdringliche Hinweis-Box: */
.hinweis {
	margin:				10px 0px 15px 0px;
	border:				solid 1px;
	padding:			10px;
}

/* Diese Klasse formatiert eine auffällige, und aufdringliche Hinweis-Box: */
.fehler {
	margin:				10px 20px 15px 0px;
	border:				solid 2px #AA2B2E;
	color:				#AA2B2E;
	font-weight:		bold;
	padding:			10px;
}

/* Diese Klasse formatiert das PLUS-Symbol auf der "Publikationen"-Seite: */
.bhb_button_schliessen {
	display:			none;
	vertical-align:		baseline;
}

/* Diese Klasse formatiert das MINUS-Symbol auf der "Publikationen"-Seite: */
.bhb_button_oeffnen {
	display:			inline;
	vertical-align:		baseline;
}

/* Diese Klasse enth�lt die zu Beginn "zusammengeklappten" Publikationen eines Jahrganges: */
.publikationsjahrgang {
	display:			none;
}

/* Diese Klasse formatiert die einzelnen Publikationen und trennt sie voneinander ab: */
.publikation {
	margin:				5px 20px 20px 20px;
	padding:			10px;
}

/* Diese Klasse formatiert die Band-Angabe einer Publikation: */
.bhb_band {
	font-size:			1.3em;
	font-weight:		bold;
	color:				#000000;
	background-color:	#FFFF80;
	padding:			5px 0px 5px 10px;
	clear:				right;
}

/* Diese Klasse formatiert den Autor/Herausgeber einer Publikation: */
.bhb_autor {
	margin:				10px 0px 10px 0px;
	font-size:			1.3em;
}

/* Diese Klasse formatiert den Titel einer Publikation: */
.bhb_titel {
	margin:				5px 0px 15px 0px;
	font-size:			1.3em;
	font-weight:		bold;
	line-height:		1.5em;
	color:				#FFFFDD;
}

/* Diese Klasse formatiert den Kurztitel einer Publikation: */
.bhb_kurztitel {
	margin-top:			0px;
}

/* Diese Klasse formatiert die Kurzzusammenfassung einer Publikation: */
.bhb_daten {
	margin:				5px 0px 5px 0px;
}

/* Diese Klasse formatiert die Kurzbeschreibung einer Publikation: */
.bhb_kommentar {
	margin:				5px 0px 5px 135px;
	font-style:			italic;
	line-height:		1.7em;
}

/* Diese Klasse formatiert die Band-Angabe einer Publikation: */
.bhb_preis {
	margin:				15px 0px 5px 135px;
	font-weight:		bold;
	font-style:			normal;
	color:				#FFFFDD;
}

/* Diese Klasse formatiert die Datumsangaben auf der "Links"-Seite: */
.zuletzt_geprueft {
	margin:				5px 0px 15px 0px;
	font-size:			.85em;
	font-style:			normal;
}

/* Die Links auf der "Links"-Seite sollen gleichzeitig ein wenig als Überschrift wirken: */
.link {
	font-weight:		bold;
	font-size:			1em;
}

/* F�r Tabellen, die nicht als solche sichtbar sein sollen: */
.nostyle {
	border:				none;
	background-color:	#000000;
	vertical-align:		middle;
	width:				auto;
	height:				auto;
}

/* F�r Input-Buttons, die Grafiken sind: */
input.nostyle {
	width:				auto;
	height:				auto;
}

/************
* Selektoren:
************/
h1,
h2,
h3 {
	font-weight:		bold;
}

h1 {
	font-size:			1.7em;
	line-height:		1.5em;
}

h2 {
	font-size:			1.3em;
}

/* Diese h2-Überschrift wird invers als Balken dargestellt: */
h2.invers {
	color:				#000000;
	background-color:	#FFFF80;
	background-color:	#FFFF80;
	padding:			.4em 0em .4em .5em;
	margin-top:			50px;
	clear:				right;
}

h3 {
	margin:				.4em 0em .4em 0em;
	font-size:			1.1em;
}

/* Zitate werden immer als blockquotes angegeben: */
blockquote {
	padding:			0em 1em 1em 0em;
	font-family:		Georgia, "Times New Roman", Times, serif;
	font-style:			italic;
}

/* Und Bilder sollen grundsätzlich keinen Rahmen anzeigen: */
img {
	border:				none;
}

/* Wenn Begriffe im Text hervorgehoben werden sollen: */
em {
	font-style:			normal;
	color:				#FFFFFF;
}

/* Auf verschiedenen Seiten werden noch immer Tabellen benötigt: */
table {
	margin:				15px 10px 15px 0px;
	border-collapse:	collapse;
	width:				100%;
}

td,
th {
	border-collapse:	collapse;
	padding:			5px 5px 5px 5px;
	vertical-align:		top;
}

th {
	padding:			8px 5px 5px 5px;
	text-align:			right;
}

td {
	border:				solid 1px #FFFF80;
}

td a {
	text-decoration:	underline;
}

td a:visited {
	text-decoration:	underline;
}

/***************
* Anker / Links:
****************/
a {
	color:				#FFFFDD;
	font-weight:		bold;
	text-decoration:	none;
}

a:hover {
	text-decoration:	underline;
}


/********************
* Formularelemente: *
********************/
input {
	height:					1.4em;
}

input.button {
	padding:				2px 5px 2px 5px;
	background-color:		#FFFF80;
	height:					auto;
	width:					auto;
	font-size:				1em;
	font-family:			Verdana, Helvetica, Arial, sans-serif;
	font-weight:			bold;
	cursor:					pointer;
}

/* Formular-Eingabefelder werden angepasst: */
input,
textarea {
	vertical-align:			middle;
	border:					0px;
	color:					#000000;
	background-color:		#ddddbb;
	font-size:				1em;
}

select {
	cursor:					pointer;
	font-size:				.9em;
	color:					#000000;
	background-color:		#ddddbb;
	border-color:			#ddddbb;
}

#form_kontaktformular label {
	float:					left;
	display:				block;
	width:					125px;
	text-align:				right;
	font-weight:			bold;
	padding:				0em 0.5em 0 0;
}

#form_kontaktformular input[type=text] {
	height:					1.2em;
	width:					430px;
	font-size:				1.1em;
}

#form_kontaktformular textarea {
	height:					28em;
	width:					430px;
	margin-top:				0.4em;
	font-family:			Verdana,Helvetica,Arial,sans-serif;
}
