body {
  font-family: sans-serif;
  font-size: 16px;
  margin: 5px;
}

#titol {
  color: Navy;
  font-family: verdana;
  font-size: 2em;
}

th {
   text-align: center;
   vertical-align: middle;
   border: 1px solid #000;
   border-collapse: collapse;
   background: Navy;
   color: White;
   padding: 0.3em;
}

td {
   vertical-align: middle;
   border-collapse: collapse;
   padding: 0.3em;
}

td.greenUp {
	background-image: url("../imatges/green_up.png");
	background-position: center;
	background-repeat: no-repeat;
	height:34px;
}

td.orangeUp {
	background-image: url("../imatges/orange_up.png");
	background-position: center;
	background-repeat: no-repeat;
	height:34px;
}

td.greenDown {
	background-image: url("../imatges/green_down.png");
	background-position: center;
	background-repeat: no-repeat;
	height:34px;
}

td.redDown {
	background-image: url("../imatges/red_down.png");
	background-position: center;
	background-repeat: no-repeat;
	height:34px;
}

td.questionRed {
	background-image: url("../imatges/question_red.png");
	background-position: center;
	background-repeat: no-repeat;
	height:34px;
}

h1 {
  color: red;
  font-family: verdana;
  font-size: 1.1em;
}

a.link {
	color: navy;
	position: relative;
	text-decoration: none;
	display: inline-block;
	margin: 0px 0px -6px;
}

a.link:hover {
	background-color: red;
	color:white;
}

a:active {
  //top: 5px;
}

.tooltip {
	position: relative;
	display: inline-block;
	border-bottom: 1px dotted black;
}

.tooltip .tooltiptext {
	visibility: hidden;
	width: 600px;
	display:inline-block;
	background-color: red;
	color: #fff;
	font-weight: normal;
	font-size:1.2em;
	text-align: left;
	border-radius: 6px;
	padding: 5px 10px;
	/* Ombra */
	box-shadow: 6px 6px 9px #858585;
	-webkit-box-shadow: 6px 6px 9px #858585;
	-moz-box-shadow: 6px 6px 9px #858585;
	filter: shadow(color=#858585, direction=135, strength=2);
	/* Position the tooltip */
	position: absolute;
	z-index: 1;
}

.tooltip:hover .tooltiptext {
  visibility: visible;
}

td.dies {
	padding-left: 25px;
	vertical-align: middle;
	background: url(../imatges/dies.jpg);
	background-position: center;
	background-repeat: no-repeat;
}

td.graus {
	padding-left: 25px;
	vertical-align: middle;
	background: url(../imatges/grausCent.jpg);
	background-position: center;
	background-repeat: no-repeat;
}

td.mmPluja {
	padding-left: 25px;
	vertical-align: middle;
	background: url(../imatges/mmPluja.jpg);
	background-position: center;
	background-repeat: no-repeat;
}

td.percent {
	padding-left: 25px;
	vertical-align: middle;
	background: url(../imatges/percent.jpg);
	background-position: center;
	background-repeat: no-repeat;
}

td.indexISID {
	padding-left: 25px;
	vertical-align: middle;
	background: url(../imatges/indexISID.jpg);
	background-position: center;
	background-repeat: no-repeat;
}

td.any {
	background: url(../imatges/any.jpg);
	background-position: center;
	background-repeat: no-repeat;
	width:400px;
}

td.labelY {
width: 35px; 
}

tr.separator {
	height: 20px;
}


td.titol {
	font-size: 0.9em;
	color: Teal;
	font-weight: bold;
	text-align: center;
}

h3 {
	color: Teal;
	padding-left: 5px;
}