/*
Copyright (c) 2009, Yahoo! Inc. All rights reserved.
Code licensed under the BSD License:
http://developer.yahoo.net/yui/license.txt
version: 2.7.0
*/
html{color:#000;background:#FFF;}body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,button,textarea,p,blockquote,th,td{margin:0;padding:0;}table{border-collapse:collapse;border-spacing:0;}fieldset,img{border:0;}address,caption,cite,code,dfn,em,strong,th,var,optgroup{font-style:inherit;font-weight:inherit;}del,ins{text-decoration:none;}li{list-style:none;}caption,th{text-align:left;}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal;}q:before,q:after{content:'';}abbr,acronym{border:0;font-variant:normal;}sup{vertical-align:baseline;}sub{vertical-align:baseline;}legend{color:#000;}input,button,textarea,select,optgroup,option{font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;}input,button,textarea,select{*font-size:100%;}body{font:13px/1.231 arial,helvetica,clean,sans-serif;*font-size:small;*font:x-small;}select,input,button,textarea,button{font:99% arial,helvetica,clean,sans-serif;}table{font-size:inherit;font:100%;}pre,code,kbd,samp,tt{font-family:monospace;*font-size:108%;line-height:100%;}body{text-align:center;}#doc,#doc2,#doc3,#doc4,.yui-t1,.yui-t2,.yui-t3,.yui-t4,.yui-t5,.yui-t6,.yui-t7{margin:auto;text-align:left;width:57.69em;*width:56.25em;}#doc2{width:73.076em;*width:71.25em;}#doc3{margin:auto 10px;width:auto;}#doc4{width:74.923em;*width:73.05em;}.yui-b{position:relative;}.yui-b{_position:static;}#yui-main .yui-b{position:static;}#yui-main,.yui-g .yui-u .yui-g{width:100%;}.yui-t1 #yui-main,.yui-t2 #yui-main,.yui-t3 #yui-main{float:right;margin-left:-25em;}.yui-t4 #yui-main,.yui-t5 #yui-main,.yui-t6 #yui-main{float:left;margin-right:-25em;}.yui-t1 .yui-b{float:left;width:12.30769em;*width:12.00em;}.yui-t1 #yui-main .yui-b{margin-left:13.30769em;*margin-left:13.05em;}.yui-t2 .yui-b{float:left;width:13.8461em;*width:13.50em;}.yui-t2 #yui-main .yui-b{margin-left:14.8461em;*margin-left:14.55em;}.yui-t3 .yui-b{float:left;width:23.0769em;*width:22.50em;}.yui-t3 #yui-main .yui-b{margin-left:24.0769em;*margin-left:23.62em;}.yui-t4 .yui-b{float:right;width:13.8456em;*width:13.50em;}.yui-t4 #yui-main .yui-b{margin-right:14.8456em;*margin-right:14.55em;}.yui-t5 .yui-b{float:right;width:18.4615em;*width:18.00em;}.yui-t5 #yui-main .yui-b{margin-right:19.4615em;*margin-right:19.125em;}.yui-t6 .yui-b{float:right;width:23.0769em;*width:22.50em;}.yui-t6 #yui-main .yui-b{margin-right:24.0769em;*margin-right:23.62em;}.yui-t7 #yui-main .yui-b{display:block;margin:0 0 1em 0;}#yui-main .yui-b{float:none;width:auto;}.yui-gb .yui-u,.yui-g .yui-gb .yui-u,.yui-gb .yui-g,.yui-gb .yui-gb,.yui-gb .yui-gc,.yui-gb .yui-gd,.yui-gb .yui-ge,.yui-gb .yui-gf,.yui-gc .yui-u,.yui-gc .yui-g,.yui-gd .yui-u{float:left;}.yui-g .yui-u,.yui-g .yui-g,.yui-g .yui-gb,.yui-g .yui-gc,.yui-g .yui-gd,.yui-g .yui-ge,.yui-g .yui-gf,.yui-gc .yui-u,.yui-gd .yui-g,.yui-g .yui-gc .yui-u,.yui-ge .yui-u,.yui-ge .yui-g,.yui-gf .yui-g,.yui-gf .yui-u{float:right;}.yui-g div.first,.yui-gb div.first,.yui-gc div.first,.yui-gd div.first,.yui-ge div.first,.yui-gf div.first,.yui-g .yui-gc div.first,.yui-g .yui-ge div.first,.yui-gc div.first div.first{float:left;}.yui-g .yui-u,.yui-g .yui-g,.yui-g .yui-gb,.yui-g .yui-gc,.yui-g .yui-gd,.yui-g .yui-ge,.yui-g .yui-gf{width:49.1%;}.yui-gb .yui-u,.yui-g .yui-gb .yui-u,.yui-gb .yui-g,.yui-gb .yui-gb,.yui-gb .yui-gc,.yui-gb .yui-gd,.yui-gb .yui-ge,.yui-gb .yui-gf,.yui-gc .yui-u,.yui-gc .yui-g,.yui-gd .yui-u{width:32%;margin-left:1.99%;}.yui-gb .yui-u{*margin-left:1.9%;*width:31.9%;}.yui-gc div.first,.yui-gd .yui-u{width:66%;}.yui-gd div.first{width:32%;}.yui-ge div.first,.yui-gf .yui-u{width:74.2%;}.yui-ge .yui-u,.yui-gf div.first{width:24%;}.yui-g .yui-gb div.first,.yui-gb div.first,.yui-gc div.first,.yui-gd div.first{margin-left:0;}.yui-g .yui-g .yui-u,.yui-gb .yui-g .yui-u,.yui-gc .yui-g .yui-u,.yui-gd .yui-g .yui-u,.yui-ge .yui-g .yui-u,.yui-gf .yui-g .yui-u{width:49%;*width:48.1%;*margin-left:0;}.yui-g .yui-g .yui-u{width:48.1%;}.yui-g .yui-gb div.first,.yui-gb .yui-gb div.first{*margin-right:0;*width:32%;_width:31.7%;}.yui-g .yui-gc div.first,.yui-gd .yui-g{width:66%;}.yui-gb .yui-g div.first{*margin-right:4%;_margin-right:1.3%;}.yui-gb .yui-gc div.first,.yui-gb .yui-gd div.first{*margin-right:0;}.yui-gb .yui-gb .yui-u,.yui-gb .yui-gc .yui-u{*margin-left:1.8%;_margin-left:4%;}.yui-g .yui-gb .yui-u{_margin-left:1.0%;}.yui-gb .yui-gd .yui-u{*width:66%;_width:61.2%;}.yui-gb .yui-gd div.first{*width:31%;_width:29.5%;}.yui-g .yui-gc .yui-u,.yui-gb .yui-gc .yui-u{width:32%;_float:right;margin-right:0;_margin-left:0;}.yui-gb .yui-gc div.first{width:66%;*float:left;*margin-left:0;}.yui-gb .yui-ge .yui-u,.yui-gb .yui-gf .yui-u{margin:0;}.yui-gb .yui-gb .yui-u{_margin-left:.7%;}.yui-gb .yui-g div.first,.yui-gb .yui-gb div.first{*margin-left:0;}.yui-gc .yui-g .yui-u,.yui-gd .yui-g .yui-u{*width:48.1%;*margin-left:0;}.yui-gb .yui-gd div.first{width:32%;}.yui-g .yui-gd div.first{_width:29.9%;}.yui-ge .yui-g{width:24%;}.yui-gf .yui-g{width:74.2%;}.yui-gb .yui-ge div.yui-u,.yui-gb .yui-gf div.yui-u{float:right;}.yui-gb .yui-ge div.first,.yui-gb .yui-gf div.first{float:left;}.yui-gb .yui-ge .yui-u,.yui-gb .yui-gf div.first{*width:24%;_width:20%;}.yui-gb .yui-ge div.first,.yui-gb .yui-gf .yui-u{*width:73.5%;_width:65.5%;}.yui-ge div.first .yui-gd .yui-u{width:65%;}.yui-ge div.first .yui-gd div.first{width:32%;}#hd:after,#bd:after,#ft:after,.yui-g:after,.yui-gb:after,.yui-gc:after,.yui-gd:after,.yui-ge:after,.yui-gf:after{content:".";display:block;height:0;clear:both;visibility:hidden;}#hd,#bd,#ft,.yui-g,.yui-gb,.yui-gc,.yui-gd,.yui-ge,.yui-gf{zoom:1;}



/* 

Font-Größen-Tabelle: 
=====================

Nutzt man wie wir YUI Fonts CSS, dann werden Schriften und Line-Heights in % angegeben. Für die gewünschte Größe in px jeweils den dahinterstehenden Wert in % wählen.

px  %
---------
10 	77
11 	85
12 	93 (was 93)
13 	100
14 	108 (was 107)
15 	116 (was 114)
16 	123.1 (was 122)
17 	131 (was 129)
18 	138.5 (was 136)
19 	146.5 (was 144)
20 	153.9 (was 152)
21 	161.6 (was 159)
22 	167
23 	174
24 	182
25 	189
26 	197

src: http://developer.yahoo.com/yui/fonts/

*/

/* 

Das CSS hat einen einfachen Aufbau:

    1. Formatierung für html und body
    2. Formatierung der Container und Menu(s)
    3. Vertikale Abstände der Standard-Blockelemente
    4. Formatierung der Standard-Blockelemente in alphabetischer Reihenfolge
    5. Formatierung der Formulare
    6. Formatierung der Standard-Inline-Elemente
    7. Seitenübergreifende Spezialitäten (hcard, buttons)
    8. Seitenindividuelle Formatierungen (auf das einzelne Projekt bezogen)

CSS soll so formuliert werden, dass Sonderfälle (beispielsweise ein speziell für das Menü formatiertes <ul>) nicht auf Standard-Elemente im Content durchschlagen. Im Content sollte man immer einfaches HTML mit möglichst wenig Klassen und IDs schreiben können ohne dabei optische Überraschungen zu erleben. 


*/

html {
	background: #f0eee1 url(../i/body-background.gif) repeat-x;
}


/* main-container */

#custom-doc {
	width: 64.6154em; /* alle Browser: Zielbreite in Pixeln / 13 */
	*width: 63.0582em; /* em allgemein * 0.9759 = em für IE */
}

.yui-t6 .yui-b {
	float: right;
	margin-right: 20px;
	width: 19.3077em;
	*width: 19.45em;
}

.yui-t6 #yui-main .yui-b {
	margin-right: 22.5385em;
	*margin-right: 22.0194em;
	padding: 20px 0 20px 20px;

}

.yui-b {
    margin-top: 24px;
}

#yui-main .yui-b {
	margin-top: 0;
}


/* Main-Menu mit CSS-Sprites */

ul.menu1 {position: relative;top: 20px;left: 145px; width: 600px;}
ul.menu1 li {position: absolute;top: 0;background-image: url(../i/menumain.jpg);}
ul.menu1 li, ul.menu1 a {height: 65px;display: block;}
#menu-home {left: 0;width: 96px;}
#menu-koepfe {left: 96px;width: 93px;background-position: -96px 0;}
#menu-themen {left: 189px;width: 104px;background-position: -189px 0;}
#menu-kontakt {left: 293px;width: 95px;background-position: -293px 0;}
#menu-datenschutz {left: 388px;width: 94px;background-position: -388px 0;}
#menu-home a:hover, #menu-home.active, #menu-home.inpath {background: transparent url(../i/menumain.jpg) 0 -67px no-repeat;}
#menu-koepfe a:hover, #menu-koepfe.active, #menu-koepfe.inpath {background: transparent url(../i/menumain.jpg) -96px -67px no-repeat;}
#menu-themen a:hover, #menu-themen.active, #menu-themen.inpath {background: transparent url(../i/menumain.jpg) -189px -67px no-repeat;}
#menu-kontakt a:hover, #menu-kontakt.active, #menu-kontakt.inpath 
{background: transparent url(../i/menumain.jpg) -293px -67px no-repeat;}
#menu-datenschutz a:hover, #menu-datenschutz.active, #menu-datenschutz.inpath {background: transparent url(../i/menumain.jpg) -388px -67px no-repeat;}


/* "Header2" mit {menu2} */

#hd2 {
	background-color: white;
	margin-top: 101px;
	padding: 10px 20px 3px;
	border: 1px solid #e9e5d0;
	-moz-border-radius-topleft: 8px;
	-moz-border-radius-topright: 8px;
	-webkit-border-top-left-radius: 8px;
	-webkit-border-top-right-radius: 8px;
	border-top-left-radius: 8px;
	border-top-right-radius: 8px;
	border-bottom: none;
}

#metorlogo {
	margin: 25px 0 13px 20px;
}

#hd2 div.banner {
	background: url(../i/banner.jpg);
	height: 108px;
	overflow: visible;
}

#hd2 div.banner h1 {
	padding: 65px 300px 0 20px;
	color: white;
	font-size: 138.5%;
	font-weight: bold;
}

#labyrinth {
	margin: -65px 100px 0 0;
	float: right;
	position: relative;
}


/* Second Menu */
/* first-child, before und after sind dank IE8.js auch in IE<8 verfügbar */

ul.menu2 {
	position: absolute;
	width: 800px;
	text-align: center;
	margin-left: 0;
	margin-right: 0;
}

ul.menu2 li {
	display: inline;
}

ul.menu2 li:before {
	content: "| ";
	color: #575d5b;
}
ul.menu2 li:last-child:after {
	content: " |";
	color: #575d5b;
}

ul.menu2 li a:link, ul.menu2 li a:visited, ul.menu2 li a:hover, ul.menu2 li a:active {
	text-decoration: none;
	color: #575d5b;
	margin:0 7px;
}

ul.menu2 li a:hover, ul.menu2 li a:active {
	color: #2857a6;
}


/* "Body" */

#bd {
    background-color: white;
	padding: 0 20px 50px;
	border: 1px solid #e9e5d0;
	border-top: none;
}

#bd2 {
    background-color: #CDD3D3;
	padding: 10px 0 20px;
	border: 1px solid #e9e5d0;
	border-top: none;
}

#bd2:after {
 	content: ".";
 	display: block;
 	height: 0;
 	clear: both;
 	visibility: hidden;   
}

/* Senkrechte Abstände von Standard-Block-Elementen im Content 

h1, h2, h3, h4, h5, h6, p, ul, ol, dl, blockquote, address, hr, table, form

Aufeinander folgende Elemente des gleichen Typs werden als Siblings selektiert ("p + p"). Ältere Internet Explorer erhalten die entsprechende Fähigkeit per IE8.js. 

*/

hr {
    margin-bottom: 32px;
}

h1, h2, form {
    margin-bottom: 9px;
}

h3, h4,  h5,  h6, table {
    margin-bottom: 7px;
}

p, ul, ol, dl, blockquote, address {
    margin-bottom: 4px;
}

li, dt, dd {
    margin-bottom: 2px;
}

p + h1, ul + h1, ol + h1, dl + h1, blockquote + h1, address + h1, table + h1, form + h1,
p + h2, ul + h2, ol + h2, dl + h2, blockquote + h2, address + h2, table + h2, form + h2,
p + h3, ul + h3, ol + h3, dl + h3, blockquote + h3, address + h3, table + h3, form + h3,
p + h4, ul + h4, ol + h4, dl + h4, blockquote + h4, address + h4, table + h4, form + h4,
p + h5, ul + h5, ol + h5, dl + h5, blockquote + h5, address + h5, table + h5, form + h5,
p + h6, ul + h6, ol + h6, dl + h6, blockquote + h6, address + h6, table + h6, form + h6, 
p + hr, ul + hr, ol + hr, dl + hr, blockquote + hr, address + hr, table + hr, form + hr {
    margin-top: 18px;
}

ul ul, ul ol, ul dl, ol ol, ol ul, ol dl, dl dl, dl ul, dl ol {
    margin-top: 2px;
}

ul ul, ul ol, ul dl, ol ol, ol ul, ol dl, dl dl, dl ol, dl ul {
    margin-bottom: 0;
}


/* 
 * Standard-Block-Elemente im Content 
 * alphabetisch sortiert
 */

address {

}

blockquote {
	margin-left: 20%;
	margin-right: 20%;
}

dl {

}

dl dl {
    margin-left: 22px;
}

dl ol, dl ul {
    margin-left: 44px;
}

dl.center {
	text-align: center;
	clear: both;
}

dl.left {
	float: left;
	margin-right: 20px;
}

dl.right {
	float: right;
	margin-left: 10px;
}

dt {
    font-weight: bold;
}

dd {
    
}

h1 {
	font-size: 131%;
	color: #1A3A6A;
	font-weight: bold;
}

h2 {
	font-size: 131%;
    color: #6f8a0b;
}

h3 {
	font-size: 123.1%;
	font-weight: normal;
	color: #1A3A6A;
}

h4 {
	font-size: 123.1%;
	font-weight: normal;
	color: #1A3A6A;
}

h5 {
	color: #1A3A6A;
	font-size: 116%;
	font-weight: bold;
}

h6 {
    color: #B60000;
	font-size: 108%;
	font-weight: bold;
}

hr {
	border: 0;
    background-color: #B60000;
    color: #B60000;
    height: 1px;
}

ol {
	margin-left: 42px;
}

ol li {
    list-style-position: outside;
    list-style-type: decimal;
    line-height: 123.1%;
}

p {

}

table {
	
}

td {
	padding: 4px;
}

table.withborder, table.withborder td, table.withborder th {
	border: 1px solid gray;
}

th {
	background: white;
	text-align: center;
	padding: 8px;
	color: #B60000;
}

ul {
	margin-left: 34px;    
}

ul li {
    list-style-position: outside;
    list-style-type: disc;
}


/* Formulare */

form {
	margin-top: 10px;
}

form dl {
    margin-left: 0;
}

textarea, input {
	width: 95%;
	font-size: 100%;
	padding: 10px;
	margin: 10px 0 16px 0;
	border: 1px solid silver;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;	
}

textarea:focus, input:focus {
	background-color: #feffaf;
}

label {
	font-size: 100%;
}

.kontaktformular_fehler {
	margin-top: 10px;
	margin-bottom: 10px;
	color: #e00000;
	font-weight: bold;
}


/* Standard Inline-Elemente im Content */

a {
	color: #1A3A6A;
}

cite {
	font-style: italic;
}

em {
    font-style: italic;
}

img {

}

q {

}

strong {
    font-weight: bold;
}



/* Buttons */

.buttons a, .buttons button{
    display: block;
	/* float: left; */
	/* margin: 0 7px 0 0; */
    margin: 0;
    background-color: #f5f5f5;
    border: 1px solid #dedede;
    border-top: 1px solid #eee;
    border-left: 1px solid #eee;
    font-family: Microsoft Sans Serif, Verdana, Geneva, sans-serif;
    line-height: 130%;
    text-decoration: none;
    font-weight: bold;
    color: #565656;
    cursor: pointer;
    padding: 5px 10px 6px 7px; /* Links */
}

.buttons button{
    width: auto;
    overflow: visible;
    padding: 4px 10px 3px 7px; /* IE6 */
}

.buttons button[type]{
    padding: 5px 10px 5px 7px; /* Firefox */
    line-height: 17px; /* Safari */
}

*:first-child+html button[type]{
    padding: 4px 10px 3px 7px; /* IE7 */
}

.buttons button img, .buttons a img{
    margin: 0 3px -3px 0 !important;
    padding: 0;
    border: none;
    width: 16px;
    height: 16px;
}


/* Farben für die Buttons */

/* Button Neutral */

button:hover, .buttons a:hover{
    background-color: #dff4ff;
    border: 1px solid #c2e1ef;
    color: #336699;
}

.buttons a:active{
    background-color: #6299c5;
    border: 1px solid #6299c5;
    color: #fff;
}


/* Button Positiv */

button.positive, .buttons a.positive{
    color:#529214;
}

.buttons a.positive:hover, button.positive:hover{
    background-color:#E6EFC2;
    border:1px solid #C6D880;
    color:#529214;
}

.buttons a.positive:active{
    background-color:#529214;
    border:1px solid #529214;
    color:#fff;
}


/* Button Negativ */

.buttons a.negative, button.negative{
    color: #d12f19;
}

.buttons a.negative:hover, button.negative:hover{
    background: #fbe3e4;
    border: 1px solid #fbc2c4;
    color: #d12f19;
}

.buttons a.negative:active{
    background-color: #d12f19;
    border: 1px solid #d12f19;
    color: #fff;
}

/* hcard */

.vcard .url, .tel .type, .adr .type, .adr .region, .adr .country-name, .geo, .note {
	display: none;
}

.vcard {
	margin-bottom: 5px;
}

.vcard .street-address {
	display: block;
}


/* Seitenindividuelle Formatierungen */

/* Rechte Spalte */

#bd2 > .yui-b h1 {
	color: white;
	background: #606150;
	border: 1px solid #b7b8a7;
	-moz-border-radius: 6px;
	-webkit-border-radius: 6px;
	border-radius: 6px;
	padding: 10px 14px;
	font-weight: bold;
	font-size: 100%;
	clear: both;
}

#bd2 > .yui-b p {
    font-size: 93%;
    line-height: 131%;
    margin-left: 14px;
}

dl.left {
    margin-left: 10px;
}

dl.persons dt {
	clear: both;
    float: left;
    width: 190px;
}

dl.persons dd {
    margin: 0 0 40px 190px;
}

table td.firstcolumn {
    background: gray;
    color: #ACC874;
}

#ft {
	margin-top: 20px;
    text-align: center;
}

#ft, #ft a {
	color: #7f7d73;
	text-decoration: none;
}

#ft a:hover {
    text-decoration: underline;
}

div.vcard {
    margin-left: 15px;
}

/* MediaboxAdvanced */
/* http://iaian7.com/webcode/mediaboxAdvanced */

#mbOverlay {
	position: absolute;
	z-index: 9998;
	left: 0;
	width: 100%;
	background-color: #000;
	cursor: pointer;
}

#mbOverlay.mbOverlayFF {
	background: transparent url(../i/mediaboxAdvanced/80.png) repeat;
}

#mbOverlay.mbOverlayIE {
	background: transparent url(../i/mediaboxAdvanced/50.gif) repeat;
}

#mbCenter, #mbBottomContainer {
	position: absolute;
	z-index: 9999;
	left: 50%;
	overflow: hidden;
	background-color: #000;
}

.mbLoading {
	background: #000 url(../i/mediaboxAdvanced/BlackLoading.gif) no-repeat center;
}

#mbImage {
	position: absolute;
	left: 0;
	top: 0;
	border: 10px solid #000;
	background-repeat: no-repeat;
/*	Sets the style for inline content, if no style is given	*/
	font-family: Myriad, Verdana, Arial, Helvetica, sans-serif;
	line-height: 19px;
	font-size: 12px;
	color: #fff;
	text-align: left;
}

/*	Sets the style for inline content, if no style is given	*/
#mbImage a, #mbImage a:link, #mbImage a:visited {
	color: #ddd;
}

/*	Sets the style for inline content, if no style is given	*/
#mbImage a:hover, #mbImage a:active {
	color: #fff;
}

#mbBottom {
	font-family: Myriad, Verdana, Arial, Helvetica, sans-serif;
	line-height: 19px;
	font-size: 12px;
	color: #999;
	text-align: left;
	border: 10px solid #000;
	border-top-style: none;
}

#mbTitle {
	display: inline;
	color: #fff;
	font-weight: bold;
	line-height: 20px;
	font-size: 12px;
}

#mbNumber {
	display: inline;
	color: #999;
	line-height: 14px;
	font-size: 10px;
}

#mbCaption {
	display: block;
	color: #999;
	line-height: 14px;
	font-size: 10px;
}

#mbPrevLink, #mbNextLink, #mbCloseLink {
	display: block;
	float: right;
	height: 20px;
	width: 46px;
	background: transparent url(../i/mediaboxAdvanced/BlackClose.gif) no-repeat center;
	margin: 0;
	outline: none;
}

#mbPrevLink {
	width: 60px;
	background: transparent url(../i/mediaboxAdvanced/BlackPrevious.gif) no-repeat center;
}

#mbNextLink {
	width: 35px;
	background: transparent url(../i/mediaboxAdvanced/BlackNext.gif) no-repeat center;
}

#mbCloseLink {
	width: 80px;
	background: transparent url(../i/mediaboxAdvanced/BlackClose.gif) no-repeat center;
}

#mbError {
	position: relative;
	top: 30%;
	font-family: Myriad, Verdana, Arial, Helvetica, sans-serif;
	line-height: 19px;
	font-size: 12px;
	color: #fff;
	text-align: center;
	border: 10px solid #700;
	padding: 20px 10px 30px;
	margin: auto;
}