/*RESET*/

	
/* -----------------------------------------
Reset.css
Resets html styles (extends YUI reset.css)
Add clearfix.
Add class to standardize the architecture.

Author: Alberto Fortes, modificado por eCliente
Web: http://www.albertofortes.com y http://www.ecliente.com
E-mail: info@albertoortes.com y info@ecliente.com
Version: February, 2008.
---------------------------------------- */

/* Reset ---------------------------------- */
body {
	font: 13px Arial,Helvetica,sans-serif;
}

body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td {
	margin:0;
	padding:0;
}

table {
	border-collapse:collapse;
	border-spacing:0;
}

fieldset,img {
	border:0;
}

address,caption,cite,code,dfn,strong,th,var {
	font-style:normal;
	font-weight:normal;
}

ol,ul {
	list-style:none;
}

caption,th {
	text-align:left;
}

h1,h2,h3,h4,h5,h6 {
	font-size:100%;
	font-weight:normal;
}

q:before,q:after {
	content:'';
}

abbr,acronym {
	border:0;
}

img {
	border:0;
}

h1,h2,h3,h4,h5,h6 {
	font-size:1em;
	font-size:100%;
	font-weight:normal;
}

a {
	outline:none;
}
	
/* estructura ------------------------- */
.invisible {
	display:none;
}

.dcha {
	text-align:right;
}

.izq {
	text-align:left;
}

.centro {
	text-align:center;
}

.no-float {
	float:none!important;
}

.clear {
	clear:both;
	height:1px;
}

.spacer {
	clear:both;
	height:20px;
}

/* clearfix --------------------------- */
.clear:after {
	content:".";
	display:block;
	height:0;
	clear:both;
	visibility:hidden;
}


/* Hides from IE-mac \*/
* html .clear {
	height:1%;
}

	
/* End hide from IE-mac */

/*GENERICOS*/
body {
	background:url(../img/teatro/bodyFondo.gif) repeat top left;
}

a, a:visited {
	text-decoration: underline;
	color: #000;
}

a:hover {
	text-decoration: none;
}

ul, ol {	
	margin: 10px 0 0;
}

ol li {
	list-style: decimal;
	margin: 0 25px 10px;
}

ul li {	
	background: url(../img/teatro/bulletActividades.jpg) no-repeat top left;
	padding: 0 0 10px  18px;
}

.pequeno {
	padding: 5px 0 0;
	font-size: 0.8em;
}

/*CABECERA*/
#bandaFide {
	width: 100%;
	background: #fff url(../img/teatro/bandaFideFondo.gif) no-repeat top right;
	height: 100px;
}

#bandaFide #logo {
	padding: 10px;
	font-family: Times;
	font-size: 20px;
}

#bandaFide #logo a {
	color: #000;
	text-decoration: none;
}

#bandaFide #logo img {
	float: left;
	padding: 0 10px;
}

#cabecera {
	width: 100%;
	background: #cc0000 url(../img/teatro/cabeceraFondo.gif) repeat-x top left;
	height: 200px;
}

#cabecera #contenidoCabeza {
	width: 800px;
	margin: 0 auto;
	position: relative;
}

#cabecera #contenidoCabeza #logoCabeza {
	padding: 60px 0 0 20px;
}

#cabecera #contenidoCabeza #slogan {
	padding: 10px 0 0 80px;
}

#cabecera #contenidoCabeza #slogan a {
	color: #fff;
	font-size: 22px;
	text-decoration: none;
}

#cabecera #contenidoCabeza #fotos {
	background: url(../img/teatro/cabeceraFotos-trans.png) no-repeat;
	position: absolute;
	top: 20px;
	right: 0;
	width: 401px;
	height: 185px;
	z-index: 3;
}
#headingJuegos {
	position: absolute;
	left: 430px;
	top: -25px;
	padding: 1px 10px;
	color: #fff;
	font-weight: bold;
	text-transform: uppercase;
	font-size: 1.7em;
	z-index: 10;
	background: #c00;
	border-radius: 5px 5px 0 0; -moz-border-radius: 5px 5px 0 0; -webkit-border-radius: 5px 5px 0 0;
}
#link-juegos {
	position: absolute;
	left: 430px;
	top: 0;
	padding: 10px 0;
	background: #fff;
	color: #c00;
	font-weight: bold;
	font-size: 1.1em;
	z-index: 10;
}
#link-juegos a {
	text-decoration: none;
	color: #c00;
	width: 100px;
}
#link-juegos a:hover {
	text-decoration: underline;
	color: #000;
}
#link-juegos .uno {
	position: absolute;
	left: 40px;
	top: 5px;
}
#link-juegos .dos {
	position: absolute;
	left: 155px;
	top: 5px;
}
#link-juegos .tres {
	position: absolute;
	left: 280px;
	top: 5px;
}
/*CONTENEDOR*/

#contenedorSombra {
	background: url(../img/teatro/contenedorSombra-trans.png) repeat-y top;
	width: 840px;
	margin: 0 auto;
	position: relative;
	z-index: 1;
}

#contenedor {
	width: 810px;
	background: #fff;
	margin: 0 auto;
}

#contenedor #contenido {
	width: 62%;
	border-right: solid 1px #d6d6d6;
	padding: 30px 0;
	float: left;
}

#contenedor #contenido #paginacion {
	padding: 40px;
}

#contenedor #contenido #paginacion a {
	color: #fff;
	text-decoration: none;
	font-weight: bold;
}

#contenedor #contenido #paginacion a:hover {
	text-decoration: underline;
}

#contenedor #contenido #paginacion #anterior {
	float: left;
	padding: 5px 2px;
	width: 48%;
	background: url(../img/teatro/botonAnterior.jpg) no-repeat top left;
	height: 50px;
}

#contenedor #contenido #paginacion #siguiente {
	float: left;
	padding: 5px 1px;
	width: 48%;
	background: url(../img/teatro/botonSiguiente.jpg) no-repeat top right;
	text-align: right;
	height: 50px;
}


/*ENTRADAS*/
#contenedor #contenido .entrada {
	clear: both;
	margin: 20px 0 0;
}

#contenedor #contenido .entrada h1 a {
	font-size: 24px;
	text-decoration: none;
}

#contenedor #contenido .entrada h1 a:hover {
	text-decoration: underline;
}

#contenedor #contenido .entrada h3 {
	font-size: 18px;
	font-weight: bold;
	margin: 20px 0 10px;
}

#contenedor #contenido .entrada h4 {
	font-size: 16px;
	font-weight: bold;
	margin: 20px 0 10px;
	border-bottom: solid 2px #d6d6d6;
}

#contenedor #contenido .entrada .categoria {
	float: right;
	width: 100px;
	height: 100px;
}

#contenedor #contenido .entrada .escritoPor {
	clear: both;
	text-align: right;
	padding: 5px 20px 10px;
}

#contenedor #contenido .entrada .chicha {
	padding: 0 20px;
}

#contenedor #contenido .entrada .chicha .textoEntrada {
	
}

#contenedor #contenido .entrada .chicha .videoEntrada {
	width: 100%;
	padding: 0 0 20px;
}

#contenedor #contenido .entrada .chicha .videoArchivo {
	width: 80%;
	margin: 20px 0;
	text-align: center;
}

#contenedor #contenido .entrada .chicha .fotoEntrada {
	float: left;
	padding: 0 20px 0 0;
}

#contenedor #contenido .entrada .chicha .leerMas {
	float: right;
	padding: 20px 0 10px;
}

#contenedor #contenido .entrada .resumen {
	clear: both;
	margin: 20px;
	padding: 10px 100px 10px 10px;
}

#contenedor #contenido .listadoEntradas {
	clear: both;
	margin: 40px 0 10px;
}

/*ENTRADAS - MATERIALES*/
#contenedor #contenido .entrada.materiales {
	
}

#contenedor #contenido .entrada.materiales h1 {
	border-bottom: solid 3px #d79325;
	padding: 51px 20px 5px;
	*padding: 53px 20px 5px;
}

#contenedor #contenido .entrada.materiales h3 {
	border-bottom: solid 2px #d79325;
}

#contenedor #contenido .entrada.materiales .categoria {
	background: url(../img/teatro/categoriaMateriales-trans.png) no-repeat top left;
}

#contenedor #contenido .entrada.materiales .chicha .leerMas a {
	color: #d79325;
}

#contenedor #contenido .entrada.materiales .resumen {
	border: solid 4px #d79325;
	background: url(../img/teatro/resumenMateriales.jpg) no-repeat bottom right;
}

#contenedor #contenido .entrada.materiales ul li {	
	background: url(../img/teatro/bulletMateriales.jpg) no-repeat top left;
}

/*ENTRADAS - ACTIVIDADES*/
#contenedor #contenido .entrada.actividades {
	
}

#contenedor #contenido .entrada.actividades h1 {
	border-bottom: solid 4px #cc0000;
	padding: 42px 20px 5px;
	*padding: 44px 20px 5px;
}

#contenedor #contenido .entrada.actividades h3 {
	border-bottom: solid 2px #cc0000;
}

#contenedor #contenido .entrada.actividades .categoria {
	background: url(../img/teatro/categoriaActividades-trans.png) no-repeat top left;
}

#contenedor #contenido .entrada.actividades .chicha .leerMas a {
	color: #cc0000;
}

#contenedor #contenido .entrada.actividades .resumen {
	border: solid 4px #cc0000;
	background: url(../img/teatro/resumenActividades.jpg) no-repeat bottom right;
}


/*ENTRADAS - OPINION*/
#contenedor #contenido .entrada.opinion {
	
}

#contenedor #contenido .entrada.opinion h1 {
	border-bottom: solid 3px #89c03e;
	padding: 53px 20px 5px;
	*padding: 55px 20px 5px;
}

#contenedor #contenido .entrada.opinion h3 {
	border-bottom: solid 2px #89c03e;
}

#contenedor #contenido .entrada.opinion .categoria {
	background: url(../img/teatro/categoriaOpinion-trans.png) no-repeat top left;
}

#contenedor #contenido .entrada.opinion .chicha .leerMas a {
	color: #89c03e;
}

#contenedor #contenido .entrada.opinion .resumen {
	border: solid 4px #89c03e;
	background: url(../img/teatro/resumenOpinion.jpg) no-repeat bottom right;
}

#contenedor #contenido .entrada.opinion ul li {	
	background: url(../img/teatro/bulletOpinion.jpg) no-repeat top left;
}

/*ENTRADAS - OTROS*/
#contenedor #contenido .entrada.otros {
	
}

#contenedor #contenido .entrada.otros h1 {
	border-bottom: solid 4px #0892f5;
	padding: 40px 20px 5px;
	*padding: 42px 20px 5px;
}

#contenedor #contenido .entrada.otros h3 {
	border-bottom: solid 2px #0892f5;
}

#contenedor #contenido .entrada.otros .categoria {
	background: url(../img/teatro/categoriaOtros-trans.png) no-repeat top left;
}

#contenedor #contenido .entrada.otros .chicha .leerMas a {
	color: #0892f5;
}

#contenedor #contenido .entrada.otros .resumen {
	border: solid 4px #0892f5;
	background: url(../img/teatro/resumenOtros.jpg) no-repeat bottom right;
}

#contenedor #contenido .entrada.otros ul li {	
	background: url(../img/teatro/bulletOtros.jpg) no-repeat top left;
}

/*BARRA LATERAL*/
#contenedor #barraLateral {
	padding: 50px 0;
	width: 37%;
	float: left;
}

#contenedor #barraLateral h2 {
	font-size: 18px;
	padding: 10px 0;
}

#contenedor #barraLateral .chichaLateral {
	padding: 20px 20px 0 20px;
	font-size: 14px;
	clear: both;
}

#contenedor #barraLateral .chichaLateral #sobre {
	float: right;
}

#contenedor #barraLateral #categorias {
	font-size: 14px;
}

#contenedor #barraLateral #categorias img {
	float: left;
	clear: both;
}

#contenedor #barraLateral #categorias a {
	float: left;
	padding: 10px 0 0 10px;
}

#contenedor #barraLateral #banners {
	text-align: center;
}

/*PIE*/
#ecliente {
	float: right;
	padding: 40px 10px 5px;
}

#pie {
	width: 100%;
	background: #89c03e url(../img/teatro/pieFondo.jpg) repeat-x bottom left;
	height: 100px;
}

#pieCopy {
	width: 700px;
	margin: 0 auto;
	padding: 10px;
	text-align: center;
}
	
/*FOTOS*/
.foto- {
	float:left;
	margin:0 10px 5px 0;
}

.foto- p {
	font-style:italic;
	font-size:.8em;
	margin-top:5px;
	text-indent:0;
}

.foto-left {
	float:left;
	margin:0 10px 5px 0;
}

.foto-left p {
	font-style:italic;
	font-size:.8em;
	margin-top:5px;
	text-indent:0;
}

.foto-right {
	float:right;
	margin:0 0 5px 10px;
}

.foto-right p {
	font-size:.8em;
	font-style:italic;
	margin:5px 0 0;
	text-indent:0;
}

.foto-center {
	text-align:center;
	width:80%;
}

.foto-center p {
	font-size:.8em;
	font-style:italic;
	margin:5px 0 0;
	width:100%;
	text-indent:0;
}

/*COMENTARIOS*/
.haComentado {
	border: solid 1px #d6d6d6;
	padding: 1px;
	margin: 0 20px;
	min-height: 70px;
}

form#formularioComentarios input {
	width: 200px;
	float: left;
	height: 20px;
	margin: 5px;
	font-size: 16px;
}

form#formularioComentarios .labelComentario {
	width: 210px;
	float: left;
	clear: both;
	padding: 10px;
	text-align: right;
}

form#formularioComentarios textarea {
	clear: both;
	margin: 10px auto;
	padding: 10px;
	width: 420px;
	height: 200px;
}

#contenedor #contenido .entrada.materiales form#formularioComentarios textarea {
	border: solid 2px #d79325;
}

#contenedor #contenido .entrada.actividades form#formularioComentarios textarea {
	border: solid 2px #cc0000;
}

#contenedor #contenido .entrada.otros form#formularioComentarios textarea {
	border: solid 2px #0892f5;
}

#contenedor #contenido .entrada.opinion form#formularioComentarios textarea {
	border: solid 2px #89c03e;
}

form#formularioComentarios input#enviarComentario {
	background: url(../img/teatro/botonSiguiente.jpg) no-repeat top left;
	color: #fff;
	font-size: 13px;
	cursor: pointer;
	width: 150px;
	height: 30px;
	float: right;
	clear: both;
	border: none;
	padding: 5px;
	margin: 0;
	text-align: left;
}

.paginacionComentarios {
	text-align: center;
	width: 100%;
	margin: 20px 0;
}

/*Marionetas*/
a#marionetaGaia {
	position: absolute;
	top:100px;
	right: 825px;
	background: url(../img/teatro/marioneta_gaia.gif) no-repeat top left;
	width: 100px;
	height: 164px;
	cursor: default;
}

#bocadillo01 {
	position: absolute;
	background: url(../img/teatro/bocadillo1.gif) no-repeat top left;
	top:0px;
	right: 650px;
	width: 140px;
	height: 200px;
	padding: 20px 30px;
	text-align: center;
	font-size: 1.4em;
	font-style: italic;
}

#bocadillo01 span {
	font-size: 0.8em;
	float: right;
	clear: both;
	font-style: normal;
	font-weight: bold;
	padding: 5px 20px 0 0;
}

a#marionetaLocuro {
	position: absolute;
	top:700px;
	right: 825px;
	background: url(../img/teatro/marioneta_locuro.gif) no-repeat top left;
	width: 100px;
	height: 192px;
	cursor: default;
}

#bocadillo02 {
	position: absolute;
	background: url(../img/teatro/bocadillo11.gif) no-repeat top left;
	top:600px;
	right: 650px;
	width: 150px;
	height: 200px;
	padding: 40px 30px;
	text-align: center;
	font-size: 1.4em;
	font-style: italic;
}

#bocadillo02 span {
	font-size: 0.8em;
	float: right;
	clear: both;
	font-style: normal;
	font-weight: bold;
	padding: 10px 20px 0 0;
}

a#marionetaMeforro {
	position: absolute;
	top:400px;
	left: 825px;
	background: url(../img/teatro/marioneta_yomeforro.gif) no-repeat top left;
	width: 100px;
	height: 164px;
	cursor: default;
}

#bocadillo03 {
	position: absolute;
	background: url(../img/teatro/bocadillo2.gif) no-repeat top left;
	top:270px;
	left: 660px;
	width: 150px;
	height: 200px;
	padding: 40px 30px;
	text-align: center;
	font-size: 1.4em;
	font-style: italic;
}

#bocadillo03 span {
	font-size: 0.8em;
	float: right;
	clear: both;
	font-style: normal;
	font-weight: bold;
	padding: 10px 20px 0 0;
}

a#marionetaEsquelin {
	position: absolute;
	top:1100px;
	left: 825px;
	background: url(../img/teatro/marioneta_esquelin.gif) no-repeat top left;
	width: 100px;
	height: 192px;
	cursor: default;
}

#bocadillo04 {
	position: absolute;
	background: url(../img/teatro/bocadillo2.gif) no-repeat top left;
	top:960px;
	left: 680px;
	width: 150px;
	height: 200px;
	padding: 40px 30px;
	text-align: center;
	font-size: 1.4em;
	font-style: italic;
}

#bocadillo04 span {
	font-size: 0.8em;
	float: right;
	clear: both;
	font-style: normal;
	font-weight: bold;
	padding: 5px 5px 0 0;
}