/*-----------------------------------------------------------------------------------------------------/
	Reset, general
/-----------------------------------------------------------------------------------------------------*/
*{margin:0; padding:0; text-decoration:none; list-style:none; border:none}
.left{float:left}
.right{float:right}
.padding{padding:5px}
.wrapp{margin:auto; overflow:hidden}

 /* alineacion de textos */
.align_left{text-align:left}
.align_right{text-align:right}
.align_center{text-align:center}
.align_justify, .contenido{text-align:justify}



/*-----------------------------------------------------------------------------------------------------/
	Tipografias, colores, backgrounds
/-----------------------------------------------------------------------------------------------------*/
body{background-image:url(../imagenes/bg.png)}
#wrapper{background-color:#E6D6BD}
h2{text-transform:uppercase; font-size:15px; font-weight:bold}
.texto{color:#39291D; font:12px Arial, Verdana}
#cabecera{background-image:url(../imagenes/cabecera_footer.jpg)}
/* izq */
.contenido{line-height:16px; font-size:13px}
.box_home, #novedades .wrapp{background:#DACAB0}
	.box_home p a, #right_side ul li a:hover, #paginador a{color:#4F908A; font-weight:bold}
	.box_home p a:hover, #paginador a:hover{color:#39291D}
/* der */
#right_side{background-color:#D6C5AB}
	#right_side ul li a{font-size:13px; font-weight:bold; color:#39291D}/* hoy en cine, hoy en teatro */
/* foot */
#footer{background:url(../imagenes/cabecera_footer.jpg) 0 -253px; color:#E6D6BD}
	#footer p.left{font-size:13px; line-height:20px}
	#footer p.right{line-height:15px}
		#footer p a{color:#E6D6BD}
		#footer p a:hover{color:#4F908A}



/*-----------------------------------------------------------------------------------------------------/
	Layouts principales
/-----------------------------------------------------------------------------------------------------*/
#wrapper{width:1000px}
	#cabecera{width:1000px; height:253px}
	#contenido{width:938px; padding-bottom:50px}
		/* izq */
		#left_side, .home_cine_teatro .wrapp{width:645px}
			.box_home{width:208px; margin:20px 7px 0 0}
			.box_home h2{margin-top:10px; margin-bottom:15px; height:18px; overflow:hidden}
			.box_home .wrapp{width:198px; height:30px}
			.contenido{margin-top:25px; padding-left:3px; padding-right:5px}
			.contenido p{margin-top:10px; margin-bottom:10px}
		/* der */
		#right_side{width:268px; padding-top:41px; padding-bottom:30000px; margin-bottom:-30000px}
			#right_side ul{padding:25px; padding-top:10px; line-height:18px}/* hoy en cine, hoy en teatro */
	#footer{height:127px}
		#footer .wrapp{height:93px; margin-top:17px}
		#footer p.left{width:701px; margin-top:30px}
		#footer p.right{width:160px; height:15px; margin-top:42px}



/*-----------------------------------------------------------------------------------------------------/
	Titulos
/-----------------------------------------------------------------------------------------------------*/
.titulo{margin-top:30px; height:35px; background:url(../imagenes/titulos.gif)}
#titulo_cine{background-position:0 -245px; height:30px}
#titulo_teatro{background-position:0 -275px; height:30px}
#titulo_novedades{margin-bottom:30px; background-position:0 -376px}
#titulo_la_sala{background-position:0 -35px}
#titulo_historia{background-position:0 -70px}
#titulo_producciones{background-position:0 -105px}
	#titulo_producciones_fotos{background-position:0 -316px; height:30px}
	#titulo_producciones_videos{background-position:0 -346px; height:30px}
#titulo_contacto{background-position:0 -140px}
#titulo_abonos{background-position:0 -210px}
#titulo_talleres{background-position:0 -175px}
#right_side h2{background:#BEAA92; padding-left:25px}
h2.padding{padding:0; padding-top:25px; font-size:16px}
h3{margin-top:25px; margin-bottom:10px}



/*-----------------------------------------------------------------------------------------------------/
	Recuadro verde que se encuentra en la cabecera (logos youtube, facebook, blog)
/-----------------------------------------------------------------------------------------------------*/
#recuadro_verde{position:relative; right:82px; width:164px; height:102px; font-size:13px; color:#FFF}/*cuando haya enlace quitar color:#fff*/
	#recuadro_verde p{margin-top:40px; margin-bottom:10px}
	#recuadro_verde li{display:inline; margin:5px}
	/* hover */
	#recuadro_verde li img:hover{height:20px; padding:0 1px 1px}
	#logo_youtube img:hover{width:49px}
	#logo_facebook img:hover{width:19px}
	#logo_blog img:hover{width:18px}



/*-----------------------------------------------------------------------------------------------------/
	Menu
/-----------------------------------------------------------------------------------------------------*/
#menu{position:relative; top:200px; right:-153px; width:475px; height:45px; font-size:14px; line-height:45px}
#menu li{display:inline; text-transform:uppercase; margin-left:4.5px; margin-right:4.5px}
#menu li a{color:#523325; font-weight:bold}
#menu li a:hover{color:#4F908A}



/*-----------------------------------------------------------------------------------------------------/
	Secciones por separado
/-----------------------------------------------------------------------------------------------------*/
/* novedades (home) */
#novedades h2{margin-bottom:10px}
#novedades .wrapp{margin-top:15px}
#novedades .right{width:435px; height:138px; overflow:hidden}
#novedades .right .novedad{height:113px; margin-top:12px; margin-right:10px; overflow:hidden}

/* paginador */
#paginador{margin:20px; font-size:14px; font-weight:bold}


/* volver */
#volver{width:645px; height:13px; margin-top:25px}
#volver .left{width:520px; height:15px; margin-top:2px; background:url(../imagenes/titulos.gif) -3px -305px no-repeat}
#volver a{color:#4F908A; font-size:13px; font-weight:bold; padding-right:5px}
#volver a:hover{color:#39291D}


/* pelicula u obra ampliada */
#peli_obra_ampliado img{margin-top:25px}
#dias_horarios, #dias_horarios div.wrapp{width:300px}
#dias_horarios .impar{background:#DACAB0}


/* botones flash talleres y abonos (derecha) */
#flash_right div{margin-top:20px}


/* la sala / empresa */
div#sala{margin-bottom:-10px}
div#historia{margin-bottom:80px}
.sala_historia_p p{margin-bottom:15px; line-height:18px}
img#img_la_sala{position:absolute; left:50%; margin-left:183px; margin-top:20px}
img#img_historia{position:absolute; left:50%; margin-left:188px; margin-top:20px}


/* producciones */
/* fotos */
#fotos .screen .next, .screen .prev{position:absolute; top:150px}
#fotos .screen .prev{left:65px}
#fotos .screen .next{right:65px}
#fotos #producciones_fotos{width:636px; height:347px; background:url(../imagenes/producciones_fotos_videos.jpg)}
	#fotos #producciones_fotos p a{font-size:30px; color:#39291D}
	#fotos .sections{overflow:hidden; width:417px;	height:317px; margin-top:27px; margin-left:106px} /* overflow:hidden es necesario */
		#fotos .sections h2{text-align:center; margin-top:12px}

/* videos */
#videos .screen .next, .screen .prev{position:absolute;	top:150px}
#videos .screen .prev{left:100px}
#videos .screen .next{right:100px}
#videos #producciones_videos{width:636px; height:349px; background:url(../imagenes/producciones_fotos_videos.jpg) 0 -347px}
	#videos #producciones_videos p a{font-size:30px; color:#39291D}
	#videos .sections{overflow-x:hidden; width:345px; height:317px; margin-top:29px; margin-left:142px} /* overflow:hidden es necesario */

/* fotos / videos */
.screen{position:relative; left:-2px; width:636px}
.sections ul{width:9999px}
.sections li{float:left}
.navigation ul{width:610px; margin-top:10px}
.navigation li{float:left; margin:2px; width:57px; height:38px}
.navigation li img:hover{width:55px; height:36px; padding-top:1px; padding-left:1px}


/* contacto */
/* left */
.aclara{font-size:12px; font-weight:normal}
#contacto form input, #contacto form textarea{width:235px; margin-top:5px; margin-bottom:10px; border:solid 1px #836e5d}
#contacto form input.padding{padding-top:7px; padding-bottom:7px}
#contacto form textarea{height:120px}
#contacto form p{font-weight:bold}
/* boton enviar */
#contacto #enviar{margin-top:-25px; margin-right:10px}
#contacto #enviar input{width:88px; height:22px; padding-bottom:2.5px; border:0; background:url(../imagenes/contacto_enviar.gif) no-repeat; color:#FFF; font-weight:bold}
#contacto #enviar input:hover{cursor:pointer}
p#enviado{margin-top:30px; padding:5px; background-color:#D6C5AB; border:solid 2px #836e5d}
/* right (datos de contacto) */
#contacto .right{margin-top:10px; margin-right:30px; font-size:20px; line-height:28px}
#contacto .right p{margin-bottom:35px}

/* right mapa */
#contacto_mapa{margin-top:80px}

