/* -------------------------------------------------------------- 
   
   grilla.css
   * Es muy fácil de usar, dividimos la página en 24 columnas

   * Por defecto el tamaño de inicio es 950 px, con 24 columnas 
 	 con spans de 30px y 10 px de margen

   * Para utilizarlo debes hacer la siguiente ecuación: tengo
	 de tamaño 950 px, que es lo mismo que decir (columnas * 40) -10
	 así que si tengo 950 serían 24 columnas.

   
-------------------------------------------------------------- */
body{

	margin: 0px auto;
	background: url("../../img/fondo.jpg") repeat-x;
	
}

img{border:0px;}


/* Contenedor de todas las columnas. */
#general {
  /*width: 900px;*/
  margin: 0px auto;
  /*background-color: #f1f1f1;*/
}

/*----------------------------------------------------------------------

	
	///////          CABECERA          ///////////////


------------------------------------------------------------------------*/	
/*Centramos la cabecera*/
#cabecera{margin: 0px auto;}

	/*.................... LOGO....................................*/
	#logo{
		background: url("../../img/logo.jpg") no-repeat;
		width: 367px;
		height: 104px;		
	}

	
		#logo span{				
			display: block;
			margin-left:-3000px;
			height: 104px; 
			width: 367px;		
		}

	
	/*.................... MENU....................................*/
			

	ul.menu{
		float:right;
		padding-top: 50px;
		list-style: none;		
	}
			
		ul.menu li{
			display: inline;
			float: left;
			padding-left: 10px;			
		}

			ul.menu li a{
				color:#fff;
				text-decoration:none;
				display: block;
			}

			ul.menu li a:hover{
				color:#99CC00;
				text-decoration:none;
				display: block;
				border-bottom: 2px solid #99CC00;
			}

			ul.menu li a:link, ul.menu li a:visited {
				padding: 0px;
				display: block;
				text-decoration: none;
			}
			
			ul.menu li a span{				
				display: block;
				text-indent:-3000px;				
			}
				
				/*.................  HOME ...........................*/
				ul.menu li a.home{				
					background-image:url("../../img/home.png");
					background-repeat: no-repeat;
					height:20px;
					width:53px;
					margin-right:-2px;						
				}
				
				ul.menu li a.home:hover{			
					background-image:url("../../img/home.png");
					background-repeat: no-repeat;
					height:20px;
					width:53px;
					background-position:0 -20px;
					margin-top:4px;					
				}

				/*.................  CONTACTO ...........................*/
				ul.menu li a.contacto{			
					background-image:url("../../img/contacto.png");
					background-repeat: no-repeat;
					height:20px;
					width:79px;
					margin-right:-2px;					
				}
				
				ul.menu li a.contacto:hover{			
					background-image:url("../../img/contacto.png");
					background-repeat: no-repeat;
					height:20px;
					width:79px;
					background-position:0 -20px;
					margin-top:4px;
				}

/*----------------------------------------------------------------------

	
	///////       BIENVENIDO Y RSS   ///////////////


------------------------------------------------------------------------*/	

/*.................... BIENVENIDOS....................................*/

/*Div de bienvenidos*/
#bienvenidos{
	margin: 0px auto;
	padding-top: 25px;
}	
	
	/*Texto de bienvenidos*/
	#bienvenidos p{	
		text-align:center;
		font-size: 24px;
		font-family: Georgia;	
		width: 960px;
	}
	

/*.................... RSS....................................*/

/*Div de RSS*/
#rss{
	margin: 0px auto;
	padding-bottom:0px;
}

	/*Imagen del RSS*/
	#rss img{float: right;}
	


/*----------------------------------------------------------------------

	
	///////        CONTENIDO          ///////////////


------------------------------------------------------------------------*/

/*..................... CONTENEDOR GERENAL .........................*/
#contenedor_general{
	margin: 0px auto;
	background: url("../../img/fondocontenido.png") no-repeat;
	background-position:top center; 
	min-height: 437px;  
	padding: 20px 0px;
	
}

	#contenido{margin: 0px auto;}
	
		/*Parte izquierda del blog*/
		#izquierda{
			min-height: 900px;
		}
	
			#titulo{
				background: url("../../img/titulotema.jpg") no-repeat;
				width: 660px;
				background-position:center;
				height: 49px;				
			}
			
				#fecha{		
					background: url("../../img/fecha.png") no-repeat;
					width: 90px;
					height: 49px;
					padding-top: 5px;
				}
		
		
					#fecha .fecha{
						font-size: 20px;
						font-family: Georgia;
						color: #fff;
						padding-left: 13px;
					}
		
				#titulo_post {
					padding-top:10px;
					padding-left: 5px;
				}
		
					#titulo_post h2.entry-title a{
						font-family: Georgia;
						color: #e7e7e7;
						font-size: 18px;
						width:545px;
					}
					
					#titulo_post h2.entry-title {
						font-family: Georgia;
						color: #bababa;
						font-size: 18px;
						width:545px;
					}
					
											
			#contenido_post{
				margin: 0px auto;
				padding-left:13px;
				padding-top: 10px;
				font-size: 14px;
			}
		
		
		/*Parte derecha del blog*/
		#derecha{		
			padding-top: 12px;
			margin-left: 10px;
		}
		
/* ----------- PIE DEL POST ----------------*/

 .entry-meta span a, .meta-sep{
 
	color: #b4b4b4;
	font-family: Georgia;
	
 }
 
	.entry-meta span.comment-count a{
	
		color: #7fa613;
	
	}
	
	
/* -----------  COMENTARIOS Y REPUESTA ---------------*/	

/* Hace referncia a la parte de Respuesta*/

#respond{

	margin: 0px auto;
	padding-left:13px;
	padding-top: 10px;

}

	h3#leave-a-reply{
	
		font-family: Georgia;
		font-size: 20px;
		color: #7fa613;
		margin-bottom: 15px;
		border-bottom: 1px dotted #dcdcdc;
		
	
	}


/* Hace referncia a la parte de Comentario*/

#comments{

	margin: 0px auto;
	padding-left:13px;
	padding-top: 10px;

}

	#comments h3.comment-title{
		
		font-family: Georgia;
		font-size: 20px;
		color: #7fa613;
		margin-bottom: 15px;
		border-bottom: 1px dotted #dcdcdc;
		
	
	
	}
	
		.url{
		
			font-family: Georgia;
			font-size: 12px;
			color: #5d5d5d;
			font-weight:bold;
		
		}
	
		.comment-content p{
		
			padding-top: 10px;
			margin: 0px;
			font-family: Trebuchet MS;
		
		
		}
/*----------   Anterior / Siguiente -----------*/
.nav-next{

	margin-right: 20px;
	


}

	.nav-next a{

		font-size: 15px;
		color: #83b100;
		font-weight:bold;
		font-family: Giorgia;


	}
	
	.nav-next span.nav-meta{

		font-size: 13px;
		color: #83b100;
		font-weight:bold;
		font-family: Giorgia;

	}
	
.nav-previous{

	margin-left: 40px;
	color: #83b100;
	font-weight:bold;
	font-family: Giorgia;

}

	.nav-previous a{

		font-size: 15px;
		color: #83b100;
		font-weight:bold;
		font-family: Giorgia;


	}

/*----------------------------------------------------------------------

	
	///////          BUSCADOR Y RESULTADOS       ///////////////


------------------------------------------------------------------------*/		

/* Cambiamos el color de la tipo de search*/
	h1.search-title{
	
		color: #7fa613;
		font-family: Georgia;
		font-size: 23px;
		margin-bottom: 36px;
		/*border-bottom: 1px dotted #dcdcdc;*/
		/*border-top: 1px dotted #dcdcdc;*/
		/*width: 600px;*/
	}

	h2.fail-search{
	
		color: #7fa613;
		font-family: Georgia;
		font-size: 23px;
			
	}
	
	
/*---------- RESULTADO DEL BUSCADOR FAIL ---------------*/
#post-0 {

	margin: 0px auto;
	padding-left:13px;
	padding-top: 10px;


}

/*----------------------------------------------------------------------

	
	///////          FECHA        ///////////////


------------------------------------------------------------------------*/	
		
	.published-time{
	
		font-family: Georgia;
		color: #fff;
		font-size: 20px;
		padding-left: 10px;
		margin-bottom: 10px;
		
	}
		
	
/*----------------------------------------------------------------------

	
	///////          SIDEBAR         ///////////////


------------------------------------------------------------------------*/
	
		
	/*ancho del sidebar*/
	.aside {
	
		width: 290px;
		margin-right: 40px;
		padding-top:2px;
	}	
	
	.widget{
	
		margin-top:0px;
	
	}
	
	/* Para cambiar el estilo de la tipografía de los tags y las categorias */
	
	#widget-tags ul.wp-tag-cloud li a {
	
		color: #7FA613;
		font-family: Trebuchet MS;
			
	
	}
	
	#widget-tags ul.wp-tag-cloud li {
	
		width:279px;
	
	
	}
	
	#widget-categories ul.xoxo li.cat-item a{
	
		color: #7FA613;
		font-family: Trebuchet MS;
		font-size: 13px
		
	
	}
	
	#widget-archives ul li a{
	
		color: #7FA613;
		font-family: Trebuchet MS;
		font-size: 13px
		
	
	}
	
	/*recomendaciones*/	
	
	.widget-title img{
	
		margin-bottom: 5px;
	
	}
	#widget-bookmarks ul.xoxo li{
	
		margin-top: 5px;
	
	}

/*----------------------------------------------------------------------

	
	///////          FUENTES DEL CONTENIDO         ///////////////


------------------------------------------------------------------------*/
		
	/*corresponde al contenido del post*/
	#contenido_post .article p{
	
		font-family: Trebuchet MS;
	
	}	
	
	/* hace referencia a "deja tu comentario"*/
	#contenido_post .cancel-comment-reply h3 {
	
		font-family: Giorgia;
		font-size: 25px;
		color:#7FA613;
	
	
	}
	
	/*Contenido que hay en sobre mi*/
	
	#widget-sobremi ul.xoxo p{
	
		font-family: Giorgia;
		line-height: 200%; /*interliniado*/
		font-size: 14px;
		text-align: justify;
		width: 279px;
		
	
	}
	
	#widget-sobremi ul.xoxo img{
	
		float: left;
		margin-right: 5px;
		
	
	}
		
/*----------------------------------------------------------------------

	
	///////         FORMULARIOS        ///////////////


------------------------------------------------------------------------*/		


/*-------- FORMULARIO DE COMENTARIO -----------*/

#comment-form .form-section label{

	font-family: Giorgia;
	font-size: 14px;
	color: #767676;


}

#author, #email, #url{

	border:none;
	background: url("../../img/form.jpg") no-repeat;
	width: 596px;
	height: 26px;

}

#comment {

	border:none;
	background: url("../../img/form2.jpg") no-repeat;
	width: 596px;
	height: 176px;

}

#submit{

	border:none;
	background: url("../../img/enviar.png") no-repeat;
	width: 60px;
	height: 20px;
	margin-left: 535px;
}

/*----------------------------------------------------------------------

	
	///////          PIE         ///////////////


------------------------------------------------------------------------*/
#wrapperpie{	
	background: url("../../img/fondopie.jpg") repeat-x;
	height:174px;
}

	#pie{	
		margin: 0px auto;
		padding-top: 30px;
	}
	
		#pie p{		
			color: #fff;
		}
		
			.mensaje{			
				font-size: 20px;
				font-family: Georgia;
			}
		
			#pie p.correo{
				color: #7EA70F;
				font-family: Trebuchet MS;
				margin-bottom: 5px;
			}
		
		
		#izq_pie .dire{		
			font-family: Trebuchet MS;
			padding-bottom: 5px;
		}
		
		#der_pie{margin-left: 5px;}
				
						
			#lista1 .redes1{
			
				padding-left: 50px;
			
			}
				.redes1{				
					padding-left: 13px;
					padding-top: 5px;
				
				}
					.redes1 li{padding-bottom: 9px;}
				
				
						.redes1 li span{		
							color: #fff;
							font-family: Georgia;
							margin-left: 5px;
						}
				
						ul.redes1 li img{vertical-align: middle;}
				
	#copy{margin: 0px auto;}
	
		#text_copy{padding-top: 5px;} /*10*/
		
			.copytext{		
				color:#5D4F48;
				padding-left: 400px;
				
			}
		
		#firma img{	
			padding-left: 280px;
			vertical-align: middle;
			margin-top: 4px;/*5*/
		}
	

	
/*.................... DIV  VACIO...................................*/
#vacio{clear: both;	}	
/* Columnas
-------------------------------------------------------------- */

/* Use esta clase junto con la clase .span-? para poder armar el esquema, el margin
define el espacio que hay despues de cada columna */
   
.columna {
  float: left;
  margin-right: 10px;
}


/* La última columan necesita que se coloque esta clase, más que todo para que no nos
deforme el diseño*/

.ultimo { margin-right: 0; }

/* Con estas clases definimos el ancho de las columnas */
.ancho-1   { width: 30px; }
.ancho-2   { width: 70px; }
.ancho-3   { width: 110px; }
.ancho-4   { width: 150px; }
.ancho-5   { width: 170px; }
.ancho-5b { width: 180px; }
.ancho-6   { width: 220px; }
.ancho-7   { width: 280px; }
.ancho-8   { width: 310px; }
.ancho-9   { width: 350px; }
.ancho-9b { width: 365px; }
.ancho-9c { width: 367px; }
.ancho-10  { width: 390px; }
.ancho-11  { width: 445px; }
.ancho-12  { width: 470px; }
.ancho-13  { width: 510px; }
.ancho-14  { width: 550px; }
.ancho-15  { width: 590px; }
.ancho-15b { width: 593px; }
.ancho-16  { width: 650px; }
.ancho-17  { width: 668px; }
.ancho-18  { width: 710px; }
.ancho-19  { width: 750px; }
.ancho-20  { width: 790px; }
.ancho-21  { width: 830px; }
.ancho-22  { width: 870px; }
.ancho-23  { width: 920px; }
.ancho-24  { width: 960px; }
.ancho-24b { width: 1000px; }
.ancho-24c { width: 1000px; }


/* Lateral derecho de las columnas. */
.border {
  padding-right: 4px;
  margin-right: 5px;
  border-right: 1px solid #eee;
}

/* Borde para agregar más espacio en blanco a los span o columnas */
.colborder {
  padding-right: 24px;
  margin-right: 25px;
  border-right: 1px solid #eee;
}


/* Utilice estas clases para sacar de la misma linea a una columna. */

.pull-1  { margin-left: -40px; }
.pull-2  { margin-left: -80px; }
.pull-3  { margin-left: -120px; }
.pull-4  { margin-left: -160px; }

.push-0  { margin: 0 0 0 18px; }
.push-1  { margin: 0 -40px 0 18px; }
.push-2  { margin: 0 -80px 0 18px; }
.push-3  { margin: 0 -120px 0 18px; }
.push-4  { margin: 0 -160px 0 18px; }
.push-0, .push-1, .push-2, .push-3, .push-4 { float: right; }


/* Más elementos
-------------------------------------------------------------- */

/* Con esta clase podemos crear cajas  */ 
.box { 
  padding: 1.5em; 
  margin-bottom: 1.5em; 
  background: #eee; 
}

/* Con esta clase podemos crear reglas horizontales. */
hr {
  background: #ddd; 
  color: #ddd;
  clear: both; 
  float: none; 
  width: 100%; 
  height: .1em;
  margin: 0 0 1.4em;
  border: none; 
}
hr.space {
  background: #fff;
  color: #fff;
}

/* Limpiar los floats 
   Based on How To Clear Floats Without Structural Markup by PiE
   [http://www.positioniseverything.net/easyclearing.html] */

.clear { display: inline-block; }   
.clear:after, .container:after {
  content: "."; 
  display: block; 
  height: 0; 
  clear: both; 
  visibility: hidden;
}
* html .clear { height: 1%; }
.clear { display: block; }


/* Derecha o Izquierda*/
.izq{
	float:left;
}

.der{
	float:right;
}

#disqus_thread{width:550px;margin-left:45px;}
