/* -------------------------------------------------------------- 
   
   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{
	background: url("../../img/bg.jpg") repeat;
}
	


img{border:0px;}


/* Contenedor de todas las columnas. */
#general {

margin:0 auto;
position:relative;
top:-17px;
}


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

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


------------------------------------------------------------------------*/	
#cabecera{
	margin:0 auto;
	
}
#destelllo{
	background:url("../../img/reflejo_menu.png") no-repeat scroll 0 0 transparent;
	width:970px;
	height:164px;
}
	/*.................... LOGO....................................*/
		#logo{
			background:url("../../img/logo.png") no-repeat scroll 0 0 transparent;
			height:166px;
			left:-22px;
			position:relative;
			width:365px;	
		}
			#logo span{				
				display: block;
				margin-left:-3000px;
				height: 166px; 
				width: 365px;		
			}
			
			/*..................... TEXTO LOGO .........................*/
			#texto_logo{
				margin-top:58px;
			}
	
			h1.texto1{
				font-size:14px;
				font-family:trebuchet MS;
				color:#bababa;
			}
			h1.texto2, p.texto3{
				font-size:11px;
				font-family:trebuchet MS;
				color:#bababa;
			}
	
	/*.................... MENU....................................*/
	#menu{
		
	}
	ul.menu{
		float:right;
		list-style:none outside none;
		margin-top:67px;
	}

		ul.menu li{
			display: inline;
			float: left;
			margin-right:20px;		
		}

			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:31px;
					width:55px;
					margin-right:-2px;						
				}

				ul.menu li a.home:hover{			
					background-image:url("../../img/menu_home.png");
					background-repeat: no-repeat;
					height:31px;
					width:55px;
					background-position:0 -33px;
					margin-top:0px;					
				}	
					
					/*.................  SERVICIOS ...........................*/
					ul.menu li a.servicios{				
						background-image:url("../../img/menu_servicios.png");
						background-repeat: no-repeat;
						height:31px;
						width:93px;
						margin-right:-2px;						
					}

					ul.menu li a.servicios:hover{			
						background-image:url("../../img/menu_servicios.png");
						background-repeat: no-repeat;
						height:31px;
						width:93px;
						background-position:0 -33px;
						margin-top:0px;					
					}
						/*.................  CLIENTES ...........................*/
					/*	ul.menu li a.clientes{				
							background-image:url("../../img/menu_clientes.png");
							background-repeat: no-repeat;
							height:31px;
							width:83px;
							margin-right:-2px;						
						}

						ul.menu li a.clientes:hover{			
							background-image:url("../../img/menu_clientes.png");
							background-repeat: no-repeat;
							height:31px;
							width:83px;
							background-position:0 -33px;
							margin-top:0px;					
						}*/
					/*.................  CONTACTO ...........................*/
					ul.menu li a.contacto{				
						background-image:url("../../img/menu_contacto.png");
						background-repeat: no-repeat;
						height:31px;
						width:91px;
						margin-right:-2px;						
					}

					ul.menu li a.contacto:hover{			
						background-image:url("../../img/menu_contacto.png");
						background-repeat: no-repeat;
						height:31px;
						width:91px;
						background-position:0 -33px;
						margin-top:0px;					
					}

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


		///////         MENU DESPLEGABLE         ///////////////


------------------------------------------------------------------------*/
#sup_menu_servicios{
	background: url("../../img/bg_desplegable01.png") no-repeat;
	width: 958px;
	height: 17px;
}
#cont_menu_servicios{
	background: url("../../img/bg_desplegable02.png") repeat-y;
	width: 958px;
}
		.titulo_serv h2 a{
		color:#fff;
		text-decoration:none;
		display: block;
	}

	.titulo_serv h2 a:link, .titulo_serv h2 a:visited {
		padding: 0px;
		display: block;
		text-decoration: none;
	}

	.titulo_serv h2 a span{				
		display: block;
		text-indent:-3000px;				
	}

		
		/*.................  ESTRATEGIA ONLINE ...........................*/
		.titulo_serv h2 a.online{				
			background-image:url("../../img/btn_estrategiashover.png");
			background-repeat: no-repeat;
			height:99px;
			width:233px;
			margin-left:43px;	
								
		}

		.titulo_serv h2 a.online:hover{			
			background-image:url("../../img/btn_estrategiashover.png");
			background-repeat: no-repeat;
			height:99px;
			width:233px;
			background-position:0 -101px;
			margin-top:0px;					
		}
		/*.................  AUDITORIA ...........................*/
		.titulo_serv h2 a.auditoria{				
			background-image:url("../../img/btn_auditoriahover.png");
			background-repeat: no-repeat;
			height:126px;
			width:235px;
			margin-left:12px;					
		}

		.titulo_serv h2 a.auditoria:hover{			
			background-image:url("../../img/btn_auditoriahover.png");
			background-repeat: no-repeat;
			height:126px;
			width:235px;
			background-position:0 -126px;
			margin-top:0px;					
		}
		/*.................  MONETIZACIÓN ...........................*/
		.titulo_serv h2 a.monetizacion{				
			background-image:url("../../img/btn_monetizacionhover.png");
			background-repeat: no-repeat;
			height:99px;
			width:223px;
			margin-left:4px;						
		}

		.titulo_serv h2 a.monetizacion:hover{			
			background-image:url("../../img/btn_monetizacionhover.png");
			background-repeat: no-repeat;
			height:99px;
			width:223px;
			background-position:0 -101px;
			margin-top:0px;					
		}
		
		/*textos*/
		.texto_serv {
			
			
			width:300px;
		}
		.texto_serv p{
			color:#FFFFFF;
			font-family:trebuchet MS;
			margin-left:28px;
			font-size:13px;
		}
		.apartados{
			margin-left:40px;
			margin-top:13px;
		}
		
			.apartados ul.part_der{
				margin-left:10px;
			}
		.seo{
			margin-left:36px;
		}
		.ppc{
			margin-left:34px;
		}
		
#inf_menu_servicios{
	background: url("../../img/bg_desplegable03.png") no-repeat;
	width: 958px;
	height: 17px;
}
.linea_separacion{
	background: url("../../img/linea_servicios.png") no-repeat;
	width: 2px;
	height: 301px;
}


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

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


------------------------------------------------------------------------*/
#contenido{
	margin-top:0px;
}
#part_sup{
		background: url("../../img/contenido01.png") no-repeat;
		width: 970px;
		height: 64px;
}
	#part_sup img{
		margin-left:444px;
		margin-top:10px;
	}

#part_center{
	background: url("../../img/contenido02.png") repeat-y;
	width: 970px;
}

	/*.............. POST......................*/
	.post{
		
	}
	/*FECHA*/
		.fecha{
			background: url("../../img/fecha.png") no-repeat;
			width: 49px;
			height: 61px;
			position:relative;
			right:31px;
		}
		
			span.published{
				color:#FFFFFF;
				font-family:trebuchet MS;
				font-size:13px;
				left:7px;
				position:relative;
				top:13px;
			}
		.titulo_post{
			margin-top:7px;
			position:relative;
			right:18px;
		}
			.entry-title{
				color:#292929;
				font-family:georgia;
				font-size:17px;
				line-height:28px;
			}
			.titulo_post h2.entry-title a{
				color:#292929;
				font-family:georgia;
				font-size:17px;
				line-height:28px;
			}
			.titulo_post h2.entry-title a:hover{
				color:#c01324;
				font-family:georgia;
				font-size:17px;
				line-height:28px;
			}
			.entry-content p{
				font-size:13px;
			}
			
	/*CONTENIDO POST COMMENT*/
	.contenido_post_coments{
		margin-left:31px;
	}
		#coment_tags{
			margin-top:10px;
		}
		/*Comentarios*/
	
		span.comment-count a{
			bottom:6px;
			left:8px;
			position:relative;
			font-family:trebuchet MS;
			font-size:11px;
			color:#000;
		}
		
		
		/*TAGS*/
		.tags img{
		
		}
		span.entry-tags{
			bottom:6px;
			float:right;
			left:8px;
			position:relative;
			top:-1px;
			
		}
		span.tags{
			bottom:6px;
			float:right;
			left:8px;
			position:relative;
			top:-1px;

		}
			span.tags a{
				font-size:11px;
				font-family:trebuchet MS;
				color:#000;
			}
		/*iconos compartir*/
		ul.compartir2{
			float:right;
		}
		ul.compartir2 li{
			display:inline;
		}
#part_inf{
	background: url("../../img/contenido03.png") no-repeat;
	width: 970px;
	height: 24px;
}


/*-------------------- SIDEBAR ------------------------*/

/*BUSCADOR*/

#lupa img{
	position:relative;
	right:3px;
}
form.searchform{
	margin-top:8px;
}
#search{
	background:url("../../img/input_buscador.png") no-repeat scroll 0 0 transparent;
	border:medium none;
	height:36px;
	list-style:none outside none;
	width:171px;
	color:#fff;
	position:relative;
	right:3px;
	/*bottom:9px;*/
	top:-11px;
	width:171px;
}
#search-btn{
	background:url("../../img/btn_buscar.png") no-repeat scroll 0 0 transparent;
	border:medium none;
	height:36px;
	width:74px;
	position:relative;
	right:12px;
	width:74px;
	bottom:16px;
}
	
#widget-categories, #widget-bookmarks{
	margin-top:27px;
}

	ul.xoxo{
		margin-left:52px;
		margin-top:13px;
	}
	ul.xoxo li{
		list-style-image:url("../../img/btn_lista.jpg");
		margin-top:5px;
	}
		ul.xoxo li a{
			color:#404040;
			font-size:13px;
			font-family:trebuchet MS;
		}
/*RSS*/
#widget-feeds ul.xoxo2{
	margin-left:38px;
}
#widget-feeds ul.xoxo2 li a{
	color:#fff;
	text-decoration:none;
	display: block;
}

#widget-feeds ul.xoxo2 li a:link, ul.xoxo2 li a:visited {
	padding: 0px;
	display: block;
	text-decoration: none;
}

#widget-feeds ul.xoxo2 li a.rss span{				
	display: block;
	text-indent:-3000px;				
}

	/*.................  HOME ...........................*/
	#widget-feeds ul.xoxo2 li a.rss{				
		background-image:url("../../img/btn_rss.png");
		background-repeat: no-repeat;
		height:30px;
		width:190px;
		margin-right:-2px;						
	}

	#widget-feeds ul.xoxo2 li a.rss:hover{			
		background-image:url("../../img/btn_rss.png");
		background-repeat: no-repeat;
		height:30px;
		width:190px;
		background-position:0 -31px;
		margin-top:0px;					
	}

/*...................COMENTARIOS ........................*/
#comments, #respond{
	margin-left:64px;
}
#comments{
	margin-top:60px;
}
h3.comment-title, h3#leave-a-reply{
	color:#c01324;
	font-family:trebuchet MS;
	font-size:15px;
}
h3.comment-title{
	margin-bottom:10px;
}
.fn a.url{
	color:#c01324;
	font-family:trebuchet MS;
	font-size:13px;
}
.comment-meta span.comment-permalink a{
	color:#393939;
	font-family:trebuchet MS;
	font-size:11px
}
.comment-content p{
	color:#000;
	font-family:trebuchet MS;
	font-size:11px
}
.comment-feed-link{
	margin-left:10px;
}
.comment-reply a.comment-reply-link{
	color:#c01324;
	font-family:trebuchet MS;
	font-size:11px;
}
.avatar {
	float:left;
	margin-right:5px;
	padding:1px;
}

/*form comentario*/
form#comment-form{
	margin-top:10px;
}

	#author, #email, #url {
		background:url("../../img/input_form.jpg") no-repeat scroll 0 0 transparent;
		border:medium none;
		height:32px;
		width:421px;
	}
	#comment {
		background:url("../../img/input_comment.jpg") no-repeat scroll 0 0 transparent;
		border:medium none;
		height:135px;
		width:421px;
	}
	#submit {
		background:url("../../img/btn_enviar.png") no-repeat scroll 0 0 transparent;
		border:medium none;
		height:36px;
		margin-left:535px;
		margin-right:20px;
		position:relative;
		right:189px;
		width:77px;
	}
	form#comment-form label{
		color:#404040;
		font-family:trebuchet MS;
		font-size:13px;
	}
	
	
/*Artículos anteriores*/
.single-page-navigation .nav-previous {
color:#C01324;
float:left;
font-family:georgia;
font-size:15px;
margin-left:27px;
}
.nav-meta a{
	color:#C01324;
	font-family:georgia;
	font-size:12px;
}
.single-page-navigation .nav-next {
float:right;
margin-right:24px;
color:#C01324;
font-family:georgia;
font-size:15px;
}
.nav-next a {
color:#C01324;
font-family:georgia;
font-size:12px;
margin-left:30px;
}
/*------------------------------

			BUSCAR ERROR

--------------------------------*/	
.no_encontrado{
	margin-left:39px;
}

/*RESULTADO DE LA BÚSQUEDA*/
h1.search-title {
font-family:georgia;
font-size:18px;
margin-left:32px;
padding-bottom:20px;
width:545px;
}
	
/*-------------------------------------------------


					PIE



-----------------------------------------------------*/	
.pie{
	
	margin:0 auto;
	margin-top:-3px;
}
	p.copy{
		color:#000;
		font-family:trebuchet MS;
	}
	#autor{
		padding-left:9px;
			background:url("../../img/reflejo_rafa.png") no-repeat scroll 0 0 transparent;
			border:medium none;
			height:66px;
			width:419px;
		
	}
	#autor a img.rafa{
		margin-top:10px;
		float:left;
	}
	
	#autor a.mail{
		color:#fff;
		text-decoration:none;
		display: block;
		float:left;
	}

	#autor a.mail:link, #autor a.mail:visited {
		display:block;
		left:4px;
		padding:0;
		position:relative;
		text-decoration:none;
		top:15px;
	}

	#autor a.mail span{				
		display: block;
		text-indent:-3000px;				
	}

	#autor a.mail{				
		background-image:url("../../img/hover_mail.png");
		background-repeat: no-repeat;
		height:14px;
		width:63px;
		margin-left:0px;	
							
	}

		#autor a.mail:hover{			
		background-image:url("../../img/hover_mail.png");
		background-repeat: no-repeat;
		height:14px;
		width:63px;
		background-position:0 -16px;
		margin-top:0px;
}
#logo_dinamiclab{
	position:relative;
	right:10px;
	top:10px;
}
/* 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-0   { width: 3px; }/*usado*/
.ancho-0a   { width: 32px; }/*usado*/
.ancho-1   { width: 49px; }/*usado*/
.ancho-1b   { width: 65px; }/*usado*/
.ancho-2   { width: 123px; }/*usado*/
.ancho-3   { width: 134px; }/*usado*/
.ancho-4   { width: 152px; }/*usado*/
.ancho-5   { width: 170px; }/*usado*/
.ancho-5b   { width: 195px; }/*usado*/
.ancho-5c   { width: 223px; }/*usado*/
.ancho-6   { width: 233px; }/*usado*/
.ancho-6b   { width: 235px; }/*usado*/
.ancho-7   { width: 180px; }/*usado*/
.ancho-8   { width: 229px; }/*usado*/
.ancho-8b   { width: 310px; }/*usado*/
.ancho-9   { width: 365px; }/*usado*/
.ancho-10  { width: 390px; }
.ancho-10a  { width: 411px; }/*usado*/
.ancho-10b  { width: 421px; }/*usado*/
.ancho-11  { width: 429px; }/*usado*/
.ancho-12  { width: 470px; }
.ancho-13  { width: 500px; }/*usado*/
.ancho-14  { width: 545px; }/*usado*/
.ancho-15  { width: 594px; }/*usado*/
.ancho-16  { width: 630px; }
.ancho-17  { width: 675px; }/*usado*/
.ancho-18  { width: 710px; }
.ancho-19  { width: 750px; }
.ancho-20  { width: 790px; }
.ancho-21  { width: 838px; }/*usado*/
.ancho-22  { width: 870px; }
.ancho-23  { width: 960px; }
.ancho-24  { width: 970px; }


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