/*
ESTILS PER A LA FINESTRA DIGITAL
Nom:	La Finestra Digital
Autor:	Aleix Cabrera
URL:	http://www.lafinestradigital.com - http://wwww.uoc.edu/alumni/lafinestradigital/
Date:	5 febrer 2006
*/

/* ------------------------- etiquetes HTML basiques ------------------------- */

html, body { 
	margin: 0; 
	padding: 0; 
	text-align: center; 
}

body {
	scrollbar-face-color: #ffffff;
	scrollbar-shadow-color: #336699;
	scrollbar-highlight-color: #336699;
	scrollbar-3dlight-color: #ffffff;
	scrollbar-darkshadow-color: #ffffff;
	scrollbar-track-color: #ffffff;
	scrollbar-arrow-color: #6699cc;
	margin: 0px 0px 0px 0px;
	padding: 0px 0px 0px 0px;
	font: normal 10px Verdana, Arial, Helvetica, sans-serif;
	color: #777777;
	text-align: center;
	background: url(../imgweb/disseny/blanc.gif) fixed no-repeat;
	overflow-y:scroll;
	overflow-x:hidden;
}

form {
	padding:0px;
	margin:0px 0px 1px 0px;
	font-size: 8px;
	vertical-align: top;
}

input, select, textarea, option {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size:10px;
	color:#777777;
	font-weight:bold;
	vertical-align: top;
}

p {margin: 0px 0px 0px 0px;}

/*samp{
	background-color: #cccccc;
	border: 1px solid #666666;
	display: block;
	font-family: "Lucida Console","Andale Mono",Monaco,"Courier New", Courier, monospace;
	font-size: 11px;
	margin: 10px;
	padding: 10px;
}*/

abbr, acronym, dfn {
	border-bottom: 1px dotted #E48170;
	cursor: help;
}

/* ------------------------- contenidor ------------------------- */

#contenidor {
	text-align: left;
	width: 762px;
	margin: auto;
	padding-top: 3px;
}

/* ------------------------- CAPÇALERA en 3 parts i DATA ------------------------- */

#cap {height: 52px; width: 762px;}

#cap_logo {
	float: left;
	height: 52px;
	width: 145px;
	background: url(../imgweb/disseny/cap_ull_bq.gif) no-repeat;
}

#cap_nom {
	float: left;
	height: 52px;
	width: 377px;
	background: url(../imgweb/disseny/cap_nom.gif) no-repeat;
}

#cap_espai {
	float: left;
	height: 52px;
	width: 240px;
	background: url(../imgweb/disseny/cap_espai.gif) no-repeat;
}

#data {
	color: #ffffff;
	text-align: right;
	margin-right:10px;
	margin-top:27px;
}
/* ABANS ERA 27 LA DATA... color data #336699 */
/* ------------------------- barra de navegacio ------------------------- */

#barra {
	clear:both;
	height: 15px;
	width: 762px;
	margin-top: 0px;
	background-image: url(../imgweb/disseny/bg_barra.gif);
	background-color: #336699;
}

#barra_text {
	color: #ffffff;
	font: bold 10px Verdana, Arial, Helvetica, sans-serif;
	text-align: right;
	text-transform: lowercase;
	margin-right: 10px;
}

/* ------------------------- CONTINGUTS ------------------------- */

/* #ruta {height:18px; margin-top:3px; color:#999999;} */

#contingut {background-color: #ffffff; width: 762px;}

/* ------------------------- PEU i CUA------------------------- */

#final {clear: both; padding: 4px 0px 3px 0px; width:762px;}

#peu {
	height: 18px;
	width: 762px;
	background: url(../imgweb/disseny/bg_peu.gif) no-repeat top center;
	padding-top: 3px;
	color: #ffffff;
	font: normal 10px Verdana, Arial, Helvetica, sans-serif;
	text-align: center;
}

#cua {
	width: 762px;
	margin-top: 10px;
	color: #cccccc;
	font: normal 9px Verdana, Arial, Helvetica, sans-serif;
	text-align: center;
}

/* ------------------------- sols PORTADA, ID estructurals 3 columnes ------------------------- */

#por_esq {
	width: 270px;
	float: left;
	margin: 0px 0px 0px 0px;
}

#por_cen {
	width: 210px;
	float: left;
	margin: 0px 4px 0px 4px;
}

#por_dre {
	width: 270px;
	margin: 0px 0px 0px 0px;
}

/* --( retols )-- */

div.retol {
	height: 18px;
	margin-top: 2px;
}

/* --( caselles, cel )-- */

div.cel_article {
	height: 138px;
	border-top: 3px solid #99cc00;
	border-right: 1px solid #99cc00;
	border-bottom: 1px solid #99cc00;
	border-left: 1px solid #99cc00;
	padding: 0px;
}

div.cel_critica {
	height: 138px;
	border-top: 3px solid #6699cc;
	border-right: 1px solid #6699cc;
	border-bottom: 1px solid #6699cc;
	border-left: 1px solid #6699cc;
	padding: 0px;
}

div.cel_especial  {
	height: 138px;
	border-top: 3px solid #ff6666;
	border-right: 1px solid #ff6666;
	border-bottom: 1px solid #ff6666;
	border-left: 1px solid #ff6666;
	padding: 0px;
}

div.cel_entre {
	height: 138px;
	border-top: 3px solid #ff9900;
	border-right: 1px solid #ff9900;
	border-bottom: 1px solid #ff9900;
	border-left: 1px solid #ff9900;
	padding: 0px;
}

#cel_centre {
	height: 316px;
	border-top: 0px solid #cccccc;
	border-right: 0px solid #cccccc;
	border-bottom: 0px solid #cccccc;
	border-left: 0px solid #cccccc;
	padding: 18px 3px 3px 3px;
	text-align: center;
}

/* ------------------------- PORTADA, imatges i paràgrafs ------------------------- */

#cel_centre img.imgestrena {
	width: 194px;
	height: 110px;
	border:1px solid #cccccc;
	text-align: center;
	vertical-align: top;
}

#cel_centre img.imgprop {
	width:44px;
	height:75px;
	border:1px solid #cccccc;
	text-align: center;
	clear: none;
}

.p_agenda {
	float: left;
	width: 42px;
	margin: 12px 0px 14px 5px;
	padding: 0px;
	text-align: center;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 9px;
	font-weight:bold;
}

/* ------------------------- HIPERTEXT ------------------------- */

a:link, a:active, a:visited {color:#336699; text-decoration:none;}
a:hover {color:#cccc99; text-decoration:none;}

h1 a:link, h1 a:active, h1 a:visited {color:#fff; font-weight:bold; text-decoration:none;}
h1 a:hover {color:#fff; font-weight:bold; text-decoration:none;}

h1.h1ombra a:link, h1.h1ombra a:active, h1.h1ombra a:visited {color:#000; font-weight:bold; text-decoration:none;}
h1.h1ombra a:hover {color:#000; font-weight:bold; text-decoration:none;}

#barra a, #barra a:visited {color:#ffffff; font-weight:bold;}
#barra a:hover {color:#cccc99; font-weight:bold;}
#barra a:active {color:#6699cc; font-weight:bold;}

#cel_centre h3 a, #cel_centre h3 a:link; #cel_centre h3 a:active, #cel_centre h3 a:visited {color:#888888; font-weight:bold;}
#cel_centre h3 a:hover {color:#cccc99; font-weight:bold;}

#peu a, #peu a:visited, #peu a:active {font-weight:normal;color:#ffffff;}
#peu a:hover {color:#cccc99;}

#ruta a, a.lletreta, a:visited.lletreta, a:active.lletreta {color:#999999; font-weight:normal;}
#ruta a:hover, a:hover.lletreta {color:#cccc99; font-weight:normal;}

div.p_agenda a, div.p_agenda a:link, div.p_agenda a:active, div.p_agenda a:hover, div.p_agenda a:visited {font-weight: bold;}

div.transOFF {width: 100%; background-color: transparent;}
div.transON {width: 100%; height:100%; background-color: #000; opacity:.50;filter: alpha(opacity=50); -moz-opacity: 0.5;}

/* ------------------------- TEXT ------------------------- */

h1 {
	font-family: Lucida Sans, Arial, Eurostile, Verdana, Georgia, "Times New Roman", Times, serif;
	font-size: 30px;
	font-weight: bold;
	padding: 3px 6px;
	margin: 0px;
	color:fff;
	line-height: 90%;
}

h1.h1dreta {text-align:right; padding: 3px 6px; margin: 0px;}

h1.h1ombra {
	font-family: Lucida Sans, Arial, Eurostile, Verdana, Georgia, "Times New Roman", Times, serif;
	font-size: 30px;
	font-weight: bold;
	padding: 2px 6px 2px 6px;
	margin: 0px;
	color:000;
	line-height: 90%;
	width:100%;
	background: #fff;
	filter:alpha(opacity=80);
	-moz-opacity:.80;
	opacity:.80;
}

h2 {
	font-family: Arial, Verdana, Helvetica, sans-serif;
	font-size: 14px;
	padding: 0px 6px;
	text-transform:uppercase;
	letter-spacing: 4px;
	color: #000;
	margin: 0px 0px 3px 0px;
	background: #fff;
	width: 100%;
	filter:alpha(opacity=50);
	-moz-opacity:.50;
	opacity:.50;
	font-weight: bold;
}

h2.h2dreta {text-align:right; padding: 0px 6px; margin: 0px 0px 3px 0px;}

h3 {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
	margin: 0px;
	padding:0px;
	font-weight: bold;
	color:#888888;
}

h4 {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 14px;
	font-weight: bold;
	margin: 0px;
	padding:0px;
	color: #999999;
}

<!-- .col_taronja {color: #ff9933;} -->
<!-- .col_verd {color: #cccc66;} -->
<!-- .col_roig {color: #cc3333;} -->
<!-- .col_gris {color: #999999;} -->
<!-- .col_grisf {color: #777777;} -->
<!-- .col_blau {color: #336699;} -->
<!-- .col_blauc {color:#6699cc} -->

<!-- #cel_entre h3, #cel_entre2 h3, #cel_article h3, #cel_article2 h3, #cel_especial h3, #cel_especial h3, #cel_critica h3, #cel_critica2 h3 {color: #999999; font-weight: bold; text-transform: uppercase;} -->
#cel_centre h3 {color: #888888; font-weight: bold; padding: 3px 0px 0px 0px;}
#cel_centre h2 {color: #cccccc; font-family: Verdana, Arial, sans-serif; text-align:center;}
#cel_centre p {color: #999999;}
#cel_centre p.lletreta {text-align: left; padding-left:2px;}
.lletreta {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 9px;
	color: #cccccc;
}


/* ------------------------- ESPECIALS ------------------------- */

.ma {cursor: pointer;}
<!-- .creu {cursor: crosshair;} -->
.clr{clear:both;padding:auto;margin:auto;}
.espai8 {height: 8px;}
.espai4 {height: 4px;}
.espai2 {height: 2px;}

#cercador {
	background: #ffffff;
	width: 208px;
	float: left;
	margin: 0px 0px 0px 4px;
	text-align:left;
}

/* ------------------------- AVIS ------------------------- */
#avis {
	position:absolute;
	top:2px;
	left:4px;
	width:110px;
	background: #eeeeee;
	border: solid 1px #bbbbbb;
	font-size:9px;
	text-align:left;
}

#avis p.tit {background-color: #bbbbbb; border-bottom: solid 1pz #bbbbbb; color: #ffffff; font-weight:bold; text-transform:uppercase;}
#avis p {padding:2px;}