* { margin:0; padding:0; } img { border:0; } a { text-decoration: none;} a:link {color:#FFA31F;} a:visited {color:#FFA31F;} img, div { behavior: url(css/iepngfix.htc) } h1, h2, h3, h4 {font-weight: inherit; font-style: inherit; font-size: 100%; font-family: inherit;} p {margin:0 0 20px 0;} ol, ul { list-style: none; margin:0; } ul { list-style:none; display:inline-block; } ul li { float:left; } body { color:#000; font-family: verdana, arial, helvetica, sans-serif; line-height:1.4;} #home, #web, #newsletters { margin-right:0; border-right:none; } #main { width:100%;} #main .inside { clear:both; height:100%; margin:0 auto; position:relative; width:940px; border:0px solid #f0f;} /************************************************************************* CABECERA ******************************************************************************/ #header { background:#fff url('../images/header.jpg') repeat-x left top; height:140px;} #header .inside { height:100%; border:0px solid #000;} #header #logo { position:relative; top:0px; left:480px; width:443px; height:80px; overflow:hidden; color:#fff;} #header #menu {width:460px; height:50px; border:0px solid #000; float:left;} /*************************************************************************** MENU ******************************************************************************/ #menu li { float:left; display:block; padding:0 15px; font-size:12pt; } #menu li a { color:#79777a; display:block; text-decoration:none; } #menu li a.current { color:#85ad35; border-bottom:3px solid #ebebeb; } #menu li a:hover { color:#FFA31F; } /*********************************************************************** MENU SERVICIOS *************************************************************************/ #menu_servicios {background:url('../images/fondo_menu_servicios.png') no-repeat left top; margin-top:33px; padding:0 17px 0 0; height:27px; width:444px; float:right; border:0px solid #000;} #menu_servicios li {float:left; display:block; padding:5px 30px 0 30px;} /************************************************************************ BANNER HOME *************************************************************************/ #home #banner { background:transparent url('../images/banner_repeat.jpg') repeat-x left top; height:279px;} #home #banner .inside { background:transparent url('../images/banner_principal.jpg') no-repeat left top; height:100%; } #links {position:relative; top:7px; width:880px; height:37px; padding:0 15px 0 15px; border:0px solid #000;} /*#links #webdesign { width:183px; height:40px; float:left; margin:0 15px 0 8px; border:1px solid #000; overflow:hidden;}*/ #links #webdesign { width:183px; height:40px; float:left; margin:0 15px 0 30px; border:0px solid #000; overflow:hidden;} #links #webdesign #imagen1 {background:url(../images/diseņo_web.png) no-repeat 0px 0px; width:183px; height:80px; display:block;} #links #webdesign #imagen1:hover {background:url(../images/diseņo_web.png) no-repeat 1px -37px; width:183px; height:80px; display:block;} #links #newsletters { width:210px; height:40px; float:left; margin:0 125px 0 125px; overflow:hidden;} #links #newsletters #imagen2 {background:url(../images/newsletters.png) no-repeat 0px 0px; width:2103px; height:80px; display:block;} #links #newsletters #imagen2:hover {background:url(../images/newsletters.png) no-repeat 0px -38px; width:210px; height:80px; display:block;} #links #banners{ width:183px; height:40px; float:left; margin:0 0px 0 0px; border:0px solid #000; overflow:hidden;} #links #banners #imagen3 {background:url(../images/banners.png) no-repeat 0px 0px; width:183px; height:80px; display:block;} #links #banners #imagen3:hover {background:url(../images/banners.png) no-repeat -1px -38px; width:183x; height:80px; display:block;} #links2 {position:relative; top:10px; width:900px; height:155px; padding:0 15px 0 15px; border:0px solid #000;} #links2 #webdesign_img { width:250px; height:164px; float:left; margin:0; border:0px solid #000; overflow:hidden;} #links2 #webdesign_img #imagen4 {background:url(../images/diseņo_web_img.png) no-repeat 0px 0px; width:250px; height:328px; display:block;} #links2 #webdesign_img #imagen4:hover {background:url(../images/diseņo_web_img.png) no-repeat 1px -164px; width:250px; height:328px; display:block;} #links2 #newsletters_img { width:250px; height:164px; float:left; margin:5px 0 0 70px; border:0px solid #000; overflow:hidden;} #links2 #newsletters_img #imagen5 {background:url(../images/newsletters_img.png) no-repeat 0px 0px; width:250px; height:328px; display:block;} #links2 #newsletters_img #imagen5:hover {background:url(../images/newsletters_img.png) no-repeat 4px -173px; width:250px; height:328px; display:block;} #links2 #banners_img { width:250px; height:164px; float:left; margin:5px 0 0 80px; border:0px solid #000; overflow:hidden;} #links2 #banners_img #imagen6 {background:url(../images/banners_img.png) no-repeat 0px 0px; width:250px; height:328px; display:block;} #links2 #banners_img #imagen6:hover {background:url(../images/banners_img.png) no-repeat 1px -173px; width:250px; height:328px; display:block;} #links #webdesign #imagen1 img, #links2 #webdesign_img #imagen4 img, #links #newsletters #imagen2 img, #links2 #newsletters_img #imagen5 img,#links #banners #imagen3 img, #links2 #banners_img #imagen6 img {display:none;} #descripciones {position:relative; top:0px; width:100%; height:100px; font-family:verdana; font-size:11px;} #desc_webdesign {color:#000; width:250px; padding:20px 10px 0 10px; margin:0 30px 0 0px; float:left; border:0px solid #000;} #desc_newsletters {color:#000; width:250px; padding:20px 10px 0 10px; margin:0 30px 0 50px; float:left; border:0px solid #000;} #desc_banners {color:#000; width:250px; padding:20px 10px 0 10px; margin:0 10px 0 10px; float:left; border:0px solid #000;} .leer_mas {font-size:10px;} /****************************************************************************************************************************************************************/ /************************************************************ BANNER SERVICIOS, CONTACTO, ACERCADE, ENLACES *************************************************************************/ #web #banner, #newsletters #banner, #banners #banner, #contacto #banner, #acercade #banner, #enlaces #banner , #error404 #banner{ background:transparent url('../images/banner_servicios_repeat.jpg') repeat-x left top; height:131px; border:0px solid #f00;} #web #banner .inside { background:transparent url('../images/banner_servicios.png') no-repeat left top; height:100%;} #web #banner #img {position:relative; left:550px; width:257px;} #newsletters #banner .inside { background:transparent url('../images/banner_newsletters.png') no-repeat left top; height:100%;} #newsletters #banner #img {position:relative; z-index:200; left:630px; top:20px; width:194px; border:0px solid #000;} #banners #banner .inside { background:transparent url('../images/banner_banners.png') no-repeat left top; height:100%;} #banners #banner #img {position:relative; left:550px; width:257px; height:150px;} #contacto #banner .inside { background:transparent url('../images/banner_contacto.png') no-repeat left top; height:100%;} #contacto #banner #img {position:relative; left:550px; top:-20px; width:264px; height:145px; } #acercade #banner .inside { background:transparent url('../images/banner_acercade.png') no-repeat left top; height:100%;} #enlaces #banner .inside { background:transparent url('../images/banner_enlaces.png') no-repeat left top; height:100%;} #enlaces #banner #img { position:relative; left:500px; top:-35px; width:358px; height:164px; } #error404 #banner .inside {font-size:20px; font-style:bold; color:#000;} /****************************************************************************************************************************************************************/ #content .inside {background:#fff; height:100%; margin:36px auto 0 auto; font-size:12px; color:#4d4d4d; border:0px solid #000;} /*********************************************************************** CONTENIDO HOME *************************************************************************/ #home #content {background:#fff; height:250px;} #home #content #descripcion {width:440px; float:left; padding:0 20px 30px 0; border-right:1px solid #d8d8d8;} #home #content #ademas {width:450px; height:200px; float:left; color:#FFA31F; font-size:15px; padding-left:15px; border:0px solid #d8d8d8;} #home #content #ademas #icorporativa {background:transparent url('../images/imagen_corporativa.png') no-repeat; width:235px; height:23px;} #home #content #ademas #logos {} #home #content #ademas #graphic {background:transparent url('../images/graphic_design.png') no-repeat; width:191px; height:25px; float:right;} /*****************************************************************************************************************************************************************/ /********************************************************************** CONTENIDO SERVICIOS *******************************************************************************/ #portafolio {width:100%; float:left; border-top:1px solid #d8d8d8; padding-top:18px;} #portafolio #img_portafolio{background:transparent url('../images/portafolio.png') no-repeat; width:174px; height:31px; padding-bottom:20px;} #portafolio .web {width:202px; float:left; padding:0 15px 0 15px; border:0px solid #333;} #portafolio .titulo {color:#666;} #portafolio .prev {width:202px; height:160px; margin:5px 0 5px 0; border:3px solid #232323; } #newsletters #content #portafolio .prev {width:202px; height:290px; margin:5px 0 5px 0; border:3px solid #232323; } #portafolio .prev a {font-size:0px; line-height:0;} #portafolio .link, #newsletters #content #portafolio .link{font-size:10px;} #logos {width:100%; padding-top:18px; } #logo_ps {background:url('../images/logos/ps.png'); float:left; width:50px; height:50px; margin:0 3px 0 3px;} #logo_ai {background:url('../images/logos/ai.png'); float:left; width:50px; height:50px; margin:0 3px 0 3px;} #logo_fl {background:url('../images/logos/fl.png'); float:left; width:50px; height:50px; margin:0 3px 0 3px;} #logo_dw {background:url('../images/logos/dw.png'); float:left; width:50px; height:50px; margin:0 3px 0 3px;} #logo_fw {background:url('../images/logos/fw.png'); float:left; width:50px; height:50px; margin:0 3px 0 3px;} #logo_id {background:url('../images/logos/id.png'); float:left; width:50px; height:50px; margin:0 3px 0 3px;} #logo_php {background:url('../images/logos/php.png'); float:left; width:100px; height:50px; margin:0 3px 0 3px;} #logo_asp {background:url('../images/logos/asp.png'); float:left; width:100px; height:50px; margin:0 3px 0 3px;} /******************************************************** CONTENIDO SERVICIOS - DISEŅO WEB ***********************************************************/ #web #content {background:#fff; height:850px;} #web #content #descripcion {width:550px; float:left; padding:0 18px 44px 0; border-right:1px solid #d8d8d8; } #web #content #opciones {width:330px; float:left; padding:0px 0px 0 18px; border:0px solid #d8d8d8;} #web #content #opciones #img_opciones {background:transparent url('../images/opciones.png') no-repeat; width:145px; height:25px; padding-bottom:20px;} #hosting, #posicionamiento { padding:18px 0 18px} .boton {background:url('../images/boton.jpg') no-repeat; padding-left:20px; width:14px; height:12px;} /******************************************************** CONTENIDO SERVICIOS - NEWSLETTERS *************************************************************/ #newsletters #content {background:#fff; height:870px;} #newsletters #content #descripcion {width:550px; padding:0 20px 94px 0;} /*********************************************************** CONTENIDO SERVICIOS - BANNERS ***************************************************************/ #banners #content {background:#fff; height:385px;} #banners #content #descripcion {width:900px; float:left; padding:0 20px 54px 0; border:0px solid #000;} /*****************************************************************************************************************************************************************/ /********************************************************************** CONTENIDO CONTACTO *******************************************************************************/ #contacto #content {background:#fff; height:520px;} #contacto #content #descripcion {width:550px; float:left; padding:0 18px 0px 0; border-right:1px solid #d8d8d8;} /*********************************************************** FORMULARIO ***************************************************************/ #contacto #content #formulario {z-index:10; position:relative; overflow:hidden; width:424px; height:340px; background:#efefef; border:1px solid #d8d8d8; margin:18px 0 0 0; padding:18px 18px 0 18px;} #contacto #content #formulario #label {} #contacto #content #formulario input, textarea {font-family:arial; background:#FFB31F url('../images/fondo_form.jpg') repeat-x 0 top; width:300px; margin:5px 0 10px; padding:3px; border:1px solid #666; font-size:11px;} #contacto #content #formulario #boton_enviar {background:#000; color:#fff; width:308px; font-size:12px;} #contacto #content #formulario #gracias {padding-bottom:5px;} #contacto #content #formulario #codigo {width:307px; height:20px; margin:5px 0 15px 0; border:0px solid #666;} #contacto #content #formulario #imagen_seguridad {height:20px; float:left; } #contacto #content #formulario #verificacion {width:140px; margin:0 0 0 19px; float:left; font-size:12px;} #contacto #content #resultado_envio {z-index:2; position:relative; top:-55px; width:460px; height:20px; background:#FFB31F; color:#383838; font-weight:bold; font-size:13px; padding:15px 0 15px 0; text-align:center; border-top:3px solid#d8d8d8; border-left:1px solid #d8d8d8; border-right:1px solid #d8d8d8; border-bottom:1px solid #d8d8d8;} /*****************************************************************************************************************************************************************/ #contacto #content #opciones {width:330px; float:left; padding:0px 0px 0 18px; border:0px solid #d8d8d8;} #contacto #content #opciones #imagen {background:transparent url('../images/informacion.png') no-repeat; width:198px; height:29px; padding-bottom:20px;} /*****************************************************************************************************************************************************************/ /********************************************************************** CONTENIDO ACERCA DE *******************************************************************************/ #acercade #content {background:#fff; height:900px; border:0px solid #000;} #acercade #content #descripcion {width:590px; float:left; padding:0 18px 4px 0; border-right:1px solid #d8d8d8;} #acercade #content #yo {position:relative; top:-90px; left:20px; width:313px; height:626px; float:left; border:0px solid #d8d8d8; background:transparent url('../images/yo.png') no-repeat; } #acercade #content #yo #quiensoy{ padding-top:650px; color:#666; font-size:12px; } #acercade #content #yo #minombre {margin-bottom:18px; } #metodo {width:580px; float:left; border-top:1px solid #d8d8d8; margin-top:18px; padding-top:18px; } #metodo #imagen {background:transparent url('../images/metodo.png') no-repeat; width:122px; height:29px; padding-bottom:20px;} #metodo #fase_inicial {background:transparent url('../images/fase_inicial.png') no-repeat; padding:36px 0 23px;} #metodo #fase_design {background:transparent url('../images/fase_design.png') no-repeat; padding:36px 0 23px;} #metodo #fase_produccion {background:transparent url('../images/fase_produccion.png') no-repeat; padding:36px 0 23px;} #metodo #fase_final {background:transparent url('../images/fase_final.png') no-repeat; padding:36px 0 23px;} /************************************************************************************************************************************************************************/ /********************************************************************** CONTENIDO ERROR404 *******************************************************************************/ #error404 #content {background:#fff; height:610px; border:0px solid #000;} #error404 #content #descripcion {width:590px; float:left; padding:0 18px 4px 0;} #error404 #content #yo {position:relative; top:-150px; left:20px; width:313px; height:626px; float:left; border:0px solid #d8d8d8; background:transparent url('../images/yo.png') no-repeat; } #error404 #content #yo #quiensoy{ padding-top:650px; color:#666; font-size:12px; } /************************************************************************************************************************************************************************/ /********************************************************************** CONTENIDO ENLACES *******************************************************************************/ #enlaces #content {background:#fff; height:470px; border:0px solid #000;} #enlaces #content #descripcion {width:900px; float:left; padding:0 20px 54px 0; border:0px solid #000;} #enlaces #content #descripcion .enlace {width:440px; padding:0 10px 0 0px; float:left; font-family:arial, verdana; font-size:11px; border:0px solid #000;} #enlaces #content #descripcion .web {color:#4d4d4d; font-size:13px;} #enlaces #content #descripcion .imagen {float:left; margin:0px 10px 18px 0; border:1px solid #4d4d4d;} /****************************************************************************** COMUN ************************************************************************************/ #portafolio a{color:#666;} .resaltar_texto_descripcion {font-weight:bold; text-decoration:underline;} .resaltar_texto {font-weight:bold; } /*********************************************************************** FOOTER *************************************************************************/ #footer { clear:both; background:#000 url('../images/footer.jpg') repeat-x left top; color:#666; padding-top:18px; padding-bottom:30px; overflow:hidden; } #footer .inside {padding:0 0 0 0px; font-size:10px; border:0px solid #f00;} #footer .left {float:left; width:300px; height:90px; border:0px solid #f00;} #footer .titulo {padding:12px 0 12px 0;} #footer .informacion {width:300px; height:50px; border:0px solid #ff0;} #footer .informacion a:link {color:#999;} #footer .informacion a:visited {color:#999;} #footer #submenu {background: transparent url('../images/flecha.png') no-repeat;color:#ddd; height:50px; margin-left:53px; padding:6px 0 0 20px;} #footer #w3c {float:left; margin-top:10px;}