#lightbox {	

position: absolute;	

left: 0; 

width: 100%; 

z-index: 100; 

text-align: center; 

line-height: 0;

}

#lightbox img { 

width: auto; 

height: auto;

}

#lightbox a img { 

border: none; 

}

#outerImageContainer { 

position: relative; 

background-color: #000; 

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: 0; 

}

#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: 39%; 

height: 100%; 

background-image: url(data:image/gif;base64,AAAA); /* Trick IE into showing hover */ 

display: block; 

}

#prevLink { 

left: 0; 

float: left;

}

#nextLink { 

right: 0; 

float: right;

}

#prevLink:hover, #prevLink:visited:hover { 

background: url(../images/prevlabeld.gif) left 20% no-repeat;

}
 
#nextLink:hover, #nextLink:visited:hover { 

background: url(../images/nextlabeld.gif) right 20% no-repeat; 

}

#imageDataContainer { 

font: 10px Verdana, Helvetica, sans-serif; 

background-color: #000; 

margin: 0 auto; 

line-height: 1.4em; 

overflow: auto; 

width: 100%	; 

}

#imageData {	

padding:0 10px; 

color: #aaa;

font-size: 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; 

outline: none;

}	 	

#overlay { 

position: absolute; 

top: 0; 

left: 0; 

z-index: 90;

width: 110%; 

height: 500px; 

background-color: #000; 

}