* {
	margin: 0;
	padding: 0;
	border: none;
}
html, body {
	height: 100%;
}
body {
	background: #ffffff url(../pics/bodybg.gif) top left repeat-y;
}
html, body, table, td {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
}
/* ============= Popup-Teaser ===============*/
.bodypopup {
    background-image:none;
}
.bodypopup #main {
    width:400px;
}
.bodypopup #mainbottom {
    margin-top:30px; 
    width:400px; 
    margin-left:-10px;
}
.bodypopup .teaser-wide {
    width:420px;
}
.bodypopup .teaser-wide-inner {
    padding-right:5px;
}

/* ============ SEITENBEREICHE ============ */
#page {
	min-height: 100%;
	width: 1000px;
	min-width: 1000px;
}
#header {
	height: 115px;
	background: url(../pics/headerbg.gif) top left repeat-y;
}
#header img {
	margin: 26px 0 0 40px;
}	
#footer {
	/* float: left; */
	margin-top: -20px;
	clear: both;
	height: 19px;
	background: url(../pics/bodybg.gif) top left repeat-y;
	border-top: 1px solid #dfdfdf;
	width: 100%;
}
#menu {
	float: left;
	width: 180px;
	border-top: 130px solid #869197;
	padding: 30px 0 20px 0; /*Padding unten fr Fu?eiste*/
}
#menuus {
	float: left;
	width: 180px;
	border-top: 130px solid #869197;
	padding: 30px 0 20px 0; /*Padding unten fr Fu?eiste*/
}
body#startseite #menu {
	border-top: 180px solid #869197;
}
#main {
	float: left;
	width: 630px; 
	color: #666;
	padding-bottom: 20px; /* fr footer */
	
}
#keyvisuallink {
    background-color:transparent;
    width:310px;
    height:180px;
}
#maintop {
	padding: 0 0 0 315px;
	min-height: 160px;
	/* START / TANTEK-HACK F? IE5.5 */
	width: 630px; 
	voice-family: "\" }\"";
	voice-family: inherit;
	/* STOP / TANTEK-HACK F? IE5.5 */
	width: 315px;
}

#mainbottomstart{
	margin-top: 200px;
	padding-left: 20px;
	width: 585px;
}
#mainbottomstartcontent{
	border-left: 3px solid #00a6eb;
	padding-left: 10px;
	margin-bottom:15px;
	background-color: #efefef;
}
#mainbottomstartcontent li{
	margin-left: 30px;
}
/* Zus?e fr rechts durchgehend (body-class auf "rdg") */
.twocolsrc #maintop, .twocols #maintop {
	float: right;
	padding: 0;
	width: 315px;
}
.keylink  #maintop {
    padding: 0;
    margin-top: -180px;
}
.twocolsrc #maintop h2, .twocols #maintop h2 {
	/*clear: both;*/
	margin: 0;
}
#twocolsrctop { /* Container fr durchgehenden Inhalt rechts oben */
	clear: both;
	padding: 52px 20px 10px 20px;
}

#mainbottom {
	padding: 0 25px 0 45px;
	/* START / TANTEK-HACK F? IE5.5 */
	width: 630px; 
	voice-family: "\" }\"";
	voice-family: inherit;
	/* STOP / TANTEK-HACK F? IE5.5 */
	width: 560px;
}

/* Zus?e fr rechts durchgehend (body-class auf "rdg") */
.twocolsrc #mainbottom {
	margin: 145px 0 0 0;
	float: left;
	padding: 0;	
	width: 315px;
}

.twocols #mainbottom {
	clear: both;
	padding: 0 0 0 25px;
	width: 605px;
}

body#startseite #mainbottom {
	margin: 195px 0 0 0;
}
body#startseite .keylink #mainbottom {
    margin: 15px 0 0 0;
}
#right {
	float: left;
	width: 190px;
	padding: 40px 0 10px 0;
}

/* ---------------------------------- */
/* ============ ELEMENTE ============ */
/* ---------------------------------- */
a{
	color: #00A6EB;
}
a.link, a.maillink, .teaser-small p a, ul.sitemaplevel1 a {
	text-decoration: underline;
	color: #00A6EB;
	padding: 0 0 0 6px;
	background: url(../pics/linkpfeil2.gif) left no-repeat;
}
a.maillink {
	text-decoration: none;
	padding: 0 58px 0 0;
	background: url(../pics/atknaufde.gif) bottom right no-repeat;
}
ul a.link {
	padding: 0;
	background: none;
}

.default-link
{
    color: #00A6EB;
    text-decoration: underline;
}

/* ?erschriften */
h1 {
	display: none;
}
.title {
	color: black;
	font-weight: bold;
	font-size: 13px;
}
.titles {
	font-style: italic;
	font-weight: bold;
}
h2 {
	/*margin: 20px 0 0 0;*/
	height: 30px;
	text-indent: -999em;
	font-size: 1px;
}
h3 {
	height: 30px;
	text-indent: -999em;
	font-size: 1px;
}
h3.tworows, h2.tworows {
	height: 30px;
	padding: 30px 0 0 0;
}
h3 span, h2 span {
	height: 30px;
	display: block;
	background-position: top left;
	background-repeat: no-repeat;
}
.teaser-small h3 {
	height: auto;
	text-indent: 0;
}
h4.flag {
	display: none;
}
hr {
	display: none;
}
p {
	color: #666;
	margin: 0 0 15px 0;
}
.small, tr.small td  {
	font-size: 10px;
}
/* Tabellen */
table {
	/*background: #efefef;*/
	color: #666;
	margin: 0 0 15px 0;
}
th {
	padding: 3px;
	text-align: left;
}
td {
	padding: 3px;
	vertical-align: top;
}
td.middle {
	vertical-align: middle;
}
table caption {
	text-align: left;
	padding: 3px;
	font-weight: bold;
	background: #fdfdfd url(../pics/tablecaption.jpg) top right repeat-y;
	letter-spacing: 0;
}
td.number, th.number {
	text-align: right;
}
td.icon, th.icon {
	text-align: center;
}
td.nobr, th.nobr {
	white-space: nowrap;
}
tr.link {
    cursor: pointer;
}
tr.link:hover, tr.alt {
    background-color: #f3f3f3;
}
#topnav {
	border-top: 1px solid #DFDFDF;
	border-bottom: 1px solid #DFDFDF;
	text-align: center;
	width: 311px;
	float: left;
	padding: 2px 0 2px 4px;
}	
#topnav ul {
	display: inline;
	list-style: none;
	float: left;
}
#topnav li {
	padding: 0 13px 0 14px;
	float: left;
	border-right: 1px solid #DFDFDF;
}
#topnav li.last {
	border: none;
}
#topnav a, #footer a {
	color: #666;
	font-size: 10px;
	text-decoration: none;
}

#footer ul {
	margin: 0 0 0 210px;
	display: inline;
	list-style: none;
	float: left;
}
#footer li {
	margin: 2px 0 2px 0;
	float: left;
	padding: 0 15px 0 15px;
	border-right: 1px solid #DFDFDF;
}
#footer li.last {
	/* padding: 0 0 0 511px; /* nach rechts */
	border: none;
}
#footer a {
	/* color: #9EA7AC; */
}

/* CONTENT-NAVI */
#right dl {
	margin: 0 0 10px 0;
}
#right dt {
	background: #869197;
	color: #fff;
	font-size: 12px;
	font-weight: bold;
	margin: 0 0 0 10px;
	padding: 2px 0 2px 8px;
}
#right dd {
	padding: 10px 10px 10px 20px;
	background: #f2f2f2;
	font-size: 10px;
	color: #666;
}
#right dd a {
	display: block;
	font-size: 10px;
	color: #666;
	text-decoration: none;
	padding: 0 0 0 6px;
	background: url(../pics/linkpfeil2.gif) left top no-repeat;
} 

/* TEASER BREIT */
.teaser-wide { /* ?erer container fr breiten teaser */
	margin: 0 0 20px 0;
	background: #efefef top left repeat-y;
	/*float: left; /* deaktiviert fr collapsing margins */
	width: 565px;
}
.teaser-wide-inner { /* innerer container fr breiten teaser; macht das linke padding */
	padding: 0 0 0 15px;
}
.teaser-wide-inner h3 { 
    background-position: top left;
    background-repeat: no-repeat;
}
.teaser-wide h3 {
	margin: 10px 0 0 0;
	float: left;
	width: 324px;
}
.teaser-wide h3.txt {
	background: #dfdfdf;
	text-indent: 0;
	font-size: 12px;
	border-bottom: 1px solid #fff;
	margin: 0 0 10px 0;
	padding: 5px 10px;
	float: none;
	width: auto;
	height: auto;
}
.contentblock { /* container fr bild und absatz im teaser. sorgt dafr, dass der absatz immer beim bild steht. */
	clear: both;
}
.teaser-wide p.opener { /* einziger absatz im zugeklappten teaser, darf nach unten keinen abstand haben */
	margin: 0;
}
.teaser-wide p { /* einrckung rechts um breite des teaser-bildes, sonst wird bild umflossen */
	/*margin-right: 205px;*/
	/* ist jetzt erst mal deaktiviert, weil die bilder vom text umflossen werden sollen! */
}
.teaser-wide p.img, .teaser-wide img  { /* bild nach rechts floaten */
	/* wichtig: im xhtml-flow steht immer erst der IMG-, dann der P-tag */
	clear: right; /* stellt sicher, dass die bilder nicht nebeneinander floaten und immer bei ihren abs?en stehen */
	float: right;
	margin: 0 0 10px 10px;
	font-style: italic;
}
.teaser-wide p.img img, .teaser-wide table img {
	clear: none;
	float: none;
	margin: 0;
	display: block;
}
.teaser-wide table img {
	width: auto;
	display: inline;
}
.teaser-wide table img {
	width: auto;
}
.teaser-wide-bottom {
	clear: both; /* beide vorhergehende floatings beenden */
	border-top: 1px solid #fff;
	display: block; /* gesamte breite des divs */
	height: 20px;
	background: #dfdfdf url(../pics/teaser-breit-opener.gif) top right no-repeat;
	width: 100%;
}
.teaser-wide-bottom#closer {
	background: #dfdfdf url(../pics/teaser-breit-closer.gif) top right no-repeat;
}
.teaser-wide img.closed {
	margin: 0 0 0 10px;
}
.teaser-wide table {
	clear: both;
	/* START / TANTEK-HACK F? IE5.5 */
	width: 534px;
	voice-family: "\" }\"";
	voice-family: inherit;
	/* STOP / TANTEK-HACK F? IE5.5 */
	width: 100%;
}
.teaser-wide ul, .teaser-wide ol {
	margin: 0 0 15px 20px;
}
.teaser-wide dl {
	margin: 0 0 10px 0;
}
.teaser-wide dl dt {
	font-weight: bold;
	margin: 10px 0 0 0;
}
.teaser-wide dl dd {
	padding: 0 0 0 10px;
}

/* Definitionslisten-Layout mit Rahmen (z.b. bei 'Referenzen') */
.teaser-wide dl.box, .teaser-wide dl.whitebox {
	clear: both;
	border: 1px solid #dedede;
	margin: 0 1px 10px 0;
}
.teaser-wide dl.whitebox {
	background: #FDFDFD;
}
.teaser-wide dl.box dt, .teaser-wide dl.whitebox dt {
	background: #dedede;
	padding: 3px 0 3px 5px;
	margin: 0;
}
.teaser-wide dl.box dd, .teaser-wide dl.whitebox dd {
	padding: 0 0 0 10px;
	margin: 5px 0 5px 0;
}
.teaser-wide dl.box dl dd, .teaser-wide dl.whitebox dl dd {
	padding: 0 0 0 10px;
}
.teaser-wide dl.box dl dt, .teaser-wide dl.whitebox dl dt {
	margin: 10px 0 0 0;
	background: #fff;
	padding: 2px 5px;
}

/* TEASER KLEIN */
.teaser-small { /* ?erer container fr breiten teaser */
	border-left: 3px solid #00a6eb;
	padding: 0 0 0 2px;
	margin: 0 0 0 0px; /* 0px 0 0 0px; */
	background: #dfdfdf url(../white.gif) top left repeat-y;
	float: left; /* ausrichtung nach rechts */
	width: 265px;
}
.teaser-small-inner { /* innerer container fr breiten teaser; macht das linke padding */
	padding: 0 0 0 7px;
}
.teaser-small h3 {
	color: #000;
	font-size: 12px;
	margin: 5px 0 0 0;
	float: left;
	width: 162px;
	height: 32px;
}
.teaser-small img { /* bild nach rechts floaten */
	/* wichtig: im xhtml-flow steht immer erst der IMG-, dann der P-tag */
	/*clear: right; /* stellt sicher, dass die bilder nicht nebeneinander floaten und immer bei ihren abs?en stehen */
	float: right;
	margin: 0 0 0 1px;
}
.teaser-small p {
	margin: 0;
	font-size: 10px;
}
.teaser-small p a {
	padding: 0 0 0 4px;
	margin: 0 0 0 2px;
}

/* TEASER KLEIN WEI? LINIE */
/* (Selbe Klasse wie kleiner Teaser ohne wei? Linie. Der Teaser erkennt an der Body-Klasse "zweispaltig", dass er eine wei? Linie braucht) */
body.twocols .teaser-small {
	border: none;
	padding: 0;
	margin: 0 0 15px 20px;
	background: #fff url(../pics/teaser-wl-bg.gif) top left repeat-y;
	float: left; /* automatische aufteilung auf zwei spalten */
	display: inline; /* fixt bug der randverdoppelung im ie */
	width: 270px;
}
body.twocols .teaser-small-inner { /* macht im prinzip goarnix, wird aber fr gleichbleibende xhtml-teaser-struktur benötigt */
	padding: 0;
}
body.twocols .teaser-small h3 {
	margin: 0;
	padding: 5px 0 0 10px;
	height: 20px;
	text-indent: 0;
	border-bottom: 2px solid #fff;
	/* START / TANTEK-HACK F? IE5.5 */
	width: 174px; 
	voice-family: "\" }\"";
	voice-family: inherit;
	/* STOP / TANTEK-HACK F? IE5.5 */
	width: 170px;
}
body.twocols .teaser-small p {
	float: left;
	padding: 10px 0 0 10px;	
	width: 167px;
}
body.twocols .teaser-small img {
	margin: 0;
}

.teaser-small#last {
	margin-bottom: 15px;
}

/* FORMULARELEMENTE */
form td {
	padding: 0 1px 0 5px;
	vertical-align: middle;
	border: none;
	border-bottom: 1px solid #efefef;
}
td.input, td.submit {
	text-align: left;
	padding: 0 2px 0 0;
}
td.input {
	width: 300px;
}
td.submit, tr.lastrow td {
	border: none;
}
form td.textrow {
	padding: 3px 1px 3px 5px;
}
input.text, select, textarea {
	width: 99%;
	border: 1px solid #c9c9c9;
	padding: 1px;
}
select {
	/*width: 310px;*/
	max-width: 343px;
}
td.longinput select {
	max-width: none;
}
tr.error td {
	color: #FF0000;
}
tr.error input.text, tr.error select, tr.error textarea {
	background: #FFE1E1;
	border: 1px solid #FF0000;
}
input.submit, input.button {
	margin: 0 0 0 5px; /* muss bei den oberen spaltenbreiten noch gefixt werden! */
	background: #FDFDFD;
	color: #666;
	text-align: left;
	cursor: pointer;
	padding: 0 0 0 6px;
	background: url(../pics/linkpfeil2.gif) left no-repeat;
	width: auto; /* Fix fr den ID, damit die Buttons vergr?rt werden */
	overflow: visible; /* Fix fr den ID, damit die Buttons vergr?rt werden */
}
.bold, form td.textrowbold {
	font-weight: bold;
}

.textarea {
	width:545px; 
	background-color:#EFEFEF;
}