#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: #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: 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: 49%;
		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/prevlabel.gif) left 15% no-repeat;

}

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

		background: url(../images/nextlabel.gif) right 15% no-repeat;

}

#imageDataContainer{

		font: 10px Verdana, Helvetica, sans-serif;
		background-color: #fff;
		margin: 0 auto; line-height: 1.4em;
		overflow: auto; width: 100%	;

}

#imageData{

		padding:0 10px; color: #666;

}

#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: 100%;
		height: 500px;
		background-color: #000;

}