/* ---------------------
basic layout
--------------------- */

* {
	margin : 0;
	padding : 0;
}

body {
	width : 100%;
	font-family : Verdana, "Trebuchet MS", Arial, Helvetica, sans-serif;
	font-size : 75%;
	background : #E5E5E5;
	color : #000000;
	text-align : center; /*centered in IE*/
}

p {
  text-align : left;
  margin : 1em 0.5em;
}

a img {
	border : none; /*linked images without bleu border*/
}

h1,
h2,
h3,
h4,
h5,
h6 { /*titles*/
	color : #C00800;
	margin : 0;
	padding : 0.5em 0 0 0;
	text-align : center;
}

h1 {font-size : 2em;}
h2 {font-size : 2em;}
h3 {font-size : 1.6em;}
h4 {font-size : 1.3em;}
h5 {font-size : 1em;}
h6 {font-size : 0.7em;}

ul {
  margin : 0;
  padding : 0;
}

ul.first_ul {
	text-align : left;
	margin : 1em 0;
	padding-left : 4em;
	font-size : 150%;
}

ul li {
	margin-left : 1.5em;
	padding : 0;
}

/* ---------------------
template layout
--------------------- */

.clearall {
  clear : both;
}

#whole_page {
  width : 80em;
  margin : 0 auto;
  text-align : center;
}

#header .img_sx {
	float : left;
	margin : 5px;
	width : 43.5em;
}

#header .img_dx {
	float : right;
	margin : 5px;
	width : 28em;
}

#content {
  clear : both;
	width : 63em;
	margin-left : 1em;
	text-align : left;
	float : right;
	padding-bottom : 2em;
}

#nav {
	width : 16em;
	vertical-align : top;
	float : left;
  text-align : left;
}

#nav ul {
  margin : 1.5em 0 0 0.5em;
  padding : 0;
}

#nav ul li {
  list-style-type : none;
  margin : 0;
  padding : 0 0 0.3em 0;
}

a.rosso,
a.nero,
a.rosa,
a.giallo,
a.arancione,
a.azzurro,
a.verde,
a.bianco {
	text-decoration : none;
	border-right : 1px solid #C0C0C0;
	border-bottom : 1px solid #C0C0C0;
	border-top : 1px solid #F5F5F5;
	display : block;
	padding : 0.7em;
	width : 13.5em;
}

a.rosso {
	border-left : 2px solid #000000;
	color : #c00800;
}

a.nero {
	border-left : 2px solid #000000;
	color : #000000;
}

a.rosa {
	border-left : 2px solid #ff6666;
	color : #ff6666;
}

a.giallo {
	border-left : 2px solid #ffb700;
	color : #ffb700;
}

a.arancione {
	border-left : 2px solid #ff7700;
	color : #ff7700;
}

a.azzurro {
	border-left : 2px solid #0072bc;
	color : #0072bc;
}

a.verde {
	border-left : 2px solid #00bb00;
	color : #00bb00;
}

a.bianco {
	border-left : 2px solid #888888;
	color : #888888;
}

a.rosso:hover,
a.nero:hover,
a.rosa:hover,
a.giallo:hover,
a.arancione:hover,
a.azzurro:hover,
a.verde:hover,
a.bianco:hover {
	background : #D0D0D0;
}

#mappa {
  position : relative;
  width : 62.5em;
}

#map_rosa {
  position : absolute;
  display : block;
  left : 13.2em;
  top : 6.2em;
}
#map_rosa img {
  width : 21.8em;
  height : 10.4em;
}

#map_azzurro {
  position : absolute;
  display : block;
  left : 35.5em;
  top : 6.2em;
}
#map_azzurro img {
  width : 9.5em;
  height : 10.4em;
}

#map_verde {
  position : absolute;
  display : block;
  left : 45.6em;
  top : 6.2em;
}
#map_verde img {
  width : 9.2em;
  height : 10.4em;
}

#map_bianco {
  position : absolute;
  display : block;
  left : 25.3em;
  top : 16.9em;
}
#map_bianco img {
  width : 9.7em;
  height : 10em;
}

#map_giallo {
  position : absolute;
  display : block;
  left : 20.5em;
  top : 30.7em;
}
#map_giallo img {
  width : 14.8em;
  height : 10em;
}

#map_arancione {
  position : absolute;
  display : block;
  left : 35.7em;
  top : 30.7em;
}
#map_arancione img {
  width : 14.1em;
  height : 10em;
}

.img_big {
  width : 62.5em;
  margin : 1em 0;
}

div.rosa,
div.rosa h1 {
	color : #ff6666;
}

div.giallo,
div.giallo h1 {
	color : #ffb700;
}

div.arancione,
div.arancione h1 {
	color : #ff7700;
}

div.azzurro,
div.azzurro h1 {
	color : #0072bc;
}

div.verde,
div.verde h1 {
	color : #00bb00;
}

div.bianco,
div.bianco h1 {
	color : #888888;
}

#footer {
  clear : both;
	width : 80em;
	text-align : center;
	border : 1px solid #C0C0C0;
	background : #F5F5F5;
	margin : 2em 0;
}

#footer span {
	font-size : 80%;
}

.small { /*small text, can be used everywhere*/
	font-size : 70%;
}

.redtext {
  color : #C00800;
}

.centered {
  text-align : center;
}

.blackborder {
  border : 1px solid #C00800;
}