body, html {
height:100%;
background:#e76f00;
font-family:verdana;
font-size:12px;
}
#girogift {
}
strong {
font-weight:bold;
}
#contingut {
width:700%;
}
.pagina {
width:14.2857143%;
float:left;
margin:0;
padding:0;
}
.clear {
clear:both;
}
.taronja {
color:#e76f00;
}
p {
font-size:1em;
margin:5px 0 0 0;
}
.header {
width:100%;
height:80px;
background:#fff url(../images/titol-left.jpg) left top no-repeat;
margin:0;
padding:0;
}
.titol {
width:100%;
margin:0;
padding:0;
background: url(../images/titol-right.jpg) right top no-repeat;
}
.titol h1 {
height:75px;
font-size:1em;
padding:5px 0 0 0;
font-weight:bold;
margin:0;
float:left;
}
.titol h1 a, .titol h1 a:visited, .titol h1 a:hover {
margin-left:32px;
padding:0 68px;
width:100%;
color:#e76f00;
text-decoration:none;
}
.titol h1 a:hover {
color:#e76f00;
text-decoration:none;
}
.titol .languages {
float:right;
font-size:11px;
color:#e76f00;
padding:5px 15px 0 0;
}
.titol .languages a, .titol .languages a:visited {
color:#e76f00;
text-decoration:none;
}
.titol .languages a:hover {
text-decoration:underline;
}
.titol a:active, .titol a:focus {
/* Reducimos el tamaño del enlace a cero cuando el enlace está activo.
¡Esto quita literalmente el borde punteado
que SOLAMENTE se aplica al enlace a sí mismo y no
a ninguno de los elementos que contiene
CUANDO ESOS ELEMENTOS TIENEN UNA POSICIÓN ABSOLUTA! */
width:0;
height:0;
outline:0; /* Para los navegadores que lo entienden */
}
/*
Paso 4
Damos el estado activo
*/
.content {
width:100%;
overflow:hidden;
padding:0;
margin:0;
padding:10px 0;
background:#fff;
height:390px;
}
.left {
float:left;
margin:0;
padding:0;
width:20%;
height:410px;
}
.center {
float:left;
width:60%;
height:410px;
}
.center-home {
float:left;
width:100%;
height:410px;
text-align:center;
}
.center-home img{
text-align:center;
}
.right {
float:right;
width:20%;
height:410px;
}
.franja {
height:40px;
background:#fff url(../images/girogift.jpg) left bottom no-repeat;
text-align:center;
width:100%;
}
.bottom {
width:100%;
margin:0;
padding:0;
display:block;
}
.menu {
margin:0;
padding:0;
}
.menu ul li {
float:left;
color:#000;
font-size:12px;
margin:5px 10px 0 10px;
font-weight:bold;
}
.menu ul li a, .menu ul li a:visited {
color:#fff;
font-weight:normal;
text-decoration:none;
}
.menu ul li a:hover, .menu ul li a:active {
font-weight:bold;
}
#products {
width:460px;
margin:0 auto;
padding:0;
}
#products h2 {
font-size:12px;
color:#e76f00;
font-weight:bold;
margin:20px 0;
}
#products ul li {
float:left;
margin:0 20px 0 0;
height:100px;
width:71px;
text-align:center;
}
#products ul li a img:hover {
height:100px;
}
#llista-ofertes {
width:330px;
margin:0 auto;
}
#llista-ofertes ul li{
text-align:center;
float:left;
margin:0 20px 15px 15px;
height:105px;
width:75px;
}
#llista-ofertes ul li a img:hover{
height:105px;
}
#enviat a, #enviat a:visited {
text-decoration:none;
color:#e76f00;
}
#enviat a:hover {
text-decoration:none;
color:#111;
}
/*********FOTOS DE FONS ***************/
#right-empresa {
background:url(../images/empresa-rightbg.jpg) right center no-repeat;
}
#left-serveis {
background:url(../images/serveis-leftbg.jpg) left center no-repeat;
}
#right-serveis {
background:url(../images/serveis-rightbg.jpg) right center no-repeat;
}
#left-productes {
background:url(../images/productes-leftbg.jpg) left center no-repeat;
}
#right-productes {
background:url(../images/productes-rightbg.jpg) right center no-repeat;
}
#left-ofertes {
background:url(../images/ofertes-leftbg.jpg) left center no-repeat;
}
#right-ofertes {
background:url(../images/ofertes-rightbg.jpg) right center no-repeat;
}
#left-info {
background:url(../images/info-leftbg.jpg) left center no-repeat;
}
#right-info {
}
#left-contacte {
}
#right-contacte {
}
/******************TEXTOS*****************/
#flash-empresa {
width:100%;
margin:-455px auto 0 auto;
z-index:0;
position:absolute;
padding:0;
}
#text-empresa {
width:550px;
text-align:justify;
margin:0 auto;
}
#text-empresa .txt {
width:550px;
margin:0 auto;
}
#text-serveis {
text-align:justify;
width:500px;
margin:0 auto;
}
#contactar-text {
background:url(../images/telefon.jpg) left -100px no-repeat;
margin:0;
padding:0 0 0 36%;
float:left;
width:20%;
}
#contactar-text a, #contactar-text a:visited {
color:#111;
text-decoration:none;
}
#contactar-text a:hover {
text-decoration:underline;
}
#enllacos {
float:right;
margin:0;
padding:0;
background:url(../images/mapa.jpg) right -80px no-repeat;
width:44%;
height:510px;
z-index:10;
}
#enllacos a, #enllacos a:hover {
color:#e76f00;
font-size:12px;
text-decoration:none;
}
#enllacos a:hover {
text-decoration:underline;
}
#ftp {
display:block;
margin:0px 0 0 18px;
padding:10px 20px 15px 20px;
background:url(../images/sotalink.png) left top no-repeat;
}
#trobar {
display:block;
padding:10px 20px 15px 20px;
background:url(../images/sotalink.png) left top no-repeat;
margin:28px 0 0 18px;
}
#contactar-text h2 {
width:220px;
font-size:1.1em;
font-weight:bold;
color:#e76f00;
}
#contactar-text p{
width:220px;
font-size:1em;
}
/****** FORMULARI INFORMACIÓ ****/
#formulari {
width:550px;
margin:0 auto;
}
#formulari p {
color:#e76f00;
margin:5px 10px;
}
#formulari .t {
display:block;
width: 70px;
float:left;
overflow:hidden;
}
#formulari .q {
display:block;
width: 150px;
float:left;
overflow:hidden;
}
.cond a, .cond a:visited{
color:#e76f00;
}
.negre, .negre:visited, .negre:hover {
color:#111;
}
.negre a, .negre a:visited, .negre a:hover {
color:#111;
}
.titol .languages {
float:right;
font-size:11px;
color:#e76f00;
padding:5px 15px 0 0;
}
.titol .languages .negre a, .titol .languages .negre a:visited {
color:#111;
text-decoration:none;
}
.titol .languages .negre a:hover {
text-decoration:underline;
}
.firma {
float:right;
font-size:6px;
color:#fff;
margin:25px 10px 0 0;
}
.firma a, .firma a:visited {
color:#fff;
text-decoration:none;
}
/****INFO****/
.q select {
width:125px;
}
textarea {
width:500px;
}
.menu ul .actual a, .menu ul .actual a:visited {
color:#fff;
font-weight:bold;
text-decoration:none;
}