/* LIVE SYSTEM scienceface.org */

* {
margin: 0;
padding: 0;
border: 0;

}

html,
body{
/* height:100%; */
padding:0;
margin:0;

}


body {
color: #ccc;
font-family: Verdana, Arial;
font-size: 0.8em;
background: #013 url(../pix/pageback4.jpg) 50% 0% no-repeat;
}


#content{
height:100%;
}



/* BREITEN */

#contentlinks,
.maincol,
#fuss{
/* width: 950px; */
width: 82em; 
width: 900px;
margin: 0 auto;
}


#display-bottom{
overflow:auto;
}


.maincol{
border: #69f 0px solid;
}


.innermaincol{
border: #090 0px solid;
width:95%;
margin: 0 auto;
}


#divider{
height:25px;
clear:both;
border-top: #cc0 1px solid;
border-bottom: #cc0 0px solid;
}


/* TYPOGRAFIE */
h1,
h3,
h4,
h5,
p{
padding: 0 0 0 0;
margin: 0 0 10px 0;
}


ul{
font-size:90%;
margin: 0 0 20px 20px;
}

strong{
color: #ddd;
}

a:link { color: #cc0; text-decoration: none; }
a:visited { color: #cc0; text-decoration: none; }
a:active { color: #fff; text-decoration: none; }
a:hover { color: #fff; text-decoration: underline; }


.vorschaubild{
height:60px;
width:100px;
margin:5px;
float:left;
border: #f00 0px solid;
}



#startmediadisplay{
height:270px;
float:left;
clear:left;
border: #f00 0px solid;
width:320px;
}




#startmediadisplay img{
margin: 0 10px;
}

#startmediadisplay img.logo-left{
width:53px;
float:left;
}

#startmediadisplay img.logo-right{
width:210px;
float:right;
}

	
	

#starttext,
#contenttext{
float:right;
clear:right;
width:59%;
border: #f00 0px solid;

}

#contenttext{
margin: 30px 0;
}


.vorschau{
width:200px;
height:113px;
}


	#logoarea,
	#logoarea #logo,
	#logoarea #contenttitle{
	
	height:70px;
	}

	#logoarea{
	background: url(../pix/scienceface_logo.png) 0 100% no-repeat;
	}

		#logoarea #logo{
		width: 400px;
		float:left;
		clear:left;
		}
		
		#logoarea #logo img{
		width: 400px;
		height:60px;
		}		

	#contenttitle{
	border: #f00 0px solid;
	width:400px;
	float:right;
	clear:right;
	}
	
		#contenttitle h2{
		margin:10px 0 0 0;
		}

		#contenttitle h2 span.cliptitle{
		float:right;
		clear:right;
		font-size: 110%;
		color: #eee;
		font-style:italic;
		font-weight:normal;
		text-align:right;
		border: #f00 0px solid;
		display:block;
		font-family: condensed, sans-serif;
		}
		
		#contenttitle h2 span.clipauthor{
		font-style:italic;
		font-size: 60%;
		color: #999;
		float:right;
		clear:right;
		display:block;
		font-weight:normal;
		padding: 10px 20px 0 0; 
		}

		#starthead{
		border: #f00 0px solid;
		height:40px;
		}


	#upperdisplay{
	border: #f00 0px solid;
	}


	#upperdisplay h2{
	color:#EEEEEE;
	font-family:"Arial narrow",sans-serif;
	font-style:italic;
	font-weight:normal;
	margin:-10px 0 10px;
	text-align:right;
	}


	#divider h2{
	color:#EEEEEE;
	font-family:"Arial narrow",sans-serif;
	font-style:italic;
	font-weight:normal;
	margin:0 0 10px 0;
	float:right;
	font-size:160%;
	}


	
	#upperdisplay h3{
	border:0 solid #FF0000;
	clear:right;
	color:#CCCCCC;
	float:right;
	font-size:100%;
	font-style:italic;
	font-weight:normal;
	margin:0 0 20px;
	padding:0 20px 0 0;
	text-align:right;
	width:40%;
	}

		
		#ajaxcontent{
		/* width: 500px; */
		border: #f00 0px solid;
		margin:30px auto;
		}

		#ajaxcontent h3,
		#contenttext h3,
		#starttext h3{
		font-size: 170%;
		font-style:italic;
		color: #eee;
		float:right;
		font-weight:normal;
		margin: -10px -140px 30px 20px;
		font-family:"Arial narrow",sans-serif;
		display:none;
		}
		
		
		
		

		#ajaxcontent h4,
		#contenttext h4{
		font-size: 120%;
		font-style:italic;
		color: #ccc;
		font-weight:normal;
		margin:0 0 20px;
		}
		
		#ajaxcontent h5,
		#contenttext h5{
		font-size: 100%;
		color: #fff;
		margin:15px 0 5px;
		}

		
		#upperdisplay p,
		#ajaxcontent p,
		#contenttext p{
		line-height:140%;
		color: #bbb;
		margin:0 0 10px 0;
		}
		
		
		
		
		
			
		#upperdisplay #starttext p {
		margin:10px 0 0;
		}
			
			
			
		#ajaxcontent p,
		#contenttext p{
		font-size:100%;
		line-height:160%;
		}
		

		
		#ajaxcontent a:link { color: #990; text-decoration: none; }
		#ajaxcontent a:visited { color: #990; text-decoration: none; }
		#ajaxcontent a:active { color: #fff; text-decoration: none; }
		#ajaxcontent a:hover { color: #fff; text-decoration: underline; }


		
		#ajaxcontent .img2left,
		#contenttext .img2left{
		margin:5px 20px 15px 0;
		float:left;
		border-right: #333 1px solid;
		background: url(../pix/img2left_back.png) repeat-y;
		}
		
		
		#ajaxcontent .img2right,
		#contenttext .img2right{
		margin:5px -50px 15px 20px;
		float:right;
		border-left: #333 1px solid;
		background: url(../pix/img2right_back.png) repeat-y;
		}
		
		
		#ajaxcontent .img2right img,
		#ajaxcontent .img2left img{
		clear:both;
		}
		
		#ajaxcontent .img2right p,
		#ajaxcontent .img2left p,
		#contenttext  .img2right p,
		#contenttext .img2left p{
		font-size:80%;
		font-style:italic;
		margin: 0.3em 0.8em;
		color: #fff;
		}
		
		#ajaxcontent .attachments{
		
		width:60%;
		float:left;
		clear:left;
		border: #333 0px solid;
		margin:10px 0 0 0;
		background: url(../pix/img2right_back.png) repeat-y;
		}
			
		#ajaxcontent .attachments ul{
		border: #333 0px solid;
		margin:0px 0 0 10px;
		}	
		
		#ajaxcontent .attachments ul li{
		list-style-type:none;
		border: #333 0px solid;
		margin:15px 0 0 0;
		color: #666633;
		}		
		
		#ajaxcontent .attachments ul li a{
		
		}		
		
		#ajaxcontent ul,
		#contenttext ul{
		margin:0 0 20px 25px;
		}	
		
		#ajaxcontent ul li,
		#contenttext ul li{
		margin:0 0 5px 0;
		
		

		}	
		
		
		
		#ajaxcontent .displaytop{
		margin:10px 0 0 0;
		clear:both;
		border-top: #333 1px solid;
		font-size:80%;
		}
		
		#ajaxcontent .displaytop p{
		text-align:right;
		padding:10px 0 2em;
		}	





		#mediaplayer{
		margin: 0 auto;
		border-left:#666 0px solid;
		border-top:#666 0px solid;
		border-right:#333 0px solid;
		border-bottom:#333 0px solid;
		}
		
		#mediaplayer-start{
		background: url(../pix/mediaplayer-start_back.png);
		width: 300px;
		height:178px;
		margin: 5px auto;
		padding:10px;
		border:#f00 0px solid;
		}		
		
		
		#mediaplayer-clip{
		background: url(../styles/mediaplayer-clip_back.gif);
		width: 540px;
		height:297px;
		float:left;
		padding:10px;
		border:#f00 0px solid;
		}
		
		
		
		#medialinks-left,
		#medialinks-right{
		width: 130px;
		margin: 0;
		border:#f00 0px solid;
		}
		
		#medialinks-left .docsize,
		#medialinks-right .docsize{
		font-style:italic;
		font-size: 80%;
		color: #666;
		}	
		
		
		
		

		
		#medialinks-left{
		float:left;
		
		}
		
		#medialinks-right{
		float:right;
		}		
		
		.medialinks{
		margin: 0 0 20px 0;
		}
		
		.format-mov,
		.format-mpg,
		.format-wmv,
		.format-ytube{
		height: 36px;
		width:130px;		
		float:right;
		border:#393 0px solid;
		}
		
		.format-mov img,
		.format-mpg img,
		.format-wmv img,
		.format-ytube img{
		width:130px;
		height: 36px;		
		border:#393 0px solid;
		}		
		
		.format-mov a,
		.format-mpg a,
		.format-wmv a,
		.format-ytube a{
		display:block;
		}
		
		
		
		.format-mov{
		background: url(../pix/medialink_mov.png) 0 0% no-repeat;
		}
		.format-mov a:hover{
		background: url(../pix/medialink_mov.png) 0% 100% no-repeat;
		}
		
		
		
		.format-wmv{
		background: url(../pix/medialink_wmv.png) 0 0 no-repeat;
		}		
		.format-wmv a:hover{
		background: url(../pix/medialink_wmv.png) 0 100% no-repeat;
		}
		
		
		
		.format-mpg{
		background: url(../pix/medialink_mpg.png) 0 0 no-repeat;
		}
		.format-mpg a:hover{
		background: url(../pix/medialink_mpg.png) 0 100% no-repeat;
		}		
			
			
				
		.format-ytube{
		background: url(../pix/medialink_ytube.png) 0 0 no-repeat;
		}
		.format-ytube a:hover{
		background: url(../pix/medialink_ytube.png) 0 100% no-repeat;
		}		
		

	#nowrap{display:block}



	#prevclip,
	#nextclip,
	#home{
	width:25px;
	border: #fff 0px solid;
	}

	#prevclip,
	#home{
	float:left;
	clear:left;
	}

	#nextclip{
	float:right;
	clear:right;
	}
	
	#nextclip img,
	#prevclip img{
	width:25px;
	height:50px;
	border: #fff 0px solid;
	}	
	
	
	


	#prevclip a,
	#nextclip a{
	display:block;
	width:25px;
	height:50px;
	margin: 10px auto 0;
	overflow:hidden;
	}	

	
	#prevclip a{
	background: url(../pix/button_pevious.png) -25px 0 no-repeat;
	}	
	
	#nextclip a{
	background: url(../pix/button_next.png) -25px 0 no-repeat;
	}	
	
	#prevclip a:hover{
	background: url(../pix/button_pevious.png) 0 0 no-repeat;
	}	
	
	#nextclip a:hover{
	background: url(../pix/button_next.png) 0 0 no-repeat;
	}	
	


/* STARTSEITE VIDEOÜBERSICHT */

















.listenelement{
font-size:80%;
width:33%;
float:left;
text-align:left;
border: #f00 0px solid;
margin: 10px 0 20px 0;
}


hr{
clear:both;
border: #f00 1px solid;
}

.listenelement .vorschaubildrahmen{
margin: 0 5px 2px 0;
border: #f00 0px solid;
float:left;
width:110px;
height:70px;
background: url(../pix/vorschauback.png) 0% 0% no-repeat;
}

.listenelement .vorschauback{
margin: 5px;
width:100px;
height:60px;
}


.listenelement .vorschauback img{
width:100px;
height:60px;
border: #f00 0px solid;
}

.listenelement .vorschauback a:hover img{
width:100px;
height:60px;
border: #f00 0px solid;
background: url(../pix/vorschaudimmer.png) 0% 0% no-repeat;
}



.listenelement .CollapsiblePanel {
margin: 0px;
padding: 0px;
border-left: solid 0px #CCC;
border-right: solid 0px #999;
border-top: solid 0px #999;
border-bottom: solid 0px #CCC;
background: url(../pix/listenelementback.png) repeat-y 100% 0;
}


.listenelement .CollapsiblePanelContent{
padding: 0 10px;
margin: 0px;
}



.listenelement .CollapsiblePanelTab {
margin: 0px;
padding: 2px;
cursor: pointer;
}

.listenelement .CollapsiblePanelTab a {
	color: black;
	text-decoration: none;
}


.CollapsiblePanelTabHover,  .CollapsiblePanelOpen .CollapsiblePanelTabHover {
background: url(../pix/listenelementback_a_hover.png) no-repeat 100% 0;
}

.CollapsiblePanelFocused .CollapsiblePanelTab {
background: url(../pix/listenelementback_a_hover.png) no-repeat 100% 0;
}







.listenelement .CollapsiblePanelTab h4{
/* width:96%; */
font-size:90%;
border: #f00 0px solid;
color: #fff;
padding:5px 10px 0 0;
text-transform:uppercase;
font-weight:normal;
margin: 0 0 0 0;
}

.listenelement .CollapsiblePanelContent p{
padding: 5px 0 0 0;
color: #fff;
margin:0;
}


.listenelement .CollapsiblePanelContent p a{
display:block;
text-align:center;
padding: 5px 0 0 0;
}










.listenelement .CollapsiblePanelContent p a:hover{
background: url(../pix/listenelementback_a_hover.png) no-repeat -32px 0%;
}

/* / STARTSEITE VIDEOÜBERSICHT */




/* NAVIGATIONSBALKEN */


	#divider .innermaincol ul{
	margin: 0;
	padding: 5px 0 0 0; 
	}
	
	#divider .innermaincol ul li{
	list-style-type:none;
	float:left;
	white-space:nowrap;
	margin: 0 30px 0 0;
	height:30px;
	}

	#divider .innermaincol ul li a{
	padding:5px;
	}
	
	#divider .innermaincol ul li a{
	
	}
	
	
	#divider .innermaincol ul li a:hover{
	background: url(../pix/divider_linkback.png);
	color: #000;
	}	
	
	#divider .innermaincol ul li b{
	font-weight:normal;
	}	
	
	
	
	#home img{
	width:25px;
	height:25px;
	}	
	
	
	#home a{
	width:30px;
	float:left;
	border: #f00 0px solid;
	background: url(../pix/overview.png) 25% 0%;
	
	}	
	
	#home a:hover{
	background: url(../pix/overview_o.png) 25% 0%;
	}
	
	
	
	
	#divider .jsnote{
	border:0 solid #FF0000;
	clear:right;
	color:#EEEEEE;
	display:block;
	float:right;
	font-family:"Arial narrow",condensed,sans-serif;
	font-size:190%;
	font-style:italic;
	font-weight:normal;
	text-align:right; 
	}	
	
	
	
	
	

/* / NAVIGATIONSBALKEN */







html > body .ende{
background: url(../pix/collapsibleContentback.png) 100% 100% no-repeat; 
height:10px;
}

.listenelement p{
padding:0;
margin: 5px 0;
border: #f00 0px solid;
color:#fff;
}



.break{
clear:both;
}


/*
#fuss{
border-top: #333 1px solid;
position:absolute;
bottom:0;
left:0;
height:5%;
height:30px;
width:100%;
background: #000;
color: #666;
}
*/

#fuss{
border-bottom: #333 1px solid;
height:30px;
width:100%;
background: #000;
color: #666;

}



#fuss p{
font-size: 85%;
list-style-type: none;
border: #ff0 0px solid;
padding:5px 0;
}


#fuss p a{
margin: 0 10px 0 0;
padding:3px;
}


#fuss p a:hover{
background: #cc0;
color: #000;
}

.fussnav-links{
width:30%;
float:left;
clear:left;
}

.fussnav-rechts{
width:69%;
float:right;
clear:right;
text-align:right;
}

.pdflink{
margin:5px 0;
border: #f00 0px solid;
background: url(../pix/docicon_pdf.gif) 0 0 no-repeat;
padding: 3px 0 3px 20px;
}