#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:#ADB0B7;
  width:250px;
  height:250px;
  margin:0 auto;}
#imageContainer{
  padding:6px;}
#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:#ADB0B7;
  margin:0 auto;
  line-height:1.4em;
  overflow:auto;
  width:100%;}
#imageData{
  padding:0;
  padding-left:6px;
  color:#000000;}
#imageData #imageDetails{
  width:80%;
  float:left;
  text-align:left;}	
#imageData #caption{
  font-weight:bold;	}
#imageData #numberDisplay{
  display:block; clear:left;
  padding-bottom:1.0em;	}			
#imageData #bottomNavClose{
  width:75px;
  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;}

