/* 
	AUTHOR: JP
	o2c
*/


#content {
	/*border:2px dashed orange;*/
	margin-top: -21px;
}

/* Elimina los márgenes originales de la página */
#content .wrapper{
	/*border:2px dashed green;*/
	padding-left:0;
	padding-right:0;
}

/* En este panel está todo el canvas inicial */
#content #panelfront {
	position:relative;
	min-height:455px;
	background:transparent url(../img/portada02/p02-roscas_bg.png) no-repeat 0px 100px;
	/*border:2px dashed red; */
}

#content #panelfront .slogans, #content #panelfront .options {
	position:absolute;
}

#content #panelfront #slogan01 {
	left:83px;
	top:30px;
}
#content #panelfront #slogan02 {
	left:500px;
	top:100px;
}
#content #panelfront #slogan03 {
	left:245px;
	top:241px;
}

#content #panelfront .slogans {
	cursor:pointer;
}

#content #panelfront .slogans:hover {
	filter:alpha(opacity=80);  
	-khtml-opacity: 0.8;  
	opacity: 0.8; 
}


#content #panelfront .options {
	top:417px;
	cursor:pointer;
	z-index:400;
	border-top: 4px dotted #eeeeee; /* Se hace que bajen un poco para que en la pestaña aparezca un poco más alto */
	filter:alpha(opacity=60);  
	-khtml-opacity: 0.60;  
	opacity: 0.60; 
}
#content #panelfront #option01 {
	left:157px;
}
#content #panelfront #option02 {
	left:305px; /* +148 */
}

#content #panelfront .options:hover {
	filter:alpha(opacity=100);  
	-khtml-opacity: 1.0;  
	opacity: 1.0; 
	/* border-top: 4px dotted #3b6d84; */
	background: url(../img/arrow_logo_sq-blue-anim.gif) no-repeat 0px -4px;
}

#content #panelfront #option01:hover {
	background-position: 6px -4px;
}
#content #panelfront #option02:hover {
	background-position: 17px -4px;
}



/* Cada pestaña */
#content #panelfront .pestanas {
	position:absolute;
	top:0px;
	left:0px;
	width:850px;
	height:457px;
	color:#255c76;
	padding:4px 10px 4px 50px;
	z-index:200;
	background:transparent no-repeat 0px 0px;
}

/* Personalización de la pestaña primera */
#content #panelfront #pest01 {
	background-image: url(../img/portada02/p02-pest01-c.png);
}
/* Personalización de la pestaña segunda */
#content #panelfront #pest02 {
	background-image: url(../img/portada02/p02-pest02-c.png);
}


/* El título de la pestaña */
#content #panelfront .pestanas h1 {
	padding:0;
	margin:0 0 0 41px;
	font-size:18px;
	letter-spacing:-1px;
}
	/* Lista de frases slogan */
	#content #panelfront .pestanas div.textos ul {
		position:absolute;
		top:80px;
		left:65px;
		width:350px;
		font-size:16px;
		list-style: disc outside none;
	}
	/* Cada frase */
	#content #panelfront .pestanas div.textos ul li {
		margin-bottom:16px;
}

/* El lugar donde van los vídeos */
#content #panelfront .pestanas div.videos {
	position:absolute;
	top:80px;
	left:425px;
	width:407px;
	height:227px;
	background: transparent url(../img/portada02/video_no_disponible.png) no-repeat;
}

/* El lugar donde van los botones */
#content #panelfront .pestanas div.botonera {
	position:absolute;
	top:340px;
	left:65px;
}

	/* Separación de botones */
	#content #panelfront .pestanas div.botonera a {
		margin-right:24px;
	}



/* El área de las noticias */
#content #panelfront div#news {
	position:absolute;
	top:21px;
	right:0px;
	width:300px;
	height:400px;
	z-index:100;
	padding:2px 6px 6px 6px;
	
	border-radius: 8px 0 0 8px;
	-moz-border-radius: 8px 0 0 8px;
	
	-webkit-border-top-left-radius: 8px;
	-webkit-border-bottom-left-radius: 8px;  
	
	border:1px solid #4a788d;
	border-right:none;
	background-color:#dce6e9;
}

#content #panelfront div#news a {
	color:#255c76;
	text-decoration:none;
}
	
#content #panelfront div#news a:visited {
	color:#4a788d;
}
	
#content #panelfront div#news a:hover {
	background:#4a788d;
	color:#f3a103;
}

	/* El título */
	#content #panelfront div#news h2 {
		padding:0;
		margin:0;
		font-size:14px;
		color:#4a778d;
	}
	/* El icono del feed */
	#content #panelfront div#news h3 {
		position:absolute;
		padding:0;
		margin:0;
		top:4px;
		right:7px;
	}
		#content #panelfront div#news h3 a:hover{
			filter:alpha(opacity=70);  
			-khtml-opacity: 0.7;  
			opacity: 0.7; 
		}
	
	/* La lista de noticias */
	#content #panelfront div#news div.newslist{
		height:380px;
		overflow:scroll;
	}
	
	/* Cada noticia */
	#content #panelfront div#news div.news-item {
		margin:0 0 8px 0;
		padding:4px;
		background-color:#eeeeee;
		border: 1px solid #7ba0ac;
		border-radius: 3px;
		-moz-border-radius: 3px;
		-webkit-border-radius: 3px;
	}
	/* La fecha */
	#content #panelfront div#news div.news-item>p{
		color:#606060;
		font-size:10px;
		margin:0;
		padding:0;
	}
	/* El título */
	#content #panelfront div#news div.news-item>h4 {
		margin:0;
		padding:0;
		font-size:12px;
		font-weight:bold;
	}
	#content #panelfront div#news div.news-item>h4 a{
		display:inline-block;
		padding:0 4px 0 4px;
	}
	/* La descripción */
	#content #panelfront div#news div.news-item>blockquote{
		margin:0 0 0 16px;
		color:#606060;
	}


/* Redefine la ubicación del closemark*/	
div.closemark {
	top:34px;
	right:66px;
}

