/* -------------------------------------------------------------------- */
/* style sheets für www.traumfabrik.de, 2009-2011						*/
/* realisation and author: michael schulze, www.ju-mi.com  				*/
/* -------------------------------------------------------------------- */

/* -------------------------------------------------------------------- */
/* globale Einstellungen */
	
	body, html {
		margin: 0px;
		padding: 0px;
		background: #000000;
		height: 100%;
	}
	
	
/* -------------------------------------------------------------------- */		
/* Schriftklassen */
	
	body {
		font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
		color: #FFFFFF;
		font-weight: normal;
		font-style: normal;
		font-size: 11px;
		line-height: 16px;
	}
	
	
	/* allgemeine Linkdarstellung */
		a {
			color: #9c9a9a;
			text-decoration: none;
		}
		
		a:hover {
			color: #FFFFFF;
		}
		

	/* Headlines */
		h1 {
		
		}
		
		
		h3 {
			font-size: 11px;
			line-height: 16px;
			font-weight: bold;
			padding: 0px;
			margin: 0px;
		}
		
	
	/* Hervorhebungen */
		.blau 	{ color: #99ACD7; }
		.gelb	{ color: #ECB735; }
		.rot	{ color: #C9633F; }
		.gruen	{ color: #368884; }
	
	
	/* Paragraphen */
		p 		{ margin: 0px 0px 16px 0px; }
		.halb	{ margin: 0px 0px 8px 0px; }
		
	/* Formulare */
		form { margin: 0px; }
		
		input, textarea {
			padding: 0px;
			margin: 0px;
			color: #FFFFFF;
		}
		
	
/* -------------------------------------------------------------------- */
/* Seitenaufbau */

	/* allgemeiner Seitenaufbau -------------------------------------- */
		
		#container {
			position: relative;
			top: 50%;	
			height: 626px;
			width: 1000px;
			margin: auto;	
			margin-top: -323px;
		}
		
		.clearer {
			clear: both;
		}
		
		
		
	/* Navigation  ---------------------------------------------------- */
		
		.navigation {
			position: absolute;
			top: 548px;
			left: 150px;
			color: #FFFFFF;
			z-index: 10;
		}
		
		.navigation a, .navigation span {
			display: block;
			float: left;
			padding-right: 18px;	
			line-height: 80px;		
		}
		
		.navigation a {
			color: #999999;
		}
		
		.navigation a:hover {
			color: #FFFFFF;
		}
		
					
	/* Inhaltsbereich -------------------------------------------------- */
			
		
			
				
		
			
	/* seitenspezifische Objekte --------------------------------------- */
		
		/* Home */
			/* Spots */
				#startspot {
					position: absolute;
					top: 159px;
					left: 280px;	
					z-index: 3;			
				}
				
				#spotReset {
					height: 10px;
					clear: both;
				}
				
				.navspot { 
					position: absolute;
					top: 159px;
					left: 116px;
					opacity: 0;
					-moz-opacity: 0;
					-khtml-opacity: 0;
					filter: alpha(opacity=0);
					z-index: 2;
				}
				
			/* Specials-Video */
				#startvideobutton {
					position: absolute;
					display: block;
					top: 300px;
					left: 20px;
					z-index: 100;
					text-align: center;
				}
				#startvideo {
					position: absolute;
					left: 200px;
					top: 170px;
					z-index: 20;
					display: none;
				}
				
			/* Aktuelles-Box */
				.aktuellBox {
					position: relative;
					top: 80px;
					left: 0px;
					width: 169px;
					background: url(../tf-re_bilder/tf_start_aktBox_unten.jpg) no-repeat left bottom;
					padding-bottom: 4px;
					font-size: 10px;
					line-height: 13px;
					z-index: 10;
				}
				
				.aktuellBox a {
					display: block;
					background: url(../tf-re_bilder/tf_start_aktBox_back.jpg) repeat-y;
					padding: 3px 0px 3px 25px;
					color: #ecb735;
				}
				
				.aktuellBox a:hover { color: #FFFFFF; }
				#aktFirst {	padding-top: 8px; }
				#aktLast { padding-bottom: 8px; }
				
				.aktuellTitle {
					background: url(../tf-re_bilder/tf_start_aktBox_oben.jpg) no-repeat;
					padding-left: 25px;
					line-height: 18px;
					color: #000000;
				}
				
			/* Button-Specials */ 
				#ticketbutton {
					position: absolute;
					z-index: 9;
					top: 230px;
					left: 50px;
					border: none;
				}
				
				#faustbutton {
					position: absolute;
					z-index: 9;
					top: 343px;
					left: 50px;
					border: none;
				}
				
			/* Ticker */
				#ticker {
					position: absolute;
					top: 110px;
					left: 170px;
					z-index: 9;
				}
				
				#tfadeleft {
					position: absolute;
					left: 0px;
					z-index: 10;
				}
				
				#tfaderight {
					position: absolute;
					right: 0px;
					z-index: 10;
				}
				
				
			/* Referenzen-Box */
				.refBox {
					position: absolute;
					top: 80px;
					right: 0px;
					width: 149px;
					background: url(../tf-re_bilder/tf_start_refBox_back.jpg) repeat-y;
					font-size: 10px;
					line-height: 18px;
				}
				
				.refBox a {
					display: block;
					border-bottom: solid 1px #000000;
					padding-left: 20px;
					margin-left: 1px;
					color: #909090;
				}
				
				.refBox a:hover, #refLast:hover {
					background: url(../tf-re_bilder/tf_start_refBox_high.gif) no-repeat 5px top;
					color: #FFFFFF;
				}
				
				#refLast { border: none; }
				
				#refTop {
					margin-left: 0px;
					padding: 10px 0px 0px 21px;
					background: url(../tf-re_bilder/tf_start_refBox_oben.jpg) no-repeat;
				}
				
				#refBottom {
					margin-left: 0px;
					padding: 0px 0px 10px 21px;
					background: url(../tf-re_bilder/tf_start_refBox_unten.jpg) no-repeat left bottom;
				}
								
				
			/* Referenzen Detail-Box */
				#refDetBox {
					position: absolute;
					left: 280px;
					top: 208px;
					width: 423px;
					display: none;
					z-index: 10;
					padding: 18px 0px 10px 0px;
					background: url(../tf-re_bilder/tf_start_refDet_back.jpg) no-repeat;
				}
				
				#refDetBottom 	{ position: absolute; bottom: 0px; }				
				
				.refLogo {
					display: none;
					float: left;
					width: 130px;
					height: 120px;
					margin-top: 3px;
					background-repeat: no-repeat;
					background-position: center top;
				}
				
				.refDet	{ 
					float: right;
					width: 276px;
					padding-right: 10px;
					display: none; 
				}
				
				.txtOnly {
					width: 380px;
				}
				
				
			/* Lightbox ---------------------------------------------- */
	
			#lightBox {
				position: fixed;
				top: 0px;
				left: 0px;
				right: 0px;
				bottom: 0px;
				height: 100%;
				z-index: 200;
				background-color: #000000; 
				filter: alpha(opacity=80); 
				-moz-opacity: 0.8; 
				opacity: 0.8;
				display: none;
			}
			
			#lightBoxContainer {
				position: fixed;
				top: 200px;
				left: 0px;
				width: 100%;
				z-index: 201;
			}
			
			#zoomcontainer {
				position: relative;
				top: 0px;
				width: 700px;
				display: none;
				background: #000000;
			}
			
			#zoombild 	{ display: none; border: none; }
			#zoomclose	{ 
				position: absolute; 
				top: 0px; 
				right: 0px; 
				border: none;
				filter: alpha(opacity=50); 
				-moz-opacity: 0.5; 
				opacity: 0.5;
			}
			
			#zoomclose:hover {
				filter: alpha(opacity=100); 
				-moz-opacity: 1; 
				opacity: 1;
			}	
			
			/* Bildergalerie ---------------------------------------------- */
			
			.bildergalerie {
				margin: 0px 0px 0px 20px;
			}
			
			.galimage {
				display: block;
				float: left;
				width: 100px;
				height: 100px;
				overflow: hidden;
				margin: 0px 10px 10px 0px;
				border: 1px solid #ffffff;
			}
			
			#galclose {
				display: block;
				margin: 50px 0px 20px 20px;
			}