/**
 * @project	    www.qubic.eu
 * @copyright   2008, Claus Coviello, www.webseiten-mit-sinn.de
 * @version     screenlayout
 * @version     01.00.02
 * @since       00.01
 * @modified    2010-03-24
 */


/**
 * verwendete body-class
 *
	.drei-spaltig-linie 	3-spaltiges Grundlayout (default) + Linie zur rechten Spalte
	.zwei-spaltig 			2-spaltiges Grundlayout
*/


/**
 * Alle tags auf Null zuruecksetzen und allgemeine
 * Formatierung (projektunabhaengig)
 */
html, body, div, ul, ol, li, img, form, fieldset, label, table, th, tr, td {
	margin:0;
	padding:0;
	border:0;
}

.skip, p.skip, .print-only {
	position:absolute;
	left:-1000px;
	top:-2000px;
	width:0;
	height:0;
	overflow:hidden;
	display:inline;
}

.spaltenabschluss {
	display:block;
	height:1px;
	font:1px /1 sans-serif;
	clear: both;
}

.anmerkung-programmierer,
.kommentar-programmierer {
	color:red;
	font-weight:normal;
	font-style:italic;
	font-size:0.9em;
}


/**
 * Aufbau Grundlayout
 */
html, body {
	height: 100%;
}

body {
	/*
		IE-Fehler: Die Schriftgroesse muss in Prozent angegeben werden.
		Mit em kann es im IE (5.0, 5.5, 6.0, 7beta) Probleme geben.
		Bei Aenderung der Schriftgroesse im Browser verschiebt sich der
		Text in der linken Spalte des 3-spaltigen Layouts.
	*/
	color:#333;
	font-size:80%;
	line-height:1.4em;
	font-family:Arial, Helvetica, sans-serif;
	font-style:normal;
	background-color:white;
}

a {
	color:#326CB3;
	text-decoration:underline;
}

a:hover,
a:focus {
	color:#333;
}

a.no-underline {
	text-decoration:none;
}

a .underline {
	text-decoration:underline;
}

#wrapper {
	width:990px;
	background:white url("../_img/hintergrund-seitenkopf.gif") no-repeat left top;
}

#header {
	position:relative;
	height:186px;
}

.outer-container {
	width: auto;
	padding-left:205px;
	padding-right:305px;
}

body.drei-spaltig-linie .outer-container {
	background:url('../_img/linie-senkrecht.gif') repeat-y 700px 0px;
}

body.zwei-spaltig .outer-container {
	padding-right:0;
}

#inner-container {
	margin: 0;
	width: 100%;
}

#layout-left {
	z-index: 10;
	position: relative;
	float: left;
	width:205px;
	margin-left:-205px;
	margin-right: 1px;
	overflow: hidden;
}

#layout-right {
	z-index:11;
	position:relative;
	float:left;
	width:305px;
	margin-left:9px;
	margin-right:-305px;
	margin-top:6px;
	overflow: hidden;
}

#layout-center {
	z-index: 12;
	position: relative;
	float: left;
	width: 100%;
	margin: 0 -8px 0 -2px;
	margin-top:6px;
	padding-bottom:40px;
	overflow: hidden;
}

.outer-container > #inner-container {
	/*
		Die Farbe dieser Linie ist an das Layout anzupassen.
		"transparent" funktioniert nicht im IE 7beta.
	*/
	border-bottom: 1px solid transparent;
}


/**
 * Kopfbereich des Layouts
 */
#header #logo-qubic {
	position:absolute;
	top:31px;
	left:32px;
}

#header #logo-qubic,
#header #logo-qubic a {
	display:block;
	width:110px;
	height:125px;
}

#header #logo-qubic strong {
	display:none;
}


/**
 * Brotkrumenpfad
 */
#wo-bin-ich {
	padding:166px 0 0 207px;
	font-size:0.8em;
	line-height:1.15em;
}

#wo-bin-ich p {
	margin:0;
	padding:0;
}

#wo-bin-ich a {
	color:#666;
	text-decoration:underline;
}

#wo-bin-ich .trennzeichen {
	margin:0;
	padding:0 2px;
}


/**
 * Aufbau Hauptmenue
 */
.hauptnavi {
	width:140px;
	margin:0 0 0 33px;
	padding:0;
	font-weight:bold;
	font-size:0.95em;
	line-height:1.1em;
}

.hauptnavi ul {
	list-style-type:none;
	margin:0;
	padding:0;
}

.hauptnavi li {
	margin:0;
	border-top:10px solid white;
	background:url("../_img/hintergrund-menue.gif") 100% 0%;
}

	/* Ergaenzung fuer Untermenue */
.hauptnavi li li {
	border-top-width:9px;
	background:white;
}

.hauptnavi li a,
.hauptnavi li strong {
	display:block;
	width:100%;
	padding:2px 0 2px 0;
	color:white;
	text-decoration:none;
	/*
		bugfix fuer ???
	*/  } html>body .hauptnavi li a {
		width:auto;
}

.hauptnavi li strong,
.hauptnavi li a.aktiv {
	color:black;
}

	/* Ergaenzung fuer Untermenue */
.hauptnavi li li a {
	color:#666;
}

.hauptnavi li li a,
.hauptnavi li li strong {
	text-transform: uppercase;
}

.hauptnavi li a span,
.hauptnavi li strong span {
	display:block;
	width:91%;
	margin:0 3% 0 5%;
}

	/* Ergaenzung fuer Untermenue */
.hauptnavi li li a span,
.hauptnavi li li strong span {
	width:85%;
	margin-left:9%;
}

.hauptnavi li a:hover,
.hauptnavi li a:focus {
	color:#333;
	cursor:pointer;
}


/**
 * Seitenfuss
 */
#footer {
	width:470px;
	margin-left:205px;
	padding-bottom:20px;
	border-top:1px solid #666;
	font-size:0.9em;
}

#footer ul {
	margin:10px 0 20px 0;
	padding:0;
	float:left;
	line-height:1em;
}

#footer ul li {
	display:inline;
}

#footer ul li a {
	float:left;
	color:#666;
	text-transform: uppercase;
	padding:0 8px;
	border-left:1px solid #666;
}

#footer ul li a:hover,
#footer ul li a:hover {
	color:#333;
	font-weight:bold;
}

#footer ul li.first a {
	padding-left:0;
	border-left:none;
}


/**
 * Allgemeine Textformatierungen
 */
h1,
.h1-style {
	margin:0 0 0.8em 0;
	padding:0;
	color:#326CB3;
	text-transform: uppercase;
	font-weight:bold;
	font-size:1.38em;
	line-height:1.35em;
}

.h1-style {
	margin-top:2.5em;
}

h2,
.h2-style {
	margin:2em 0 1em 0;
	padding:0;
	color:#333;
	font-size:1.10em;
	line-height:1.4em;
	font-weight:bold;
}

h3,
.h3-style {
	margin:0.8em 0 0.4em 0;
	padding:0;
	color:#333;
	font-size:1em;
	line-height:1.4em;
	font-weight:bold;
}

h3 span.normal {
	font-weight:normal;
}

p {
	margin:0 0 0.8em 0;
	padding:0;
}

strong {
	font-weight:bold;
}

#layout-center ul,
#layout-right ul {
	margin:0.8em 0 0.8em 1px;
	padding:0;
	list-style-type:none;
}


#layout-center ul li,
#layout-right ul li {
	margin:0 0 0.4em 0;
	padding:0 0 0 14px;
	background:url("../_img/listenzeichen_blau.gif") no-repeat 0px 0.4em;
	/*
		IE-bugfix
	*/	position:relative;
}

#layout-center ul h3,
#layout-right ul h3 {
	margin-top:0;
	margin-bottom:0.2em;
}


/**
 * Mitteilungsboxen
 */
#layout-center .aktuell-0,
#layout-center .aktuell-1 {
	margin-bottom:14px;
	padding:4px 5px 5px 5px;
}

#layout-center .aktuell-0 {
	background-color:#E0E9F4;
}

#layout-center .aktuell-1 {
	background-color:#E5E5E5;
}
#layout-center .aktuell-0 h3,
#layout-center .aktuell-1 h3 {
	margin-top:0em;
	margin-bottom:0.2em;
}

#layout-center .aktuell-0 a,
#layout-center .aktuell-1 a {
	color:#333;
	text-decoration:none;
}

#layout-center .aktuell-0 a span,
#layout-center .aktuell-1 a span {
	text-decoration:underline;
	color:#326CB3;
}

#layout-center .aktuell-0 a:hover,
#layout-center .aktuell-1 a:hover {
	text-decoration:underline;
}

#layout-center .aktuell-0 .datum,
#layout-center .aktuell-1 .datum {
	display:block;
	margin-top:0.3em;
	color:#666;
}

/* Downloadliste */
#layout-center ul.downloadliste {
	list-style-position:inside;
}

#layout-center ul.downloadliste li {
	margin-top:1.8em;
	padding-left:0;
}

#layout-center ul.downloadliste h3 {
	margin-top:0;
	text-indent:1em;
}


/* PDF-Download */
.pdf-download {
	width:100%;
	display:block;
	margin-top:0.4em;
	margin-bottom:1.3em;
}

.pdf-download img {
	float:left;
	margin-right:10px;
}

#layout-center .pdf-download {
	font-weight:bold;
}

/* Produkt-Navi-Seite */
#layout-center #produkte-navi ul {
	margin:25px 0 0 0;
	padding:0;
	position:relative;
	width:541px;
	height:527px;
	background:white url("../_img/produkte/hintergrund.gif");
	z-index:1;
	overflow:hidden;
	list-style-type:none;
}

#layout-center #produkte-navi li {
	margin:0;
	padding:0;
	background:none;
	position:absolute;
}

#layout-center #produkte-navi a {
	display:block;
	height:0;
	color:black;
	text-decoration:none;
	background:transparent;
	overflow:hidden;
	z-index:10;
}

#layout-center #produkte-navi #personal {
	width:230px;
	height:120px;
}

#layout-center #produkte-navi #personal a {
	position:absolute;
	left:150px;
	top:0px;
	width:230px;
	padding-top:120px;
	background:url("../_img/produkte/personal.gif") no-repeat -235px 0;
	/*
		bugfix: IE 5 / 5.5
	*/	}
		* html #layout-center #produkte-navi a {
		height:120px;
		he\ight:0;
}

#layout-center #produkte-navi #organisation {
	width:230px;
	height:128px;
}

#layout-center #produkte-navi #organisation a {
	position:absolute;
	left:150px;
	top:120px;
	width:230px;
	padding-top:128px;
	background:url("../_img/produkte/organisation.gif") no-repeat -235px 0;
	/*
		bugfix: IE 5 / 5.5
	*/	}
		* html #layout-center #produkte-navi a {
		height:128px;
		he\ight:0;
}

#layout-center #produkte-navi #qualitaet {
	width:230px;
	height:124px;
}

#layout-center #produkte-navi #qualitaet a {
	position:absolute;
	left:150px;
	top:248px;
	width:230px;
	padding-top:124px;
	background:url("../_img/produkte/qualitaet.gif") no-repeat -235px 0;
	/*
		bugfix: IE 5 / 5.5
	*/	}
		* html #layout-center #produkte-navi a {
		height:124px;
		he\ight:0;
}

#layout-center #produkte-navi #evaluation {
	width:228px;
	height:125px;
}

#layout-center #produkte-navi #evaluation a {
	position:absolute;
	left:307px;
	top:248px;
	width:228px;
	padding-top:125px;
	background:url("../_img/produkte/evaluation.gif") no-repeat -235px 0;
	/*
		bugfix: IE 5 / 5.5
	*/	}
		* html #layout-center #produkte-navi a {
		height:125px;
		he\ight:0;
}

#layout-center #produkte-navi #strategie {
	width:150px;
	height:150px;
}

#layout-center #produkte-navi #strategie a {
	position:absolute;
	left:0px;
	top:372px;
	width:150px;
	padding-top:150px;
	background:url("../_img/produkte/strategie.gif") no-repeat -155px 0;
	/*
		bugfix: IE 5 / 5.5
	*/	}
		* html #layout-center #produkte-navi a {
		height:150px;
		he\ight:0;
}

#layout-center #produkte-navi #projekte {
	width:145px;
	height:150px;
}

#layout-center #produkte-navi #projekte a {
	position:absolute;
	left:150px;
	top:372px;
	width:145px;
	padding-top:150px;
	background:url("../_img/produkte/projekte.gif") no-repeat -150px 0;
	/*
		bugfix: IE 5 / 5.5
	*/	}
		* html #layout-center #produkte-navi a {
		height:150px;
		he\ight:0;
}

#layout-center #produkte-navi #personal a:hover,
#layout-center #produkte-navi #organisation a:hover,
#layout-center #produkte-navi #qualitaet a:hover,
#layout-center #produkte-navi #evaluation a:hover,
#layout-center #produkte-navi #strategie a:hover,
#layout-center #produkte-navi #projekte a:hover {
	background-position:0 0;
}

#layout-center #produkte-navi strong {
	display:none;
}

/* Seite: Evaluation */
#layout-center .eval-navi {
	display:block;
	float:left;
	width:150px;
	margin-left:15px;
	overflow:hidden;
}

#layout-center .eval-navi.first {
	margin-left:0;
}

#layout-center .eval-navi h2.h3-style {
	font-size:0.95em;
}


#layout-center .eval-navi ul {
	margin:0.8em 0 0 0;
	padding:0;
	list-style:none;
}

#layout-center .eval-navi li {
	margin:0 0 18px 0;
	padding:0;
	background:none;
}

#layout-center .eval-navi li strong {
	display:block;
	width:149px;
	height:151px;
	background-repeat:no-repeat;
	background-position:left top;
}

#layout-center .eval-navi li#eva3-1 strong {
	background-image:url("../_img/evaluation/eva3-teilnehmer_on.gif");
}

#layout-center .eval-navi li#eva3-2 strong {
	background-image:url("../_img/evaluation/eva3-kursleiter_on.gif");
}

#layout-center .eval-navi li#eva3-3 strong {
	background-image:url("../_img/evaluation/eva3-benchm_on.gif");
}

#layout-center .eval-navi li#eva3job-1 strong {
	background-image:url("../_img/evaluation/job-teilnehmer_on.gif");
}

#layout-center .eval-navi li#eva3job-2 strong {
	background-image:url("../_img/evaluation/job-lerntransf_on.gif");
}

#layout-center .eval-navi li#eva3job-3 strong {
	background-image:url("../_img/evaluation/job-kundenspez_on.gif");
}

#layout-center .eval-navi li#eva3projekt-1 strong {
	background-image:url("../_img/evaluation/projekt-prozess_on.gif");
}

#layout-center .eval-navi li#eva3projekt-2 strong {
	background-image:url("../_img/evaluation/projekt-wirkung_on.gif");
}

#layout-center .eval-navi li#befr-1 strong {
	background-image:url("../_img/evaluation/mitarbeiterbefr_on.gif");
}

#layout-center .eval-navi li#befr-2 strong {
	background-image:url("../_img/evaluation/kundenbefr_on.gif");
}

#layout-center .eval-navi li#befr-3 strong {
	background-image:url("../_img/evaluation/befr-ontop_on.gif");
}

#layout-center .eval-navi a {
	display:block;
	width:149px;
	height:151px;
}

#layout-center .eval-navi img {
	width:100%;
	height:100%;
	border:0;
}

* html a:hover {
	visibility:visible;
}

#layout-center .eval-navi a:hover img {
	visibility:hidden;
}


/* Partner-Seite mit Logos */
.partnerlogo {
	margin-bottom:10px;
	padding:7px 7px 0 7px;
	border:1px solid #CCC;
}

.partnerlogo div {
	width:100%;
}

.partnerlogo img {
	float:left;
	display:block;
	margin-bottom:2px;
}

.partnerlogo h2 ,
.partnerlogo h3 {
	margin:0 0 0.2em 173px;
}

.partnerlogo p {
	margin:0 0 0.5em 173px;
}

/* Mitarbeiteruebersicht */
#layout-center ul.portraets {
	margin:0;
	padding:0;
	list-style:none;
}

#layout-center ul.portraets li {
	float:left;
	width:130px;
	margin:0.5em 0 2em 55px;
	padding:0;
	background:none;
}

#layout-center ul.portraets li.first {
	margin-left:0;
}

#layout-center ul.portraets li a {
	text-decoration:none;
}

#layout-center ul.portraets li a strong {
	font-weight:bold;
	font-size:0.95em;
	text-decoration:underline;
}

#layout-center ul.portraets li img {
	border:1px solid #CCC;
}

/* Mitarbeiterseite */
#layout-center .mitarbeiterseite img {
	float:left;
	width:113px;
	margin:0 20px 15px 0;
	/*
		bugfix: box model hack unterdrueckt nachfolgende Angaben fuer IE 5 / 5.5
	*/	voice-family: "\"}\"";
		voice-family: inherit;
	/*
		regulaere Werte fuer alle "normalen" Browser
	*/
	padding-bottom:250px;
	background:url("../_img/mitarbeiter-hintergrund.gif") no-repeat left bottom;
	} .empty {
}

/* Formular: Newsletternameldung */
#layout-center .infokuben {
	width:28em;
	padding:12px;
	background-color:#E5E5E5;
	/*
		bugfix: Firefox 1.5 / 2.0
	*/	overflow:hidden;
}

form .pflichtfeld {
	font-weight:bold;
	color:red;
}

form .form-personendaten,
form .form-postanschrift {
	margin:0 0 1.4em 0;
}

form .form-post-email {
	margin-bottom:1em;
}

form .form-personendaten p,
form .form-postanschrift p {
	margin-bottom:0.4em;
}

form .form-personendaten label,
form .form-postanschrift label {
	float:left;
	width:8em;
	margin:0.5em 3px 0 0;
	padding:0;
}

form .form-personendaten input,
form .form-postanschrift input {
	width:18em;
	margin:0.4em 0 0 0;
}

form .form-personendaten input,
form .form-personendaten select {
	margin-left:12px;
}

form .form-postanschrift input#form-plz {
	width:7em;
}


/**
 * Gestaltung rechte Spalte (dritte Spalte)
 */
#layout-right .seitenrand {
	margin-left:31px;
}

#layout-right .seitenanfang-plus-h1 {
	display:block;
	margin-top:3.2em;
}

#layout-right h2.seitenanfang {
	margin-top:0;
}


/* Startseite: Personenfotos, rechte Spalte */
#layout-right .portraets {
	width:100%;
	margin:0 0 30px 0;
	padding:0;
}

#layout-right .portraets .spalte-links {
	float:left;
	width:47%;
	display:block;
}

#layout-right .portraets .spalte-rechts {
	display:block;
	margin-left:54%;
}

#layout-right .portraets img {
	border:1px solid #CCC;
}

#layout-right .portraets a:hover {
	text-decoration:none;
	/*
		bugfix: IE6
	*/	background:white;
}

#layout-right .portraets a .text {
	display:block;
	position:absolute;
	top:-2000px;
	width:13em;
	padding:3px 3px 4px 3px;
	font-weight:normal;
	color:black;
	line-height:1.2em;
	background-color:#FFFFE1;
	border:1px solid black;
}

#layout-right .portraets a .text .linie {
	display:block;
	margin:5px 0;
	padding:0;
	border-top:1px solid #8D8D7C;
	border-left:1px solid #8D8D7C;
	border-bottom:1px solid white;
	background:none;
}

#layout-right .portraets a#img-niemeyer:hover .text {
	top:130px;
	left:35px;
}

#layout-right .portraets a#img-hendricks:hover .text {
	top:130px;
	right:15px;
}

#layout-right .portraets a#img-westhaus:hover .text {
	top:337px !important;
	left:35px;
	/*
		bugfix: IE 6
	*/	top:333px;
}

#layout-right .portraets a#img-laurion:hover .text {
	top:337px !important;
	right:15px;
	/*
		bugfix: IE 6
	*/	top:333px;	
}

#layout-right .portraets a#img-hollmann:hover .text {
	top:544px !important;
	left:35px;
	/*
		bugfix: IE 6
	*/	top:536px;	
}

#layout-right .portraets a#img-braun:hover .text {
	top:544px !important;
	right:15px;
	/*
		bugfix: IE 6
	*/	top:536px;	
}

#layout-right .portraets a#img-buitkamp:hover .text {
	top:751px !important;
	left:35px;
	/*
		bugfix: IE 6
	*/	top:739px;
}

#layout-right .portraets a#img-lehnort:hover .text {
	top:751px !important;
	right:15px;
	/*
		bugfix: IE 6
	*/	top:739px;
}

#layout-right .portraets a#img-wrede:hover .text {
	top:958px !important;
	left:35px;
	/*
		bugfix: IE 6
	*/	top:942px;
}


/* Kubus mit Spezialinfos */
#layout-right .infokuben {
	padding:15px 8px 8px 15px;
	background-color:#E5E5E5;
	/*
		bugfix: Firefox 1.5 / 2.0
	*/	overflow:hidden;
}

#layout-right .infokuben h2 {
	margin-top:0;
}

#layout-right .infokuben ul {
	margin-top:0.2em;
}