
div.lightbox { overflow-x:hidden;overflow-y:scroll; width:550px; height:400px; padding:0; margin:0;}


/* the overlayed element */
div.overlay {
	
	/* growing background image */
	background:url('../images/overlay/gray.png') no-repeat 0% 0%;
	
	/* dimensions after the growing animation finishes  */
	width:550px;
	height:470px;		
	
	/* initially overlay is hidden */
	display:none;
	
	/* some padding to layout nested elements nicely  */
	padding:55px 55px 30px 55px ;
	
	color:#fff;
	text-align:left;
	font-size:.9em;
	z-index:10;
}

/* default close button positioned on upper right corner */
div.overlay div.close {
	background-image:url('../images/overlay/close.png');
	position:absolute;
	right:5px;
	top:5px;
	cursor:pointer;
	height:35px;
	width:35px;
}


/* black */
div.overlay.black {
	background:url('../images/overlay/transparent.png') no-repeat !important;
	color:#fff;
}

/* petrol */
div.overlay.petrol {
	background:url('../images/overlay/petrol.png') no-repeat !important;
	color:#fff;
}

div.black h2, div.petrol h2 {
	color:#ddd;		
}



/**********************************

***********************************/

/* root element for tabs  */
ul.tabs { 
	list-style:none; 
	margin:0 !important; 
	padding:0;	
	border-bottom:1px solid #666;	
	height:30px;
}

/* single tab */
ul.tabs li { 
	float:left;	 
	text-indent:0;
	padding:0;
	margin:0 !important;
	list-style-image:none !important; 
}

/* link inside the tab. uses a background image */
ul.tabs a { 
	background: url('../images/tabs/blue.png') no-repeat -420px 0;
	font-size:11px;
	display:block;
	height: 30px;  
	line-height:30px;
	width: 134px;
	text-align:center;	
	text-decoration:none;
	color:#333;
	padding:0px;
	margin:0px;	
	position:relative;
	top:1px;
}

ul.tabs a:active {
	outline:none;		
}

/* when mouse enters the tab move the background image */
ul.tabs a:hover {
	background-position: -420px -31px;	
	color:#fff;	
}

/* active tab uses a class name "current". it's highlight is also done by moving the background image. */
ul.tabs a.current, ul.tabs a.current:hover, ul.tabs li.current a {
	background-position: -420px -62px;		
	cursor:default !important; 
	color:#000 !important;
}

/* Different widths for tabs: use a class name: w1, w2, w3 or w2 */


/* width 1 */
ul.tabs a.s 			{ background-position: -553px 0; width:81px; }
ul.tabs a.s:hover 	{ background-position: -553px -31px; }
ul.tabs a.s.current  { background-position: -553px -62px; }

/* width 2 */
ul.tabs a.l 			{ background-position: -248px -0px; width:174px; }
ul.tabs a.l:hover 	{ background-position: -248px -31px; }
ul.tabs a.l.current  { background-position: -248px -62px; }


/* width 3 */
ul.tabs a.xl 			{ background-position: 0 -0px; width:248px; }
ul.tabs a.xl:hover 	{ background-position: 0 -31px; }
ul.tabs a.xl.current { background-position: 0 -62px; }


/* initially all panes are hidden */ 
div.panes div.pane {
	display:none;		
}








/*
	Appendix
*/
table.appendixTable,table.appendixTableCustom { font-size:.9em; background-color:#46211E;}

table.appendixTableCustom td { border:1px solid white;}
table.appendixTableCustom td.hideLeftBorder { border-left: none;}
table.appendixTableCustom td.hideRightBorder { border-right: none;}
/* root element for accordion. decorated with rounded borders and gradient background image */
#accordion {
	background:#333/*
 url('../images/tabs/h300.png') 0 0
*/;
	width: 550px;
	border:1px solid #333;	
	-background:#666;
}

/* accordion header */
#accordion h2 {
	background:#ccc url('../images/tabs/h30.png');
	margin:0;
	padding:5px 0;
	font-size:.9em;
	font-weight:normal;
	border:1px solid #fff;
	border-bottom:1px solid #ddd;
	cursor:pointer;	
	color:#444;
		
}

/* currently active header */
#accordion h2.current {
	cursor:default;
	background-color:#fff;
}

/* accordion pane */
#accordion div.pane {
	border:1px solid #fff;
	border-width:0 2px;
	display:none;	
	padding:5px;
	color:#fff;
	font-size:1em;;
}






#tooltip {
	display:none;
	background:transparent url('../images/tooltip/black_arrow.png');
	font-size:1em;;
	height:70px;
	width:160px;
	padding:25px;
	color:#fff;
	z-index:20;	
	
}
a.tooltip{ color:#429393;}
a.tooltip:hover{ color:#400000;}
