/* 

	WebLab Section CSS
	
*/


.section {
	width:100%;
	

	
	position:absolute;
	top:0px;
	left:0px;

	text-align:center;

	color:#5C6665;

	background: rgb(217,219,219);
	 /* @alternate */ background: -moz-linear-gradient(top, rgba(240,242,242,1) 0%, rgba(217,219,219,1) 100%);
	 /* @alternate */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(240,242,242,1)), color-stop(100%,rgba(217,219,219,1)));
	 /* @alternate */ background: linear-gradient(top, rgba(240,242,242,1) 0%,rgba(217,219,219,1) 100%);
	background-attachment: fixed;
}

.section.scrollSection {
	
}

/* Bugfix for chrome rendering quirks */
/* If viewport has uneven height */
.vpUw .section {
	margin-left:-1px;
	padding-right:1px;	
}

.vpUh .section.fitSection {
	margin-top:-1px;
	padding-bottom: 1px;
}

@media (min-height:580px) {
	.section.scrollSection {
		min-height: 100%;
	}
}



.section.fitSection {
	height: 100%;
}

#sectionBackground {
	width:100%;
	height:100%;
	position: absolute;
	top:0px;
	left:0px;	

	opacity:0;
}


/* Experiment Pages */
#sectionContentHolder {
	width:100%;
}

.section.fitSection #sectionContentHolder {
	position:absolute;
	left:0px;
	top:0px;
	height:100%;
	
	/*background-color:#FF0000;*/
}


#sectionContentHolder #sectionCenteredContent {
	width:960px;
	margin:auto;
	text-align:left;
	position: relative;
}

.section.fitSection #sectionContentHolder #sectionCenteredContent {
	position:absolute;
	left:50%;
	top:0px;
	margin-left:-466px;
	height:100%;
}


#sectionContentHolder #sectionFullBrowserContent {
	width: 100%; 
	height:100%;
	left:0px;
	position:absolute;
	margin:auto;
	overflow: hidden;

	
}

@media all and (max-width: 1000px) {

	#sectionContentHolder #sectionCenteredContent {
		left:35px;
		margin-left:0px;
	}
} 



/* Experiment title */
#experimentTitle {
	position: absolute;	
	top:15px;
	margin-left:-68px;
	
	width:500px;
	text-align:left;
	opacity:1;

	z-index:2;
}

#experimentTitle.hidden {
	display: none;
}

#experimentTitle .weblabIcon {
	position: absolute;
	width:80px;
	height:80px;
	text-align:right;
	float:left;
	margin-right:16px;
	margin-top:-18px;

}
#experimentTitle .weblabIcon #logoAnim > div {
	background:none !important;
}
#experimentTitle .weblabIcon #logoAnim{
	background:none !important;
	width:80px;
	height:80px;
	pointer-events: none;

}

#experimentTitle .experimentTitle {
	margin-left:67px;	
}

#experimentTitle .experimentNameTitle {
	overflow: hidden;	
	margin-left:-1px;
}

/* Silly pixel tweaks for EN-GB */
html[lang="en-GB"] #experimentTitle.teleporter .experimentNameTitle {
	margin-left:1px;
}

#experimentTitle .experimentNumberTitle { 
	/*position: absolute;
	top:0px;
	left:0px;
	display:inline-block;*/
	overflow: hidden;
	height:17px;
	width:50px;
}

#experimentTitle h1 { line-height:23px; }
#experimentTitle h3 { line-height:18px; }

#experimentTitle .experimentSubtitle {
	margin-left:68px;	
	margin-top:22px;
}


/* Experiment subtitle */
#sectionContentHolder .experimentSubtitle  {
	/*margin-top:24px;	*/
}
#sectionContentHolder .experimentSubtitle .line {
	background-color: #414342;
	width:100%;
	height:1px;
	display:block;
}
#sectionContentHolder .experimentSubtitle {		
	width:305px;
	height:50px;
}
#sectionContentHolder .experimentSubtitle .content {
	position: absolute;
	/* overflow: hidden; */	
	width:300px;
	min-height:50px;
}
#sectionContentHolder .experimentSubtitle .content ul{list-style-type: disc; margin: 10px 0 10px 15px;}
#sectionContentHolder .experimentSubtitle .content .animationLayer {
	margin-top:5px;	
	-webkit-font-smoothing:antialiased;	
}

#sectionContentHolder .experimentSubtitle .content button {

}

#sectionContentHolder .experimentSubtitle .content div[data-weblab-type="subtitleContent"] p {
	margin-top:0px;	
}

/* Dialog Layer */
#sectionDialogLayer {
	z-index:10; 
	text-align:left;

}




/*ErrorMessage*/
.experimentErrorTitle, .experimentErrorContent{margin-left:68px;}
.experimentErrorContent{color:#77807f;}
.experimentErrorStatusTitle h3{font-family:"DejaVuSansMono", "Courier New", Courier, monospace; text-transform:none;font-size:9px;font-weight:bold; padding-left:12px; background:url(../../images/common/icons/ico_error.png) no-repeat left center}
.postedError{font-size:9px;color:#3e4544;margin-top:-5px; font-weight:bold; }
.footerError{display:block; position:absolute; left:0; bottom:0px; width:756px; height:196px; background:url(../../images/common/logo_error.png) no-repeat left 2px;}
.error_Experiment .experimentSubtitle{float:none;}
#logoExp{position:relative;}
#ico_exp_1{position:absolute; left:16px; top:20px;}
#ico_exp_2{position:absolute; left:-52px;top:20px;}
#ico_exp_3{position:absolute; left:-8px; top:22px;}
#ico_exp_4{position:absolute; left:15px; top:22px;}
#ico_exp_5{position:absolute; left:15px; top:22px;}