@charset "UTF-8";
/* CSS Document */
body{margin:0px auto; padding:0px;}
/*body {margin:0 auto; padding:0; background: #fafafa url(../images/bg_pattern.png) repeat;}*/ 
p, span, ul {font: lighter 13px/16px 'Helvetica', 'Arial', sans-serif; color: #464646;}
a {color:#fff; border:0px;outline:none;}
a:link {text-decoration: none;  color:inherit; color:#FFF;outline:none;}
a:visited {text-decoration: none;  color:inherit;outline:none;}
a:hover {text-decoration: none; color:#00aeff;outline:none;}

.credito {font:lighter 13px/16px 'Helvetica','Arial',serif; color:#999; padding:0px 15px 15px 15px;}
/* SUBURBANAS - Portada de la semana*/
#suburbanas .PortDeLaSemana { width:300px; height:250px; background:url(../imgdiseno/bg_portadaDeLaSemana.png) no-repeat; overflow:hidden; float:left}
#suburbanas .PortDeLaSemana h1 {font: 100 22px/26px 'Oswald','Arial',serif; color:#fff; padding:10px 10px 0 10px; text-align: center;}
#suburbanas .PortDeLaSemana .foto{ width:160px;float:left; margin:4px 10px 10px 20px; position: relative}
#suburbanas .PortDeLaSemana .foto p{ width:150px;float:left; padding:5px; background:url(../imgdiseno/bg_caption.png) repeat; position:absolute; bottom:0; left:0}
#suburbanas .PortDeLaSemana .foto a{ font: 100 13px/16px 'Helvetica','Arial',serif;}
#suburbanas .PortDeLaSemana .boton{ position: relative; top:10px; left:9px; width:70px; margin:10px 0;}

/* Botón genérico */
.boton{ padding:5px; display: inline; border: solid thin #444;float:left; text-align:center;
	background:#333;
	font:100 20px/22px 'Oswald','Arial',serif; color: #fff;
	-moz-border-radius: 3px; /* Firefox */
	-webkit-border-radius: 3px; /* Safari and Chrome */
	-khtml-border-radius: 3px; /* Linux browsers */
	border-radius: 3px; /* Opera 10.50, IE and CSS3 */
	
	-webkit-box-shadow: inset 0px 0px 2px 0px rgba(1, 1, 1, .8);
	box-shadow: inset 0px 0px 2px 0px rgba(1, 1, 1, .8);
	}
.boton:hover{ background:#0099ff; color:#fff;}


/*ESTRUCTURA*/
.c960{width:960px; margin:auto;}

.mdl {overflow:hidden; background: #000; position:relative;}
.mdl .foto, .riel .foto{width:100%; height:auto; position:relative;}
.mdl .foto img{width:100%; height:auto;}

.x1 {width:300px; float:left}
.x2 {width:630px;}
.x3 {width:800px;}   /*920px*/
.x4 {width:95%;float:left;border:0px solid red;margin-left:35px;}
.x5 {width:100%;}

.y0_5 {height:120px;}
.y1 {height:110px;}
.y1_5 {height:390px;}
.y2 {height:530px;}
.y3 {height:810px;}
.y4 {height:450px;}
.y5 {height:300px;}
.y6 {height:100%;}

/*Captions*/
.ic_container {vertical-align:baseline;margin:0;position:relative;}
.ic_caption{position:absolute;overflow:hidden;margin:0px;padding:0px;left:0px;right:0px;cursor:default;background: url(../imgdiseno/bg_caption.png) repeat;}
.gd .ic_caption {position:absolute;overflow:hidden;margin:0px;padding:90px 0 0 0;left:0px;right:0px;cursor:default;background:url(../imgdiseno/grdAV_1.png) repeat-x 0 40px;}
.overlay {opacity:0.8;position:absolute;top:0px;bottom:0px;left:0px;right:0px;filter:progid:DXImageTransform.Microsoft.Alpha(opacity=80);}
.ic_category {text-transform:uppercase;font-size:11px;padding:5px;margin:0px;}

/*PRINCIPAL*/
.ppal h1, .ppalW h1{font:400 44px/50px 'Oswald','Arial',serif; padding:0px 15px; margin:5px 0px; color: #fff;}
.ppalW .foto img{ height:400px;}
/*.ppalW p{ padding:-1px 15px}*/
.ppal .foto{ width:375px;}
.ppalv h1{font:400 44px/50px 'Oswald','Arial',serif; padding:0px 15px 5px; margin:5px 0px;}
.fnppal h1{font:400 44px/47px 'Oswald','Arial',serif; padding:0 15px 10px 15px;} 
.ppalsf h1{font:700 42px/45px 'Oswald','Arial',serif; padding:15px 15px 5px 15px;}
.ppalsfm h1{font:400 44px/47px 'Oswald','Arial',serif; padding:30px 15px 30px 15px;}
.ppalTopH h1{font:400 44px/50px 'Oswald','Arial',serif; padding:0px 15px 20px 15px; margin:5px 0px; color: #fff;} 

/*FOTONOTA*/
.fn h1{font:100 31px/32px 'Oswald','Arial',serif; padding:5px 15px 10px 15px;}

/*NOTA*/
.n { cursor:pointer;}
.n h1{font:400 19px/22px 'Oswald','Arial',serif; padding:12px 15px 10px 15px; color:#FFF;}
.nsf h1{font:400 19px/22px 'Oswald','Arial',serif; padding:10px 15px 7px 15px; color:#FFF;}

/* COMPLEMENTOS GRAFICOS*/
.grdAV {position: absolute;left: 0;bottom: 0;width: 100%;height: 40px;background: url(../imgdiseno/grdAV.png) repeat-x;}
.grd2H {position: absolute;left: 300px;bottom: 0;width: 40px;height: 100%;background: url(../imgdiseno/grdAV_2.png) repeat-y; z-index: 1;}
.foto2H img{position: absolute; width:330px; height:100%; float:right}

/*Herramientas en Hover*/
ul.herr {font:lighter 12px/16px 'Helvetica', 'Arial', sans-serif; bottom:0px; position:absolute;}
.ic_caption ul.herr {position: relative;}
ul.herr li {margin-left:0; list-style-type:none; font:100 13px/17px 'Oswald','Arial',serif; text-transform:uppercase; display:inline;}
ul.herr li a{color:#00c6ff; display:inline-block; background:inherit; padding:4px; margin-left: -4px; border:solid 1px #333 }
ul.herr li a:hover{color:#00c6ff; display:inline-block; background:#eaeaea;}

/* Zoom */
.zoomBtn {width:40px; height:40px; position:absolute; top:0; right:0; z-index:10}
.zoomBtn a {width:40px; height:40px; background:url(../imgdiseno/btnZoomImg.png) no-repeat 0 0; display: block;}
.zoomBtn a:hover {width:40px; height:40px; background:url(../imgdiseno/btnZoomImg.png) no-repeat 0 -40px;}

/*botón play video*/
.btnPlayVideo {width:36px; height:36px; position:absolute; top:5px; right:5px; z-index:10}
.btnPlayVideo a   { width:36px; height:36px; background:url(../imgdiseno/btn_PlayVideo.png) no-repeat 0 0; display: block;}
.btnPlayVideo a:hover  { width:36px; height:36px; background:url(../imgdiseno/btn_PlayVideo.png) no-repeat 0 -36px;}
.btnPlayVideo a:active  {width:36px; height:36px; background:url(../imgdiseno/btn_PlayVideo.png) no-repeat 0 -72px;}
/*botón fotogaleria*/
.btnFotogal {width:36px; height:36px; position:absolute; top:5px; right:5px; z-index:10}
.btnFotogal a   { width:36px; height:36px; background:url(../imgdiseno/btnFotogal.png) no-repeat 0 0; display: block;}
.btnFotogal a:hover  { width:36px; height:36px; background:url(../imgdiseno/btnFotogal.png) no-repeat 0 -36px;}
.btnFotogal a:active  {width:36px; height:36px; background:url(../imgdiseno/btnFotogal.png) no-repeat 0 -72px;}
/*botón podcast y audio*/
.btnAudio {width:36px; height:36px; position:absolute; top:5px; right:5px; z-index:10}
.btnAudio a   { width:36px; height:36px; background:url(../imgdiseno/btnAudio.png) no-repeat 0 0; display: block;}
.btnAudio a:hover  { width:36px; height:36px; background:url(../imgdiseno/btnAudio.png) no-repeat 0 -36px;}
.btnAudio a:active  {width:36px; height:36px; background:url(../imgdiseno/btnAudio.png) no-repeat 0 -72px;}

ul.nRel{list-style:disc outside; padding:5px 30px 15px; color:#FFF;}
p {color:#FFF; padding: 0px 15px;}


/*Rieles*/
.riel,.rielSemanal,.rielMensual,.rielEjemplares,.rielPortadas,.rielPaginas, .rielHistorico {
	overflow:hidden;
	position: relative;
	float: left;
	
			
}

.riel img.plecaRiel{float: left;}

.riel .nriel,.rielHistorico .nrielEjemplares,.rielSemanal .nriel, .rielMensual .nriel, .rielPortadas .nriel, .rielPaginas .nrielPaginas {
	position: relative;
	float: left;
	display: block;
	/* If you don't want the images in the scroller to be selectable, try the following
	   block of code. It's just a nice feature that prevent the images from
	   accidentally becoming selected/inverted when the user interacts with the scroller. */
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-o-user-select: none;
	user-select: none;
	
}

.Pub_riel{width:150px;height:120px; overflow:hidden; background:#ffcc00; margin:0 20px; float:left}
.nriel{height:90px; overflow:hidden; background-color:Transparent; margin:15px 10px 0 10px;}
.nriel .foto { height:140px; background:#00ccff; position:relative}
.nriel .ic_caption{position:absolute;overflow:hidden;margin:0px;padding:0px;left:0px;right:0px;cursor:default;background: url(../imgdiseno/bg_caption.png) repeat;}
.nriel h1 {font:400 19px/22px 'Oswald','Arial',serif; padding:12px 15px 10px 15px; color:#FFF;}
.nriel p {font: lighter 12px/16px 'Helvetica', 'Arial', sans-serif; color: #fff; padding: 0 10px 5px 10px}
.nriel h1 a {color:#fff; text-decoration:none;outline:none;}
.nriel h1 a:hover {color:#00c6ff; text-decoration:none}
.nriel p.seccion {position: absolute; left:0; top:0; display:block; font: lighter 12px/12px 'Helvetica', 'Arial', sans-serif; background:#000; color:#00c6ff; padding:2px}

.nriel ul li{margin-left:0; list-style-type:none; font:100 13px/17px 'Oswald','Arial',serif; text-transform:uppercase; display:inline}
.nriel ul li a{color:#00c6ff; display:inline-block; background:#444444; padding:5px}
.nriel ul li a:hover{color:#00c6ff; display:inline-block; background:#fff}
.ic_container img{width:77px}


.nrielEjemplares{height:500px; overflow:auto; background-image:url(../imgdiseno/bg_impresa.png); margin:0 0px; width:250px;}
.nrielPaginas{height:300px; overflow:auto; background:; 
margin:0 0px; width:180px; }

.swiper-img
{
	height:375px;
	box-shadow: 8px 5px 20px #000;
	-moz-box-shadow: -8px -5px 20px #000;
	-webkit-box-shadow: -8px -5px 20px #000;
	cursor:pointer;	
	
}

.captionDia
{
	font-size:14px;
	font-weight:bold;
	/*color:#1311e3 ;*/
	color:Silver;
	text-align:center;	
	width:83%;
}

.captionFecha
{
	font-size:12px;
	font-weight:bold;
	color:ButtonFace;
	text-align:center;
	width:83%;
}

.nom_seccion
{
	width:80px;
	font: 300 13px/16px helvetica, arial, sans-serif;
	color: #ddd;
	text-align:center; 	
	position:absolute;	
	margin:0;
	padding:0;
	top:70px;
	z-index:99;
	overflow:hidden;
	
}



.itemRiel
{
	height:65px;
	width:77px;
	overflow:hidden;
}

.itemRielPagina
{
	height:85px;
	overflow:hidden;
}

.itemRielPaginaxSeccion
{
	height:110px;
	overflow:hidden;
}
.sombraimg
{
	cursor:pointer;top:-5px;position:absolute;
}
.portada{border:1px solid red;float:left; margin:0px 15px; margin-top:0px; background:url(../imgdiseno/impresa_bg_portada.png);}

.portada_semanal{ float:left; margin:0px 15px; margin-top:35px; background:url(../imgdiseno/impresa_bg_portada_semanal.png);}