@import url(inicial.css);

/* Para conseguir que el pie siempre sea empujado abajo de la pagina*/
html,body { height:100%;}
/* Hack para IE 6 */
* html #contenedor {height:100%;}
body	{font-size: 100.01%;font-family: Arial, Verdana, Helvetica, sans-serif;color:#444;background-color: #fff;}


/* Para conseguir que el pie siempre sea empujado abajo de la pagina*/
#contenedor{ margin:0 auto;min-height: 100%;width:62em; }

a{ text-decoration:underline}
a:hover{ text-decoration:none}
p{ font-size:0.8em; line-height:1.5em; text-align:left;margin:1em auto; padding:0 0.5em}
ul{ margin:0.5em; margin-left:1em}
ul li{ font-size:0.9em; line-height:1.5em; background:url(../images/fondo_lista.gif) no-repeat left center; padding-left:1em }
.listaHorizontal li{ float:left; padding:0.3em 0.6em;}
.listaHorizontal li a{ text-decoration:none}

/* Para que IExplorer 6 respete el Min-Width (Explicado en http://www.positioniseverything.net/articles/jello-expo.html) */
/*.bodydiv { padding: 0 379px 0 385px}
.sizer { width: 100%}
.expander { margin: 0 -379px 0 -385px; position: relative; min-width: 385px}*/



/* -------------------- REGLAS APLICABLES A LA CABECERA  --------------------------- */

#cabecera{   height:6em; margin:auto;float:left;width:100%; }
#cabeceraLogo{ float:left;width:46%; }
#cabeceraMenuUtilidades{ float:right;width:54%; padding-top:1em;}
#cabeceraMenuUtilidades ul li{  background:url(../images/fondo_menu_utilidades.jpg) ; margin-left:0.1em; margin-right:0.1em }
#cabeceraMenuUtilidades ul li.selected{color:#999; font-weight:bold;  font-size:0.8em; background:url(../images/fondo_menu_utilidades.jpg) -20px 94px; padding-top:0.4em; padding-bottom:0.45em }
#cabeceraMenuUtilidades ul li.clientes { margin-left:2em}
#cabeceraMenuUtilidades a{ color:#999; font-weight:bold;  font-size:0.9em}
#cabeceraMenuUtilidades .clientes a{ color:#FF8911;}



/* -------------------- REGLAS APLICABLES AL CONTENIDO --------------------------- */  
#contenido{width:97%; float:left; margin-top:16em; padding:0 1em;}
.contenedorHome{ background:url(../images/fondo_home.jpg) no-repeat}


/* -------------------- pie  --------------------------- */  
#pie{width:99%; float:left ; border-top:1px solid #FFDCB9; padding:0.3em 0; margin:1.2em 0 }
.pieBloque{ margin:auto; width:45em}
#pie ul li{ font-size:0.8em; font-weight:bold; background:none}
#pie ul li a{ color:#FF9A35; text-decoration:underline}
#pie ul li a:hover{text-decoration:none}


/* -------------------- estilos de HOME  --------------------------- */  
.bloqueSeccionInfo{ background:url(../images/fondo_inf_titulo.jpg) repeat-x bottom left; float:left; margin-bottom:2em}
.bloqueSeccionInfoTitulo{ background:url(../images/fondo_sup_titulo.jpg) repeat-x top left; height:3em; padding-top:0.5em; width:100%}
.bloqueSeccionInfoTitulo h2{ margin-left:1em; font-weight:bold; font-size:1.1em}
.bloqueSeccionInfoContenido{ width:100%; font-size:0.9em; min-height:7.7em; float:left; }
.bloqueSeccionInfoContenido p{ margin-left:0.5em; margin-right:0.5em; margin-top:-0.3em}
.bloqueSeccionInfoContenido p.textoImg{ float:left; width:72%}
.bloqueSeccionInfoContenido img{ border:1px solid #CCC; float:right; margin:0 0.4em 1em 0.4em }
.bloqueSeccionInfoEnlace{ width:100%; float:left; margin-bottom:1.2em; font-size:0.8em; text-align:right; height:2.2em;  }
.bloqueSeccionInfoEnlace a{ color:#555; display:block; padding-right:1em}
.bloqueSeccionInfoEnlace a:hover{ color:#FF8911}

.seccionAltaBuscadores{ width:30em;}
.seccionEstrategia{width:25em; clear:both}
.seccionMarketing{width:32.5em; margin-left:2.4em}
.bloqueSeccionInfoTitulo h2.bloqueSeccionInfoTituloSmall{ font-size:1em; margin-left:0.7em}
.seccionCursos{width:25em; clear:both}
.seccionOptimizacion{width:32.5em; margin-left:2.4em}

.bloqueBotonHome{ float:left; width:20em; padding:9em 0 0 7em}


/* -------------------- estilos de SECCIONES  --------------------------- */  
.bloqueTituloSeccion{ float:left; width:100%; background:url(../images/fondo_seccion_titulo.jpg) no-repeat left bottom; padding-bottom:0.5em; margin-bottom:1em }
.bloqueTituloSeccion h2{font-weight:bold; margin-left:1em} 
#contenido p.textoCorto{ width:60%; margin:0; margin-bottom:1em}
ul.listaInterior{ margin-left:4em; font-size:0.8em}
.bloqueBotonSeccion{ float:left; width:100%; text-align:center; margin-bottom:2em; margin-top:1em  }
.bloqueBotonSeccion a{ margin:1em auto; }
ul.listaSecciones li{ background:url(../images/fondo_seccion_interior.jpg) no-repeat top right; padding-top:1.2em; height:3.28em; width:12.5em; margin:0 0.7em; text-align:center; line-height:1em }
ul.listaSecciones li.seccionSeleccionada{ background:url(../images/fondo_seccion_interior_selected.jpg) no-repeat top right; }
ul.listaSecciones li.enlaceCorto{ width:9.5em} 
ul.listaSecciones li.enlaceMuyCorto{ width:8em} 
.listaSecciones a{ color:#666; font-size:0.8em; display:block; height:100%}
.listaSecciones a:hover{ color:#FF8911; }
.listaSecciones span{ color:#666; font-size:0.8em; display:block; height:100%; font-weight:bold}
h3{ margin:2em 0; margin-bottom:0.5em; color:#333}
h4.tituloLista2{ margin:2em 0; margin-bottom:0.2em; color:#666; font-weight:bold; margin-left:1em}
ul li.noBullet{ background:none}

/* -------------------- estilos de CONTACTO  --------------------------- */  
.seccionContacto{width:38em; margin-top:1em; padding-bottom:1em; margin-bottom:1em}
.explicacionAsteriscos{ float:left; width:99%; text-align:right;}
.explicacionAsteriscos p{ padding-right:2em; text-align:right}
.asterisco{ color:#F00; font-weight:bold; font-size:1.5em}
.bloqueCampoForm{ width:98%; margin:0.7em 0; float:left}
.labelForm{ width:48%; float:left; text-align:right; padding-right:0.5em}
.labelForm label.obligatorio{ background:url(../images/asterisco.jpg) no-repeat 0 3px; padding-left:0.6em}
.campoForm{ width:50%; float:right}
.campoForm input{ width:80%; }
.campoForm input.inputCorto{ width:30%; }
.campoForm textarea{width:80%; }

/* botontes animados */
.imagenSolicitar{background:url(../images/boton_presupuesto.jpg) no-repeat 0 0;display:block;height:64px;position:relative;width:213px;}
.imagenSolicitarOver {background:transparent url(../images/boton_presupuesto.jpg) no-repeat scroll 0 -64px;display:none;height:64px;left:0pt;position:absolute;top:0pt;width:213px;}

.imagenContacto{background:url(../images/boton_contacto.jpg) no-repeat 0 0;display:block;height:64px;position:relative;width:213px; margin:auto}
.imagenContactoOver {background:transparent url(../images/boton_contacto.jpg) no-repeat scroll 0 -64px;display:none;height:64px;left:0pt;position:absolute;top:0pt;width:213px; border:none}

/* fondos */
.contenedorAlta{ background:url(../images/fondo_alta.jpg) no-repeat}
.contenedorContacto{ background:url(../images/fondo_contacto.jpg) no-repeat}
.contenedorFilosofia{ background:url(../images/fondo_filosofia.jpg) no-repeat}
.contenedorCursos{ background:url(../images/fondo_cursos.jpg) no-repeat}
.contenedorEnlaces{ background:url(../images/fondo_marketing.jpg) no-repeat}
.contenedorPlanificacion{ background:url(../images/fondo_planificacion.jpg) no-repeat}
.contenedorPosicionamiento{ background:url(../images/fondo_optimizacion.jpg) no-repeat}
.contenedorSobrenosotros{ background:url(../images/fondo_sobreNosotros.jpg) no-repeat}