@charset "utf-8";
/* CSS Document */
body{
margin:0; 
padding:0;
background:#EAEAEA url(../images/bg.jpg) repeat-x;
}
/* ======================= VARIOS========================== */
h1, h2, h3, h4, h5, h6 { margin: 0; padding: 0; text-align: left; }
h1 { font-size: 17px; text-transform: uppercase; font-weight: lighter; }
h1 a { color: #333333; text-decoration: none; } h1 a:hover { color: #ff5400; text-decoration: none; }
p { margin: 0; padding: 0; text-align: left; }
a {	color: #ff5400; text-decoration: underline; }
a:hover { color: #000000; text-decoration: none; }
a:focus { outline: none; }
img { border: 0; }
acronym { cursor: help; }

/* ======================= ESTRUCTURA WEB=========================== */
/* ======================= CONTENIDO HEADER=========================== */
#logo{
background: url(../images/logo.png) no-repeat;
width:300px;
height:69px;
border:0px solid lime;
} 
#mainmenu{
height:90px;
border:0px solid #ff4500;
}
.contmenu{
float: left;
width:574px;
border:0px solid #ff4500;
margin:0;
padding:0;
}
#mainmenu ul.menu {
width:574px;
border:0px solid fuchsia;
}
#mainmenu ul.menu li {
list-style: none;
text-indent: -9999px;
float: left;
width: auto;
margin:0;
}
#mainmenu ul.menu li a{
height:75px;
display: block;
}
body #mainmenu ul.menu li a:hover {
background-position: 0 -80px;
}
#home li.home a{
background-position: top;
}
#mainmenu ul.menu li.home a{
width:88px;
background: url(../images/home.gif) no-repeat;
}
#mainmenu ul.menu li.quisom a{
width: 88px;
background: url(../images/quisom.gif) no-repeat;
}
#mainmenu ul.menu li.quienessomos a{
width: 132px;
background: url(../images/quienes.gif) no-repeat;
}
#mainmenu ul.menu li.serveis a{
width: 88px;
background: url(../images/serveis.gif) no-repeat;
}
#mainmenu ul.menu li.servicios a{
width: 88px;
background: url(../images/servicios.gif) no-repeat;
}
#mainmenu ul.menu li.webs a{
width: 88px;
background: url(../images/webs.gif) no-repeat;
}
#mainmenu ul.menu li.contacte a{
width:88px;
background: url(../images/contacte.gif) no-repeat;
}
#mainmenu ul.menu li.contacto a{
width:88px;
background: url(../images/contacto.gif) no-repeat;
}
#mainmenu ul.menu li.cat a{
width:50px;
background: url(../images/cat.gif) no-repeat;
}
#mainmenu ul.menu li.castellano a{
width:71px;
background: url(../images/castellano.gif) no-repeat;
}
/* ======================= CONTENIDO SLIDER=========================== */
#slider{
width:940px; 
height:190px;
margin:0;
padding:0;
border:0px solid #87ceeb;
background: url(../images/slider.png);
}
#slider_cast{
width:940px; 
height:190px;
margin:0;
padding:0;
border:0px solid #87ceeb;
background: url(../images/slider_cast.png);
}
.stepcarousel{
position: absolute; /*leave this value alone*/
overflow: scroll; /*leave this value alone*/
width:224px;
height:140px; /*Height should enough to fit largest content's height*/
border:0px solid navy;
margin:14px 0 0 67px;
}
.stepcarousel .belt{
position: absolute; /*leave this value alone*/
left: 0;
top: 0;
}
.stepcarousel .panel{
float: left; /*leave this value alone*/
overflow: hidden; /*clip content that go outside dimensions of holding panel DIV*/
margin:0; /*margin around each panel*/
width:224px; /*Width of each panel holding each content. If removed, widths should be individually defined on each content DIV then. */
height:140px;
}
/* ======================= CONTENIDO========================== */
#main{
text-align:left;
border:0px solid #7fff00;
}
#caja_web{
width:295px;
height:93px;
float: left;
margin-top:55px;
margin-left:10px;
border:0px solid #666666;
}
#caja_web_cast{
width:295px;
height:93px;
float: left;
margin-top:55px;
margin-left:10px;
border:0px solid #666666;
}
#caja_publicidad {
width:295px;
height:93px;
float: left;
margin-top:55px;
border:0px solid #666666;
}
#caja_publicidad_cast {
width:295px;
height:93px;
float: left;
margin-top:55px;
border:0px solid #666666;
}
#caja_ecommerce {
width:295px;
height:93px;
float: left;
margin-top:55px;
border:0px solid #666666;
}
#caja_ecommerce_cast {
width:295px;
height:93px;
float: left;
margin-top:55px;
border:0px solid #666666;
}
h1.tit_1{
border:0px solid #666666;
margin-right:5px;
}
/* ======================= FOOTER=========================== */
#apDiv1 {
position:absolute;
left:210px;
top:782px;
width:762px;
height:50px;
z-index:1;
border:0px solid #666666;
}
/* =======================QUI SOM =========================== */
.mac{
width:auto;
height:16px;
font: bold 12px/12px Helvetica, Arial, 'Liberation Sans', FreeSans, sans-serif;
color: #444444;
text-align: justify;
border:0px solid #e4e4e4;
padding-left: 17px;
margin-left:5px;
margin-bottom:10px;
margin-top:20px;
background: url(../images/turquoise_button.png) no-repeat bottom left;
List-style:none;
}
/* =======================SERVEIS=========================== */
.serveis{
font: 16px/16px Helvetica, Arial, 'Liberation Sans', FreeSans, sans-serif;
color: #366ba1;
text-align: justify;
border:0px solid #e4e4e4;
margin-left:2px;
margin-bottom:5px;
margin-top:5px;
background:url(images/macosx.gif) bottom left no-repeat;
List-style:none;
}
/*menu-serveis*/
#apDiv2 {
position:absolute;
left:510px;
top:273px;
width:508px;
height:32px;
z-index:2;
}
ul#menu_serveis{
width:600px;
height:30px;
border:0px solid fuchsia;
list-style:none;
float:left;
margin:0;
padding:0;
}
/*catala*/
li.s_web {
float:left;
display:inline;
background: url(../images/li_dissenyweb.png) no-repeat;
width:150px;
height:30px;
border:0px solid #666666;
}
li.s_web a{
float:left;
display:inline;
background: url(../images/li_dissenyweb.png) no-repeat;
width:150px;
height:30px;
border:0px solid #666666;
}
li.s_web a:hover{
float:left;
display:inline;
background: url(../images/li_dissenyweb.png) no-repeat;
width:150px;
height:30px;
border:0px solid #666666;
background-position:0 -30px;
}
li.s_publicitat {
float:left;
display:inline;
background: url(../images/li_publicitat.png) no-repeat;
width:150px;
height:30px;
border:0px solid #666666;
}
li.s_publicitat a{
float:left;
display:inline;
background: url(../images/li_publicitat.png) no-repeat;
width:150px;
height:30px;
border:0px solid #666666;
}
li.s_publicitat a:hover{
float:left;
display:inline;
background: url(../images/li_publicitat.png) no-repeat;
width:150px;
height:30px;
border:0px solid #666666;
background-position:0 -30px;
}
/*Castellano*/
li.s_web_es {
float:left;
display:inline;
background: url(../images/li_disenoweb.png) no-repeat;
width:150px;
height:30px;
border:0px solid #666666;
}
li.s_web_es a{
float:left;
display:inline;
background: url(../images/li_disenoweb.png) no-repeat;
width:150px;
height:30px;
border:0px solid #666666;
}
li.s_web_es a:hover{
float:left;
display:inline;
background: url(../images/li_disenoweb.png) no-repeat;
width:150px;
height:30px;
border:0px solid #666666;
background-position:0 -30px;
}
li.s_publicidad {
float:left;
display:inline;
background: url(../images/li_publicidad.png) no-repeat;
width:150px;
height:30px;
border:0px solid #666666;
}
li.s_publicidad a{
float:left;
display:inline;
background: url(../images/li_publicidad.png) no-repeat;
width:150px;
height:30px;
border:0px solid #666666;
}
li.s_publicidad a:hover{
float:left;
display:inline;
background: url(../images/li_publicidad.png) no-repeat;
width:150px;
height:30px;
border:0px solid #666666;
background-position:0 -30px;
}
li.s_ecommerce {
float:left;
display:inline;
background: url(../images/li_ecommerce.png) no-repeat;
width:150px;
height:30px;
border:0px solid #666666;
}
li.s_ecommerce a{
float:left;
display:inline;
background: url(../images/li_ecommerce.png) no-repeat;
width:150px;
height:30px;
border:0px solid #666666;
}
li.s_ecommerce a:hover{
float:left;
display:inline;
background: url(../images/li_ecommerce.png) no-repeat;
width:150px;
height:30px;
border:0px solid #666666;
background-position:0 -30px;
}
/*====disseny web diseo web====*/
ul.disseny{
border:0px solid #666666;
margin:10px 0 5px 0;
padding:0;	
}
li.listdissenyweb {
font: 14px/14px Helvetica, Arial, 'Liberation Sans', FreeSans, sans-serif;
color: #444444;
text-align: justify;
border:0px solid #e4e4e4;
padding-left: 17px;
margin:5px 0 10px 5px;
background: url(../images/turquoise_button.png) no-repeat left;
List-style:none;
}
/*====publicidad-publicitat====*/
ol.listnu{
font: 14px/14px Helvetica, Arial, 'Liberation Sans', FreeSans, sans-serif;
color: #444444;
border:0px solid #666666;
margin:5px 0 5px 0;
padding: 0;
}
ul.publi{
margin:5px 0 5px -5px;
padding:0;	
}
li.listpubli{
font: 14px/14px Helvetica, Arial, 'Liberation Sans', FreeSans, sans-serif;
color: #444444;
text-align: justify;
border:0px solid #e4e4e4;
padding-left: 17px;
margin:5px 0 10px 5px;
background: url(../images/green_button.png) no-repeat  left;
List-style:none;
}
ul.listpubli{
width:auto;
font: bold 13px/13px Helvetica, Arial, 'Liberation Sans', FreeSans, sans-serif;
color: #444444;
border:0px solid #666666;
margin: 0 0 5px 0;
}
ul.listlogos{
width:auto;
height:40px;
border:0px solid #666666;
background: #DCE6F3;
}
li.google{background: url(../images/logo-google.png) no-repeat; float:left; display:inline; width:85px; height:29px;  border:0px solid orange;  margin:7px 0 0 25px; }
li.google a {background: url(../images/logo-google.png) no-repeat;float: left;display:inline;width:85px;height:29px;border:0px solid orange;}
li.google a:hover{background: url(../images/logo-google.png)  no-repeat 0 -29px;float: left;display:inline;width:85px;height:29px;border:0px solid orange;}
/*======*/
li.yahoo {background: url(../images/logo-yahoo.png) no-repeat;float: left;display:inline;width:85px;height:29px;border:0px solid orange; margin:10px 0 0 15px;}
li.yahoo a  {background: url(../images/logo-yahoo.png) no-repeat;float: left;display:inline;width:85px;height:29px;border:0px solid orange;}
li.yahoo a:hover {background: url(../images/logo-yahoo.png) no-repeat 0 -30px;float: left;display:inline;width:85px;height:29px;border:0px solid orange;}
/*======*/
li.alltheweb {background: url(../images/logo-alltheweb.png) no-repeat;float: left;display:inline;width:85px;height:29px;border:0px solid orange;margin:10px 0 0 15px;}
li.alltheweb a  {background: url(../images/logo-alltheweb.png) no-repeat;float: left;display:inline;width:85px;height:29px;border:0px solid orange;}
li.alltheweb a:hover {background: url(../images/logo-alltheweb.png)  no-repeat 0 -31px;float: left;display:inline;width:85px;height:29px;border:0px solid orange;}
/*======*/
li.yacom {background: url(../images/logo-yacom.png) no-repeat;float: left;display:inline;width:85px;height:25px;border:0px solid orange;margin:5px 0 0 15px;}
li.yacom a  {background: url(../images/logo-yacom.png) no-repeat;float: left;display:inline;width:85px;height:25px;border:0px solid orange;}
li.yacom a:hover {background: url(../images/logo-yacom.png) no-repeat 0 -26px;float: left;display:inline;width:85px;height:29px;border:0px solid orange;}
/*======*/
li.wanadoo {background: url(../images/logo-wanadoo.png) no-repeat;float: left;display:inline;width:85px;height:29px;border:0px solid orange;margin:10px 0 0 15px;}
li.wanadoo a  {background: url(../images/logo-wanadoo.png) no-repeat;float: left;display:inline;width:85px;height:29px;border:0px solid orange;}
li.wanadoo a:hover {background: url(../images/logo-wanadoo.png) no-repeat 0 -28px;float: left;display:inline;width:85px;height:29px;border:0px solid orange;}
/*======*/
li.lycos{background: url(../images/logo-lycos.png) no-repeat;float: left;display:inline;width:85px;height:29px;border:0px solid orange;margin:7px 0 0 15px;}
li.lycos a  {background: url(../images/logo-lycos.png) no-repeat;float: left;display:inline;width:85px;height:29px;border:0px solid orange;}
li.lycos a:hover {background: url(../images/logo-lycos.png) no-repeat 0 -27px;float: left;display:inline;width:85px;height:29px;border:0px solid orange;}
/*======*/
li.tiscali{background: url(../images/logo-tiscali.png) no-repeat;float: left;display:inline;width:85px;height:29px;border:0px solid orange;margin:10px 0 0 15px;}
li.tiscali a  {background: url(../images/logo-tiscali.png) no-repeat;float: left;display:inline;width:85px;height:29px;border:0px solid orange;}
li.tiscali a:hover {background: url(../images/logo-tiscali.png) no-repeat 0 -30px;float: left;display:inline;width:85px;height:29px;border:0px solid orange;}
/*======*/
li.hispavista{background: url(../images/logo-hispavista.png) no-repeat;float: left;display:inline;width:85px;height:29px;border:0px solid orange;margin:10px 0 0 15px;}
li.hispavista a  {background: url(../images/logo-hispavista.png) no-repeat;float: left;display:inline;width:85px;height:29px;border:0px solid orange;}
li.hispavista a:hover {background: url(../images/logo-hispavista.png) no-repeat 0 -32px;float: left;display:inline;width:85px;height:29px;border:0px solid orange;}
/*======*/
li.excite{background: url(../images/logo-excite.png) no-repeat;float: left;display:inline;margin:0 3px 0 0;width:85px;height:33px;border:0px solid orange;margin:2px 0 0 15px;}
li.excite a  {background: url(../images/logo-excite.png) no-repeat;float: left;display:inline;margin:0 3px 0 0;width:85px;height:33px;border:0px solid orange;}
li.excite a:hover {background: url(../images/logo-excite.png) no-repeat 0 -38px;float: left;display:inline;margin:0 3px 0 0;width:85px;height:33px;border:0px solid orange;}

/*====ecommerce====*/
.ecommer{
border:0px solid #666666;
margin:5px 0 5px 0;
padding:0;	
}
li.listecommer{
font: 14px/14px Helvetica, Arial, 'Liberation Sans', FreeSans, sans-serif;
color: #444444;
text-align: justify;
border:0px solid #e4e4e4;
padding-left: 17px;
margin:5px 0 10px 5px;
background: url(../images/pink_button.png) no-repeat left;
List-style:none;
}
#demobotiga{
margin:80px 0 0 350px;
}
#demoajuda{
width:240px;
margin:80px 0 0 340px;
border:0px solid #666666;
padding-left:35px;
}
#demoip{
width:240px;
margin:50px 0 0 350px;
border:0px solid #666666;
padding-left:35px;
}
.imgconexionip{
width:300px;
height:165px;
margin:25px 0 0 325px;
border: 1px solid #e7e7e7;
padding:5px 5px 5px 5px;
}
.textajuda{
font: 12px/12px Helvetica, Arial, 'Liberation Sans', FreeSans, sans-serif;
color: #444444;
text-align:center;
border:0x solid #e4e4e4;
margin:5px 0px 5px -25px; 
padding: 0;
line-height:15pt;
}
/* =======================WEBS=========================== */
div#contenido_galeria {
height:315px;
width:800px;
margin:5px 0 0 0;
display: inline-block;
float: left;
border:0px solid #666666;
margin:25px 0 0 25px;
}
button.prev {
width: 44px;
height: 44px;
background: url(../images/btn_drch.png) no-repeat;
cursor: pointer;
float: left;
position: absolute;
margin-left: 830px;
margin-top: 140px;
z-index: 5;
border:none;
}
button.next {
position: absolute;
width: 44px;
height: 44px;
background: url(../images/bton_izq.png) no-repeat;
cursor: pointer;
z-index: 5;
margin-left: -30px;
margin-top: 140px;
border:none;
}
div#botones_control {
width:800px;
display: table;
margin: auto;
z-index: 0;
height:300px;
border:0px solid fuchsia;
}
div.galeria {
width:800px;
height:300px;
position: absolute;
z-index: 3;
overflow: hidden;
border:0px solid #00bfff;
}
div.galeria ul {
width:800px;
position: absolute;
display: inline-block;
z-index: 5;
margin:0;
border:0px solid #00bfff;
}
div.galeria ul li {
width:800px;
float: left;
height:300px;
margin:0;
padding:30px 0 0 50px;
border:0px solid #00bfff;
}
div.tumb {
float: left;
margin-right: 5px;
margin-bottom: 5px;
width: 175px;
height: 120px;
background-image: url(../images/showcase_a_thumb.png);
padding:5px;
border:0px solid #666666;
}
div.tumb img{
position: absolute;
z-index: 1;
}

/* =======================CONTACTO========================== */
h1.donde{
font: Helvetica, Arial, 'Liberation Sans', FreeSans, sans-serif;
color: #366ba1;
}
#google_maps{
float:right;
height:300px;
margin:5px 0 8px 8px;
border-left:0px solid #666666;
}
.mapa{
width:300px;
height:200px;
background: url(../images/bg_maps.png) repeat;
}
.mapa_mon{
margin:7px 0 5px 10px;
border:1px solid #DADADA;
}
#adreca{
float:left;
margin:-190px 0 0 568px;
width:295px;
height:80px;
border-bottom:1px solid #DADADA;
}
p.text_adreca{
font: 13px/11px "Courier" Arial Helvetica sans-serif ;
color: #151e27;	
margin: 8px 5px 8px 2px;
}
.onestem{
margin:0 0 8px 2px;
}
.dondeestamos{
margin:0 0 8px 2px;
}
/* ----------- My Form ----------- */
#formulario{
float:left;
border:0px solid #666666;
}
form {
text-align: left;
border:0px solid #ff1493;
margin: 5px 5px 5px 5px;
padding-left: 15px;
}
fieldset {
margin: 0;
border: 0;
padding: 0;
}
legend {
display: none;
}
form h3 {
clear: both;
font-size: 12px;
font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
color: #414141;
margin-top: 5px;
}
form label {
font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
font-size: 11px;
color: #333333;
display: block;
width: 340px;
line-height: 9px;
padding:5px 0px 0px 0px;
margin:5px 0 0 0;
border:0px solid #666666;
}
form input {
display: block;
margin-top: 3px;
background-color: #F5F5F6;
border:0px solid #666666;
}
form label.field-first,
form label.field-address,
form label.field-pais,
form label.field-email {
clear: left;
}
form label.field-first,
form label.field-last,
form label.field-city,
form label.field-email,
form label.field-phone {
float: left;
margin: 0px 10px 0px 0px;
width: 150px;
}
form label.field-first input,
form label.field-last input,
form label.field-email input,
form label.field-city input,
form label.field-phone input {
float: left;
width: 150px;
padding: 0px;
background-color: #F5F5F6;
border: 1px solid #D9D9D9;
}
form label.field-pais{
float:left;
margin:5px 10px 0px 0px;
width:150px;
}
form label.field-pais input {
float:left;
width:150px;
padding: 0px;
background-color: #F5F5F6;
border: 1px solid #D9D9D9;
}
form label.field-city {
float: left;
width: 100px;
margin:5px 60px 0px 0px;
}
form label.field-city input{
float: left;
width: 150px;
background-color: #F5F5F6;
border: 1px solid #D9D9D9;
}
form label.field-zip {
float: left;
width:150px;
margin: 5px 0px 0px 0px;
}
form label.field-zip input {
float: none;
width: 100px;
background-color: #F5F5F6;
border: 1px solid #D9D9D9;
}
form label.field-empresa {
float: left;
width:310px;
margin: 5px 0px 0px 0px;
}
form label.field-empresa input {
float: left;
width: 310px;
padding: 0px;
background-color:#F5F5F6;
border: 1px solid #D9D9D9;
}
form label.field-address {
float: left;
width:350px;
margin: 5px 0px 0px 0px;
}
form label.field-address input {
float: left;
width: 310px;
padding: 0px;
background-color: #F5F5F6;
border: 1px solid #D9D9D9;
}
textarea {
width:450px;
font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
font-size: 11px;
color: #333333;
background-color: #F5F5F6;
border: 1px solid #D9D9D9;
display: block;
}
form textarea {
margin-top: 5px;
}
.marco{
height: 25px;
}
.btn  {
clear: left;
background-image: url(../images/btn_enviar.png);
width:158px;
height:27px;
margin: 0px 0 5px 5px;
}
.btn:hover  {
clear: left;
background-image: url(../images/btn_enviar.png);
width:158px;
height:27px;
margin: 0px 0 5px 5px;
background-position:0 -27px;
cursor:default;
}
.btn2{
background-image: url(../images/btn_esborrar.png);
width:158px;
height:27px;
margin: -32px 0 5px 175px;
}
.btn2:hover {
background-image: url(../images/btn_esborrar.png);
width:158px;
height:27px;
margin: -32px 0 5px 175px;
background-position:0 -27px;
}
.btn3{
background-image: url(../images/btn_borrar.png);
width:158px;
height:27px;
margin: -32px 0 5px 175px;
}
.btn3:hover {
background-image: url(../images/btn_borrar.png);
width:158px;
height:27px;
margin: -32px 0 5px 175px;
background-position:0 -27px;
}
/* =======================PAGE FLIP========================== */
#pageflip {
position: relative;
}
#pageflip img {
width: 50px; height: 52px;
z-index: 99;
position: absolute;
right: 0; top: 0;
-ms-interpolation-mode: bicubic;
}
#pageflip .msg_block {
width: 50px; height: 50px;
position: absolute;
right: 0; top: 0;
background: url(../images/subscribe.png) no-repeat right top;
text-indent: -9999px;
}
/* =======================png ie6========================== */
h1, h6, img, div, a href, background, #pageflip, .tit_1, .msg_block, button,  ul, li, .google, .yahoo, .alltheweb, .yacom, .wanadoo, .lycos, .tiscali, .hispavista, .excite  { behavior: url("../iepngfix.htc") }


