/********************************************************************************************

	TOC:	- GENERAL & HEADINGS
			- STRUCTURE
			- NAVIGATION
			- CONTENT & FORMS
			- FOOTER

********************************************************************************************/


/****************************************  GENERAL  ****************************************/

html, body, ul {
	border:0;
	margin:0;
	padding:0;
}

body {
	background:#fff url(images/bg_header.gif) repeat-x;
	color:#333;
	font:0.8em Arial, Helvetica, sans-serif;
}

img {border:0}

/*** Headings ***/

#text h1 {color:#333; font:bold 1.8em Arial, Helvetica, sans-serif; margin:10px 0 20px 0; padding:0; letter-spacing:-0.05em}
#intro h1 {font:bold 1.4em Arial, Helvetica, sans-serif; color:#666; margin:0; padding:0}
#intro h1 span {font:bold 1.6em Arial, Helvetica, sans-serif; color:#333; line-height:1em}
.frontbox h1 {font:1.4em Arial, Helvetica, sans-serif; color:#333; margin:0 0 15px 0; padding:0}
.tageskarte h1 {font:1.4em Arial, Helvetica, sans-serif; color:#333; float:left; margin:9px 0 15px 0; padding:0}

#text h2 {color:#666; font:1.4em Arial, Helvetica, sans-serif; margin:25px 0 10px 0; padding:0}
#text .mitarbeiter h2 {margin:5px 0 10px 0;}
#text td h2 {margin:0 0 10px 0; padding:0}

#text h3 {color:#333; font:bold 1.1em Arial, Helvetica, sans-serif; margin:25px 0 5px 0; padding:0}

/*** Links ***/

a {outline:none}

a:link, a:visited {color:#3366CC; text-decoration:underline}
a:hover, a:active {color:#0099FF; text-decoration:none}

#metanav a:link, #metanav a:visited {color:#fff; font-size:0.85em; font-weight:normal; text-decoration:underline}
#metanav a:hover, #metanav a:active {color:#66CCFF; text-decoration:none}

.frontbox a:link, .frontbox a:visited {color:#666; font-weight:bold; text-decoration:none}
.frontbox a:hover, .frontbox a:active {color:#0099FF; font-weight:bold; text-decoration:none}

.more a:link, .more a:visited {background:url(images/icon_arrow.gif) right 6px no-repeat; color:#3366CC; padding-right:8px}
.more a:hover, .more a:active {color:#0099FF}

#footer a:link, #footer a:visited {color:#999; font-weight:normal; text-decoration:underline}
#footer a:hover, #footer a:active {color:#3366CC; text-decoration:none}

a.mailto {background:url(images/icon_mail.gif) 0 3px no-repeat; padding-left:20px}
a.pdficon {background:url(images/icon_pdf.gif) center left no-repeat; padding-left:22px}
a.docicon {background:url(images/icon_doc.gif) center left no-repeat; padding-left:22px}
a.xlsicon {background:url(images/icon_xls.gif) center left no-repeat; padding-left:22px}
a.formular {background:url(images/icon_form.gif) center left no-repeat; padding-left:22px}
a.ga {background:url(images/icon_tageskarte.gif) center left no-repeat; padding-left:20px}
a.extern {background:url(images/icon_extern.gif) center left no-repeat; padding-left:22px}
a.back {background:url(images/icon_back.gif) left 4px no-repeat; padding-left:15px}
.forward a {background:url(images/icon_forward.gif) right 4px no-repeat; padding-right:15px}
a.lock {background:url(images/icon_lock.png) center left no-repeat; padding-left:22px}
a.edit {background:url(images/icon_edit.png) center left no-repeat; padding-left:22px}

.plusicon a {
	background:url(images/icon_plus.gif) center left no-repeat;
	display:block;
	font:bold 1.1em Arial, Helvetica;
	padding-left:22px;
	margin-top:20px;
	text-decoration:none;
}

.plusicon a:visited {text-decoration:none}

.plusicon .expand a {background:none; font-size:1em; display:inline; padding:0; margin:0; text-decoration:underline}

#anlaesse p {display:inline}


/****************************************  STRUCTURE  ****************************************/

#wrapper {
	background:url(images/bg_header_bottom.gif) 0 99px repeat-x;
	margin:0 auto;
	width:100%;
}

#header {overflow:hidden; margin:0 auto 25px auto; width:960px}
#logo {float:left; width:354px}
#metanav {color:#fff; float:right; text-align:right; width:200px}
#searchfield {background:url(images/bg_search.gif) top right no-repeat; height:24px; margin-top:20px}
#fontsize {float:right; font-weight:bold; margin-top:30px; width:160px}
#photos {clear:both; height:130px; margin:0 auto; width:960px}

#content {
	background:#F6F6F6 url(images/bg_content_top.gif) top no-repeat;
	margin:20px auto 0 auto;
	padding:30px 30px 20px 30px;
	overflow:hidden;
	width:900px
}

#content2 {
	background:#F6F6F6 url(images/bg_content_top.gif) top no-repeat;
	margin:20px auto 0 auto;
	padding:20px;
	overflow:hidden;
	width:920px
}

#contentstop {background:#F6F6F6 url(images/bg_content_bottom.gif) bottom no-repeat; height:10px; margin:0 auto; width:960px}
#intro {height:225px; overflow:hidden; padding-bottom:25px}
#side {float:left; width:240px}
#text {float:left; width:670px}

#frontwrap {float:left; width:656px}

.frontbox {background:url(images/bg_news.gif) repeat-y; float:left; width:314px}
.frontboxtop {background:url(images/bg_news_top.gif) top no-repeat; height:9px; width:314px}
.frontboxbottom {background:url(images/bg_news_bottom.gif) bottom no-repeat; height:9px; width:314px}

.tageskarte {background:url(images/bg_tageskarte.gif) no-repeat; float:left; height:63px; margin-top:20px; padding:0 15px; width:626px}
.tageskarte span {display:block; float:right; margin-top:10px; line-height:1.5em; width:500px}

.box {background:url(images/bg_contact.gif) repeat-y; float:right; width:217px}
.boxtop {background:url(images/bg_contact_top.gif) top no-repeat; height:9px; width:217px}
.boxbottom {background:url(images/bg_contact_bottom.gif) bottom no-repeat; height:9px; width:217px}

#side .box {background:url(images/bg_box.gif) repeat-y; margin-bottom:20px; width:240px}
#side .boxtop {background:url(images/bg_box_top.gif) top left no-repeat; height:9px; width:240px}
#side .boxbottom {background:url(images/bg_box_bottom.gif) bottom left no-repeat; height:9px; width:240px}

#footer {
	border-top:1px solid #e5e5e5;
	color:#999;
	font-size:0.85em;
	overflow:hidden;
	padding:5px 0 20px 0;
	margin:20px auto 0 auto;
	width:960px;
}
#footerleft {float:left}
#footerright {float:right}

/****************************************  NAVIGATION  ****************************************/

#header ul.nav {float:left; list-style:none; margin-top:30px; padding:0; width:810px}

#header .nav li {
	background:url(images/nav_separator.gif) right no-repeat;
	float:left;
	text-transform:uppercase;
	padding:0 5px;
}

#header .nav li a {
	display:block;
	color:#666;
	font:bold 0.9em Arial, Helvetica, sans-serif;
	text-align:center;
	text-decoration:none;
	padding:5px 0 4px 10px
}

#header .nav li a span {padding:5px 10px 5px 0;}

#header .nav li a:hover, #header .nav li a.currentpage, #header .nav li a.activeparent {background:url(images/nav_on.gif) no-repeat; color:#fff}

#header .nav li a:hover span, #header .nav li a.currentpage span, #header .nav li a.activeparent span  {
	background:url(images/nav_on_stop.gif) top right no-repeat;
	padding:5px 10px 4px 0
}

/* Safari */
@media screen and (-webkit-min-device-pixel-ratio:0)
{
#header .nav li a {font-size:0.85em; padding:6px 0 5px 10px}
#header .nav li a span {padding:6px 10px 5px 0}
#header .nav li a:hover span, #header .nav li a.currentpage span, #header .nav li a.activeparent span {padding:6px 10px 5px 0}
}

#header .nav b {background:url(images/nav_pointer.gif) center no-repeat; display:block; padding:1px 5px 4px 5px;

font-size:0;}

/*** Fontsize ***/

ul#fontsize {background:#fff; float:right; list-style:none; margin-top:31px; padding:0; width:120px}
#fontsize li {float:left; font-weight:bold; margin-right:8px;}
#fontsize li.text {margin-top:4px}
#fontsize li a.small {
	background:url(images/icon_fontsize.gif) no-repeat;
	display:block;
	font-size:0.9em;
	font-weight:normal;
	text-decoration:none;
	padding:5px 8px 4px 9px
}

#fontsize li a.large {
	background:url(images/icon_fontsize.gif) no-repeat;
	display:block;
	font-size:1.4em;
	font-weight:normal;
	text-decoration:none;
	padding:1px 6px 2px 7px
}

#fontsize li a.small:hover, #fontsize li a.large:hover {background:url(images/icon_fontsize_on.gif) no-repeat;}

/* Safari */
@media screen and (-webkit-min-device-pixel-ratio:0)
{
#fontsize li a.small {padding:5px 8px 5px 8px}
#fontsize li a.large {padding:2px 6px 2px 7px}
}

/*** Subnav ***/

#side ul.nav {list-style:none; margin:0; padding:0 15px 15px 15px}

#side .nav li a {
	background:url(images/subnav_separator.gif) left bottom no-repeat;
	display:block;
	color:#666;
	font-weight:bold;
	height:10px;
	text-decoration:none;
	padding:10px 0 16px 0 !important;
	padding:10px 0 10px 0;
}

#side .nav li a:hover {color:#3F96D0}
#side .nav li a.currentpage {background:url(images/subnav_arrow.gif) left bottom no-repeat; color:#3F96D0}

/****************************************  CONTENT  ****************************************/

#intro img {padding-left:80px}

.frontbox div.text {padding:0 15px; width:284px}
.frontbox td {color:#666; font-weight:bold; padding-bottom:12px; vertical-align:top}
.frontbox td.date {color:#999; font-size:0.9em; font-style:italic; font-weight:normal; padding-top:1px; width:57px}
.frontbox div.more {border-top:1px solid #e5e5e5; padding:10px 0 5px 0}

.box div.text {color:#666; font-size:0.95em; line-height:1.45em; padding:5px 15px; width:187px}

.bildlinks {float:left; margin:0 15px 15px 0}
.bildrechts {float:right; margin:0 0 15px 15px}
.bildlinks-r {background:#fff; border:#ccc 1px solid; padding:3px; float:left; margin:0 15px 15px 0}
.bildrechts-r {background:#fff; border:#ccc 1px solid; padding:3px; float:right; margin:0 0 15px 15px}

#text ul {list-style:none; margin:0; padding:15px 0 10px 0}
#text ul li {background:url(images/icon_bullet.gif) 6px 6px no-repeat; padding:0 0 10px 15px}
#text ol li {padding-bottom:15px}
#sitemap ul {list-style:none; margin:0; padding:10px 0 15px 0}
#sitemap li {background:none; font-weight:bold}
#sitemap li ul li {background:url(images/icon_bullet.gif) 6px 6px no-repeat; font-weight:normal}

span.date {color:#666; font-size:0.9em; font-style:italic; font-weight:normal}
div.separator {display:block; height:30px}
div.linkimg {float:left; width:165px; border-top:1px solid #f6f6f6}
div.linktxt {float:left; width:505px}
div.linkurl {float:left; width:220px}
div.linktxt2 {float:left; width:430px; padding-left:20px}
div.separator2 {display:block; clear:both; border-bottom:#e0e0e0 1px solid; height:10px; margin-bottom:10px}
div #print {float:right; height:16px}
div.left {float:left; width:500px}
div.right {float:left; padding-left:20px; width:150px}
div.foto {float:left; margin-bottom:20px; width:420px}

/*** Tables ***/
table {border-collapse:collapse}

table.striped {width:670px}
	.left table.striped {width:500px}
.striped td {padding:7px}
.striped tr.odd {background:#fff}

th {text-align:left}
th.blue {background:#3F96D0; color:#fff; padding:4px 7px}

table.mitarbeiter {border-bottom:#e0e0e0 1px solid; margin-bottom:20px; width:670px}
.mitarbeiter img {background:#fff; border:#ccc 1px solid; padding:3px; margin:0 15px 20px 0;}
.mitarbeiter td {vertical-align:top; padding-bottom:0 !important; padding-bottom:20px}
.mitarbeiter strong {display:block; padding-top:10px;}

div#user {margin-bottom:10px; text-align:right}

/*** Forms ***/

#text form {margin:0; padding:10px 0 0 0}
#text form p {display:block; float:left; margin:0; padding:0; width:310px}
#text form p.inline {clear:both; display:block; float:left; margin:0; padding:3px 0; width:230px}
#text fieldset {border:#ddd solid 1px;padding:20px 0 20px 20px; margin-bottom:25px}
#text legend {color:#777; font-size:1.1em; font-weight:bold; margin-bottom:0 !important; margin-bottom:20px}
#text label {float:left; width:90px; margin:4px 0 5px 0}
#text label.labelinline {float:none; width:300px; margin:4px 0 5px 0}
#text div.clear {clear:both; height:10px}

#text input, #text textarea, #text select {
	background:#fff;
	border:#ccc solid 1px;
	color:#666;
	font:1em Arial, Helvetica, sans-serif;
	width:180px;
	margin:0 0 10px 0;
	padding:2px 3px 2px 3px;
}

#text input.sizeM {width:100px;}

#text select {width:188px}
#text textarea {height:100px; width:300px}
#text textarea#Personen2 {height:100px; width:270px}

#text .radio {background:none; border:none; margin:0; vertical-align:middle; width:20px}

#text #Senden {width:80px; margin:0 0 0 90px}
#text #Reset {width:80px; margin:0}

#text .error {background:#ffedeb; border:1px solid #db564b}

#text #url {
	z-index:999;
	position:absolute;
	height:0;
	width:0;
	border:none;
	background:none;
	margin:0;
	top:0;
	left:0;
	clear:both;
	font-size:0px;
	line-height:0px;
}

#text .small {color:#999; font-size:0.85em; font-style:italic}

#text div.info {background:url(images/bg_info.gif) no-repeat; height:23px; margin-top:20px; padding:7px 0 0 30px; width:636px}
#text div.red {background:url(images/bg_error.gif) no-repeat; color:#db564b; height:23px; padding:7px 0 0 30px; width:636px}
#text div.back {margin-top:20px; text-align:right; width:670px}


/*** Search ***/

#searchfield input {border:1px solid #fff; padding-bottom:3px; width:150px}
#searchfield #submit {
	background:url(images/bg_searchbutton.gif) 0 2px no-repeat !important;
	background:url(images/bg_searchbutton.gif) 0 3px no-repeat;
	border:none;
	cursor:hand;
	cursor:pointer;
	height:24px;
	width:20px
}

#searchfield label {display:none}

#search form {background:#fff; padding:20px 10px}
#search form label {color:#333; font-weight:bold; padding-top:3px; width:60px;}
#search form input {border:1px solid #ccc; padding:5px; width:300px}
#search form #submit {background:#e7e7e7; margin:0 0 5px 0; padding:3px 4px; width:80px}
