/* Grundeinstellung -------------------------------------------------------------------------------------------------------------- */
* {
margin: 0;
padding: 0;
}
body {
padding: 0 0 0 0px;
background: #fff url(../images/bg_main.jpg) repeat-x 100%;
background-position: top;
font: 0.8125em Helvetica, Arial, sans-serif;
line-height: 1.3em;
color: #444;
}

/* Typographie ---------------------------------------------------------------------------------------------------------------- */

a, a:active, a:visited {
text-decoration: underline;
}
a:hover {
text-decoration: underline;
color: #fd1717;
}
h1 {
font: 2em Helvetica, Arial, sans-serif;
color: #00416e;
}
h2 {
font: 1.3em Helvetica, Arial, sans-serif;
color: #00416e;
}

/* Kopf --------------------------------------------------------------------------------------------------------------------- */
#topnavi {
width: 900px;
padding-top: 8px;
padding-bottom: 8px;
margin-bottom:0px;
text-align: right;
color: #fff;
}

#topnavi a {
text-decoration: none;
color: #fff;
}

#topnavi a:hover, 
#topnavi a:visited:hover, 
#topnavi a.active:hover {
text-decoration: underline;
}

#logozeile {
background: #fff;
width: 900px;
margin:0px;
padding: 0px;
height:100px;
}

/* breadcrumb */

#breadcrumb {
width: 450px;
padding: 6px 10px 6px 10px;
margin-bottom: 15px;
border-bottom: 1px dotted #888;
font: .85em Helvetica, Arial, sans-serif;
color: #888;
}

#breadcrumb a,
#breadcrumb a:visited,
#breadcrumb a:active{
text-decoration: none; 
color: #888;
}

#breadcrumb a:hover{
text-decoration: underline; 
color: #888;
}

#linie {
margin-top:10px;
margin-bottom: 10px;
border-bottom: 1px dotted #888;
}

#bildlogo {clear: both; height:380px; padding: 0px; margin: 0px;}

/* Fuss --------------------------------------------------------------------------------------------------------------------- */
#developer { 
	clear: both; 
	color: #888;
	background: #fff;
	font-size: 90%;		
	width:900px;
padding: 0px;
border-top: 1px dotted #888;
margin-top: 20px;
font: .85em Helvetica, Arial, sans-serif;
line-height: 1.5em;
}

#developer .footer-spalte{
	width:140px;
	float: left;
	padding-left: 8px;
	padding-top: 15px;
	padding-bottom: 15px;
}

#developer a, 
#developer a:active, 
#developer a:visited {

text-decoration: none;
color: #888;
}
#developer a:hover {
text-decoration: underline;
}

/* Contentbereich --------------------------------------------------------------------------------------------------------------------- */

#container_haupt_start {
	CLEAR: both; 
	PADDING-RIGHT: 0px; 
	PADDING-LEFT: 0px; 
	PADDING-BOTTOM: 0px; 	
	PADDING-TOP: 0px; 	
	FLOAT: none; 
	MARGIN: 0px auto; 
	WIDTH: 900px;
	BACKGROUND: #fff;
	height:auto;
}

#container_kopf {
	PADDING-RIGHT: 0px; 
	PADDING-LEFT: 0px; 
	PADDING-BOTTOM: 0px; 	
	PADDING-TOP: 0px; 	
	FLOAT: none; 
	MARGIN: 0px auto;
	WIDTH: 900px; 
}

#wrapper {
	PADDING-RIGHT: 0px; 
	PADDING-LEFT: 0px; 
	PADDING-TOP: 0px; 	
	PADDING-BOTTOM: 0px; 	
	Z-INDEX: 1; 
	LEFT: 0px; 
	WIDTH: 900px; 
	background: #fff;
}
/* Titelcontent */

#titelcontent {
	clear:both;
	PADDING: 0px; 
	margin: 0px;
	WIDTH: 900px;  
	POSITION: relative; 
	top: 0px;
	height:auto;
}

/* menuspalte */
#spalte_1 {
width: 190px;
FLOAT: left;
padding: 0px;
margin: 0px;
min-height: 550px;
}

#navigation {
width: 190px;
}
#navigation ul {
list-style: none;
}
#navigation ul li {
display: inline;
}
#navigation li a {
font: bold .85em Helvetica, Arial, sans-serif;
letter-spacing: 1px;;
text-transform: uppercase;
padding: 3px 8px;
text-decoration: none;
display: block;
color: #777;
}
#navigation li a:hover, 
#navigation li a:visited:hover, 
#navigation li a.active:hover {
color: #fff;
background-color: #bd1717;
}
#navigation li a.active {
color: #fff;
background-color: #bd1717;
}
#navigation li.sub a {
font: 1em Helvetica, Arial, sans-serif;
letter-spacing: 0px;;
text-transform: none;
padding: 3px 12px;
text-decoration: none;
}
#navigation li.sub a:hover, 
#navigation li.sub a:visited:hover, 
#navigation li.sub a.active:hover {
color: #bd1717;
background-color: #fff;
}
#navigation li.sub a.active {
color: #bd1717;
background-color: #fff;
}


/* Contentspalten -------------------------------------- */

#spalte_2 {
width: 468px;
padding-left: 3px;
padding-right: 3px;
margin: 0px;
min-height: 550px;
FLOAT: left;
line-height: 1.3em;
margin-bottom: 20px;
}

#spalte_2 p{
padding-top: 10px;
}

#spalte_2 ul{
padding-top: 10px;
list-style: square;
list-style-position:outside;
margin-left: 20px;
}

#spalte_2 li{
padding-left: 10px;
padding-bottom: 5px;
}

#content h2
{
padding-top: 2px;
padding-bottom: 2px;
}

#content h2 a:hover,
#content h2 a:active,
#content h2 a:visited,
#content h2 a
{
	color: #00416e;
	text-decoration: underline;
}

#content table td h2 a:hover,
#content table td h2 a:active,
#content table td h2 a:visited,
#content table td h2 a
{
color: #00416e;
text-decoration: underline;}

#content {
padding-left:10px;
padding-right:10px;
}

#content a,
#content a:visited, 
#content a:active{
text-decoration: underline; 
color: #444;
}

#content a:hover{
text-decoration: underline; 
color: #bd1717;
}



#content td {
padding-left:10px;
padding-right:10px;
}


#spalte_3 {
width: 236px;
padding: 0px;
margin: 0px;
min-height: 550px;
FLOAT: left;
}



#wegweisersuche {
padding: 0px;
color: #00416e;
background: #EAF6FB;
}
#wegweisersuche .input 
{     
border: 1px solid #00416e; 
width: 100%;
} 

#wegweisersuche .input:hover {
border: 1px solid #00416e; 
width: 100%;
background: #eee;
}

.button,
.button:visited,
.button:active
{
color: #fff;
background: #00416e;
border: 0px;
text-decoration: none;
padding: 2px;
}

.button:hover
{
color: #fff;
background: #bd1717;
border: 0px;
text-decoration: none;
padding: 2px;
}




#portraitleiste {
padding: 0px;
background: #EAF6FB;
border-left: 1px solid #fff;
border-right: 1px solid #fff;
}

#portraitleiste p{
padding: 8px;
}
#portraitleiste b,#portraitleiste strong{
color: #00B4DA;
}

#portraitleiste a,#portraitleiste a:active,#portraitleiste a:visited,#portraitleiste a:hover {
color: #444;
}

#portraitleiste h2{
border-top:2px solid #fff;
background: #00B4DA;
color: #fff;
font: 0.9em Helvetica, Arial, sans-serif;
padding-left: 10px;
padding-right:10px;
padding-top: 2px;
padding-bottom: 2px;
}

#teaserleiste {
padding: 10px;
color: #023E6C;
font: 0.85em Helvetica, Arial, sans-serif;
}

#teaserleiste a,
#teaserleiste a:visited, 
#teaserleiste a:active{
text-decoration: underline; 
color: #023E6C;
}

#teaserleiste a:hover{
text-decoration: underline; 
color: #bd1717;
}


#content h2.trigger {
	border-top: 1px dotted #888;
	padding-left: 30px;
	padding-top: 10px;
	padding-bottom: 10px;
	margin: 0 0 0 0;
	vertical-align:middle;
	background: url(../images/h2_trigger_a.gif) no-repeat;
	width: 415px;
	color: #00416e;
	font-weight: normal;
	float: left;
}
#content h2.trigger a {
	color: #00416e;
	text-decoration: none;
}
#content h2.trigger a:hover {
	color: #00416e;
	text-decoration: none;
}
#content h2.active {	background: url(../images/h2_trigger_a2.gif) no-repeat;}

.toggle_container {
	margin: 0 0 0px;
	padding-bottom: 15px;
	overflow: hidden;
	width: 450px;
	clear: both;
}
.toggle_container .block {
	padding-left: 30px; 
	padding-bottom: 0px;
	padding-top: 0px;
}


#linkbutton a,#linkbutton a:active,#linkbutton a:visited {
color: #fff;
background: #8c8c8c;
text-decoration: none;
padding: 2px;
}
#linkbutton a:hover {
color: #fff;
background: #bd1717;
text-decoration: none;
padding: 2px;
}



label.left
{
    float            : left;
    text-align        : right;
/*  Bei Aenderungen aber nicht 
    vergessen, die margins bei input.right 
    entsprechend anzupassen: */
    width            : 8em;
    margin-right    : .3em;
}

/*  positioniert die Text- und 
    Auswahlboxen rechts daneben: */

input[type=text],
select
{
    float            : left;
}

/*  dann werden alle checkboxen und radiobuttons,
    die mit der Klasse "right" versehen wurden,
    um den errechneten linken Abstand der input
    und select-Elemente (s.o.) nach rechts
    verschoben: */

input.right
{
    float                    :    left;
    width                    :    auto;
    clear                    :    both;
    margin-left                :    8.3em;
    margin-right            :    .3em;
}

/*  Extrawurst fuer Mozilla, keine Ahnung, 
    warum das so ist. Feedback und 
    Loesungsvorschlaege willkommen */

input[type=checkbox].right,
input[type=radio].right,
input[type=submit].right
{
    margin-left                :    6.3em;
}

/*  Nicht vergessen, die floats wieder aufzuheben,
    sonst floatet es munter weiter */

form br
{
    clear                    :    both;
}

/*  fuer grafische UAs und DAUs der Hinweis, dass
    die Label anklickbar sind. Weil's so schoen ist, 
    die Kontrollelemente gleich mit. Mit einer Ausnahme: 
    fuer Textfelder macht der Pointer natuerlich keinen 
    Sinn, dort sollte nach wie vor die Text-Einfuegemarke 
    als Cursor erscheinen. Daher hier die Einschraenkung 
    auf die input-Elemente des Typs checkbox, radiobutton, 
    button und submit: */

label,
select,
input[type=checkbox],
input[type=radio],
input[type=button],
input[type=submit]
{
    cursor                    :    pointer;
}

/*  legt den vertikalen Abstand der 
    einzelnen Elemente zueinander fest */

form
{
    line-height                :    110%;

}
legend
{
    line-height                :    110%;
	color: #000000;
}


.accessKey {
	FONT-WEIGHT: bold; FONT-SIZE: 0.8em; VISIBILITY: hidden; COLOR: #fbabab; MARGIN-RIGHT: 1px; 
}
#accessKeyHelpText {
	BORDER-RIGHT: #e9000 1px solid; PADDING-RIGHT: 5px; BORDER-TOP: #e9000 1px solid; PADDING-LEFT: 5px; LEFT: -350px; VISIBILITY: hidden; PADDING-BOTTOM: 5px; BORDER-LEFT: #e9000 1px solid; WIDTH: 500px; COLOR: #000000; LINE-HEIGHT: 1.5em; PADDING-TOP: 5px; BORDER-BOTTOM: #e9000 1px solid; POSITION: absolute; TOP: 0px; BACKGROUND-COLOR: #fbabab; TEXT-ALIGN: left
}