/* Start of CMSMS style sheet 'estilo_er' */
/* CSS BASICO DE KIKE RENTA*/
/* MMO, Miercoles, Agosto 5, 2009 8:14 PM*/



/*"""""""" EMPIEZA GENERALES """"""""*/	

body {
	margin: 0px 0px 0px 0px; /* n6.01win n6mac won't recognize top margin for middle box, so it goes here */
	padding: 0px 0px 0px 0px;
	font-family:  Georgia,"Times New Roman",Times,serif;/* tipografia basica */
	font-size: 0.8em;
	color: #161515;
        color: rgb(22, 21, 21);
	/*color: ; #FEF9D3 amarillo de blog*/
	/*color: rgb(); 254, 249, 211*/
	/*background-color: transparent; */
        line-height: 1.5em;
	vertical-align: baseline;
	letter-spacing: 0.1em;
	word-spacing: 0.1em;
	font-weight: bold;
	font-style: normal;
	font-variant: normal;
	text-transform: none;
	text-decoration: none;
	text-align: start;
	text-indent: 0px;
	}
	
html, body {margin:0; padding:0; width:100%; height:100%;}
	


	
/*no border alrededor de imagenes */
img, img a {border: 0;} /* se junta, menos codigos */

/*termina los no border alrededor de imagenes */


/* invisible, se hara visible en print_re.css para que se imprima */
#impresos { display: none;}

/* codigos para acesibilidad*/
.bckets { color: #ffffff;}/* brackets para indicar que comienza y termina enlaces que esten corridos  blanco calido del fondo */
	
	
/* brackets para hover*/
.bckets_hover { color: #d43927;}/* brackets para indicar seleccion de menus */




/* para brincar a contenido y menu. fuera de pantalla, no se ve */
#jump_menu, #jump_menu a:link, #jump_menu a:hover, #jump_menu a:active, #jump_menu a:visited, #accesible_menu, #accesible_menu a:link, #accesible_menu a:hover, #accesible_menu a:active, #accesible_menu a:visited { 
	position: absolute;
	top: -100px;
	left: -999px;
	}


/*"""""""" 	TERMINAN GENERALES """"""""*/	








/*"""""""" EMPIEZA TIPOGRAFIA """"""""*/	


/*Empiezan controlan el color de los links en los cuerpos de textos en CONTENT */	
body a,  body a:visited {
	text-decoration: none;
	color: #ffffff;  /*#FFFFFF;blanco del blog*/
	outline: none;
	font-weight: bold;
	}
/*Terminan  class controlan el color de los links en los cuerpos de textos */	



/*/////PARA TITULO DE SECCION Y PAG//////////*/
H1.spin { /*header*/
	font-size: 1.4em;
	text-transform:  lowercase;
	font-family: Verdana, Arial, Helvetica, san serif;

	}
	

H2.spin { /*seccion*/
	position: relative;
	left:30px;
	top: 25px;
	font-family: Verdana, Arial, Helvetica, san serif;
	font-size: 1.8em;
	text-transform:  lowercase;
	color: #000000;

	}

	
/*/////PARA FOOTER//////////*/
h4 { 
	font-family: Verdana, Arial, Helvetica, san serif;
	font-size: .7em;
	color: #000000;
	font-weight: bold;
}




/*/////PARA MAIN TOP MENU//////////*/
/*sube tamaño de letra en mouseover del main menu */
#works a:hover, #bio a:hover, #essays a:hover, #blog a:hover{
	font-size: 2.7em;
	color: #FFFFFF;
}

/*sube tamaño de letra en mouseover secciones del main menu (su sub estilo_fuente) y del sub menu (seccion) */
#estilo_fuente a:link, #estilo_fuente a:active, #estilo_fuente a:visited, #sub_menu_seccion a:link, #sub_menu_seccion a:active, #sub_menu_seccion a:visited {
	font-size: 1.2em;
	color: #FEF9D3;/*amarillo de blog*/
	color: rgb(254, 249, 211);
}

/* las opciones del main menu, todos menos BLOG que no tiene */
#estilo_fuente a:hover {
	font-size: 2.9em;
	color: #FFFFFF;
}
	
/*sube tamaño de letra en mouseover secciones del sub menu (seccion) */
#sub_menu_seccion a:hover, #sub_menu_seccion_ocurrido a:hover,  {
	font-size: 1.7em;
	color: #ffffff;
}

/* para seccion solamente de ocurrido#sub_menu_seccion_ocurrido a:hover */
#sub_menu_seccion_ocurrido a:link, #sub_menu_seccion_ocurrido a:active, #sub_menu_seccion_ocurrido  a:visited {
	color: #ffffff;/*blanco*/
}
	
/* para obra en contenido, no puede ser negro por asi esta trasparente para scrollbar */
#obra_texto { 
	font-family: Verdana, Arial, Helvetica, san serif;
	font-size: .7em;
	color: #000033;
	font-weight: bold;
	white-space: normal;
	line-height: 1.5em;
	
}

#contenido .img { 
	vertical-align: baseline;
}

/* para obra en contenido, no puede ser negro por asi esta trasparente para scrollbar */
#cronica_texto { 
	font-weight: normal;
	font-style: normal;
	font-variant: normal;
	color: #663300;

}

#cronica_texto_title {
	font-weight: bold;
	color: #663300;
}
	
#ocurrido_texto { 
	font-weight: bold;
	font-style: normal;
	font-variant: normal;
	color: #161515;
        color: rgb(22, 21, 21);
	text-indent: 2%;

}

#italic { /* para ocurrido */
 font-style: italic;
 }

#ocurrido_texto_ocurrido {
	font-weight: bold;
	color: #161515;
        color: rgb(22, 21, 21);
       /* color: #384654; griz lindo */
       /* color: rgb(56, 70, 84); griz lindo */

}	
	
/*"""""""" TERMINA TIPOGRAFIA """"""""*/	


	





/*"""""""" EMPIEZA LAYOUT """"""""*/	

/*//////////MAIN TOP MENU//////////*/
/*PORTAFOLIO DE KIKE*/
#works {
        font-size:0.8em;
	text-transform:  lowercase;
	font-weight: bold ;
	width: 200px;
	padding:8px;
	color:#333;
	position: absolute;
	z-index: 2;
	left: 31px;
	top: 66px;
	/*border:solid 1px #000000;*/
}

/*fluidos*/
#mainmenu_1 {
	margin-left:180px;
	margin-top: -40px;
}

/*promiscuos*/
#mainmenu_2 {
	margin-left:20px;
	margin-top: -30px;
}


/*tierra*/
#mainmenu_3 {
	margin-left:200px;
	margin-top: -60px;
}


/*despacio*/
#mainmenu_4 {
	margin-left:40px;
	margin-top: -90px;
}


/*circuitos*/
#mainmenu_5 {
	margin-left:50px;
	margin-top: -60px;
}


/*transcapes*/
#mainmenu_6 {
	margin-left:300px;
	margin-top: -70px;
}


/*(PR)e(textos*/
#mainmenu_12 {
	margin-left:300px;
	margin-top: -70px;
}


/*BIOGRAFIA DE KIKE*/
#bio {
	width: 250px;
	padding:8px;
	color:#333;
	position: absolute;
	z-index: 2;
	left: 350px;
	top: 27px;
	/*border:solid 1px #000000;*/
}

/*identidad*/
#mainmenu_7 {
	margin-left:-80px;
	margin-top: -40px;
}

/*redactado*/
#mainmenu_8 {
	margin-left:100px;
	margin-top: -30px;
}



/*ENSAYOS SOBRE KIKE*/
#essays {
       font-size:0.6em;
	text-transform:  lowercase;
	width: 250px;
	padding:8px;
	color:#333;
	position: absolute;
	z-index: 4;
	left: 613px;
	top: 7px;
	/*border:solid 1px #000000;*/
}

/*renta_05*/
#mainmenu_9 {
	margin-left:-80px;
	margin-top: -40px;
}

/*trelles_05*/
#mainmenu_10 {
	margin-left:100px;
	margin-top: -30px;
}

/*alvarez_05*/
#mainmenu_11 {
	margin-left:70px;
	margin-top: -70px;
}



/*BLOG para portada*/
/*Efecto de burn para fondo "repeatable"*/
#burn{
        position:absolute;
        z-index:1;
        left:0px;
        top:0px;
        width:405px;
        height:240px;
        background-image:url(images/burn.png);
        background-repeat:no-repeat;
}

/*Valores para div de el blog*/
#blog {
        font-size:0.8em;
	text-transform:  lowercase;
	font-weight: bold ;
	width: 100px;
	padding:1px;
	color: #FEF9D3; /*amarillo de blog*/
	color: rgb(254, 249, 211);
	position: absolute;
	z-index: 1;
	left: 230px;
	top: 250px;
	/*border:solid 1px #000000;*/
}

/*////////END MAIN TOP MENU//////////*/


/*////////EMPIEZA SUB MENU//////////*/

#sub_menu_seccion {
	position:relative; 
	z-index:2; 
	left:70px;
	top:220px;
	width:300px;
	height:auto;
	/*border:2px solid #000;*/
}


#sub_menu_seccion_ocurrido {
	position:relative; 
	z-index:2; 
	left:570px;
	top:220px;
	width:300px;
	height:auto;
	/*border:2px solid #000;*/
}

/*arte (blog, fluido (obra),  identidad (ocurrido)*/
#categoria_01 {
	margin-left:210px;
	margin-top: -70px;
}

/*Literatura (blog, redactado (ocurrido)*/
#categoria_02 {
	margin-left:150px;
	margin-top: -40px;
}

/*Viaje (blog, tierra (obra)*/
#categoria_03 {
	margin-left:90px;
	margin-top: -40px;
}

/*Ambiente (blog, despacio (obra)*/
#categoria_04 {
	margin-left:180px;
	margin-top: -50px;
}


/*Cine (blog), circuito (obra), challenge (cronica)*/
#categoria_05 {
	margin-left:70px;
	margin-top: -100px;
	
}


/*transcapes (obra)*/
#categoria_06 {
	margin-left:150px;
	margin-top:-40px;
	
}

/*cronica*/
#categoria_07 {
	margin-left:40px;
	margin-top:0px;
	
}

/*tropico (obra) */
#categoria_08 {
	margin-left:0px;
	margin-top:-40px;
	
}

/*statement (cronica) */
#categoria_09 {
	margin-left:20px;
	margin-top: -70px;
}


/*para mas (obra) */
#categoria_10 {
	/*margin-left:0px;*/
	/*margin-top: 0px;*/
}

/*////////END SUB MENU//////////*/






/*////////EMPIEZA CONTENIDO//////////*/

#contenido {
	position:absolute; 
	width:500px;
	z-index:3; 
	left:460px;
	top:70px;
	overflow: auto; /*crea un scroll en layer */
	height: 500px; 
	padding-right: 5px;
	scrollbar-track-color: #000000; 
	scrollbar-face-color: #000000; 
	scrollbar-shadow-color: #000000; 
	scrollbar-dark-shadow-color: #000000; 
	scrollbar-highlight-color: #FEF9D3; 
	scrollbar-3d-light-color: #FEF9D3; 
	scrollbar-arrow-color: #003366;
	allowtransparency:true;
	filter: chroma(color=#000000);
	/*border:2px solid #000;*/
}

/* contenido_blog, que tiene dos #blog_texto */
#contenido_blog {
	position:absolute; 
        margin-left: -240px;
	left:460px;
	top:70px;
	height: 500px; 
	padding-right: 5px;
	scrollbar-track-color: #000000; 
	scrollbar-face-color: #000000; 
	scrollbar-shadow-color: #000000; 
	scrollbar-dark-shadow-color: #000000; 
	scrollbar-highlight-color: #FEF9D3; 
	scrollbar-3d-light-color: #FEF9D3; 
	scrollbar-arrow-color: #003366;
	allowtransparency:true;
	/*border:2px solid #000;*/
}

/*para plantilla de blog*/
#blog_texto {
        font-size:0.8em;
	text-transform:  lowercase;
	font-weight: bold ;
	width: 300px;
	padding:1px;
	color: #FEF9D3; /*amarillo de blog*/
	color: rgb(254, 249, 211);
	position: absolute;
	z-index: 0;
	left: 0px;
	top: 0px;
	/*border:solid 1px #000000;*/
}

/* contenido_ocurrido */
#contenido_ocurrido {
	position:relative; 
	width:500px;
	z-index:4; 
	left:60px;
	top:100px;
	overflow: auto; /* crea un scroll en layer */
	height: 300px; 
	padding-right: 5px;
	scrollbar-track-color: #000000; 
	scrollbar-face-color: #000000; 
	scrollbar-shadow-color: #000000; 
	scrollbar-dark-shadow-color: #000000; 
	scrollbar-highlight-color: #FEF9D3; 
	scrollbar-3d-light-color: #FEF9D3; 
	scrollbar-arrow-color: #003366;
	allowtransparency:true;
	filter: chroma(color=#000000);
		/*border:2px solid #000;*/

}

/*"""""""" EMPIEZA SCROLLBAR """"""""*/
/*http://www.hesido.com/web.php?page=customscrollbar*/
#mycustomscroll {
	width: 290px;
	height: 380px;
	overflow: auto;
	position: relative;
	z-index:4;
	left:60px;
	top:100px;
	border:2px solid #000;/**/
	}

/*"""""""" TERMINA SCROLLBAR """"""""*/




/*"""""""" EMPIEZA NEXT OBRA """"""""*/
.flechas_rojas {
	color: #990000; /*rojo marron*/
	color: rgb(153, 0, 0);
	}


/*"""""""" TERMINA NEXT OBRA """"""""*/

/*////////END CONTENIDO//////////*/





/*////////CAJAS PARA IDENTIFICAR PAG Y SECCION//////////*/

/*Titulo Enrique Renta junto a nombre de seccion*/

#header {
	position:absolute; 
	z-index:2; 
	left:10px;
	top:400px;
	width:200px;
	/*border:1px solid #000;*/
}


#header_ocurrido {
	position:absolute; 
	z-index:2; 
	left:590px;
	top:400px;
	width:200px;
	/*border:1px solid #000;*/
}

#footer {
	position:absolute; 
	z-index:2; 
	left:20px;
	top:500px;
	width:500px;
	/*border:1px solid #000;*/
}
/*////////END CAJAS PARA IDENTIFICAR PAG Y SECCION//////////*/

/*"""""""" TERMINA LAYOUT """"""""*/	



/*LOS PAGE CLASS OSEA, CAMBIA BODY SEGUN PAG */
/*"""""""" EMPIEZA FONDO SEGUN PAGE CLASS """"""""*/	

#fondo_blog {
	position:absolute; 
	z-index:1; 
	width:100%; 
	height:100%;
}

/*"""""""" TERMINA FONDO SEGUN PAGE CLASS """"""""*/	





/*"""""""" EMPIEZA ESCALA DE SECCION SEGUN PAGE CLASS """"""""*/	

/* empieza para afectar class segun pagina funciona con page_class del body */
 /* se hace un class para asignar cosas particulares*/
/* http://wiki.cmsmadesimple.org/index.php/Share_your_tags_here*/


/* en user desifen se hace page_class*/
/*se pone en el body <body class="{page_class}"> */
/* global $gCms;*/
/* $classes = array();*/
/* $manager =& $gCms->GetHierarchyManager();*/
/* $thisPage = $gCms->variables['content_id'];*/
/* $currentNode = &$manager->sureGetNodeById($thisPage);*/
/* while( isset($currentNode) && $currentNode->getLevel() >= 0 )*/
/* {*/
    /* $currentContent =& $currentNode->getContent();*/
    /* array_unshift($classes, $currentContent->Alias());*/
    /* $currentNode =& $currentNode->getParentNode();*/
/* }*/
/* echo implode($classes, ' ') . ' ' . implode($classes, '-') . ' ' . 'page-' . $thisPage;*/

/*to affect "en" page and all it's children */
/*body.en {*/
   /* style declarations*/
/*}*/
/*to affect only that specific page*/
/*this is not 100% proof, and might break in cases where you have similar URLs:*/
/* /en/some/page/ and /en/some-page/ will result in the same class name*/
/* for these cases you can use the ID of the page*/
/*body.en-some-page {*/
   /* style declarations */
/*} */
/* uses ID of the page */
/*body.page-23 { */
   /* style declarations */
/*}*/
 
/* CAMBIA LA SECCION A + GRANDE Y NEGRO */

/*body.overview #menu_main li.rojo_seccion2_main a {color: #d43927;}  ejemplo rojo*/  

/*to affect only "blog" pages */
body.blog body {background-color: #67654E;} /* verde olivo*/ 


/*to affect only "cronica" pages  */
body.renta_05 #categoria_09 a {color: #000000; font-size:1.3em;}
body.trelles_05 #categoria_07 a {color: #000000; font-size:1.3em;}
body.alvarez_05 #categoria_05 a {color: #000000; font-size:1.3em;}



/*to affect only "ocurrido" pages */
body.identidad #categoria_01 a {color: #000000; font-size:1.3em;} /**/ 
body.redactado #categoria_02 a {color: #000000; font-size:1.3em;}


/*to affect only "portafolio" pages and all its childrens */
body.Fluido_00 #categoria_01 a {color: #000000; font-size:1.3em;}
body.Tropicos_00 #categoria_08 a {color: #000000; font-size:1.3em;}
body.Tierra_00 #categoria_03 a {color: #000000; font-size:1.3em;}
body.despacio_00 #categoria_04 a {color: #000000; font-size:1.3em;}
body.Circuitos_00 #categoria_05 a {color: #000000; font-size:1.3em;}
body.Transcapes_00 #categoria_06 a {color: #000000; font-size:1.3em;} 
body.pretextos_00 #categoria_07 a {color: #000000; font-size:1.3em;}




/*"""""""" TERMINA FONDO SEGUN PAGE CLASS """"""""*/	





/*"""""""" LIGHTBOX PARA COMPOSICIONES """"""""*/

#lightbox{
	background-color:#eee;
	padding: 10px;
	border-bottom: 2px solid #666;
	border-right: 2px solid #666;
	}
#lightboxDetails{
	font-size: 0.8em;
	padding-top: 0.4em;
		color: #000000;
	}	
#lightboxCaption{ float: left; }
#keyboardMsg{ float: right; }
#closeButton{ top: 5px; right: 5px; }

#lightbox img{ border: none; clear: both;} 
#overlay img{ border: none; }

#overlay{ background-image: url(../images/overlay.png); }

* html #overlay{
	background-color: #333;
	back\ground-color: transparent;
	background-image: url(blank.gif);
	filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src="../images/overlay.png", sizingMethod="scale");
	}
	
/*"""""""" TERMINA LIGHTBOX """"""""*/


/* en CSS http://www.emanueleferonato.com/2007/08/22/create-a-lightbox-effect-only-with-css-no-javascript-needed/*/

/* End of 'estilo_er' */