/*****************************************************
 Documento CSS para somi.cat 
 2creativo.net - octubre 2007
 *****************************************************/

html {  padding:0px;  margin:0px;  }

body {
	background:#FFCC33;
/*	background:#FFCC33 url(files/bg.png) !important; 	/* Firefox y los demás */ 
/*	*background:#FFCC33 url(files/bg.png) !important;	/* Sólo IE7 */
/*	*background:#FFCC33; 								/* Sólo IE6 */
	color: #000000;
	font-size: 1.1em;
	line-height: 1.5em;
	font-family: "Trebuchet MS", Verdana, Arial, Helvetica, Sans-Serif;
	padding:0px;
	margin:0px;
	text-align:center;
}





/***************************************************
   Posicionamiento - Centrado de contenidos 
 ***************************************************/

#contenedor {
background:#eee;
color:#000000; 	
  
  width:742px; 
  text-align: left;

  min-height:220px; 
  height:auto;
  
  margin-top: 50px;
	margin-left: auto;
	margin-right: auto;
	
	padding-bottom: 0px;
}
  
/* hack para Internet Explorer */
/*\*/
* html #contenedor {height: 220px;}



/**********************************************************
   Estilo caja contenidos
**********************************************************/
.contenidos {
    padding: 0px 10px 0px 10px;
	height: auto; 
	margin-top: 40px; 
	text-align:left;
    padding: 0px 35px 10px 35px;
}
	
.contenidos p {  
font-weight: normal; padding: 0px 25px 4px 20px;}

.contenidos ul {
  padding-bottom: 10px;}

.contenidos ul li {
  list-style-image: url(files/flecha_1.gif);}

h1, h2 {
  /*clear: both; */margin: 0;  font-weight: bold; color: #FF9900;
}  
h3, h4 {
  clear: both;  padding: 10px 0 0 8px;
  margin: 0;  font-weight: bold; color:#FF9900;
} 


h1 {
  font-size: 1.4em;  
  padding: 25px 0 12px 8px;
}
 
h2 {
  font-size: 1.1em;  
  padding: 25px 0 12px 15px;
}

h2.no {display:none}

h3 {
  font-size: 1.1em; margin-bottom:-10px; 
  }
  
/***************************************************
   ESTILOS GENERALES
 ***************************************************/

a {	color:#FF6600;
	text-decoration:none;
	outline:0;
	padding: 0 6px;}
a:link a:visited a:active {color: #FF6600;}
a:hover { color:#fff; background-color:#FF6600}
a:focus, a:active {outline: none; /* @ Firefox 1.5, remove ugly dotted border */}

.none {display:none}

.acceskey {text-decoration:underline}

.title, .arriba { display:none; }

.left {float: left; clear:both; padding:5px 15px;}
.right { float: right; clear:both; padding:5px 25px 5px 15px;}

.l {float: left; padding:5px 15px;}
.r {float: right; }
.clear { clear:both; }

img {border:0px;} 

.carg {background: transparent url("files/loading.gif") no-repeat center; } 
.carg a:hover{ background-color: transparent; }
.header a:hover{ background-color: transparent; }

.reduce { font-size: 0.8em; color: #333333; background-color:transparent;}  

.contacto {float: right; border-left: #FF9900 2px solid; margin-left:15px; font-size:0.9em;}

.borde { border: #666666 solid 1px; }
.pad { margin:5px}

.b { font-weight:bold}

.cajita{ 
width: 18em;  
float: right; border: #666 1px solid; 
padding: 10px; font-size:0.7em; margin: 12px;
/* background-color:#CCCCCC; */}

.idioma {
float:right; background-color:#d8d8d8; 
text-align:center; position: inherit; padding: 2px;
margin: 0 10px 0 0; font-size:0.9em; font-weight:bold;}


/********************************************************
  Arriba
*********************************************************/

/*.arriba {background:url(files/flecha_up.gif) no-repeat bottom left;
		 padding: 30px 30px 0px 20px; }
*/		 
		 
a.arriba:link, a.arriba:visited, a.arriba:hover, a.arriba:active {
/* margin: 20px 0 0 -55px; */
background: transparent url("files/flecha_up.gif") no-repeat; 
text-decoration:none; padding: 3px 0 0 0px; color:#000;}
a.arriba:hover {background: transparent url("files/flecha_up.gif") no-repeat; text-decoration:underline; color:#000;}		
 
 
/***************************************************
   Estilos MENU
 ***************************************************/

#menu {
	font-family:Verdana, Arial, Helvetica, sans-serif; 
	font-size:1em;
    list-style: none; 
    margin: 0;
    padding: 0 0 10px 17px;
	text-align:center;
    font-weight:bold; 
}

#menu li {
    float: left;
    margin: 0 0 0 25px;
}

#menu a {
    display: block;
    z-index: 2;
	padding: 5px 20px 10px 20px;
    text-decoration: none;
    color: #FF6633;
	display:block; clear:both;
}

#menu a:focus, #menu a:active {
    outline: none; /* @ Firefox 1.5, remove ugly dotted border */
}

#menu a:hover  {
	background:#FF6633; 
	color: #FFF;
}

#menu a:focus, #menu a:active, #menu .on a {
	background:#FFCC33; 
	color:#FF6633;
}
#menu .on a {
  padding: 5px 20px 10px 20px;
  font-weight: bold;
  color: #000;
}
#menu .on a:link, #menu .on a:visited { /* @ Opera, use pseudo classes otherwise it confuses cursor... */
    cursor: text;
}
#menu a:hover, #menu a:focus, #menu a:active {
    cursor: pointer;
}


/***************************************************
   CABECERA - HEADERs
 ***************************************************/


.header { 
height: 200px; 
clear:both;
display:block;
width:auto;
padding:0; 
margin:auto;
}

.inici {
height: 300px;
}

.fotos { 
height: 150px; width:630px;
padding:0 0 0 70px; 
position:absolute; z-index:0;
float: right; 
}


.header .logo { 
height: 150px; 
width: 140px;
position:absolute; z-index:1; 
float:left; }
  
.header .logo a:hover { background-color:transparent}
 
 
/***************************************************
   Estilo PIE PAGINA - FOOTER
 ***************************************************/


#footer {
	clear: both;
	margin: 12px auto 20px auto;
	padding: 8px 0; 
	text-align: center;  
	font-size: 0.9em;
	color: #666666;
	background-color:#eee;
	width:742px;
	height:32px;
  }


.footer { margin:0 2em; padding:0}

#footer ul {padding:0px; list-style:none; margin: 0px 3px 5px 0; float:right}
#footer li {float:left; padding:0px; margin:0 10px 0px 0}

* html #footer {
height: 32px;
}




/***************************************************
   NAVEGACION PESTAÑAS ACCESIBLE
 ***************************************************/

@media projection, screen { 
/* use class for showing/hiding tab content, so that visibility can be better controlled in different media types... */
    .tabs-hide {
        display: none;
    }
}
@media print { 
/* mantener accesibilidad  */
    .contenidos {
        display: block !important;
        height: auto !important;
       /* opacity: 1 !important; */
    }
}


/*****************************************************
 Documento CSS para somi.cat 
 2creativo.net - octubre 2007
 *****************************************************/