/* -------------------------------------------------------------- 
   
   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;
	width: 100%;
	height: 100%;
	
}

img{border:0px;}


/* Contenedor de todas las columnas. */
#wrapergeneral {
	background: url("../../img/bg_degradado.jpg") repeat-x;
	height: 250px;
}

	#general{margin:0 auto;}
	
/*TEXTOS*/
.verde{
	color:#00b9a0;
	font-family:trebuchet MS;
}


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

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


------------------------------------------------------------------------*/	
/*---------- LOGO -------------*/
/* Imágen del logo*/
#logo{

	background: url("../../img/logo2.png") no-repeat;
	width: 313px;
	height: 159px;
}
	#logo span{
		display: block;
	    margin-left:-3000px;
		height: 159px; 
		width: 326px;
	}

/*---------- MENÚ -------------*/
#menu_rss_linea{margin-top:89px;}
	#menu_rss{float:right;}
ul.menu{
	margin-top:10px;
	margin-left:10px;
}
	ul.menu li{
		display:inline;
		float: left;
		padding:0px 0px;
		margin: 0px 3px;
		}
		
			ul.menu li.puntito{
				height:3px;
			}
			ul.menu li a{
				color:#fff;
				text-decoration:none;
				display: block;
			}
				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/menu_home.png");
						background-repeat: no-repeat;
						height:18px;
						width:43px;
						margin-top:3px;
						margin-right:0px;
					}

					ul.menu li a.home:hover{
						background-image:url("../../img/menu_home.png");
						background-repeat: no-repeat;
						height:18px;
						width:43px;
						background-position:0 -19px;
						margin-top:3px;
					}
					
					/*PROYECTOS*/
					ul.menu li a.proyectos{
						background-image:url("../../img/menu_proyectos.png");
						background-repeat: no-repeat;
						height:18px;
						width:69px;
						margin-top:5px;
						margin-right:0px;
					}

					ul.menu li a.proyectos:hover{
						background-image:url("../../img/menu_proyectos.png");
						background-repeat: no-repeat;
						height:18px;
						width:69px;
						background-position:0 -19px;
						margin-top:5px;
					}
					/*SERVICIOS*/
					ul.menu li a.servicios{
						background-image:url("../../img/menu_servicios.png");
						background-repeat: no-repeat;
						height:18px;
						width:61px;
						margin-top:4px;
						margin-right:0px;
					}

					ul.menu li a.servicios:hover{
						background-image:url("../../img/menu_servicios.png");
						background-repeat: no-repeat;
						height:18px;
						width:61px;
						background-position:0 -19px;
						margin-top:4px;
					}
					/*QUIENES SOMOS*/
					ul.menu li a.quienesomos{
						background-image:url("../../img/menu_quienesomos.png");
						background-repeat: no-repeat;
						height:18px;
						width:99px;
						margin-top:4px;
						margin-right:0px;
					}

					ul.menu li a.quienesomos:hover{
						background-image:url("../../img/menu_quienesomos.png");
						background-repeat: no-repeat;
						height:18px;
						width:99px;
						background-position:0 -18px;
						margin-top:4px;
					}
					/*SERVICIOS*/
					ul.menu li a.contacto{
						background-image:url("../../img/menu_contacto.png");
						background-repeat: no-repeat;
						height:18px;
						width:53px;
						margin-top:5px;
						margin-right:0px;
					}

					ul.menu li a.contacto:hover{
						background-image:url("../../img/menu_contacto.png");
						background-repeat: no-repeat;
						height:18px;
						width:53px;
						background-position:0 -18px;
						margin-top:5px;
					}
					
/*RSS*/
	
	#rss a span{
		display: block;
		text-indent:-3000px;
	}
	
		#rss a.rss span{
			background-image:url("../../img/btn_rss.png");
			background-repeat: no-repeat;
			height:28px;
			width:25px;
			margin-top:5px;
			margin-right:0px;
		}
			
		#rss a.rss span:hover{
			background-image:url("../../img/btn_rss.png");
			background-repeat: no-repeat;
			height:28px;
			width:25px;
			background-position:0 -33px;
			margin-top:5px;		
		}
	
/*LINEA*/
.linea{
	background: url("../../img/linea02.png") no-repeat;
	width: 634px;
	height: 1px;
}

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

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


------------------------------------------------------------------------*/
/*TEXTO DEL PIE DEL POST*/
span.entry-categories a{
	color:#000;
	font-family:trebuchet MS;
}
span.entry-tags a{
	color:#000;
	font-family:trebuchet MS;
}
span.author a{
	color:#000;
	font-family:trebuchet MS;
}
span.comment-count a{
	color:#000;
	font-family:trebuchet MS;
}

/*TEXTO DE LOS TITULOS DEL POST*/
h2.entry-title a{
	color:#636363;
	font-family:lucida grande;
	font-size:17px;
}
h2.entry-title a:hover{
	color:#00b9a0;
	font-family:lucida grande;
	font-size:17px;
}

h2.noencontrado{margin-top:23px;}

/*TEXTO POST*/
span.published{
	color:;
}
.post{margin-top: 20px;}
.linea_dotted{
	border-bottom:1px dotted #00b9a0;
	width:567px;
	margin-left:15px;
	margin-top:6px;
}
/*---TÍtulo y Fecha---*/
.fecha{
	background: url("../../img/title_fecha.jpg") no-repeat;
	width: 53px;
	height: 54px;
	margin-left:15px;
}
	.fecha span{
		color:#FFFFFF;
		font-family:lucida grande;
		font-size:12px;
		margin-left:4px;
		/*padding-top:47px;*/
		position:relative;
		top:22px;
		
	}
.titulo_post{
	background: url("../../img/title_articulo.jpg") no-repeat;
	width: 517px;
	height: 29px;
	margin-top:18px;
}
	.titulo_post span{
		vertical-align:middle;
		padding-top:13px;
		font-size:14px;
		color:#999;
		font-family:trebuchet MS;
		margin-left: 6px;
	}
	.contenido_post_coments{
		margin-left:37px;
		margin-top:15px;
		width:517px;
	}
		.texto_post{
			width:517px;
			
		}
		.texto_post2{
			width:517px;
			margin-left:18px
			
		}
			.texto_post2 ul{
				margin-left:37px;
			}
			
				.texto_post2 ul li{
					list-style-image:url("../../img/puntito.jpg");
					font-size:13px;
					font-family:trebuchet MS;
				}
				
				.texto_post2 p strong a{
					color:#636363;
					font-size:13px;
				}
				
				.texto_post2 p strong a:hover{
					color:#00b9a0;
					font-size:13px;
				}

/*----Compartir-----*/
.compartir{margin-top:20px;}
ul.compartir2 li{
	display:inline;
	margin-right:9px;
}

/*----boton anterior--------*/
#btn_anterior{
	margin-left:34px;
	margin-top:20px;
	
}

/*-------------------------- PÁGINAS ----------------------------------------*/
h2.entry-title{
	padding-left:16px;
	color:#636363;
	font-family:lucida grande;
	font-size:17px;
}

/*texto del contendio de la página*/
.article p{
	font-family:trebuchet MS;
	font-size:12px;
	margin-top:21px;
}
/*----------------------------------------------------------------------

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


------------------------------------------------------------------------*/
/*-----FORMULARIO-----------*/
#sidebar{
	margin-top:38px;
}
.searchform{

	margin-left: 12px;
}
	.searchform img{
		position:relative;
		left:4px;
	}
	.search2{
		background:url("../../img/input_buscador2.png") no-repeat scroll 0 0 transparent;
		border:medium none;
		height:29px;
		list-style:none outside none;
		width:214px;
		margin-top:-18px;
		vertical-align:middle;
		font-size:12px;
	}
	.search-btn{
		background:url("../../img/btn_buscar.jpg") no-repeat scroll 0 0 transparent;
		border:medium none;
		height:29px;
		list-style:none outside none;
		width:90px;
		margin-top:-26px;
		vertical-align:middle;
	}
	
/*------SERVICIOS-------*/
.secciones_sidebar img.tags{
	margin-left:12px;
	margin-top:15px;
}
.titulo_sidebar{
	background: url("../../img/bloque01.jpg") no-repeat;
	width: 348px;
	height: 39px;
	margin-left: 12px;
	margin-top:20px;
}
	.titulo_sidebar h3{
		vertical-align:middle;
		padding-top:8px;
		margin-left:12px;
		font-size:17px;
		color:#999;
		font-family:lucida grande;
		color:#636363;
	}
.cont_sidebar{
	background: url("../../img/bloque02.jpg") repeat-y;
	margin-left: 12px;
}
	
	
		ul.xoxo li a{
			
		}
		
		ul.xoxo li a:hover{
			font-family:trebuchet MS;
			font-size: 12px;
			color:#00b9a0;
		}
		
	ul.cont{
		margin-left:29px;
		padding-top:15px;
	}
		ul.cont li.cat-item{list-style-image:url("../../img/ico_flechitas01.jpg");}
		ul.cont li a{
			
			font-family:trebuchet MS;
			font-size: 12px;
			color:#636363;
		}
		ul.cont li a:hover{
			font-family:trebuchet MS;
			font-size: 12px;
			color:#00b9a0;
			
		}
		
		ul.cont li span{margin-left:5px;}
.pie_sidebar{
	background: url("../../img/bloque03.jpg") no-repeat;
	width: 348px;
	height: 22px;
	margin-left: 12px;	
}

/*Último comentarios*/
.comentarios ul{padding-top:10px;}
	.comentarios ul li{
		list-style-image:url("../../img/ico_flechitas01.jpg");
		margin-left:44px;
		color:#00b9a0;
		font-family:trebuchet MS;
		font-size:12px;
	}
		.comentarios ul li a{
			color:#999;
		}
/*Último proyectos*/		
		.proyectos ul{padding-top:10px;}
			.proyectos ul li{
				list-style-image:url("../../img/ico_flechitas01.jpg");
				margin-left:44px;
				color:#00b9a0;
				font-family:trebuchet MS;
				font-size:12px;
			}
				.proyectos ul li a{
					color:#636363;
				}
				
				.proyectos ul li a:hover;{
					color:#00b9a0;
					font-family:trebuchet MS;
					font-size:12px;
				}
				

/*-----TAGS----*/
#widget-tags{margin-left:12px;}
	#widget-tags ul li a{
		color:#000;
	}
	
/**/
#facebook{margin-top:20px;}
#twitter{margin-left:12px;}
	
/*----------------------------------------------------------------------

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


------------------------------------------------------------------------*/
/*Sombra*/
#sombra{
	background: url("../../img/sombra.jpg") repeat-x;
	height: 42px;
	width:1020px;
	margin:0 auto;
}
/*FACEBOOK y TWITTER*/
#contenido_fb_tw{
	margin:0 auto;
	margin-top:20px;
}
#wraperpie{
	background: url("../../img/bg_pie.jpg") repeat-x;
	height: 69px;
}
	#pie{
		margin:0 auto;
		padding-top: 25px;
	}
		#pie img.logo_dinamic{
			float:right;
		}

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


	///////         RESTO DE SECCIONES DEL BLOG        ///////////////


------------------------------------------------------------------------*/
/*Comentarios*/
#respond{padding-left:12px;}
#comments{
	width:590px;
	padding-left:12px;
	margin-top:73px;
}
	h3.comment-title{
		border-bottom:1px dotted #00B9A0;
		width:567px;
		color:#00b9a0;
		font-family:lucida grande;
	}
.comment-content{
	width:590px;
	margin-top:12px;
}
	.comment-content p{
		font-family:trebuchet MS;
		font-size:13px;
	}

.avatar { 
	float:left;
	margin-right:11px; 
}

h3#leave-a-reply{
		border-bottom:1px dotted #00B9A0;
		width:567px;
		color:#00b9a0;
		font-family:lucida grande;
		margin-top:66px;
		padding-bottom:9px;
	
}
label{
	color:#636363;
	font-family:lucida grande;
	font-size:14px;

}

#author, #email, #url {
	background:url("../../img/input_contacto01.png") no-repeat scroll 0 0 transparent;
	border:medium none;
	height:29px;
	width:402px;
	margin-top:5px;
}

#comment {
	background:url("../../img/input_contacto02.png") no-repeat scroll 0 0 transparent;
	border:medium none;
	height:103px;
	width:401px;
}
#submit {
	background:url("../../img/btn_enviar.png") no-repeat scroll 0 0 transparent;
	border:medium none;
	height:29px;
	width:90px;
	float:right;
	margin-right:20px;
	margin-right:113px;
}

.nav-meta a{
	color:#00B9A0;
	font-family:lucida grande;
	font-size:13px;

}
.nav-next{
	float:right;
	margin-top:12px;
}
.nav-previous {
	float:left;
	margin-top:12px;
	
}
.nav-next a{
	color:#00B9A0;
	font-family:lucida grande;
	font-size:13px;
	margin-top: 12px;
}

/*CATEGORIAS*/
.page-title {
	margin-top:31px;
}
	.page-title span {
		color:#636363;
		font-family:lucida grande;
		font-size:17px;
		padding-left:16px;
	}
	
	
/*---------------- SERVICIOS -------------*/
ol.text_servicios{
	margin-top:41px;
}
	ol.text_servicios li span.title_text{
		font-size:13px;
		color:#636363;
	}
	
	ul.subtext{
		margin-left:32px;
		margin-top:12px;
		padding-bottom:12px;
	}	
		ul.subtext li{
			list-style-image:url("../../img/puntito.jpg");
			font-size:13px;
			font-family:trebuchet MS;
			
		}
		
/*------------------  CONTACTOS -------------------*/
#text_contacto {
		margin-top:22px;
}
ul.text_contaco{
	margin-left:79px;
	margin-top:13px;
}
ul.text_contaco li.dire{
	list-style-image:url("../../img/ico_direccion.jpg")
}
ul.text_contaco li.phone{
	list-style-image:url("../../img/ico_telefono.jpg")
}
ul.text_contaco li.correo{
	list-style-image:url("../../img/ico_mail.jpg")
}

	ul.text_contaco li span{
		vertical-align:middle;
		padding-bottom:10px;
		font-size:13px;
		font-family:trebuchet MS;
	}
	
.texto_contacto p{
	margin-left:12px;
	font-size:15px;
	font-family:trebuchet MS;
}
/*formulario de contacto*/
#comment-form{
	margin-top:20px;
	margin-left:79px;
}
.cform {
margin-left:51px;
width:410px;
margin-top:31px;
}
.cform label span {
display:block;
text-align:left;
width:90px;
}



	#cf_field_1, #cf_field_2, #cf_field_3{
		background:url("../../img/input_contacto01.png") no-repeat scroll 0 0 transparent;
		border:medium none;
		height:29px;
		width:402px;
		margin-top:8px;
		
	}
	#cf_field_4{
		background:url("../../img/input_contacto02.png") no-repeat scroll 0 0 transparent;
		border:medium none;
		height:103px;
		width:401px;
		margin-top:8px;
	}
	#sendbutton{
		background:url("../../img/btn_enviar.png") no-repeat scroll 0 0 transparent;
		border:medium none;
		height:29px;
		width:90px;
		float:right;
		margin-right:20px;
	}
	
	p.linklove a{color:#fff;}
	
	/*---------  MENSAJE DE ERROR ------------------*/
	#post-0{margin-top:28px;}
	.entry-content p{margin-left:0px;}
/* 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: 25px; }/*usado*/
.ancho-2   { width: 53px; }/*usado*/
.ancho-3   { width: 110px; }
.ancho-4   { width: 150px; }
.ancho-5   { width: 170px; }
.ancho-6   { width: 220px; }
.ancho-7   { width: 270px; }
.ancho-8   { width: 326px; }/*usado*/
.ancho-8b  { width: 334px; }
.ancho-9   { width: 370px; }/*usado*/
.ancho-10  { width: 390px; }
.ancho-11  { width: 445px; }
.ancho-12  { width: 478px; }/*usado*/
.ancho-13  { width: 517px; }/*usado*/
.ancho-14  { width: 550px; }
.ancho-15  { width: 590px; }/*usado*/
.ancho-16  { width: 600px; }
.ancho-17  { width: 634px; }/*usado*/
.ancho-18  { width: 710px; }
.ancho-19  { width: 750px; }
.ancho-20  { width: 790px; }
.ancho-21  { width: 830px; }
.ancho-22  { width: 870px; }
.ancho-23  { width: 900px; }
.ancho-24  { width: 960px; }/*usado*/


/* 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;
}

.vacio{clear:both;}