/*
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;}

* :focus { outline: 0; }

/* 

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. 

*/

body {
	font-family: Arial,Helvetica,Verdana,'Lucida Grande',Geneva,sans-serif;
	background: url(../i/bg-hd-small.gif) repeat-x;
}


/* main-container */

#hd {
	height: 242px;
}

.yui-t1 .yui-b {
	float: left;
	width: 19.2308em;
	*width: 18.75em;
}

.yui-t1 #yui-main .yui-b {
	margin-left: 23.0769em;
	*margin-left: 22.5em;
}


/* Header */

#toplinks {
	float: right;
	margin: 3px -12px 0 0;
}

#toplinks * {
	color: white;
}

#toplinks li {
    float: left;
    margin-right: 5px;
}

#toplinks a {
    text-decoration: none;
    padding: 0 7px;
	font-size: 116%;
}

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

#logo {
	clear: both;
	float: right;
	margin: 94px 0 0 0;
}

#hd img {
    border: 0;
}


/* 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: 20px;
}

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

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

p, #yui-main ul, ol, dl, blockquote, address {
    margin-bottom: 8px;
}

dl.center, dl.left, dl.right {
    margin-top: 8px;
    margin-bottom: 8px;
}

#yui-main 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, dt, dd, #yui-main li, h1, h2, h3, h4, h5, h6, p, td {
    color: #787C77;
    font-size: 108%;
    line-height: 167%;
}

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-family: monospace;
	font-size: 245%;
	font-weight: bold;
	text-transform: lowercase;
}

h2 {
	font-size: 146.5%;
}

h3 {
	font-weight: bold;
	font-size: 108%;
	line-height: 153.9%;
}

h4 {
	font-size: 123.1%;
	font-weight: normal;
}

h5 {
	font-size: 116%;
	font-weight: bold;
}

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

hr {
	clear: both;
	border: 0;
    background-color: #D6D7CE;
    color: #D6D7CE;
    height: 10px;
}

ol {
	margin-left: 42px;
}

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

p {
	font-size: 108%;
	line-height: 153.9%;
}

table {
	
}

td {
	font-size: 108%;
	line-height: 153.9%;
	margin-bottom: 15px;
	vertical-align: top;
}

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;    
}

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


/* Formulare */

fieldset {
	text-indent: 0;
	font-size: 108%;
	line-height: 153.9%;
}

fieldset.buttonarea {
	border: 0;
	border-top: 1px solid #BAC19D;
}

fieldset legend {
	border: 0;
	color: #000000;
	margin-left: -10px;
	padding-right: 5px;
}

fieldset label {
	color: #8D927D;
	vertical-align: top;
	display: block;
	float: left;
	width: 130px;
}

input.textfield, input, textarea {
	width: 300px;
	border: 1px solid #8D927D;
	background: #FFF;
	color: #000;
	font-size: 108%;
	line-height: 153.9%;
}

input.textfield:focus {
	color: #000;
}

.error {
	color: #ff0000;
}

.error li {
	color: #ff0000;
}

.error p {
	color: #ff0000;
}


/* Standard Inline-Elemente im Content */

#yui-main a {
	color: #C40A0A;
	text-decoration: underline;
}

cite {
	font-style: italic;
}

em {
    font-style: italic;
}

img {
	border-width: 1px;
	border-color: #a0a0a0;
	border-style: solid;
}

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 !important;
    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 */

dl.center dt, dl.center dd, dl.left dt, dl.left dd, dl.right dt, dl.right dd {
    line-height: 131%;
    font-style: italic;
}

table.testimonials td {
	padding: 0 10px 20px 0px;
	vertical-align: bottom;
}

#ft {
	margin-top: 20px;
}

#ft h6 {
	font-family: monospace;
	color: #B0B6AF;
	font-size: 167%;
	margin-top: 21px;
}

#ft p {
	color: #B0B6AF;
	font-size: 93%;
}

#ft a:link, #ft a:visited, #ft a:hover, #ft a:active {
	text-decoration: none;
	color: #B0B6AF;
}

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


/* Videos auf der Startseite */

.staff-video {
	float: left;
	margin-bottom: 15px;
}

#bd .staff-video p {
	font-size: 92%;
	line-height: 123.1%;
}


/* Block über den Bildern mit Titel, Datum und Text */

div.references_item_title {
	float: left;
	width: 490px;
	margin: 0px 0px 5px 0px;
	font-size: 120%;
	font-weight: bold;
	color: #000000;
}

div.references_item_description {
	clear: both;
}

div.references_item_date {
	float: right;
	width: 120px;
	text-align: right;
}

div.references_item_images {
	margin: 6px 0px 6px 0px;
	clear: both;
	background-color: #c0c0c0;
}

#yui-main div.references_item_images img {
	float: none;
	margin: 2px;
}


/* Referenzen */

div.references_jumpbar {
	margin: 15px 0px 15px 0px;
}

div.references_item {
	margin: 20px 0px 15px 0px;
	color: #787C77;
}

div.filmlibrary_jumpbar {
	margin: 15px 0px 15px 0px;
}

div.filmlibrary_item {
	margin: 30px 0px 15px 0px;
	color: #787C77;
}

div.filmlibrary_flashhost {
}

div.filmlibrary_item_title {
	margin: 10px 0px 10px 0px;
	font-size: 120%;
	font-weight: bold;
	color: #000000;
}

div.filmlibrary_item_description {
	float: left;
	width: 370px;
}

div.filmlibrary_item_media {
	float: right;
	width: 204px;
	height: 172px;
	margin: 0px 0px 6px 10px;
}

#yui-main div.filmlibrary_item_images img {
	float: none;
	margin: 2px;
}


/* body */

#bd .menu1 li {
	text-align: right;
	list-style: none;
	line-height: 25px;
	font-size: 20px;
	padding: 0;
	display: block;
	margin-bottom: 8px;
}

#bd .menu1 {
	margin-top: 7px;
}

#bd .menu1 a {
	font-family: monospace;
	font-weight: bold;
	font-size: 20px;
	line-height: 25px;
	color: black;
	text-transform: lowercase;
	text-decoration: none;
	padding: 0;
	margin: 0;
	display: block;
}

#bd .menu1 a:hover,
#bd .menu1 a:active,
#bd .menu1 .active a {
	color: #C40A0A;
}

