#lightbox
{
	position:		absolute;
	left:			0;
	width: 			100%;
	z-index: 		100;
	text-align: 	center;
	line-height: 	0;
}

#lightbox a img
{
	border: 		none;
}

#outerImageContainer
{
	position: 		relative;
	background:		#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: 	transparent url(../images/lightbox/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(../images/lightbox/prevlabel.gif) left 15% no-repeat;
}

#nextLink:hover,
#nextLink:visited:hover
{
	background:		url(../images/lightbox/nextlabel.gif) right 15% no-repeat;
}

#imageDataContainer
{
	font: 			10px Verdana, Helvetica, sans-serif;
	background: 	#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;
	color:			#333;
}

#imageData #caption
{
	font-weight: 	bold;
}

#imageData #numberDisplay
{
	display: 		block;
	clear:			left;
	padding-bottom: 1.0em;
	color:			#333;
}

#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: 	#000;
}