@charset "utf-8";
/* CSS Document */

/*==============================*/
/* Datei: main.css				*/
/* Website kulturhof-itzehoe.de	*/
/* Version 3.0					*/
/* Datum: Januar 2009			*/
/* Autor: graugans-design		*/
/*==============================*/

/*==============================*/
/* Inhalt:						*/
/* I.	allgemeine Format.		*/
/* II.	wrapper					*/
/* III.	header					*/
/* IV. 	navi (navi.css) 		*/
/* V.	content	(content.css	*/
/* VI.	formular (formular.css)	*/
/* VII.	footer					*/
/*==============================*/

/*==============================*/
/* Farben:						*/
/* hg 				#560000		*/
/* hg mob			#560000		*/
/* hg mob websicher #660000		*/
/* spalte_li, senkrechter 		*/
/* trenner 			#5f1414		*/
/* text				#e0d9d9		*/
/* linien navi		#6d2b2b		*/
/* formularfeld		#			*/
/* hover textlinks	#bc6d4c		*/
/* hover alt. textlinks	#ca8b71	*/
/* navi musikschule	#d10019		*/
/* navi verantst	#112372		*/
/* navi raeume		#f39400		*/
/* navi musikalien	#007d44		*/
/* navi verein		#c37daa		*/
/* navi kurse/ausst	#ffdd1d		*/
/*==============================*/

/*==============================*/
/* einbinden anderer CSS- 		*/
/* Dateien mit @import			*/
/*==============================*/

@import url(navi.css);
@import url(content.css);
@import url(formular.css);

/*==============================*/
/* Teil I. 						*/
/* allg. Format.				*/
/*==============================*/

* {
	margin:0;
	padding:0;
}

html {
	height:101%;
}

body {
	/*height:100%;*/
	background-color:#390000;
	/*background-color:#fff;*/
	font-family:Verdana, Geneva, sans-serif;
	font-size:12px;
	color:#450000;
}

h3 {
	font-size:1.8em;
	margin-bottom:0.5em;
	padding-bottom:0.3em;
	font-family:Georgia, "Times New Roman", Times, serif;
	/*margin-bottom:0.7em;*/
}

h4 {
	font-size:1.1em;
	line-height:1.4em;
	font-family:Georgia, "Times New Roman", Times, serif;
	/*margin-bottom:1em;*/
	font-style:italic;
}

h5 {
	font-size:1em;
	font-weight:bold;
	line-height:1.5em;
	font-family:Verdana, Geneva, sans-serif;
	margin-top:1em;
}

p {
	line-height:1.5em;
}

a {
	color:#450000;
}

a:hover {
	color:#972222;
}

.platz_nach_unten {
	padding-bottom:0.4em;
}

.rot {
	color:#F00;
}

/* Texte, die zur Kenntnisnahme besser lesbar sein sollen */
.alert {
	border-top: 1px solid #560000;	
	border-bottom: 1px solid #560000;
	margin-top: 5px;
	padding: 5px 10px;
	background-color: #eee5e5;
}

/*==============================*/
/* Teil II. 					*/
/* wrapper						*/
/*==============================*/

/* umschließt den ges. body, gibt hg verlauf. läuft in bg-color #390000 aus, 
diese ist im body definiert */
#wrapper_verlauf {
	background-image:url(../_img/_site/_site/hintergrund_verlauf.gif);
	background-repeat:repeat-x;
}

/* zentriert die seite und bestimmt die breite */
#wrapper {
	position:relative;
	margin:0 auto 0 auto;
	width:82em;
}

/* ein wrapper im wrapper, nur um den schatten links zu erzeugen. 
padding, damit die inhalte nicht in den schatten reinragen */
#wrapper_schatten_links {
	background-image:url(../_img/_site/_site/schatten_content_links.png);
	background-repeat:repeat-y;
	background-position:left 200px;
	padding-left:18px;
}

/* siehe wrapper_schatten_links... */
#wrapper_schatten_rechts {
	background-image:url(../_img/_site/_site/schatten_content_rechts.png);
	background-repeat:repeat-y;
	background-position:right;
	padding-right:18px;
}

/*==============================*/
/* Teil III. 					*/
/* header						*/
/*==============================*/

.versteckt {
	position:absolute;
	top:-9999px;
	left:-9999px;
	display:inline;
	width:0;
	height:0;
}	/* Elemente ausblenden */

.weg {
	display:none;
} /* wacken werbung ausblenden */

.tabmich:focus, .tabmich:active {
	position:absolute;
	top:9999px;
	left:9999px;
	display:inline;
	color:#560000;
	width:13em;
	height:auto;
	padding:5px;
	background-color:#e0d9d9;
	text-decoration:none;
	border:solid 1px #6d2b2b;
	text-align:center;
}

/* schatten links */
#wrapper_header1 {
	height:170px;
	padding-left:18px;
	background-image:url(../_img/_site/_header/schatten_header_links.png);
	background-repeat:no-repeat;
	background-position:left;
}

/* schatten rechts */
#wrapper_header2 {
	height:170px;
	padding-right:18px;
	background-image:url(../_img/_site/_header/schatten_header_rechts.png);
	background-repeat:no-repeat;
	background-position:right;
}

#header {
	/*margin:14px auto 0 auto;*/
	height:170px;
	/*width:950px;*/
	/*width:80em;*/
	position:relative;
	background-color:#560000;
}

/* obere hälfte des headers */
#header_oben {
	height:101px;
	background-image:url(../_img/_site/_header/schatten_oben.gif);
	background-repeat:repeat-x;
	/*border-bottom:1px solid #c9b1ae;*/
}

/* header foto (stühle) läuft nach rechts in hg-farbe aus */
#header_foto {
	height:69px;
	background-image:url(../_img/_site/_header/header_foto.jpg);
	background-repeat:no-repeat;
}

/* logo-schrift absolut in der ob. hälfte positioniert */
#header_logo {
	background-image:url(../_img/_site/_header/logo_schrift.gif);
	background-repeat:no-repeat;
	width:209px;
	height: 74px;
	position:absolute;
	top:29px;
	left:30px;
	
}

/* mikado immer ganz rechts, auch bei schriftvergrößerung */
#header_mikado {
	background-image:url(../_img/_site/_header/mikado.gif);
	background-repeat:no-repeat;
	width:275px;
	height:162px;
	position:absolute;
	top:8px;
	right:0;

}

/* musikunterricht in wacken */
#musikunterricht_wacken a {
	position:absolute;
	background:url(../_img/_site/_content/musikunterricht_wacken.gif) no-repeat top;
	width:171px;
	height:171px;
	left:230px;
	top:10px;
}

/* musikunterricht in wacken HOVER */
#musikunterricht_wacken a:hover {
	position:absolute;
	background:url(../_img/_site/_content/musikunterricht_wacken.gif) no-repeat bottom;
	width:171px;
	height:171px;
	left:230px;
	top:10px;
}

/*==============================*/
/* Teil VII. 					*/
/* footer						*/
/*==============================*/

/* hauptdiv des footers hat gleichzeitig den schatten links */
#footer {
	clear:both;
	text-align:center;
	background-image:url(../_img/_site/_site/schatten_footer_links.png);
	background-repeat:no-repeat;
	background-position:left;
}

/* zweiter wrapper um den footer, nur für den rechten schatten */
#wrapper_footer_schatten_rechts {
	background-image:url(../_img/_site/_site/schatten_footer_rechts.png);
	background-repeat:no-repeat;
	background-position:right;
}

/* innerster wrapper, erzeugt schatten unten */
#wrapper_footer_schatten_unten {
	background-image:url(../_img/_site/_site/schatten_footer_unten.png);
	background-repeat:repeat-x;
	background-position:bottom;
	padding-bottom:18px;
	margin-left:18px;
	margin-right:18px;
	height:30px;
	line-height:2em;
	border-top:solid 1px #6d2b2b;
}

/* soll sich voll ausdehnen, hat die hg-farbe */
#footer ul {
	height:100%;
	background-color:#560000;
	color:#e0d9d9;
}

#footer li {
	display:inline;
}

#footer a {
	font-size:10px;
	color:#e0d9d9;
}

#footer a:hover {
	color:#e6c6c6;
}

#footer a:hover,
#footer a:focus,
#footer a:active {
	text-decoration:underline;
}

/*==============================*/
/* vorletzter Teil 	 			*/
/* landeseite					*/
/*==============================*/

#landeseite #content_main li {
	list-style-image:url(../_img/_site/_content/checked.gif);
	margin-bottom:0.4em;
}

#landeseite #button_landeseite {
	margin-left:100px;
}

#landeseite #button_landeseite a {
	display:block;
	width:200px;
	height:18px;
	text-align:center;
	padding:6px 5px;
	background-color:#eee5e5;
	border:1px solid #bb9999;
	margin-top:20px;
	margin-bottom:30px;
}

#landeseite #spalte_re {
	display:none;
}

/*==============================*/
/* letzter Teil 	 			*/
/* die graugans					*/
/*==============================*/

#graugans_logo {
	border:0;
	margin-bottom:-5px;
}

/* JavaScript nicht aktiviert */
.JavaWarning {
	font-family:Verdana, Geneva, sans-serif;
	color:red;	
}