/*- - - - - ( lightbox ) - - - - - - - - - - - - - - - */                            
                              
                              
#lightbox{ position: absolute;
	          top: 40px;
	          left: 0;
                  width: 100%;
                  z-index: 100;
                  text-align: center;
                  line-height: 0px;}


#lightbox a img { border: none;}

#outerImageContainer {	position: relative;
                                	background-color: #fff;
                                	width: 250px;
                                 	height: 250px;
                                      	margin: 0 auto;}

#imageContainer { padding: 10px;}

#loading { position: absolute;
                  top: 40%;
                  left: 0%;
                  height: 25%;
                  width: 100%;
                  text-align: center;
                  line-height: 0px;}

#hoverNav { position: absolute;
                      top: 0;
                      left: 0;
                      height: 100%;
                      width: 100%;
                      z-index: 10;} 

#imageContainer>#hoverNav{left: 0;}

#hoverNav a {outline: none;}

#prevLink, #nextLink { width: 49%;
                                     height: 100%;
                                     background: transparent url(js/blank.gif) no-repeat; /* Trick IE into showing hover */
                                     display: block;}     
	
#prevLink { left: 0; float: left;}
#nextLink { right: 0; float: right;}
#prevLink:hover, #prevLink:visited:hover { background: url( js/prevlabel.gif) left 15% no-repeat; }
#nextLink:hover, #nextLink:visited:hover { background: url( js/nextlabel.gif) right 15% no-repeat; }

#imageDataContainer{ font: 10px Verdana, Helvetica, sans-serif;
                                      background-color: #fff;
                                      margin: 0 auto;
                                      line-height: 1.4em;}

#imageData{ padding:0 10px;}    
	
#imageData #imageDetails{ width: 70%; float: left; text-align: left;}	
#imageData #caption{ font-weight: bold;}
#imageData #numberDisplay{ display: block; clear: left; padding-bottom: 1.0em;}			
#imageData #bottomNavClose{ width: 66px; float: right; padding-bottom: 0.7em;}	
		
#overlay{ position: absolute;
                 top: 0;
                 left: 0;
                 z-index: 90;
                 width: 100%;
                 height: 500px;
                 background-color: #000;
                 filter:alpha(opacity=40%); 
                 -moz-opacity: 0.6;
                 opacity: 0.6;}

.clearfix:after { content: "."; 
                         display: block;
                         height: 0; 
                         clear: both; 
                         visibility: hidden;}

* html>body .clearfix { display: inline-block; 
	                             width: 100%;}

* html .clearfix { /* Hides from IE-mac \*/
                           height: 1%;
	                   /* End hide from IE-mac */}	
	                  
#overlay{ background-image: url(js/overlay.png); }

* html #overlay{ background-color: #000;
                            back\ground-color: transparent;
                            background-image: url(js/blank.gif);
                            filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="js/overlay.png", sizingMethod="scale");}