/**********************************************************************/
/* ARCHIVO: css_principal.css                                         */
/* AUTOR: Marco Séneca                                                */
/* FECHA: 24/05/2010                                                  */
/* DESCRIPCION: Hoja de estilo principal de los RICT                  */
/**********************************************************************/

/***********/
/******************/
/***************************/
/**********************************/
/**********************************************************************************/
/*                  RICT: Realidad Infernal Caos Total                            */
/**********************************************************************************/
                                                /**********************************/
                                                       /***************************/
                                                                /******************/
                                                                       /***********/
/*******************************************/
/*INICIO -->  ESTRUCTURA GENERAL DE LA WEB */
/*******************************************/
/**********************************/
/***************************/
/******************/
/***********/

@charset "utf-8";
body  {
	background-image: url(../imagenes/fondo1.jpg);/*imagen de fondo de la web*/
	background-attachment: scroll; /*indica como se manejara la imagen de fondo de la web; fija, movimiento*/
	margin: 0; /*ajusto a cero el margen del elemento body para lograr la compatibilidad con los diversos navegadores*/
	padding: 0; /*ajusto a cero el relleno del elemento body para lograr la compatibilidad con los diversos navegadores*/
	text-align: center; /*esto centra el contenedor en los navegadores IE 5*. El texto se ajusta posteriormente con el valor predeterminado de alineación del id #contenido*/
	color: #CCCCCC;
	cursor: crosshair;/*cursor del mouse en forma de cruz*/
}

.estructura_general #contenido {
	z-index: 0; /*indica que las capas de la web estan por debajo de las demas (es el valor por defecto)*/ 
	opacity:.85; /*nivel de transparencia de la web. Metodo estandar de CSS3*/
	-moz-opacity:.85; /* transparencia de la web para nevegadores Mozillas antiguos*/
	filter: alpha(opacity=85); /*transparencia para navegadores IE, no hay punto decimal*/
	max-width: 1100px; /*este es el ancho maximo de la web*/
	min-width: 1100px; /*este es el ancho minimo de la web*/
	background: #333333; /*es el color de fondo de la zona contenido*/
	margin: 0 auto; /* los márgenes automáticos (conjuntamente con un ancho) centran la página */
	border: 1px solid #000000; /*define el tamaño, la caracteristica y el color del borde de toda la estructura de la pagina*/
	text-align: left; /* esto anula text-align: center en el elemento body. */

}

.estructura_general #cabecera { 
	text-align: left; /* esto anula text-align: center en el elemento body.*/
	max-width: 1100px; /*este es el ancho maximo de la web*/
	min-width: 1100px; /*este es el ancho minimo de la web*/
	margin: 0 auto; /* los márgenes automáticos (conjuntamente con un ancho) centran la página */
	border-top: 1px solid #000000; /*bode superior; tamaño, tipo, color del mismo*/
	border-right: 1px solid #000000; /*bode derecho; tamaño, tipo, color del mismo*/
	border-left: 1px solid #000000;/*bode izquierdo; tamaño, tipo, color del mismo*/
	background: #000000; /*Color de fondo de la cabecera, en ella se colocara la imagen principal de la web*/
	padding: 0px 0px 0px 0px;  /* este relleno coincide con la alineación izquierda de los elementos de los divs que aparecen bajo él. Si se utiliza una imagen en el #cabecera en lugar de texto, es mejor no colocar nada*/
} 

.estructura_general #cabecera h1 {
	margin: 0; /*el ajuste en cero del margen del último elemento del div de #cabecera evita la contracción del margen (un espacio inexplicable entre divs). Si el div tiene*/
	padding: 0px; /* el uso de relleno en lugar de margen le permitirá mantener el elemento alejado de los bordes del div */
}

.estructura_general #barra_lateral {
	float: left;  /*flotante del lado izquierdp*/
	width: 250px; /*dado que este elemento es flotante, debe asignarse un ancho */
	height: 850px; /*este es el largo*/
	background: #000000; /* el color de fondo se mostrará a lo largo de todo el contenido de la columna, pero no más allá */
	padding: 0px 0px 10px;/* el relleno superior e inferior crea un espacio visual dentro de este div */
	border-right: 1px solid #000000; /*bode derecho; tamaño, tipo, color del mismo*/
	border-bottom: 1px solid #000000;
}
.estructura_general #barra_lateral h3, .estructura_general #barra_lateral p {
	margin-left: 10px; /* deben asignarse los márgenes izquierdo y derecho de cada elemento que vaya a colocarse en las columnas laterales */
	margin-right: 10px;
}

.estructura_general #contenido_principal {
	margin: 36px 5px 0 256px; /* el margen derecho puede asignarse en ems o píxeles. Éste crea el espacio a lo largo de la parte derecha de la página. */
	text-align:justify; /*texto por defecto esta alineado*/
}
.estructura_general #pie_pagina { 
	padding: 0px 0px; /* este relleno coincide con la alineación izquierda de los elementos de los divs que aparecen por encima de él. */
	background: #666666; /*color de fondo*/
} 
.estructura_general #pie_pagina p {
	margin: 0; /* el ajuste en cero de los márgenes del primer elemento del pie evitará que puedan contraerse los márgenes (un espacio entre divs) */
	padding: 5px 0; /* el relleno de este elemento creará espacio, de la misma forma que lo haría el margen, sin el problema de la contracción de márgenes */
	text-align: center; /*Texto por defecto centrado*/
	color:#000000; /*color del texto*/
	border-top: 1px solid #000000;
	
}
/* esta clase debe colocarse en un elemento div o break y debe ser el último elemento antes del cierre de un contenedor que incluya completamente a un elemento flotante */
.forzar_contenido_principal { 
	clear:both;
    height:0;
    font-size: 1px;
    line-height: 0px;
}

/* coloque las reparaciones de css para todas las versiones de IE en este comentario condicional */
.estructura_general #barra_lateral { 
	padding-top: 10px;
	
}
/* zoom: 1; colocar si hay problemas con el IE la propiedad zoom propia que se indica más arriba proporciona a IE el hasLayout que necesita para evitar diversos errores */
.estructura_general #contenido_principal {
	padding-top: 5px; 
} 
/***********/
/******************/
/***************************/
/**********************************/
/*******************************************/
/*FIN -->  ESTRUCTURA GENERAL DE LA WEB    */
/*******************************************/

/*******************************************/
/*INICIO -->  CARACTERISTICAS VARIAS       */
/*******************************************/
/**********************************/
/***************************/
/******************/
/***********/

p, ol, pre{
    font-family: Verdana, Geneva, sans-serif; /*Tipo de letra de toda la web*/
	font-size: 90%; /*Tamaño de la letra*/
	line-height: 170%; /*Interlineado (separacion entre lineas)*/
    text-indent: 2em; /*Sangria*/
}

.letras_pequeñas{
	  font-size:75%;
}

.letras_pequeñas_sin_sangria{
	font-size:75%;
	text-indent:0em;	
}

.texto_importante{
	color: #77D2FF /*resalta en color cualquier texto que lo amerite*/
}

.no_sangria{
	text-indent:0em; /*sin sangria, se utiliza cuando no se necesita de la misma*/
}

.titulo_cajas {
	font-family: Verdana, Geneva, sans-serif;
	color:#000000;
	background: #77D2FF;
	text-indent:0em; /*sin sangria, se utiliza cuando no se necesita de la misma*/
}

/***********/
/******************/
/***************************/
/**********************************/
/*******************************************/
/*FIN -->  CARACTERISTICAS VARIAS          */
/*******************************************/