﻿@charset "utf-8";

/* CSS Document */

h1, h2, h3, h4, h5, h6{
	font-family: georgia, serif;
	font-size: 2.5em;
	font-weight: 300;
	font-variant: small-caps;
	letter-spacing: 0.3em;
	line-height: 0.8em;
	color:#CFCFCF;
	margin-top: 0;
}

h2>a, h2>a:hover{
	font-family: georgia, serif;
	font-weight: 300;
	font-variant: small-caps;
	letter-spacing: 0.3em;
	line-height: 0.8em;
	color:#CFCFCF;
	margin-top: 0;
	text-decoration: none;
}

h2{
	font-size: 1.6em;   
	font-weight:200;
	letter-spacing: 0.2em;
}
  
h3{
	font-size: 1.4em;   
	font-weight: 200;
	letter-spacing: 0.1em;
}
  
h4{
	font-size: 1.2em;
	font-weight:200;
	letter-spacing: 0em;
}

p, a {
	font-family: helvetica, arial, sans-serif;
	font-size: 0.95em;
	font-weight:500;
	line-height: 1.2em;
	color: #AFAFAF;
	text-decoration: none;
}
	
a{
	text-decoration: underline;
	color: #CFCFCF;
}
	
a:hover{
	color: #FF9900;	
}

.smallcaps{
	font-variant: small-caps;
	letter-spacing: 0.3em;
	line-height: 1.3em;
}

.center{
	text-align: center;
}
	
.left{
	text-align: left;
}

.right{
	text-align: right;
}
	
.justify{
	text-align: justify;
}
	
p.advertencia, p.advertencia > a{
	color: #da3020;
	margin-top: 0;
}
	
p.advertencia > a:hover{
	color: #f26161;
}
	

/*GENERAL------------------------------------------------------------------------------------------*/

html, body{
	height: 100%;
	background: #303333 url(http://www.produccionescachivache.com/imagen/bck.png) top center;
}
	
body{
	font-size: 100%;
	padding: 0.3em 0 0.6em 0;
	margin: 0;
}

#page{
	width: 60em;
	margin: 0 auto 0 auto;
	padding-bottom: 1em;
}

#leftright{
	width: 60em;	
	background: url(http://www.produccionescachivache.com/imagen/colbottomnew.gif) bottom center no-repeat;
	margin-bottom: 0.5em;
	padding-bottom: 0.125em;
	overflow: hidden;	
	float: left;
}

#inner{	
	overflow: hidden;
	float: left;
}
	
#left, #right, #all{
	border: 0.125em solid #444;	
	background: #2B2B2B;
	text-align: center;
	overflow: hidden;
}
	
#left{
	width: 40.25em;
	margin: 0 0.5em -999em 0;	
	padding: 1em 1em 1000em 1em;
	float: left;
}

#right{
	width: 14.75em;	
	margin: 0 0 -999em 0;
	padding: 1em 1em 1000em 1em;
	float: right;
	}
	
#all{
	border: 0.125em solid #444;
	padding: 1em;
	margin: 0 auto 0.5em auto;	
	clear: both;
}

.columna{
	width: 42em;
	margin: 0em auto;
	background-color: transparent;
}

#ad{
	width: 254px;
	height: 254px;
	background: transparent url(http://www.produccionescachivache.com/cuentad.png);
	position: relative;
	left: -0.55em;
}

div#ad a{
	display: block;
	width: 254px;
	height: 254px;
	text-indent: -9999px;
	text-decoration: none;
}

/*HEADER -----------------------------------------------------------------------------------------------*/
	
#logo{
	font-size: 1em;
	background: #FF9900 url(http://www.produccionescachivache.com/imagen/logotypo.gif) no-repeat scroll center top;
	width: 60em;
	height: 4.4em;
	margin-top: 0;
	margin-bottom: 0.2em;
	text-indent: -9999px;
}

/*MENU -----------------------------------------------------------------------------------------------*/

#menu{
	text-align: center;
	margin: 0;
	padding: 0;
	list-style: none;
}
	
ul#menu li{
	float: left;
	width: 15em;
	margin-bottom: 0.5em;
}

#here, .goto{
	font-family: helvetica, arial, sans-serif;
	font-size: 1.4em;
	color: #000;
	margin: 0;
	border: 0.085em solid #333;
	border-top: 0;
	border-bottom: 0;
}
	
#here{	
	background-color: #FF9900;	
	cursor: default;
}

.goto, .goto:visited{
	color: #AFAFAF;
	background-color: #000;
	display: block;
	text-decoration: none;
}

.goto:hover, .goto:focus{
	color: #000;
	background-color: #FF9900;
}

.goto:active{
	color: #FF9900;
	font-style: italic;
	background-color: #111;
}
	
/*ESPECTACULOS------------------------------------------------------------------------------------------*/

.espectaculo, .espectaculo:visited{
	width: 15em;
	margin: 0.5em auto 0.5em auto;	
	display: block;
	background-color: #121212;
	font-family: "Times New Roman", Times, serif;
	font-size: 2.2em;
	color: #FF9900;		
	text-decoration: none;
	letter-spacing: 0.05em;
	padding-bottom: 0.1em;
	border-top: 1px solid #AA5500;
}
	
.espectaculo:hover, .espectaculo:active{
	text-decoration: none;
}

.espectaculo:hover{	
	color: #121212;
	background-color: #FF9900;	
}
	
.espectaculo:active{
	color: #FF9900;
	background-color: #121212;
}

p.espectaculo:hover, p.espectaculo:active{
	text-decoration: none;
}

p.espectaculo:hover{	
	color: #FF9900;
	background-color: #121212;	
}
	
p.espectaculo:active{
	color: #FF9900;
	background-color: #121212;
}
	
.espcontainer{
	width: 15em;
	font-size: 2.2em;
	margin: 0.5em auto 0.5em auto;
}
	
div.espcontainer  > p{
	font-size: 100%;
	margin-bottom: 0;
}
	
div.espcontainer  > a{
	float: left;
	font-size: 100% !important;
	margin: 0 !important;
	width: 7.5em !important;
	border-top: medium none !important;
}

/*ESPECTACULO------------------------------------------------------------------------------------------*/

.cartel{
	width: 19.562em;
	float: left;
	margin: 0 1em 1em 0;
	border: 0.2em solid #202020;
}
	
.sinopsis{
	text-align: left;
	position: relative;
	top: -1em;
}
	
.feten{
	width: 38em;
	margin: 0 auto 1em 0;
}

.elenco{
	text-align: center;
	clear:both;
}

p.elenco{
	line-height: 1.65em;
	font-variant: small-caps;
	vertical-align: middle;
}
	
#pic{
	width: 36em;
	border: 0.2em solid #202020;
	margin: 1em auto 1em auto;
}
	
.critica{
	width: 36.5em;
	border: 0.2em solid #202020;
	margin: 0em auto 1em auto;
	clear: both;
}
	
.archive0{
	width: 100%;
	margin: 2em auto;
}
	
.archive{
	float: left;
	width: 33.333%;
	margin: 2em auto;
}
	
.archive2{
	float: left;
	width: 50%;
	margin: 2em auto;
}

.rar{
	border: 0;
}

.rolla{
    width: 12em;
	height: 3em;
    margin: 0.5em auto;
	padding: 0;
    position: relative;
	font-size:1em;
}
	
.rolla li {
    margin: 0;
	padding: 0;
	list-style: none;
    position: absolute;
	top: 0;
}
	
.rolla li, .rolla a {
	font-size:1em;
    height: 3em;
	display: block;
}
	
.rollb {
	left: 0;
	width: 12em;
}

#sina{
	background: transparent url(http://www.produccionescachivache.com/imagen/master_botones.gif) no-repeat;
}
	
#sinb a:hover{
	background: transparent url(http://www.produccionescachivache.com/imagen/master_botones.gif) -12em 0 no-repeat;
}
	
#sinhere{
	background: transparent url(http://www.produccionescachivache.com/imagen/master_botones.gif) -24em 0 no-repeat;
}
	
#imga{
	background: transparent url(http://www.produccionescachivache.com/imagen/master_botones.gif) -36em 0 no-repeat;
}
	
#imgb a:hover{
	background: transparent url(http://www.produccionescachivache.com/imagen/master_botones.gif) -48em 0 no-repeat;
}
	
#imghere{
	background: transparent url(http://www.produccionescachivache.com/imagen/master_botones.gif) -60em 0 no-repeat;
}

#cria{
	background: url(http://www.produccionescachivache.com/imagen/master_botones.gif) 0 -3em no-repeat;
}
	
#crib a:hover{
	background: transparent url(http://www.produccionescachivache.com/imagen/master_botones.gif) -12em -3em no-repeat;
}
	
#crihere{
	background: transparent url(http://www.produccionescachivache.com/imagen/master_botones.gif) -24em -3em no-repeat;
}

#vida{
	background: url(http://www.produccionescachivache.com/imagen/master_botones.gif) -36em -3em;
}
	
#vidb a:hover{
	background: transparent url(http://www.produccionescachivache.com/imagen/master_botones.gif) -48em -3em no-repeat;
}
	
#vidhere{
	background: transparent url(http://www.produccionescachivache.com/imagen/master_botones.gif) -60em -3em no-repeat;
}
	
#guia{
	background: url(http://www.produccionescachivache.com/imagen/master_botones.gif) 0 -6em no-repeat;
}
	
#guib a:hover{
	background: transparent url(http://www.produccionescachivache.com/imagen/master_botones.gif) -12em -6em no-repeat;
}
	
#guihere{
	background: transparent url(http://www.produccionescachivache.com/imagen/master_botones.gif) -24em -6em no-repeat;
}
	
#desa{
	background: url(http://www.produccionescachivache.com/imagen/master_botones.gif) -36em -6em no-repeat;
}
	
#desb a:hover{
	background: transparent url(http://www.produccionescachivache.com/imagen/master_botones.gif) -48em -6em no-repeat;
}
	
#deshere{
	background: transparent url(http://www.produccionescachivache.com/imagen/master_botones.gif) -60em -6em no-repeat;
}
	
#dossa{
	background: url(http://www.produccionescachivache.com/imagen/master_botones.gif) 0 -9em no-repeat;
}
	
#dossb a:hover{
	background: transparent url(http://www.produccionescachivache.com/imagen/master_botones.gif) -12em -9em no-repeat;
}

#resa{
	background: url(http://www.produccionescachivache.com/imagen/master_botones.gif) -36em -9em no-repeat;
}
	
#resb a:hover{
	background: transparent url(http://www.produccionescachivache.com/imagen/master_botones.gif) -48em -9em no-repeat;
}
	
#reshere{
	background: transparent url(http://www.produccionescachivache.com/imagen/master_botones.gif) -60em -9em no-repeat;
}

/*HISTORIA------------------------------------------------------------------------------------------*/

.scrollable {
	position:relative;
	overflow:hidden;
	width:46em;
	height:15em;
	left:4em;
}

.scrollable .items {
	width:20000em;
	position:absolute;
	clear:both;
}

.items div {
	float:left;
	width:44em;
	height:15em;
	text-align:center;
	padding:0 1em;
}

.intextl{
	width:23em !important;
}

.intextr{
	width:23em !important;
	float:right !important;
}

.scrollable {
	float:left;	
}

a.browse {
	background:url(../imagen/scroll_sprite.png) no-repeat;
	display:block;
	width:32px;
	height:32px;
	float: left;
	cursor:pointer;
	position: relative;
	top: 7.5em;
}

a.right {
	background-position: -32px 0;
	float: right;
	right: 2em;	
}
	
a.right:hover {
	background-position: -32px -32px;
	}

a.left{
	margin-left: 0px;
	left:2em;
}

a.left:hover{
	background-position: 0 -32px;
	margin-left: 0px;
}

a.disabled {
	visibility:hidden !important;		
} 

.hline{
	width: 100%;
	margin: 0 auto 1em auto;
	padding: 0;
	border-bottom: 0.125em solid #444;
	clear: both;
}

#zoo{
	background:url(http://www.produccionescachivache.com/secciones/historia/imagen/zoo.jpg) no-repeat;
}

#alquimista{
	background:url(http://www.produccionescachivache.com/secciones/historia/imagen/alquimista.jpg) no-repeat;
}

#ciego{
	background:url(http://www.produccionescachivache.com/secciones/historia/imagen/ciego.jpg) no-repeat;
}

#carcoma{
	background:url(http://www.produccionescachivache.com/secciones/historia/imagen/carcoma.jpg) no-repeat;
}

#pate{
	background:url(http://www.produccionescachivache.com/secciones/historia/imagen/pate.jpg) no-repeat;
}

#fantasma{
	background:url(http://www.produccionescachivache.com/secciones/historia/imagen/fantasma.jpg) no-repeat;
}

#yepeto{
	background:url(http://www.produccionescachivache.com/secciones/historia/imagen/yepeto.jpg) no-repeat;
}

#cirilinda{
	background:url(http://www.produccionescachivache.com/secciones/historia/imagen/cirilinda.jpg) no-repeat;
}

#quijote{
	background:url(http://www.produccionescachivache.com/secciones/historia/imagen/quijote.jpg) no-repeat;
}

#mangolele{
	background:url(http://www.produccionescachivache.com/secciones/historia/imagen/mangolele.jpg) no-repeat;
}

#federico{
	background:url(http://www.produccionescachivache.com/secciones/historia/imagen/federico.jpg) no-repeat;
}

#macbeth{
	background:url(http://www.produccionescachivache.com/secciones/historia/imagen/macbeth.jpg) no-repeat;
}

#coloquio{
	background:url(http://www.produccionescachivache.com/secciones/historia/imagen/coloquio.jpg) no-repeat;
}

#pamplinas{
	background:url(http://www.produccionescachivache.com/secciones/historia/imagen/pamplinas.jpg) no-repeat;
}

#romano{
	background:url(http://www.produccionescachivache.com/secciones/historia/imagen/romano.jpg) no-repeat;
}

#ilusion{
	background:url(http://www.produccionescachivache.com/secciones/historia/imagen/ilusion.jpg) no-repeat;
}

#piquetitos{
	background:url(http://www.produccionescachivache.com/secciones/historia/imagen/piketitos.jpg) no-repeat;
}

#papel{
	background:url(http://www.produccionescachivache.com/secciones/historia/imagen/papel.jpg) no-repeat;
}

#criaturas{
	background:url(http://www.produccionescachivache.com/secciones/historia/imagen/criaturas.jpg) no-repeat;
}

#saludador{
	background:url(http://www.produccionescachivache.com/secciones/historia/imagen/saludador.jpg) no-repeat;
}

#plata{
	background:url(http://www.produccionescachivache.com/secciones/historia/imagen/plata.jpg) no-repeat;
}

#viento{
	background:url(http://www.produccionescachivache.com/secciones/historia/imagen/viento.jpg) no-repeat;
}

#luces{
	background:url(http://www.produccionescachivache.com/secciones/historia/imagen/luces.jpg) no-repeat;
}

#negra{
	background:url(http://www.produccionescachivache.com/secciones/historia/imagen/negra.jpg) no-repeat;
}

#dionisio{
	background:url(http://www.produccionescachivache.com/secciones/historia/imagen/dionisio.jpg) no-repeat;
}

#nona{
	background:url(http://www.produccionescachivache.com/secciones/historia/imagen/nona.jpg) no-repeat;
}

#adan{
	background:url(http://www.produccionescachivache.com/secciones/historia/imagen/adan.jpg) no-repeat;
}

#suenos{
	background:url(http://www.produccionescachivache.com/secciones/historia/imagen/suenos.jpg) no-repeat;
}

#tataracine{
	background:url(http://www.produccionescachivache.com/secciones/historia/imagen/tataracine.jpg) no-repeat;
}

#cuernos{
	background:url(http://www.produccionescachivache.com/secciones/historia/imagen/cuernos.jpg) no-repeat;
}

#linterna{
	background:url(http://www.produccionescachivache.com/secciones/historia/imagen/linterna.jpg) no-repeat;
}

#desvan{
	background:url(http://www.produccionescachivache.com/secciones/historia/imagen/desvan.jpg) no-repeat;
}

#taquillera{
	background:url(http://www.produccionescachivache.com/secciones/historia/imagen/taquillera.jpg) no-repeat;
}

#jean{
	background:url(http://www.produccionescachivache.com/secciones/historia/imagen/jean.jpg) no-repeat;
}

#cuentiritillos{
	background:url(http://www.produccionescachivache.com/secciones/historia/imagen/cuentiritillos.jpg) no-repeat;
}

#desvanesp{
	background:url(http://www.produccionescachivache.com/secciones/historia/imagen/desvanesp.jpg) no-repeat;
}
	
/*MAPA------------------------------------------------------------------------------------------*/

#columnamapa1{
	width: 20em;
	margin: 1em auto;
	background-color: transparent;
	text-align: left;
	position: relative;
	left:6em;
	float: left;
}
	
#columnamapa2{
	width: 20em;
	margin: 1em auto;
	background-color: transparent;
	text-align: left;
	position: relative;
	left:12em;
	top:1em
}
	
.mapa{
	list-style: outside square;
	margin: 0;
	padding-left: 3em;
}
 
.big{
	font-size: 1.1em;
	font-weight: bold;
}

.mbig{
	font-size: 0.9em;
	font-weight: normal;
}

/*FOOT-----------------------------------------------------------------------------------*/

.foot{
	width: 59.75em;
	height: 3em;
	clear: both;
	border: 0.125em solid #444;
	margin: 0 auto 0 auto;
	background-color: #2B2B2B;
	text-align: justify;
}
	
#copyyear{
	font-variant: small-caps;
	letter-spacing: 0.3em;
	float:left;
	margin: 1em 0 1em 1em;
}

#year{
	padding-left:2em;
}

#w3c{
	width: 12.5em;
	margin: 0.575em 1em 0.575em 1em;
	text-align: center;
	float: right; 
}

.w3cpic{
	border: 0;
	width: 5.5em;
	height: 1.9em;
}
	
/*------------------------------*/

.quoted{
	border:none;
	width: 4em;
	height: 1.7em;
	position: relative;
	left: -13em;
}

.quo{
	width: 20em;
	position: relative;
	left:12em;
	top: -2.5em;
}

.hidden{
	display: none;
	visibility: hidden;
	padding: 0;
	margin: 0;
}
	
.cleaner{
	visibility: hidden;
	padding: 0;
	margin: -1px 0 0 0;
	height: 1px;
	clear: both;
}

