@charset "utf-8";
/* CSS Document */

* {margin:0;padding:0;} 

/* must declare 0 margins on everything, also for main layout components use padding, not 
vertical margins (top and bottom) to add spacing, else those margins get added to total height 
and your footer gets pushed down a bit more, creating vertical scroll bars in the browser */

html, body, #wrap {height: 100%;}

body > #wrap {height: auto; min-height: 100%;}

body{
	background:url(../img/bg01.jpg) top center repeat-y;
}
#main {padding-bottom: 150px;}  /* must be same height as the footer */

#footer {
	position: relative;
	margin-top: -40px; /* negative value of footer height */
	height: 40px;
	clear:both;
} 

/* CLEAR FIX*/
.clearfix:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}
.clearfix {display: inline-block;}
/* Hides from IE-mac \*/
* html .clearfix { height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */

#centrado {

	position: absolute; /*Posicionamiento absoluto*/
	top: 50%; /*Desde arriba, colocar al 50% de la pantalla*/
	left: 50%; /*Desde la izquierda, colocar al 50% de la pantalla*/
	height: 768px; /*Le ponemos el valor del alto*/
	width: 1024px; /*Le ponemos el valor del ancho*/
	margin-top: -384px; /*Restamos la mitad de alto para centrarlo verticalmente*/
	margin-left: -512px; /*Restamos la mitad de ancho para centrarlo horizontalmente*/
	border:#e2e3de dotted 2px;
	background:url(../img/bg_centrado.png);

}

#header {
	height: 115px;
	background-image:url(../img/web/bg_header.png);
	background-repeat: repeat-x;
}

#navigation {
	width: 1000px;
	margin:0 auto;
	padding:0 0 0 0;
	height: 115px;
}	

#main {
	width:1000px;
	margin:0 auto;
	clear:both;
	padding-right:0px;
	padding-left:0px;
}

#content {
	width:700px;
	float:left;
	padding:0px 0px 0px 0px;
}

#sidebar {
	width:275px ;
	float:right;
	padding:0px 0px 0px 0px;
}

#footer {
	background: url('../img/web/bg_footer.png') repeat-x;
	height: 40px;
	color:#ffffff;
	font-size:11px;
	font-family:Verdana, Arial, sans-serif;
}

#galeria{
	width: 700px;
}

#cabecero{
	width:700px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 20px;
	text-transform: capitalize;
	color: #EDB9EE;
}

#salas{
	background:url(../img/web/bg_content.png) repeat;
}

#locales{
	background:url(../img/web/bg_content.png) repeat;
}

#comentarios{
	width:700px;
	padding-left:10px;
	padding-right:10px;
	font-family: Arial, Helvetica, sans-serif;
	font-size:12px;
}

#ademas{
	width:700px;
	font-family: Arial, Helvetica, sans-serif;
	font-size:12px;
}

#com{
	background:url(../img/web/bg_coment.png) repeat;
}

#unete{
	font-family:Arial, Helvetica, sans-serif;
	background:url(../img/web/bg_content_verde.png) repeat;
}

#filosofia{
	font-family:Arial, Helvetica, sans-serif;
	background:url(../img/web/bg_coment.png) repeat;
}

#listado_videos{
	width: 700px;
}

#player{
	
}

#programa{
	width: 700px;
	height: 381px;
}

#fecha_programa_jueves{
	font-family:Arial, Helvetica, sans-serif;
	font-size:12px;
	color:#FF00FF;
	font-weight:bold;
}

#fecha_programa_viernes{
	font-family:Arial, Helvetica, sans-serif;
	font-size:12px;
	color:#00FF00;
	font-weight:bold;
}

#fecha_programa_sabado{
	font-family:Arial, Helvetica, sans-serif;
	font-size:12px;
	color:#FFFF00;
	font-weight:bold;
}

#local_programa_jueves{
	margin-top: 5px;
	padding: 0px 10px 0px 10px;
	font-family:Arial, Helvetica, sans-serif;
	font-size:12px;
	color:#FF00FF;
	font-weight:bold;
}

#local_programa_viernes{
	margin-top: 5px;
	padding: 0px 10px 0px 10px;
	font-family:Arial, Helvetica, sans-serif;
	font-size:12px;
	color:#00FF00;
	font-weight:bold;
}

#local_programa_sabado{
	margin-top: 5px;
	padding: 0px 10px 0px 10px;
	font-family:Arial, Helvetica, sans-serif;
	font-size:12px;
	color:#FFFF00;
	font-weight:bold;
}

#texto_programa{
	padding: 5px 10px 15px 10px;
	height: 80px;
	font-family:Arial, Helvetica, sans-serif;
	font-size:12px;
	color:#FFFFFF;
}

#imagendia_programa{
	margin-top: 10px;
}

#imagen_programa{

}

#columna_programa{
	float:left;
	margin-left: 8px;
	width: 222px;
	height: 381px;
	background:url(../img/web/base_programacion.png) no-repeat;
	overflow: hidden;
	font-family:Arial, Helvetica, sans-serif;
	font-size:12;
	color:#FFFFFF
}

#calendar{
	float: left;
	background: url(../img/web/calendar_80.png) no-repeat;
	width: 80px;
	height: 80px;
}

#calendar_mes{
	padding: 7px 0px 0px 0px;
	font-family:Arial, Helvetica, sans-serif;
	font-size:14px;
	font-weight:bold;
	color:#FFFFFF;
	text-align:center;
}

#calendar_dia{
	padding: 5px 0px 0px 0px;
	font-family:Arial, Helvetica, sans-serif;
	font-size:35px;
	font-weight:bold;
	color:#000000;
	text-align:center;
}

#calendar_cabecero{
	padding: 7px 0px 0px 0px;
	font-family:Arial, Helvetica, sans-serif;
	font-size:14px;
	font-weight:bold;
	color:#FFFFFF;
}

#calendar_texto{
	padding: 7px 0px 0px 0px;
	height:50px;
	overflow:hidden;
	font-family:Arial, Helvetica, sans-serif;
	font-size:12px;
	color:#FFFFFF;
}

#previewvideo{
	float: left;
	margin-left: 10px;
	margin-top: 10px;
	width: 325px;
	height: 105px;
	padding-top: 5px;
	padding-left: 5px;
	padding-right: 5px;
	padding-bottom: 5px;
	overflow: hidden;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 10px;
	color:#FFFFFF;
	background:url(../img/web/bg_coment.png) repeat;
}

#titulovideo{
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	font-weight: bold;
	color: #01ff01;
}

#btn_video{
	float:left;
	width:142px;
	height:80px;
	margin-top:5px;
}

#resumen_video{
	float:left;
	height:80px;
	width:178px;
	margin-left:5px;
	margin-top:5px;
	color:#FFFFFF;
	font-size:10px;
	font-weight:bold;
}

#social{
	font-family:Arial, Helvetica, sans-serif;
}

#bio{
	width: 680px;
	padding-left: 10px;
	padding-right: 10px;
	font-family:Arial, Helvetica, sans-serif;
	font-size:12px;
	color:#FFFFFF;
	background:url(../img/web/bg_coment.png) repeat;
}

#bio a:link {
	color: #FFFFFF;
	text-decoration: none;
}
#bio a:visited {
	color: #FFFFFF;
	text-decoration: none;
}
#bio a:hover {
	color: #01ff01;
	text-decoration: none;
}
#bio a:active {
	color: #FFFFFF;
	text-decoration: none;
}

#subnavdj{
	width:700px;
	background:url(../img/web/bg_coment.png) repeat;
	font-family:Arial, Helvetica, sans-serif;
	font-size:12px;
	font-weight:bold;
	color: #FFFFFF;
}

#subnavdj a:link {
	color: #01ff01;
	text-decoration: none;
}
#subnavdj a:visited {
	color: #01ff01;
	text-decoration: none;
}
#subnavdj a:hover {
	color: #FFFFFF;
	text-decoration: none;
}
#subnavdj a:active {
	color: #01ff01;
	text-decoration: none;
}

#footer_content {
	width: 1000px;
	margin:0 auto;
	padding:15px 0 0 0;
	height: 25px;
	font-family:Arial, Helvetica, sans-serif;
	font-size:12px;
	color:#FFFFFF;
}

/*//////////////////////////////////////////////////////////////////////////////////
//						CLASES PARA ELEMENTOS SUELTOS							  //
//////////////////////////////////////////////////////////////////////////////////*/

.usercomentario{
	color:#F8B9FF;
	font-weight:bold;
}

.comentario{
	color:#01ff01;
}

.textounete{
	color:#FFFFFF;
	font-size:10px;
	font-weight:bold;
}

.nombre{
	font-family:Arial, Helvetica, sans-serif;
	font-size:12px;
	color:#01ff01;
}

.titulo_video{
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	font-weight: bold;
	color: #01ff01;
}

/*//////////////////////////////////////////////////////////////////////////////////
//		    				CLASES PARA LIGHTBOX								  //
//////////////////////////////////////////////////////////////////////////////////*/

#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(../img/lightbox/prevlabel.gif) left 15% no-repeat; }
#nextLink:hover, #nextLink:visited:hover { background: url(../img/lightbox/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; }