/* Main Structure */
body  {
    	font: Verdana, Arial, Helvetica, sans-serif;
		font-size: 20px;
    	background-image: url(../images/top3.png);
		background-repeat:repeat-x;
    	margin: 0; /* es recomendable ajustar a cero el margen y el relleno del elemento body para lograr la compatibilidad con la configuración predeterminada de los diversos navegadores */
    	padding: 0;
    	text-align: center; /* esto centra el contenedor en los navegadores IE 5*. El texto se ajusta posteriormente con el valor predeterminado de alineación a la izquierda en el selector #container */
    	color: #000000;
    }
a:link {
	color:#000;
	text-decoration:none;
	font-family: Geneva, Arial, Helvetica, sans-serif;
	font-size:20px;
	text-decoration:none;
}
a:visited {
	font-family: Geneva, Arial, Helvetica, sans-serif;
	color:#000;
	font-size:20px;
	text-decoration:none;
}
a:hover {
	color:#4473AD;
	font-family: Geneva, Arial, Helvetica, sans-serif;
	font-size:20px;
	text-decoration:underline;
}
    #container { 
    	width: 90%;  /* esto creará un contenedor con el 80% del ancho del navegador */
    	background: none;
    	margin: 0 auto; /* los márgenes automáticos (conjuntamente con un ancho) centran la página */
    	text-align: left; /* esto anula text-align: center en el elemento body. */
    } 
    #header { 
    	background:none;
		font: Georgia, "Times New Roman", Times, serif;
		font-size:1em;
		color: #fff;
    	padding:0;  /* 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 #header en lugar de texto, es posible que le interese quitar el relleno. */
    } 
    #header h1 {
		background:none;
    	margin: 0; /* el ajuste en cero del margen del último elemento del div de #header evita la contracción del margen (un espacio inexplicable entre divs). Si el div tiene un borde alrededor, esto no es necesario, ya que también evita la contracción del margen */
    	padding: 10px 0; /* el uso de relleno en lugar de margen le permitirá mantener el elemento alejado de los bordes del div */
    }
    /* Sugerencias para sidebar1:
    1. dado que está trabajando en porcentajes, es conveniente no utilizar relleno en la barra lateral. Se añadirá al ancho en el caso de navegadores que cumplen los estándares, creando un ancho real desconocido. 
    2. El espacio entre el lado del div y los elementos que contiene puede crearse colocando un margen izquierdo y derecho en dichos elementos, como se observa en la regla ".twoColLiqLtHdr #sidebar1 p".
    3. Dado que Explorer calcula los anchos después de mostrarse el elemento padre, puede que ocasionalmente encuentre errores inexplicables con columnas basadas en porcentajes. Si necesita resultados más predecibles, puede optar por cambiar a columnas con tamaño en píxeles.
    */
    #sidebar1 {
    	float: left; 
    	width: 250px; /* dado que este elemento es flotante, debe asignarse un ancho */
    	background: none; /* el color de fondo se mostrará a lo largo de todo el contenido de la columna, pero no más allá */
    	padding: 10px 0; /* el relleno superior e inferior crea un espacio visual dentro de este div  */
    }
    #sidebar1 h3, #sidebar1 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;
    }
    
    /* Sugerencias para mainContent:
    1. el espacio entre el mainContent y sidebar1 se crea con el margen izquierdo del div mainContent.  Con independencia de la cantidad de contenido que incluya el div sidebar1, permanecerá el espacio de la columna. Puede quitar el margen izquierdo si desea que el texto del div #mainContent llene el espacio de #sidebar1 cuando termine el contenido de #sidebar1.
    2. para evitar la caída de un elemento flotante con una resolución mínima admitida de 800 x 600, los elementos situados dentro del div mainContent deben tener un tamaño de 430px o inferior (incluidas las imágenes).
    3. en el siguiente comentario condicional de Internet Explorer, la propiedad zoom se utiliza para asignar a mainContent "hasLayout." Esto evita diversos problemas específicos de IE.
    */
    #mainContent { 
    	margin: 0 0 0 27%; /* el margen derecho puede asignarse en porcentajes o píxeles. Éste crea el espacio a lo largo de la parte derecha de la página. */
    } 
	#mainContent h2 {
		border-bottom: 2px solid  #B6B6B6;
		padding-bottom:10px;
		margin-bottom:0px;
    }
	#mainContent h4 {
		font-size:18px;
		padding:0px;
		margin:0px;
    }
    #footer { 
		background-image: url(../images/foot2.png);
		background-repeat:no-repeat;
		background-position:center;
		background-position:top;
		height:100px;
		font-size:12px;
    } 
    #footer 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: 10px 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 */
    }
    
    /* Varias clases diversas para su reutilización */
    .fltrt { /* esta clase puede utilizarse para que un elemento flote en la parte derecha de la página. El elemento flotante debe preceder al elemento junto al que debe aparecer en la página. */
    	float: right;
    	margin-left: 8px;
    }
    .fltlft { /* esta clase puede utilizarse para que un elemento flote en la parte izquierda de la página. */
    	float: left;
    	margin-right: 8px;
    }
    .clearfloat { /* 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 */
    	clear:both;
        height:0;
        font-size: 1px;
        line-height: 0px;
    }
	div#contador{
		width:80%;
		border-top:2px solid;
		border-top-color:#B6B6B6;
		padding-top:20px;
		margin-top:20px;
		margin-bottom:10px;
	}
	div#post2{
		border-bottom:2px solid;
		border-bottom-color:#B6B6B6;
		margin-bottom:20px;
	}
	div#inpost1{
		background-color:#E6E6E6;
		border:1px solid #CCCCCC;
	}
	div#inpost2{
		display:inline;
	}
	div#titulos{
	font-size:1.3em;
	font-weight:bold;
	}
	div#mai{
		text-align:right;
		float:right;
		padding:0;
		margin-right:0;
	}
	div#mai a:link, div#mai a:visited{
		font-size:0.9em;
	}
	div#mai a:hover{
		font-size:0.9em;
		color:#FFFFFF;
	}

/* Main Structure */

/* Post - Typography & Colors - Structure */

div#post-it {
  font-size: 62.5%;
  font-family: Arial, Sans-Serif;
  text-align: center;
  margin: 0 0 20px 0;
}

.post * {
 padding: 0; 
 margin: 0;
}

.post {
  clear: both; 
  text-align: justify;
  padding: 5px 15px;
  margin: 0 auto 9px auto;
  border-bottom: 2px solid #BFBFBF;
  }
  
.post small {
  font-family: Arial, Helvetica, Sans-Serif;
  font-size: 1em;
  line-height: 1.5em;
  color:#808080;
}

.post small a:link, .post small a:visited, .post small a:hover {
  font-family: Arial, Helvetica, Sans-Serif;
  font-size: 1em;
  line-height: 1.5em;
  color:#003366;
}

.post a:link, .post a:visited, .post a:hover  {
  font-family: Arial, Helvetica, Sans-Serif;
  font-size: 0.9em;
  line-height: 1.5em;
  color:#0066CC;
}

.postx small {
  font-family: Arial, Helvetica, Sans-Serif;
  font-size: 1em;
  line-height: 1.5em;
  color:#808080;
}

.postx a:link, .post a:visited, .post a:hover  {
  font-family: Arial, Helvetica, Sans-Serif;
  font-size: 0.9em;
  line-height: 1.5em;
  color:#0066CC;
}

.post p { margin:0}

.tit { font-size: 1.3em; font-weight:bold; }

.post h2, .post h2, .post h3 { font-size: 1.3em; }

.post h5 {
  font-family: 'Trebuchet MS', 'Lucida Grande', Verdana, Arial, Sans-Serif;
  font-weight: bold;
}

.post-img { float:right; margin:0; padding: 0;}

.postmetadata{ color:#808080; clear: both; }

.entry { clear: both;}

.entry a:link, .entry a:visited, .entry a:hover  {
  font-family: Arial, Helvetica, Sans-Serif;
  font-size: 1.2em;
  color:#0066CC;
}

.entry h1 {
  position: static;
  font-size: 2em;
  color: #333;
}

.cal {
  color:#666666;
  text-align: center;
  line-height: 1.4em;
  font-family: "Lucida Grande", "Lucida Sans Unicode", Arial, Sans-Serif;
  padding: 1px;
  width: 2.9em;
}

.calborder {
  display: inline;
  padding: 1px;
  float: left;
  margin-right: 1em;
}

.cal span { display: block; }

.cald {
  font-size: 1.5em;
  letter-spacing: .2em;
  padding-left: .2em
}

.calm {
  font-weight: bold;
  font-size: 2em;
  line-height: .7em;
}

.caly {
  font-size: .8em;
  line-height: 1em;
}

.postinfo { padding-bottom: 1em; }

.postinfo h2, .postinfo h3 { line-height: .9em; }

/* End Post - Typography & Colors - Structure */



/*!!!!!!!!!!! Core CSS [Do Not Modify!] !!!!!!!!!!!!!*/
.qmmc .qmdivider{display:block;font-size:1px;border-width:0px;border-style:solid;position:relative;z-index:1;}.qmmc .qmdividery{float:left;width:0px;}.qmmc .qmtitle{display:block;cursor:default;white-space:nowrap;position:relative;z-index:1;}.qmclear {font-size:1px;height:0px;width:0px;clear:left;line-height:0px;display:block;float:none !important;}.qmmc {position:relative;zoom:1;z-index:10;}.qmmc a, .qmmc li {float:left;display:block;white-space:nowrap;position:relative;z-index:1;}.qmmc div a, .qmmc ul a, .qmmc ul li {float:none;}.qmsh div a {float:left;}.qmmc div{visibility:hidden;position:absolute;}.qmmc .qmcbox{cursor:default;display:block;position:relative;z-index:1;}.qmmc .qmcbox a{display:inline;}.qmmc .qmcbox div{float:none;position:static;visibility:inherit;left:auto;}.qmmc li {z-index:auto;}.qmmc ul {left:-10000px;position:absolute;z-index:10;}.qmmc, .qmmc ul {list-style:none;padding:0px;margin:0px;}.qmmc li a {float:none;}.qmmc li:hover>ul{left:auto;}#qm0 ul {top:100%;}#qm0 ul li:hover>ul{top:0px;left:100%;}

/*!!!!!!!!!!! QuickMenu Styles [Please Modify!] !!!!!!!!!!!*/


	/* QuickMenu 0 */

	/*"""""""" (MAIN) Container""""""""*/	
	#qm0	
	{	
		width:80%;
		padding:5px;
		padding-left:20px;
		margin-top:5px;
		margin-left:0.9em;
		background-image: url(../images/menu_back2.png);
		background-repeat:no-repeat;
		border-width:0px;
		border-style:solid;
		border-color:#EEEEEE;
	}


	/*"""""""" (MAIN) Items""""""""*/	
	#qm0 a	
	{	
		padding:5px 4px 5px 5px;
		color:#555555;
		font-family:Arial;
		font-size:10px;
		text-decoration:none;
	}


	/*"""""""" (SUB) Container""""""""*/	
	#qm0 div, #qm0 ul	
	{	
		padding:10px;
		margin:-2px 0px 0px 0px;
		background-color:transparent;
		border-style:none;
	}


	/*"""""""" (SUB) Items""""""""*/	
	#qm0 div a, #qm0 ul a	
	{	
		padding:3px 10px 3px 5px;
		background-color:transparent;
		font-size:11px;
		border-width:0px;
		border-style:none;
	}


	/*"""""""" (SUB) Hover State""""""""*/	
	#qm0 div a:hover	
	{	
		color:#4473AD;
	}


	/*"""""""" (SUB) Hover State - (duplicated for pure CSS)""""""""*/	
	#qm0 ul li:hover>a	
	{	
		color:#4473AD;
	}


	/*"""""""" (SUB) Active State""""""""*/	
	body #qm0 div .qmactive, body #qm0 div .qmactive:hover	
	{	
		color:#4473AD;
	}


	/*"""""""" Individual Titles""""""""*/	
	#qm0 .qmtitle	
	{	
		cursor:default;
		padding:3px 0px 3px 4px;
		color:#444444;
		font-family:arial;
		font-size:11px;
		font-weight:bold;
	}


	/*"""""""" Individual Horizontal Dividers""""""""*/	
	#qm0 .qmdividerx	
	{	
		border-top-width:1px;
		margin:4px 0px 4px 0px;
		border-color:#BFBFBF;
	}


	/*"""""""" Individual Vertical Dividers""""""""*/	
	#qm0 .qmdividery	
	{	
		border-left-width:1px;
		height:15px;
		margin:4px 10px 0px 10px;
		border-color:#AAAAAA;
	}


	/*"""""""" (main) Rounded Items""""""""*/	
	#qm0 .qmritem span	
	{	
		border-color:#DADADA;
		background-color:#F7F7F7;
	}


	/*"""""""" (main) Rounded Items Content""""""""*/	
	#qm0 .qmritemcontent	
	{	
		padding:0px 0px 0px 4px;
	}


	/*"""""""" Sub Hover Fill Items [Static]""""""""*/	
	#qm0 div .qmhoverfill	
	{	
		background-color:#E5E5E5;
		border-width:1px;
		border-style:solid;
		border-color:#D0D0D0;
	}


	/*"""""""" Custom Rule""""""""*/	
	ul#qm0 ul	
	{	
		padding:10px;
		margin:-2px 0px 0px 0px;
		background-color:#F7F7F7;
		border-width:1px;
		border-style:solid;
		border-color:#DADADA;
	}


	/*"""""""" Custom Rule""""""""*/	
	ul#qm0 li:hover > a	
	{	
		background-color:#F7F7F7;
	}
