
/*  CSS Balmes Business Center  */
/*  Hoja de estilos del Lightbox  */


/* Lightbox
--------------------------------------------------------------------------- */
#overlay{ position: absolute; top: 0; left: 0; z-index: 90; width: 100%; height: 500px; background: #000; filter: alpha(opacity=60); -moz-opacity: 0.6; opacity: 0.6;}
#lightbox{ position: absolute; top: 40px; left: 0; width: 100%; z-index: 100; text-align: center; line-height: 0;}
#lightbox a, #lightbox a img{ border: none;}


/* Container de la imagen
--------------------------------------------------------------------------- */
#outerImageContainer{ position: relative; width: 250px; height: 250px; margin: 0 auto; background: #FFF;}
#imageContainer{ padding: 10px;}

	/* Navegacion */
	#hoverNav{ position: absolute; top: 10px; left: 0; width: 100%; height: 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{ float: left; left: 0; background: url(../images/lightbox_prevlabel.gif) 0 100% no-repeat;}
	#nextLink{ float: right; right: 0; background: url(../images/lightbox_nextlabel.gif) 100% 100% no-repeat;}
	#prevLink:hover, #prevLink: visited:hover{ background: url(../images/lightbox_prevlabel.gif) 0 100% no-repeat;}
	#nextLink:hover, #nextLink: visited:hover{ background: url(../images/lightbox_nextlabel.gif) 100% 100% no-repeat;}

	/* Loading */
	#loading{ position: absolute; top: 40%; left: 0%; width: 100%; height: 25%; text-align: center; line-height: 0;}
	
	
/* Container de los datos
--------------------------------------------------------------------------- */
#imageDataContainer{ margin: 0 auto; background: #FFF; font: 1em/1.4em Arial, Helvetica, sans-serif;}

	#imageData{ padding: 0 10px;}
	#imageData #imageDetails{ float: left; width: 70%; padding: 2px 0 10px 0; text-align: left;}	
	#imageData #caption{ font-size: 1.3em; font-weight: bold;}
	#imageData #numberDisplay{ clear: left; display: block; font-size: 1.1em; line-height: 1.8em;}			
	#imageData #bottomNavClose{ float: right; width: 22px; height:22px; padding: 7px 0;}	
	#imageData #bottomNavClose img{ width: auto;}	
	
	
/* Clearfix
--------------------------------------------------------------------------- */
.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 */}	
