﻿body {
margin : 0;
padding : 0;
 /* text-align : center; centre el contingut */
/*
color: #000000;
background-color : #ffd57d;
*/
}
.thrColHybHdr #contenidortotal {   /* controla lo referent a tot aquest marc */
width : 100%;
height : 100%;
/*margin : 0 auto;            */
color : #1a50b8;
/*text-align : left;      */
}
.thrColHybHdr #contenidorhaeder {
margin : 0;
padding : 0;
width : 100%;
background : #000000;
}
.thrColHybHdr #header {
width : 100%;
padding : 0;
background : #000000;
color : #bcd6d6;
}
.thrColHybHdr #header h1 {
margin : 0;
padding : 0;
text-align : left;
position : relative;
top : auto;
height : 100px;
background-color : #000;
}
.thrColHybHdr #menu {
height : 40px;
background-color : #cc3300;
background-image : url(../img/navsup.gif);
background-repeat : repeat-x;
margin-top: -2px;
/*margin : 0; */
padding-top : 0;
padding-right : 0;
padding-bottom : 0;
padding-left : 0;
}
#contenidorcolesquerra {
float : left;
display: block;
vertical-align:top;
width : 165px;
color : #f00;
font-family : Arial, Helvetica, sans-serif;
top : 0px;           /*controla la posició top dels divs que conté */
margin-top : 0;
margin-bottom : 5px;
/*background : #cc3300;  */
}
.thrColHybHdr #sidebar1 {
float : left;
width : 162px;
background : #cc3300;
border : 1px solid #000000;
padding : 0;
margin-top : 0px;
margin-right : 5px;
border-bottom-left-radius : 11px;
border-bottom-right-radius : 11px;
-moz-border-radius: 0px 0px 11px 11px;
-webkit-border-radius: 0px 0px 11px 11px;
behavior: url(../estils/border-radius.htc);  /* Para IE */
}
#contenidorcoldreta {
float : right;
display: block;
vertical-align:top;
top : 0px;           /*controla la posició top dels divs que conté */
margin-top : 0px;    /*controla la posició top dels divs que conté */
margin-right : 0;
width : 115px;
height: auto;
}
.contenidorcoldreta {
width : 115px;
margin : 0;
}
.thrColHybHdr #sidebar2 {
float : right;
width : 115px;
/*height: 800px;    des d'aquí es controla l'alçada de sidebar   */
background : #ffbf00;  /* fondo de color taronja */
border : 1px solid #000000;
border-bottom-left-radius : 11px;
border-bottom-right-radius : 11px;
-moz-border-radius: 0px 0px 11px 11px;
-webkit-border-radius: 0px 0px 11px 11px;
behavior: url(../estils/border-radius.htc);  /* Para IE */
}
.thrColHybHdr #mainContent {
margin : 0 120px 0 168px;
padding : 5px 10px 0 10px;  /*el primer controla el paddin top del costext */
}
#contenidorparcial {
float : left;
margin : 0 auto;
width : 50%;
}
.contenidorparcial {
float : left;
margin : 0 auto;
width : 50%;
}
.thrColHybHdr #footer p {
margin : 0;
padding : 10px 0;
}
.thrColHybHdr #sidebar1 h3, .thrColHybHdr #sidebar1 p, .thrColHybHdr #sidebar2 p, .thrColHybHdr #sidebar2 h3 {
margin-left : 1px;
margin-right : 1px;
margin-bottom: 1px;
top: 0;
}
/* FI DE L'ESTRUCTURA O MAQUETACIÓ BÀSICA */


#apDiv {
position : absolute;
left : 12px;
top : 255px;
width : 142px;
height : 15px;
z-index : 9;
}
#apDiv1 {     /* posiciona el rellotje */
position:absolute;
right:1px;
top:80px;
width:400px;
height : 25px;
text-align : right;
z-index : 9;
}
.borderwrap {    /* Per formatejar taules */  /* this will affect the outlining border of all the tables and boxes through-out the skin. */
background : #FF0000; /* fondo original #cc9900 */
border : 1px solid #FFFFFF;
padding : 0;
margin : 0;
}
.bordexterns {
float : left;
padding : 10px;
margin : 10px 10px 10px 0;
border : 1px solid #a2acb0;
}
.bordextern1 {
width : auto;
border : 4px double #1e851e;
margin : 0 auto;
padding : 0 0 0 0;
margin-top : 40px;
}
.bordextern2 {
position : relative;
border : 2px solid #e5e5e5;
width : auto;
padding : 10px 0 0 0;
margin : 5px 0 5px 0;
}
.bordextern3 {
padding : 5px;
height : auto;
background-color : #ffff99;
font-weight : bold;
text-align : justify;
padding : 7px;
color : #000000;
border-top-width : medium;
border-right-width : medium;
border-bottom-width : medium;
border-left-width : medium;
border-top-style : solid;
border-right-style : solid;
border-bottom-style : solid;
border-left-style : solid;
border-top-color : #000000;
border-right-color : #999999;
border-bottom-color : #666666;
border-left-color : #000000;
margin : 5px;
}
.bordextern3a {
text-align : justify;
padding : 5px;
height : auto;
background-color :
#ffcc00;
font-weight : bold;
padding : 5px;
color : #000000;
margin : 5px;
border : medium solid #996600;
}
#bordextern4 {
position : relative;
border : 2px solid #ff0000;
width : auto;
padding : 10px;
margin : 20px 0 20px 0;
}
.box1 {
border : 3px solid #ccc;
padding : 8px;
margin : 5px 5px 10px 5px;
background-color : #4c810d;
}
.box2 {
border : 3px solid #ccc;
margin : 5px;
padding : 5px;
/* background-color : #ff9933;   */
}
.box3 {
margin : 20px 0 20px 0;
/*border : 1px solid #000;   */
color : #ffffff;
padding : 5px;
text-align : left;
background-color : #ff0000;
background-image : url(../img/espigant.gif);
}
.box3a {
border : 3px solid #FF0;
color : #EAEA00;
padding : 10px;
font-size : 12pt;
text-align : left;
background-color : #ff0000;
background-image : url(../img/fullesv.jpg);
text-shadow: #000 2px 2px 1px;
-moz-box-shadow: 2px 2px 5px #999;
filter: shadow(color=#000000, direction=135 strength=2);
font-family: "Comic Sans MS", cursive;
margin-top: 20px;
margin-right: 0;
margin-bottom: 20px;
margin-left: 0;
font-weight: bold;
}
.box4 {
margin : 0 0 10px 0;
padding : 3px;
width : 115px;
border : 1px solid #fff;
text-align : center;
font-weight : bold;
}
.boxdret {
float : right;
vertical-align: top;
border : 2px outset #cbc8ca;
background : #774400;
margin-top : 5px;
margin-bottom : 5px;
margin-left : 5px;
margin-right : 5px;
padding : 0;
text-align : center;
width : 100px;
background-color : #1e851e;
color : white;
font-weight : bold;
border : medium outset #f90;
font-size : small;
}
.boxdretA {
float : right;
vertical-align: top;
border : 2px outset #cbc8ca;
background : #774400;
margin-top : 5px;
margin-bottom : 5px;
margin-left : 5px;
margin-right : 5px;
padding : 0;
text-align : center;
width : 100px;
background-color : #aa542b;
color : white;
font-weight : bold;
border : medium outset #f90;
font-size : small;
}
.boxesq0 {
float :left;
border : 2px outset #cbc8ca;
background : #774400;
margin-top : 5px;
margin-bottom : 5px;
margin-left : 5px;
margin-right : 5px;
padding : 5px;
text-align : left;
width : auto;
background-color : #aa542b;
color : white;
font-weight : bold;

border : medium outset #f90;
font-size : small;
background-color :#C00;
display :inline;
}
.boxdret0 {
float : right;
border : 2px outset #cbc8ca;
background-color :#C00;
margin-top : 10px;
margin-bottom : 10px;
margin-left : 5px;
margin-right : 5px;
padding : 0;
text-align : left;
width : 100px;
background-color : #aa542b;
color : white;
font-weight : bold;
display : block;
border : medium outset #f90;
font-size : small;
text-shadow: #000 2px 2px 1px;
-moz-box-shadow:4px 4px 3px #000;
-webkit-box-shadow: 4px 4px 3px #000;
filter: progid:DXImageTransform.Microsoft.Shadow(color=#000000,direction=125,strength=6);
}
.boxdret1 {
float : right;
width : 390px;
border : medium outset #f90;
/*background : #774400;  */
/*background-color :#AA542B;  */
margin-top : 0;
margin-bottom : 10px;
margin-left : 5px;
margin-right : 5px;
display : inline;
}
.boxdret2 {
float : right;
width :auto;
border : medium outset #f90;
/*background : #774400; */
margin-top : 5px;
margin-bottom : 5px;
margin-left : 5px;
margin-right : 5px;
padding : 5px;
background-color :#C00;
display :inline;
text-align: center;
text-shadow: #000 2px 2px 1px;
-moz-box-shadow:4px 4px 3px #000;
-webkit-box-shadow: 4px 4px 3px #000;
filter: progid:DXImageTransform.Microsoft.Shadow(color=#000000,direction=125,strength=6);
}
 .boxdret3 {
float : right;
width :auto;
border : medium outset #f90;
/*background : #774400;  */
margin-top : 5px;
margin-bottom : 5px;
margin-left : 5px;
margin-right : 5px;
padding : 5px;
background-color : #00CC00;
display :inline;
text-align:center;
text-shadow: #000 2px 2px 1px;
-moz-box-shadow:4px 4px 3px #000;
-webkit-box-shadow: 4px 4px 3px #000;
filter: progid:DXImageTransform.Microsoft.Shadow(color=#000000,direction=125,strength=6);
}
.boxesq {
border : 0 solid #ccc;
padding : 0;
margin : 1px 0 1px 0;
height: auto;
}
.boxliq {     /* */
color : #000;
font-weight : bold;
margin: 1px;
border: solid #FFFF33;
border-top-width: 1px;
border-right-width: 1px;
border-bottom-width: 1px;
border-left-width: 1px;
border-radius: 10px;
border-bottom-left-radius : 10px;
border-bottom-right-radius : 10px;
-moz-border-radius: 0px 0px 10px 10px;
-webkit-border-radius: 0px 0px 10px 10px;
behavior: url(../estils/border-radius.htc);  /* Para IE */
  }
.boxliq.marro {background-color:#CC6633;}
.boxliq.blau {background-color : #0000ff;}
.boxliq.verd {background-color: #4c810d;}
.boxliq.taronja {background-color: #FFCC33;}



.boxliqv {     /*verdos  */
 background-color: #4c810d; /* #FFCC33 taronja;   */
 color : #ffff00;
font-weight : bold;
  margin: 20px 20px 20px 20px;
  border: solid #FFFF33;
  border-top-width: 2px;
  border-right-width: 2px;
  border-bottom-width: 2px;
  border-left-width: 2px;
border : 1px solid #FF0;
border-bottom-left-radius : 11px;
border-bottom-right-radius : 11px;
-moz-border-radius: 0px 0px 11px 11px;
-webkit-border-radius: 0px 0px 11px 11px;
behavior: url(../estils/border-radius.htc);  /* Para IE */
  }
  .boxliqv1 {     /*TARONJA  */
 background-color: #B55A00;  /*#CC6600;   */
 color : #000000;
font-weight : bold;
  margin: 20px 20px 20px 20px;
  border: solid #FFFF33;
  border-top-width: 2px;
  border-right-width: 2px;
  border-bottom-width: 2px;
  border-left-width: 2px;
border : 1px solid #FFF;
border-bottom-left-radius : 11px;
border-bottom-right-radius : 11px;
-moz-border-radius: 0px 0px 11px 11px;
-webkit-border-radius: 0px 0px 11px 11px;
behavior: url(../estils/border-radius.htc);  /* Para IE */
  }



.boxliqt {
background-color: #FF9933;  /*taronja;   */
color: #000000;
margin: 20px 20px 20px 20px;
border: solid #fff;
border-top-width: 1px;
border-right-width: 2px;
border-bottom-width: 2px;
border-left-width: 2px;
border-radius: 10px;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
-o-border-radius: 10px;
-khtml-border-radius: 10px;
behavior: url(../estils/border-radius.htc);  /* Para IE */
 /*
border-bottom-left-radius : 11px;
border-bottom-right-radius : 11px;
-moz-border-radius: 0px 0px 11px 11px;
-webkit-border-radius: 0px 0px 11px 11px;
behavior: url(../estils/border-radius.htc);  /* Para IE */
*/
}
.boxlist {
float : left;
top : 30px;
margin : 20px 10px 10px 20px;
padding : 5px;
width : 440px; /* amb auto s'adapta flexiblement a l'amplada de línea més llarga *//* original 430px; */
height : auto;
border : 5px outset #fff;
background-color : #660000;
text-align : left;
color : #ffffff;
font-weight : bold;
background-image : url(../img/1.jpg);  /* imatge de fons del box */
background-repeat : repeat-x;
background-attachment : scroll;
background-position : left bottom;
}
.boxlist0 {
float : left;
top : 30px;
margin : 20px 10px 10px 20px;
padding : 5px;
width : 430px;
height : auto;
border : 5px outset #fff;
background-color : #660000;
text-align : left;
color : #ffffff;
font-weight : bold;
}
div#bgsize{      /* afextarà a tots els DIV que s'els adjudiqui l'id="bgsize". Afectar+a a tot el par+agraf en qüestió */
background: url(../img/fonespig.jpg) no-repeat center center;
background-size: cover;
-moz-background-size: cover;
-webkit-background-size: cover;
-o-background-size: cover;
border: 15px solid #FF9966 ;
filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="../img/fonespig.jpg", sizingMethod="scale");
border-radius: 10px;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
-o-border-radius: 10px;
-khtml-border-radius: 10px;
behavior: url(../estils/border-radius.htc);  /* Para IE */
}
.centrarbloc {   /* centre qualsevol objecte dins el seu contenidor */
text-align : center !important;
}
.clear {
clear : none;
}
.clearr {     /*con esto nos aseguramos de que no se ponga nada a la derecha*/
clear : right;
}
.clearfloat {  /*con esto nos aseguramos de que no se ponga nada a los lados*/  /* esta clase debe colocarse en un elemento div o break y debe ser el último elemento antes del cierre de un contenedor que incluya completamente a un elemento flotante */
clear : both;
height : 0;
font-size : 1px;
line-height : 0;
}
.colvert {
width : 160px;
height : 200px;
margin-left : 10px;
margin-top : 25px;
border : 3px outset #000;
overflow : hidden;
}
.cercador {
position : absolute;
width: 200px;
top : 25px;
right : 5px;
}
.degradado[class] {
background-image : url(../img/degradado.png);
}
.fix {
position : fixed;
top : 300px;
right : 10px;
z-index : 8;
}
.fltrt {
float : right;
margin-left : 8px;

}
.fltlft {
float : left;
margin-right : 8px;
}
.float_left {
float : left;
margin-right : 10px;
-webkit-box-shadow: 2px 2px 6px #000;
-moz-box-shadow: 2px 2px 6px #000;
filter: progid:DXImageTransform.Microsoft.Shadow(color=#666666,direction=125,strength=6);
}
.float_right {
float : right;
margin-left : 10px;
-webkit-box-shadow: 2px 2px 6px #000;
-moz-box-shadow: 2px 2px 6px #000;
filter: progid:DXImageTransform.Microsoft.Shadow(color=#666666,direction=125,strength=6);
}
.fltleftbor {
float : left;
margin-right : 8px;
width : auto;
}
.fltrightbor {
float : right;
margin-left : 8px;
width : auto;
}
.floatletfre {
float : left;
margin : 0 10px 10px 0;
border : 1px solid #666;
padding : 2px;
width : auto;
}
.floatrightre {
float : right;
margin : 0 0 10px 10px;
border : 1px solid #666;
padding : 2px;
width : auto;
}
#footer {
clear : both;
margin : 0;
padding : 0;
text-align : center;
border : 0 solid #aaaaaa;
width : 100%;
height : 68px;
background-image : url(../img/peupag.jpg);
background-repeat : repeat-x;
}
.imagcentrada {
display : block;
margin : 20px auto;
padding : 3px;
text-align : left;
}
.imagcentrada1 {
display : block;
margin : 20px auto;
padding : 3px;
text-align : center;
-webkit-box-shadow: 2px 2px 6px #000;
-moz-box-shadow: 2px 2px 6px #000;
filter: progid:DXImageTransform.Microsoft.Shadow(color=#666666,direction=125,strength=6);
}
.imagcentrada2 {
display : block;
margin : 20px auto;
padding : 3px;
text-align : center;
}
.imagleftc {
float : left;
border : 1px solid #90b905;
margin : 5px 10px 5px 0px;
padding : 5px;
-webkit-box-shadow: 2px 2px 6px #000;
-moz-box-shadow: 2px 2px 6px #000;
filter: progid:DXImageTransform.Microsoft.Shadow(color=#666666,direction=125,strength=6);
}
.imagleft2 {
float : left;
margin-right : 10px;
margin-bottom : 5px;
border : 0;
-webkit-box-shadow: 2px 2px 6px #000;
-moz-box-shadow: 2px 2px 6px #000;
filter: progid:DXImageTransform.Microsoft.Shadow(color=#666666,direction=125,strength=6);
}
.imagright {
float : right;
margin-left : 10px;
margin-bottom : 5px;
border : 0;
-webkit-box-shadow: 2px 2px 6px #000;
-moz-box-shadow: 2px 2px 6px #000;
filter: progid:DXImageTransform.Microsoft.Shadow(color=#666666,direction=125,strength=6);
}
.imagrightc {
float : right;
border : 1px solid #90b905;
margin : 5px 5px 5px 5px;
padding : 5px;
-webkit-box-shadow: 2px 2px 6px #000;
-moz-box-shadow: 2px 2px 6px #000;
filter: progid:DXImageTransform.Microsoft.Shadow(color=#666666,direction=125,strength=6);
}
div.intro1 {   /* Todos los elementos de tipo "div" con classe="intro" */
display: block;
margin: 15px 30px 25px 30px;
padding: 5px 12px 5px 12px;
font-size : 12px;
font-family : Arial, Helvetica, sans-serif;
text-decoration : none;
font-style : italic;
font-weight : bold;
text-align : justify;
clear: none;
background-color: #FFFFFF; /*    aquest provoca que a IE no aparegui la sombra */
color: #000000;
border: 1px solid #666666;
border-radius: 10px;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
-o-border-radius: 10px;
-khtml-border-radius: 10px;
behavior: url(../estils/border-radius.htc);  /* Para IE */
-moz-box-shadow:4px 4px 3px #000;
-webkit-box-shadow: 4px 4px 3px #000;
filter: progid:DXImageTransform.Microsoft.Shadow(color=#000000,direction=125,strength=5);
 }
div.intro2 {   /* Todos los elementos de tipo "div" con classe="intro" */
display: block;
margin: 15px 30px 25px 30px;
padding: 5px 12px 5px 12px;
font-size : 12px;
font-family : Arial, Helvetica, sans-serif;
text-decoration : none;
font-style : italic;
font-weight : bold;
text-align : justify;
clear: none;
background-color: #FFFF99; /*    aquest provoca que a IE no aparegui la sombra */
color: #000000;
border: 1px solid #666666;
border-radius: 10px;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
-o-border-radius: 10px;
-khtml-border-radius: 10px;
behavior: url(../estils/border-radius.htc);  /* Para IE */
-moz-box-shadow:4px 4px 3px #000;
-webkit-box-shadow: 4px 4px 3px #000;
filter: progid:DXImageTransform.Microsoft.Shadow(color=#000000,direction=125,strength=5);
 }
.intromev  {
font-family : Arial, Helvetica, sans-serif;
text-decoration : none; 
font-style : italic;
font-weight : bold;
text-align: justify;
background-color: #FFFF99;  /*  */
color: #000000;
margin: 10px 20px 10px 20px;
border: solid #000;
border-top-width: 1px;
border-right-width: 2px;
border-bottom-width: 2px;
border-left-width: 2px;
padding: 5px 10px 5px 10px;
border-radius: 10px;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
-o-border-radius: 10px;
-khtml-border-radius: 10px;
behavior: url(../estils/border-radius.htc);  /* Para IE */
-moz-box-shadow:4px 4px 3px #000;
-webkit-box-shadow: 4px 4px 3px #000;
filter: progid:DXImageTransform.Microsoft.Shadow(color=#000000,direction=125,strength=5);
*/
  }
.intromev1 {
margin: 15px 30px 25px 30px;
padding: 5px 10px 5px 10px;
font-size : 12px;
font-family : Arial, Helvetica, sans-serif;
text-decoration : none;
font-style : italic;
font-weight : bold;
text-align : justify;
clear: none;
background-color: #FFFFFF;   /*  aquest provoca que a IE no aparegui la sombra */
color: #000000;
border: 1px solid #666666;
border-radius: 10px;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
-o-border-radius: 10px;
-khtml-border-radius: 10px;
behavior: url(../estils/border-radius.htc);  /* Para IE */
-moz-box-shadow:4px 4px 3px #000;
-webkit-box-shadow: 4px 4px 3px #000;
filter: progid:DXImageTransform.Microsoft.Shadow(color=#000000,direction=125,strength=5);
}
.intromev2 {
margin: 15px 30px 25px 30px;
padding: 5px 10px 5px 10px;
font-size : 12px;
font-family : Arial, Helvetica, sans-serif;
text-decoration : none;
font-style : italic;
font-weight : bold;
text-align : justify;
clear: none;
background-color: #FFFF99;  /* aquest provoca que a IE no aparegui la sombra */
color:#000000;
border-radius: 10px;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
-o-border-radius: 10px;
-khtml-border-radius: 10px;
behavior: url(../estils/border-radius.htc);  /* Para IE */
border: 1px solid #666666;
-moz-box-shadow:4px 4px 3px #000;
-webkit-box-shadow: 4px 4px 3px #000;
filter: progid:DXImageTransform.Microsoft.Shadow(color=#000000,direction=125,strength=5);
}
.Left {
float : left;
width : auto;
}
ol li {
padding-left : 3px;
margin-bottom : 1em;
/* background: url(bullet.png) 0em 0.5em no-repeat; */
}
.opac {
  opacity: .5;
  filter: alpha(opacity=50);
  }

/* p {
clear : left;
}
p {
clear : right;
}
/* p {
clear : both;
} */
p.filter {        /* afectarà a tots els paràgrafs que s'els adjudiqui la classe filter- Afectarà a tot el par+agraf en qüestió */
width: 97%;
font-family: "Comic Sans MS", cursive;
font-weight: bold;
padding: 1px 5px 5px 10px;
color: #FF0;
font-size:18px;
text-shadow:#000 2px 2px 2px;
filter:
    progid:DXImageTransform.Microsoft.Shadow(color=#000000,direction=135,Strength=2);
}
.peu1 {
margin-top: 5px;
margin-bottom: 5px;
background-image : url(../img/peu1.gif);
/*background-repeat : repeat-x;    */
background-position : center bottom;
width: 100%;
height : 12px;
overflow: hidden;
}
.peu2 {
margin-top: 5px;
margin-bottom: 5px;
background-image : url(../img/peu2.gif);
/*background-repeat : repeat-x;    */
background-position : center bottom;
width: 100%;
height : 12px;
overflow: hidden;
}
.peu3 {
margin-top: 5px;
margin-bottom: 5px;
background-image : url(../img/peu3.gif);
/*background-repeat : repeat-x;    */
background-position : center bottom;
width: 100%;
height : 12px;
overflow: hidden;
}
.peu4 {
margin-top: 5px;
margin-bottom: 5px;
background-image : url(../img/peu4.gif);
/*background-repeat : repeat-x;    */
background-position : center bottom;
width: 100%;
height : 12px;
overflow: hidden;
}
.peueduca {
background-image : url(../img/peueduca.jpg);
background-repeat : repeat-x;
background-attachment : scroll;
background-position : left bottom;
height : 80px;
}
.peufperm {
background-image : url(../img/peufperm.jpg);
background-repeat : repeat-x;
background-attachment : scroll;
background-position : left bottom;
height : 80px;
}
.peufona {
background-image : url(../img/peufona.jpg);
background-repeat : repeat-x;
background-attachment : scroll;
background-position : left bottom;
height : 80px;
}
.peuespi {
background-image : url(../img/peuespi.jpg);
background-repeat : repeat-x;
background-attachment : scroll;
background-position : left bottom;
height : 80px;
}
.peucomp {
background-image : url(../img/peucomp.jpg);
background-repeat : repeat-x;
background-attachment : scroll;
background-position : left bottom;
height : 80px;
}
#rellot {
position : absolute;
top : 80px;
right : 1px;
width : 400px;
height : 30px;
text-align : right;
z-index : 8;
}
.rellot1 {
position : absolute;
top : 10px;
right : 1px;
width : 400px;
height : 30px;
text-align : right;
z-index : 8;
}
.Right {
float : right;
width : auto;
}
.rot {
position:absolute;
border: 3px solid #FFF;
color: #FFF;
font-family: Verdana;
font-size: 24px;
text-align: center;
top:200px;
right:50px;
width:400px;
margin:0 auto;
padding: 2px;
width: 250px;
z-index: 200;
-moz-transform: rotate(45deg);  /* FF3.5+ */
-o-transform: rotate(45deg);  /* Opera 10.5 */
-webkit-transform: rotate(45deg);  /* Saf3.1+, Chrome */
transform: rotate(45deg);
filter:  progid:DXImageTransform.Microsoft.Matrix(sizingMethod='auto expand', M11=0.7071067811865476, M12=-0.7071067811865475, M21=0.7071067811865475, M22=0.7071067811865476); /* IE */
zoom: 1;
}
#rss {
position : absolute;
width : 50px;
height :auto;
top : 110px;
right : 25px;
border : 0;
z-index : 9;
}
.separador {
float : left;
width : 5px;
height : 120px;
margin : 10px 0;
padding : 4px;
}
div#submenulat {
float : left;
display: block;
vertical-align: middle;
width : 152px;
border : 1px solid #000000;
color : #ffffff;
font-weight : bold;
font-size : 10pt;
font-family : "Comic Sans MS", "Action Man", Georgia, Verdana, cursive;
color : #FFF;
/*top : 20px;           controla la posició top dels divs que conté */
margin-top : 10px;
margin-right : 5px;
margin-bottom : 10px;
background : #cc3300;
padding: 5px;
border-bottom-left-radius : 11px;
border-bottom-right-radius : 11px;
-moz-border-radius: 11px 11px 11px 11px;
-webkit-border-radius: 11px 11px 11px 11px;
 border-radius: 11px; /* CSS3 */
behavior: url(../estils/border-radius.htc);  /* Para IE */
}
div#submenulatv {
float : left;
display: block;
vertical-align: middle;
width : 152px;
border : 1px solid  #FFFC00;
color : #ffffff;
font-weight : bold;
font-size : 10pt;
font-family : "Comic Sans MS", "Action Man", Georgia, Verdana, cursive;
/* color:#fffc00;
top : 20px;           controla la posició top dels divs que conté */
margin-top : 10px;
margin-right : 5px;
margin-bottom : 10px;
background-color:#4c810d;
padding: 5px;
border-bottom-left-radius : 11px;
border-bottom-right-radius : 11px;
-moz-border-radius: 11px 11px 11px 11px;
-webkit-border-radius: 11px 11px 11px 11px;
 border-radius: 11px; /* CSS3 */
behavior: url(../estils/border-radius.htc);  /* Para IE */
}
#submenulat p {       /* tots els paràgrfs que stiguin dintre del fiv submenulat */
  padding: 7px 5px 10px 5px;
 }
#submenulatv p {       /* tots els paràgrfs que stiguin dintre del fiv submenulat */
  padding: 7px 5px 10px 5px;
 }
ul {
margin : 5px 5px 5px 30px;
padding : 10px;
list-style : square;
line-height : 1.3em;
font-family : arial;
font-size : 12px;
font-weight : bold;
text-align : left;
width : auto;
}
ul.col3 {
float : left;
padding-right : 8px;
padding-left : 14px;
padding-bottom : 10px;
margin : 15px 0;
width : 100%;
padding-top : 0;
list-style-type : none;
}
ul.col3 li {
padding-right : 2px;
display : inline;
padding-left : 2px;
float : left;
padding-bottom : 2px;
width : 32%;
padding-top : 2px;
}
/* 2 columnes, Definimos una clase para <ul> */
ul.columnas2 {
float : left;
width : 70%;      /*Este ancho será el total que ocupen muestras columnas */
list-style-type : none;   /*Eliminamos las viñetas */
}
/*Definimos las propiedades para <li> a partir de las otorgadas a <ul>*/
ul.columnas2 li {
display : inline;   /*Se declara que las propiedades serán otorgadas a cada linea*/
float : left;
width : 50%;   /*Al definir el ancho definimos también el número de columnas, siendo 25% para 4 columnas, 33% para 3, 50% para 2 y asi para la cantidad de columnas que deseemos */
text-align : right;
font-family : Arial, Helvetica, sans-serif;
color : #000;
}
/* 3 columnes, Definimos una clase para <ul> */
ul.columnas3 {
float : left;
width : 90%;  /*Este ancho será el total que ocupen muestras columnas dentro de su quadro */
list-style-type : none;     /*Eliminamos las viñetas */
}
/*Definimos las propiedades para <li> a partir de las otorgadas a <ul>*/
ul.columnas3 li {
display : inline;  /*Se declara que las propiedades serán otorgadas a cada linea*/
float : left;
width : 32%;  /*Al definir el ancho definimos también el número de columnas, siendo 25% para 4 columnas, 33% para 3, 50% para 2 y asi para la cantidad de columnas que deseemos */
text-align :
right;
padding-right: 3px;
font-family : Arial, Helvetica, sans-serif;
color : #000;
}

/* BORDER RADIUS */
.comicgrocesqra {
float: left;
border: solid #FFFF33 3px;
color : #ffff00;
font-weight : bold;
font-size : 13px;
font-family : "Comic Sans MS", "Action Man", Georgia, Verdana, cursive;
text-align:left;
padding : 5px;
margin-right : 7px;
background-color:#4c810d;
border-radius: 10px;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
-o-border-radius: 10px;
-khtml-border-radius: 10px;
behavior: url(../estils/border-radius.htc);  /* Para IE */
}
.comicblancdra {
float: right;
border: solid #FFFFFF 3px;
color : #ffffff;
font-weight : bold;
font-size : 13px;
font-family : "Comic Sans MS", "Action Man", Georgia, Verdana, cursive;
text-align: right;
padding : 5px;
margin-left: 7px;
background-color:#0033CC;
border-radius: 10px;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
-o-border-radius: 10px;
-khtml-border-radius: 10px;
behavior: url(../estils/border-radius.htc);  /* Para IE */
/*
background: url(../img/fonespig1.jpg) no-repeat center center;
filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="../img/fonespig.jpg", sizingMethod="scale");   */
}
  /* Aquests comprovats que FUNCIONEN  sempre que estiguin dis <DIV class="rel">     */
.rel {
margin : 50px 0 0 33px;
padding : 25px;
position : relative;
z-index : inherit;
zoom: 1; /* For IE6 */
}
.bor0 {
border: 1px solid #d7d7d7;
border-radius: 11px;
-moz-border-radius: 11px;
-webkit-border-radius: 11px;
behavior: url(../estils/border-radius.htc);  /* Para IE */
}
.bor1 {
background-color: #f0f0f0;
width: 533px;
height: 50px;
margin: 0 auto 15px auto;
padding: 20px;
border: 1px solid #d7d7d7;
border-radius: 11px;
-moz-border-radius: 11px;
-webkit-border-radius: 11px;
behavior: url(../estils/border-radius.htc);  /* Para IE */
}
.bor2 {
background : url(../img/vaniver.jpg) transparent;
width : 420px;
height : 220px;
margin : 0 auto 35px auto;
padding : 30px;
color : #fff;
font-weight : bold;
border : 11px solid #35b70e;
border-radius : 20px;
-moz-border-radius: 20px;
-webkit-border-radius: 20px;
border-radius: 20px;
behavior: url(../estils/border-radius.htc);  /* Para IE */
}
.bor3 {
background-color: #ddd;
width: 210px;
height: 30px;
padding: 20px;
position: absolute;
top: 5px; left: 5px;
-moz-border-radius: 15px;
-webkit-border-radius: 15px;
border-radius: 15px;
behavior: url(../estils/border-radius.htc);  /* Para IE */
    /* con sombras */
-Moz-box-shadow: 10px 20px 10px # FFF; / * Firefox * /
-Webkit-box-shadow: 10px 10px 20px # 000; / * Safari y Chrome * /
box-shadow: 10px 20px 10px # 000; / * Opera 10.5 +, navegadores del futuro y IE6 + usando IE-CSS3 * /
}
.bor4 {
background-color : #f0f0f0;
width : 740px;
margin : 0 auto 15px auto;
padding : 20px 35px;
border : 1px solid #d7d7d7;
border-radius : 11px;
-moz-border-radius: 11px;
-webkit-border-radius: 11px;
behavior: url(ie-css3.htc);
}
.bor5 {
background : url(../img/vaniver.jpg) transparent;
width : 414px;
height : 262px;
margin : 0 auto 35px auto;
padding : 15px;
border : 11px solid #c6ac6c;
position : relative;
margin-top : 35px;
border-radius : 32px;
box-shadow : 10px 10px 10px #000 ;
-moz-border-radius: 32px;
-webkit-border-radius: 32px;
-moz-box-shadow: 10px 10px 10px #000;
-webkit-box-shadow: 10px 10px 10px #000;
box-shadow: 10px 10px 10px #000;
behavior: url(../estils/border-radius.htc);  /* Para IE */
z-index : 2;
}
.bor6 {   /* The script works with absolutely positioned elements too */
position : absolute;
top : 120px;
left : 10px;
width : 110px;
height : 25px;
padding : 20px;
text-align : center;
font-weight : bold;
background-color : #ddd;
-moz-border-radius: 15px;
-webkit-border-radius: 15px;
border-radius: 15px;
-moz-box-shadow: 10px 10px 20px #000;
-webkit-box-shadow: 10px 10px 10px #000;
box-shadow: 10px 10px 20px #0ff;
behavior: url(../estils/border-radius.htc);
}

  /* BOTOMS: AQUESTS */
.button, .button:visited { /* botones genéricos */
background: #222; /* url(../img/17s.jpg) repeat-x; CODI ORIGINAL url(URL_overlay.png) repeat-x; */
display: inline-block;
padding: 5px 10px 6px;
color: #FFF;
text-decoration: none;
border-radius : 6px;
-moz-border-radius: 6px;
-webkit-border-radius: 6px;
-moz-box-shadow: 0 1px 3px rgba(0,0,0,0.6);
-webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.6);
 behavior: url(../estils/border-radius.htc);
text-shadow: 0 -1px 1px rgba(0,0,0,0.25);
border: 1px solid #000000;
border-bottom: 1px solid rgba(0,0,0,0.25);
position: relative;
cursor:pointer}

.button:hover { /* el efecto hover */
background-color: #111
color: #FFF;}

.button:active{  /* el efecto click */
top: 1px;}

/* botones pequeños */
.small.button, .small.button:visited {
  font-size: 11px ;}

/* botones medianos */
.button, .button:visited,.medium.button, .medium.button:visited {
  font-size: 13px;
  font-weight: bold;
  line-height: 1;
  text-shadow: 0 -1px 1px rgba(0,0,0,0.25);}

/* botones grandes */
.large.button, .large.button:visited {
    font-size:14px;
    padding: 8px 14px 9px;}

/* botones extra grandes */
.super.button, .super.button:visited {
      font-size: 34px;
      padding: 8px 14px 9px;}

 /*   Por útimo, definimos los colores, aquí algunos ejemplos:    */
.pink.button { background-color: #E22092; }
.pink.button:hover{ background-color: #C81E82; }
.green.button, .green.button:visited { background-color: #749A02;}
.green.button:hover{ background-color: #91BD09;}
.red.button, .red.button:visited { background-color: #D71A1A; }
.red.button:hover{ background-color: #E67373; }
.orange.button,.orange.button:visited { background-color: #FF5C00; }
.orange.button:hover{ background-color: #D45500; }
.blue.button, .blue.button:visited { background-color: #2981E4; }
.blue.button:hover{ background-color: #1C5A9F; }
.yellow.button, .yellow.button:visited { background-color: #FFB515; }
.yellow.button:hover{ background-color: #FC9200; }

.maroon.button, .maroon.button:visited { background-color: #990033; }
.maroon.button:hover{ background-color: #FC9200; }


/*¿Cómo usarlos, agregando las clases a cualquier enlace:
<a href="#" class="small button orange"> botón naranja pequeño </a>
<a href="#" class="medium button blue"> botón azul mediano </a>
<a href="#" class="large button red"> botón rojo grande </a>
<a href="#" class="super button pink"> botón rosa exra grande </a>
class="large button maroon"
class="medium button green"
 */
