@charset "utf-8";

/****************************************
* Globale Definitionen					*
****************************************/
body { background: rgb(64, 64, 64); }
body#uid37 { background: rgb(255, 255, 255); }

.clear { clear: both; }
.legalText { font-size: .75em; }

/* Links */	
	/* interne Links */
	#text a {
		color: rgb(230, 0, 40);
		text-decoration: none;
	}
	#text a:visited { border-bottom: 1px dotted rgb(230, 0, 40); }
	#text a:hover { /* bitte leer lassen, wird von jQuery übernommen */ }
	
	#text div.csc-textpic-imagewrap a:visited { border: none; }
	
	/* extere Links */
	#text a.external-link-new-window .extIcon,
	#text a.external-link .extIcon {
		display: inline-block;
		background: url('../images/ext-link-icon.gif') no-repeat 0 0;
		
		width: 11px;
		height: 10px;
		
		margin: 0 0.15em -0.1em;
	}
	#text a.external-link-new-window:hover .extIcon,
	#text a.external-link:hover .extIcon { background-image: url('../images/ext-link-icon-hover.gif'); }
	
	/* E-Mail Link Protection (Spamblocker) */
	#text a.mail .spamProtect {
		display: inline-block;
		background: url('../images/at-substitute.gif') no-repeat 0 0;
		
		width: 11px;
		height: 12px;
		
		margin: 0 0.125em -0.2em 0.1em;
	}
	#text a.mail:hover .spamProtect { background-image: url('../images/at-substitute-hover.gif'); }
	
	/* Call to Action */
	#text a.ctaButton {
		display: inline-block;
		background: rgb(230, 0, 40);
		
		padding: 0 1em;
		
		color: rgb(255, 255, 255);
		line-height: 3em;
	}
	#text a.ctaButton:visited { border: none; }
	
/****************************************
* Typografie							*
****************************************/
/* Global */
body {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 100%;
	line-height: 1em;
}

.important { color: rgb(230, 0, 40); }

/* Überschriften */
h1 {
	background: url('../images/arrow.gif') no-repeat 0 1.65em;
	
	margin: 0 0 0 -1.5em;
	padding: 1.5em 0 1.25em 1.5em;
	
	color: rgb(128, 128, 128);
	font-size: 1.5em;
	line-height: 1em;
}

h2 {
	padding: 1.5em 0 1.25em;
	
	color: rgb(128, 128, 128);
	font-size: 1.25em;
	line-height: 1em;
}
p + h2 { padding: 3em 0 1.5em; }
h1 + h2 { padding: 0 0 1.25em; }

h3 {
	padding: 1.5em 0 1.25em;
	
	color: rgb(128, 128, 128);
	font-size: 1em;
	line-height: 1em;
}
h2 + h3 { padding: 0 0 1.25em; }

h4 {
	padding: 1.5em 0 1.25em;
	
	color: rgb(128, 128, 128);
	font-size: 0.75em;
	line-height: 1em;
}
h3 + h4 { padding: 0 0 1.25em; }

/* Absätze */
p {}
p + p,
p + ul, ul + p,
p + table, table + p { margin: 1.5em 0 0; }

/* Ungeordnete Listen */
#text ul {}
	#text ul li {
		margin: 0 0 0 1.5em;
		list-style-type: disc;
		list-style-position: outside;
	}
		#text ul li ul { background: none; }
			#text ul li ul li {}
				#text ul li ul li a { color: rgb(76, 76, 76); }
				#text ul li ul li a:visited { border-color: rgb(76, 76, 76); }

/* Geordnete Listen */
#text ol {
	padding: 1.5em 0 0 0;
	list-style-type: upper-roman;
}
	#text ol li { padding: 1.5em 0 0 0; }
	#text ol.inhalt li { padding: 0.25em 0 0 0; }
		#text ol li ol {
			padding: 0 0 1.5em 1.5em;
			list-style-type: lower-latin;
		}

/* Tabellen */
table tr td { padding: 0 3em 0 0; }
	

/****************************************
* IDs / Klassen							*
****************************************/
/********************
* Hauptcontainer	*
********************/
#mainBackground {
	background: rgb(255, 255, 255) url('../images/main-background.jpg') no-repeat center bottom;
	
	width: 960px;
	min-height: 820px;
	height: auto !important;
	height: 820px;
	
	margin: 0 auto 100px;
	
	color: rgb(76, 76, 76);
	font-size: 0.75em;
	line-height: 1.5em;
	
	position: relative;
	
	box-shadow: 2px 2px 10px rgba(0, 0, 0, .35);
	-moz-box-shadow: 2px 2px 10px rgba(0, 0, 0, .35);
	-webkit-box-shadow: 2px 2px 10px rgba(0, 0, 0, .35);
	-khtml-box-shadow: 2px 2px 10px rgba(0, 0, 0, .35);
}


	/********************
	* Header			*
	********************/
	#header {
		width: 960px;
		height: 120px;
	}
	
		/* Text Team Logo */
		#logo {
			display: inline;
			
			width: 240px;
			height: 70px;
				

			margin: 50px 0 0 50px;
			
			float: left;
		}
			#logo a {
				display: inline;	/* "display: inline;" um IE6 Positionsfehler (doppelte margin links/rechts) durch "float: right;" zu umgehen */
				background: url('../images/logo.gif') no-repeat 0 0;
				
				width: 240px;
				height: 70px;
				
				float: left;
			}
				#logo a span { display: none; }
	
		/* Navigation */
		#navigation {
			width: 610px;
			height: 30px;
			
			margin: 82px 60px 0 0;
			
			text-align:right;
			
			float: right;
		}
		
			#navigation ul {
				display: inline;
				/*margin: 0 60px 0 0;*/
				float: right;
			}
				#navigation ul li {
					display: inline;
					border-left: 1px solid rgb(220, 220, 220);
					float: left;
				}
				#navigation ul li:last-child { border-right: 1px solid rgb(220, 220, 220); }
					#navigation ul li a {
						display: inline;
						background: none;
						
						height: 30px;
						
						padding: 0 20px 0 10px;
						
						color: rgb(115, 115, 115);
						font-size: 12px;
						letter-spacing: 1px;
						line-height: 30px;
						text-decoration: none;
						text-transform: uppercase;
						
						float: left;
					}
					#navigation ul li.active a {
						background: rgb(230, 0, 40);
						
						padding: 0 15px;
						
						color: rgb(255, 255, 255);
						
						border: none;
						
						position: relative;
						top: 38px;
						
						z-index: 100;
					}
					/* wird durch jQuery animiert
					 * ... auskommentiert da sonst die Animation beim
					 * ersten Überfahren nicht ordentlich funktioniert
					#navigation ul li a:hover {
						background: rgb(230, 0, 40);
						color: rgb(255, 255, 255);
					}
					*/
					
					
	/********************
	* Inhalt			*
	********************/
	#content {
		display: inline;
		background: url('../images/ie-content-background.png') repeat 0 0;
		background: rgba(255, 255, 255, .85);
		
		width: 420px;
		
		margin: 0 60px 0 0;
		padding: 300px 60px 60px 120px;
		
		position: relative;
		float: right;
				
		box-shadow: 2px 3px 5px rgba(0, 0, 0, .15);
		-moz-box-shadow: 2px 3px 5px rgba(0, 0, 0, .15);
		-webkit-box-shadow: 2px 3px 5px rgba(0, 0, 0, .15);
		-khtml-box-shadow: 2px 3px 5px rgba(0, 0, 0, .15);
	}
	#start #content { padding: 90px 60px 60px 120px; }
		
		/* Metabilder */
		#content #metaImage {
			width: 580px;
			height: 210px;
			
			position: absolute;
			top: 40px;
			left: 10px;
		}
		
		/* Subnavigation */
		#content #subNavigation {
			background: rgb(220, 220, 220);
			
			width: 580px;
			height: 30px;
			
			position: absolute;
			top: 253px;
			left: 10px;
		}
			#content #subNavigation ul {
				margin: 0 0 0 90px;
			}
				#content #subNavigation ul li {
					display: inline;
					float: left;
				}
					#content #subNavigation ul li a {
						display: block;
						
						height: 30px;
						
						padding: 0 20px;
						
						color: rgb(90, 90, 90);
						font-weight: bold;
						line-height: 2.5em;
						text-decoration: none;
						
						float: left;
					}
					#content #subNavigation ul li.active a { color: rgb(230, 0, 40); }
					/* wird durch jQuery animiert
					 * ... auskommentiert da sonst die Animation beim
					 * ersten Überfahren nicht ordentlich funktioniert
					#content #subNavigation ul li a:hover {
						background: rgb(230, 230, 230);
					}
					*/
	
	/* MPO Präsentation */
	#mpoWrapper {}
		#mpoWrapper #showmpo,
		#mpoWrapper #showmpo img,
		#mpoWrapper #abstract,
		#mpoWrapper #controls {
			width: 750px;
			height: auto;
			text-align: center;
		}
		#mpoWrapper #showmpo img { display: none; }
		#mpoWrapper #abstract { height: 70px; }
	
	/********************
	* Neuigkeiten		*
	********************/
	#news {
		position: absolute;
		top: 240px;
		left: 120px;
	}
	#start #news { top: 180px; }
	
	
	/********************
	* Anfrage			*
	********************/
	#contact {
		width: 120px;
		
		position: absolute;
		top: 510px;
		left: 130px;
	}
	#start #contact { top: 450px; }
		
		#contact a {
			display: inline;
			background: rgb(230, 0, 40);
			
			padding: 0 15px;
			
			color: rgb(255, 255, 255);
			font-size: 1.08333em;
			letter-spacing: 0.05em;
			line-height: 2.5em;
			text-transform: uppercase;
			text-decoration: none;
			
			float: left;
		}
		/* wird durch jQuery animiert
		* ... auskommentiert da sonst die Animation beim
		* ersten Überfahren nicht ordentlich funktioniert
		#contact a:hover {
			background: rgb(255, 255, 255);
			color: rgb(115, 115, 115);
		}
		*/
	
	
	/********************
	* Fußleiste			*
	********************/
	#footer {}
		#footer ul {
			display: inline;
			margin: 5px 75px 20px 0;
			float: right;
		}
			#footer ul li {
				display: inline;
				background: url('../images/white-pixel.gif') no-repeat right center;
				
				margin: 0 10px 0 0;
				padding: 0 10px 0 0;
				
				float: left;
			}
			#footer ul li:last-child {
				background: none;
				margin: 0;
				padding: 0;	
			}
				#footer ul li a {
					color: rgb(255, 255, 255);
					text-decoration: none;
				}
				#footer ul li a:hover { border-bottom: 1px solid rgb(255, 255, 255); }
				

/****************************************
* TYPO3 Plugins							*
****************************************/
/********************
* tt_content		*
********************/
#uid8 div.csc-textpic-intext-right-nowrap div.csc-textpic-imagewrap,
#uid15 div.csc-textpic-intext-right div.csc-textpic-imagewrap { margin-top: 4.5em; }
#uid14 div.csc-textpic-intext-right div.csc-textpic-imagewrap,
#uid14 div.csc-textpic-intext-right-nowrap div.csc-textpic-imagewrap { margin-top: 1.5em; }

.csc-frame-frame1 { padding: 0 0 3em; margin: 0 0 3em; border-bottom: 1px solid rgb(128, 128, 128); }
.csc-frame-frame2 { padding: 0 0 3em; margin: 0 0 1.5em; border-bottom: 1px solid rgb(128, 128, 128); }

/********************
* tt_news			*
********************/
.news-list-item,
.news-list-item:first-child {
	padding: 0 0 20px;
	border-bottom: 1px solid rgb(220, 220, 220);
}
.news-list-item { padding: 20px 0; }
.news-list-item:last-child { border: none; }

.news-single-img {
	margin: 0;
	padding: 0;
	
	position: absolute;
	top: 40px;
	left: 10px;
	float: none;
}
.news-single-imgcaption { display: none; }

.news-list-date { float: left; padding: 0; }

/********************
* powermail			*
********************/
.tx-powermail-pi1 {}
	.tx-powermail-pi1 legend { display: none; }
	.tx-powermail-pi1 label {
		display: inline;
		
		width: 100px;
		height: 2em;
		
		line-height: 2em;
		
		float: left;
	}
	.tx-powermail-pi1 select,
	.tx-powermail-pi1 input,
	.tx-powermail-pi1 textarea {
		display: inline;
		
		padding: 0.25em;
		
		color: rgb(64, 64, 64);
		font-family: inherit;
		font-size: inherit;
		
		border: 1px solid rgb(220, 220, 220);
		
		float: left;
	}
	.tx-powermail-pi1 select { width: auto; }
	.tx-powermail-pi1 input { width: 180px; }
	.tx-powermail-pi1 textarea { width: 300px; height: 7.5em; overflow: auto; }
		.tx-powermail-pi1 .tx_powermail_pi1_fieldwrap_html {
			width: 100%;
			height: 2em;
			
			margin: 1.5em 0;
			
			clear: both;
		}
		.tx-powermail-pi1 .tx_powermail_pi1_fieldwrap_html_textarea { height: 8em; }
		.tx-powermail-pi1 .tx_powermail_pi1_fieldwrap_html_submit input,
		.tx-powermail-pi1_mandatory input {	
			display: inline;
			background: rgb(230, 0, 40);
			
			width: auto;
			height: 2.5em;
			
			margin: 0 0 0 100px;
			padding: 0 15px;
			
			color: rgb(255, 255, 255);
			font-size: 1.08333em;
			letter-spacing: 0.05em;
			line-height: 2.5em;
			text-transform: uppercase;
			text-decoration: none;
			
			border: none;
			
			cursor: pointer;
			
			float: left;
		}
		.tx-powermail-pi1_mandatory input { margin: 0; }
		
.powermail_mandatory_list {
	margin: 1.5em 0;
}