/* ================================================================== */
/* ===== Der standard Stil für http://www.sy-gioconda.de/ =========== */
/* ================================================================== */

/* Wichtige Farben
Hintergrund Html (Menü,Titel - blau	: #09f;
Hintergrund Inhalt (türkis)			: #0cf;

Schriftfarbe						: #0012b2;

Link-Reihenfolge:
:link, :visited, :hover,

line-height evt. noch einbauen

*/

/* Alle Abstände werden auf Null gesetzt             */
/* Die Schriften festgelegt und alle Rahmen gelöscht */


* {
	padding:0;
	margin:0;
	border:none;
	color:#0012b2;
	background-color:transparent;
	font-family:Verdana, Arial, Sans-serif;
}

html{
	background:#0cf;
	height:100%;
}

body{
	font-size:0.9em;
	background:transparent;
	position:relative;
	height:100%;
}
/*
html, body{
	height:100%;
}*/
/* Rahmen zum Testen */
/*body, h1, h2, div{
	border:1px solid red;
}
*/
/* ******************************************************************* */
/* *** Die Grundelemente formatieren ********************************* */
/* ******************************************************************* */

.center{
	text-align:center;
}
.center img{
	margin:0.5em 0;
}
.clear{
	clear:both;
}
.unsichtbar{
	display:none;
}
a{
	text-decoration:underline;
	color:#003254;
}
a:hover{
	color:#0065a8;
}
a.extern, a.extern:hover{
	padding-right:15px;
}
a.extern{
	background:url(../bilder/extern_link.gif) right no-repeat transparent;
}
a.extern:hover{
	background:url(../bilder/extern_link_h.gif) right no-repeat transparent;
}
a.english, a.deutsch{
	padding-left:50px;
}
a.english{
	background:url(../bilder/flaggeus.png) left no-repeat transparent;
}
a.deutsch{
	background:url(../bilder/flaggedeutsch.png) left no-repeat transparent;
}
a.english:hover, a.deutsch:hover{
	color:#09f;
}

address{
	font-style:italic;
	padding:0.7em 0;
}
em{
	font-style:italic;
}
/*em:before{
	content:"\201E";
}

em:after{
	content:"\201C";
}
*/
hr{
	height:0;
	background:#0cf;
	margin:1em 0 1em 0;
	border:1px solid #0cf;
}
h1, h2, h3, h4, h5{
	font-weight:bold;
	font-family:Verdana, Arial, Sans-serif;
}
h3{
	font-size:1.5em;
	font-style:italic;
	margin:0 0 1em;
}
h4{
	font-size:1.1em;
	margin:1.3em 0 0.7em 0;
}
h5{
	font-size:1em;
	margin:1.3em 0 0.7em 0;
}
img.f_rechts{
	float:right;
	margin:0 0.5em 0.5em 1em;
}
img.f_links{
	float:left;
	margin:0 1.5em 0.5em 0.5em;
}

li{
	margin:0.7em 0 0.7em 1.5em;
}

p{
	margin:0.7em 0 0.7em 0;
}
table{
	padding:2px;
	border-collapse:collapse;
	border:2px solid #09f;
	margin:0.5em auto 1em auto;
}
th, td{
	text-align:left;
	padding:2px;
	border:2px solid #09f;
}
ul{
	list-style:outside;
}

ul.bilder{
	list-style:none;
	width:634px;
	margin:0 auto 0 auto;
	padding:0;
}
ul.bilder li{
	width:198px;
	float:left;
	text-align:center;
	margin:0;
	padding:5px;
}
ul.bilder li.center{
	width:624px;
}
ul.bilder img{
	vertical-align:middle;
}
ul.bilder a{
	display:block;
	height:150px;
	width:170px;
	margin-left:auto;
	margin-right:auto;
	padding:10px;
	text-decoration:none;
	font-size:1.1em;
	font-weight:bold;
	border:4px solid #0cf;
	line-height:150px;
	overflow:visible;
}
body#bilder ul.bilder{
	width:416px;
}
body#bilder ul.bilder a{
	height:150px;
	line-height:2em;
}
ul.bilder a:hover{
	border:4px solid #09f;
}
ul#bildnavigation{
	list-style:none;
	width:300px;
	height:60px;
	margin:0 auto 0 auto;
	position:relative;
}
ul#bildnavigation li{
	display:inline;
}
ul#bildnavigation a{
	padding:39px 0 0 0;
	text-decoration:none;
/*	height:39px;
	display:block;
	float:left;
	*/
}
ul#bildnavigation a#zurueck{
/*	width:36px;
	margin:0 auto 0 0;*/
	background:url(../bilder/pfeil_links.png) top no-repeat transparent;
	padding:29px 0 0 0;
	margin:10px 0 0 0;
	position:absolute;
	left:0;
}
ul#bildnavigation a#zurueck:hover{
	background:url(../bilder/pfeil_links_hover.png) top no-repeat transparent;
}
ul#bildnavigation a#weiter{
/*	width:36px;
	margin:0 0 0 auto;*/
	background:url(../bilder/pfeil_rechts.png) top no-repeat transparent;
	padding:29px 0 0 0;
	margin:10px 0 0 0;
	position:absolute;
	right:0;
}
ul#bildnavigation a#weiter:hover{
	background:url(../bilder/pfeil_rechts_hover.png) top no-repeat transparent;
}
ul#bildnavigation a#uebersicht{
/*	width:39px;
	margin:0 auto;*/
	background:url(../bilder/punkt.png) top no-repeat transparent;
	position:absolute;
	left:115px;
}
ul#bildnavigation a#uebersicht:hover{
	background:url(../bilder/punkt_hover.png) top no-repeat transparent;
}

ul.bericht_bilder{
	list-style:none inside;
	width:410px;
	margin:0;
	padding:0;
	float:right;
}
ul.bericht_bilder li{
	margin:0;
	padding:3px 0;
	text-align:center;
}
ul.bericht_bilder img{
	padding:0 3px;
	vertical-align:middle;
}

/* ============================================================================= */
/* === Formulare und Eingabefelder ============================================= */
/* ============================================================================= */

/* ******************************************************************* */
/* *** Die Boxen fürs Layout ***************************************** */
/* ******************************************************************* */

#kopf{
	height:117px;
	margin-left:200px;
	background:#09f;
}
#kopf h1, #kopf h2{
	color:#fff;
	font-style:italic;
}
#kopf h1{
	font-size:20px;
	padding:10px 0 5px 0;
}
#kopf h2{
	font-size:25px;
	padding-top:5px;
}
#main{
	padding:5px 1em 1em 1em;
	margin:0;
	border-left:200px solid #09f;
	background:#0cf;
	max-width:780px;
}
#hauptmenu{
	position:fixed;
	top:0;
	left:0;
	width:200px;
	background:url(../bilder/logo_gioconda.png) center 10px no-repeat #09f;
	text-align:center;
	height:100%;
}
#hauptmenu, #hauptmenu ul{
	list-style:none inside;
}
#hauptmenu li{
	margin:0.4em 0;
}
#hauptmenu li.abstand{
	margin-top:2em;
}
#hauptmenu li#erster_punkt{
	margin-top:117px;
}
#hauptmenu a, a.english, a.deutsch{
	color:#fff;
	text-decoration:none;
	font-size:1.5em;
	font-weight:bolder;
	font-style:italic;
	display:block;
}
#hauptmenu li.sprache{
	font-size:0.5em;
	margin:2em 0;
}
ul#hauptmenu a:hover{
	color:#0cf;
	background:#08f;
}
ul#hauptmenu li.sprache a:hover{
	background:#09f;
}

/*Untermenüs */
#hauptmenu ul li a{
	font-size:1.1em;
}
#hauptmenu ul li{
	margin:0.4em;
}
body#bericht_belize-it #hauptmenu ul li,
body#bericht_landausflug #hauptmenu ul li,

body#bilder_belize_festland #hauptmenu ul li,
body#bilder_belize_cayos #hauptmenu ul li,
body#bilder_rio_dulce #hauptmenu ul li,
body#bilder_gioconda #hauptmenu ul li{
	margin:0.4em 0;
}

/* ******************************************************************* */
/* *** Spezielle Formatierung der einzelnen Seiten ******************* */
/* ******************************************************************* */

/* Startseite */

body#startseite p, body#startseite h4{
	text-align:center;
	max-width:600px;
	margin-left:auto;
	margin-right:auto;
}
body#startseite #main{
	max-width:none;
}

/* Die Törns (toerns.html) */
body#toerns td{
	text-align:right;
}
body#toerns img.f_rechts{
	margin:0 3px 0.5em 3px;
}

/* Das Boot (boot.html) */
body#boot table{
	margin-left:0;
	margin-right:auto;
}
body#boot table, body#boot th, body#boot td{
	border:none;
}
body#boot th, body#boot td{
	padding:5px;
}
body#boot th.abstand{
	padding-left:3em;
}

/* Kontakt (kontakt.html) */

body#kontakt p, body#kontakt address{
	text-align:center;
}

/* *** Die aktiven Menülinks verbergen ******************************* */
/* :link, :visited, :hover, :active. */

body#startseite a#l_startseite,
body#revier     a#l_revier,
body#toerns     a#l_toerns,
body#anreise    a#l_anreise,
body#boot       a#l_boot,
body#kosten     a#l_kosten,
body#tauchen    a#l_tauchen,
body#kontakt    a#l_kontakt,

body#bilder		a#l_bilder,
body#bilder_belize_festland	a#l_bilder_belize_festland,
body#bilder_belize_cayos	a#l_bilder_belize_cayos,
body#bilder_rio_dulce		a#l_bilder_rio_dulce,
body#bilder_gioconda		a#l_bilder_gioconda,

body#berichte   a#l_berichte,
body#bericht_belize-it   a#l_bericht_belize-it,
body#bericht_landausflug a#l_bericht_landausflug
{
	cursor:default;
	color:#0012b2;
	background:#0cf;
	display:block;
	width:100%;
}

/* *** Kategorie herforheben *** */
body#bilder_belize_festland a#l_bilder,
body#bilder_rio_dulce       a#l_bilder,
body#bilder_belize_cayos    a#l_bilder,
body#bilder_gioconda        a#l_bilder,

body#bericht_belize-it    	a#l_berichte,
body#bericht_landausflug	a#l_berichte
{
	color:#00ffe5;
}

body#bilder_belize_festland a#l_bilder:hover,
body#bilder_rio_dulce       a#l_bilder:hover,
body#bilder_belize_cayos    a#l_bilder:hover,
body#bilder_gioconda        a#l_bilder:hover,

body#bericht_belize-it    	a#l_berichte:hover,
body#bericht_landausflug	a#l_berichte:hover
{
	color:#0cf;
}

/* Die Untermenüs ausblenden */
#l_bericht_untermenu, #l_bilder_untermenu{
	display:none;
}
/* Aufklappmenüs */
ul#hauptmenu li#bilder:hover ul, ul#hauptmenu li#berichte:hover ul{
	display:block;
	background:#08f;
	position:absolute;
	left:200px;
	margin-left:0;
	margin-top:-2em;
	width:100%;
}

/* Damit das eigene Menü in den Kategorien nicht aufklappt */
body#bilder					ul#hauptmenu li:hover ul#l_bilder_untermenu,
body#bilder_belize_festland	ul#hauptmenu li:hover ul#l_bilder_untermenu,
body#bilder_belize_cayos	ul#hauptmenu li:hover ul#l_bilder_untermenu,
body#bilder_rio_dulce		ul#hauptmenu li:hover ul#l_bilder_untermenu,
body#bilder_gioconda		ul#hauptmenu li:hover ul#l_bilder_untermenu,

body#berichte            ul#hauptmenu li:hover ul#l_bericht_untermenu,
body#bericht_belize-it   ul#hauptmenu li:hover ul#l_bericht_untermenu,
body#bericht_landausflug ul#hauptmenu li:hover ul#l_bericht_untermenu
{
	position:static;
	margin:0;
	padding-bottom:0.3em;
	margin-bottom:0.3em;
	background:transparent;
	margin-left:none;
}
/* In der entsprechenden Kategorie die Untermenüs wieder einblenden */
body#bilder					ul#l_bilder_untermenu,
body#bilder_belize_festland	ul#l_bilder_untermenu,
body#bilder_belize_cayos	ul#l_bilder_untermenu,
body#bilder_rio_dulce		ul#l_bilder_untermenu,
body#bilder_gioconda		ul#l_bilder_untermenu,

body#berichte            ul#l_bericht_untermenu,
body#bericht_belize-it   ul#l_bericht_untermenu,
body#bericht_landausflug ul#l_bericht_untermenu
{
	display:block;
	padding-bottom:0.3em;
	margin-bottom:0.3em;
}

/* ============================================================================= */
/* ===== Anweisungen für den Ausdruck der Seiten =============================== */
/* ============================================================================= */

@media print{
	* {
		padding:0;
		margin:0;
		border:none;
		color:#000;
		font-family:"Times New Roman", Georgia, Times, Serif;
		font-size:12pt;
		background-image:none;
		background-color:#fff;
	}
	
	#kopf{
		margin-left:0;
	}
	#main{
		border:none;
	}
	
	#hauptmenu{
		display:none;
	}
	
	hr{
		background:#fff;
		border:#fff;
	}

}
/* ============================================================================= */
/* ===== Anweisungen Kleinbildschirme ========================================== */
/* ============================================================================= */

@media handheld{
	* {
		padding:0;
		margin:0;
		border:none;
		background-image:none;
	}
	
	#kopf{
		margin-left:0;
	}
	#main{
		border:none;
		max-width:100%;
	}
	
	#hauptmenu{
		position:static;
		width:100%;
		background-image:none;
	}
	#hauptmenu li#erster_punkt{
	margin-top:1em;
	}
	/* Die Untermenüs ausblenden */
	#l_bericht_untermenu{
		display:block;
	}
	/* Aufklappmenüs */
	ul#hauptmenu li:hover ul{
		display:block;
		background:#09f;
		position:static;
		margin:0;
		border:none;
	}
	
	
	hr{
		background:#fff;
		border:#fff;
	}
	
	img, #l_bilder{
		display:none;
	}

}