body  {
	font-family:Arial, Helvetica, sans-serif;
	background: #333366;
	margin: 0; /* è buona norma impostare a zero i valori margin e padding dell'elemento body per tenere conto delle diverse impostazioni predefinite dei browser*/
	padding: 0;
	text-align: center; /* centra il contenitore nei browser IE 5*. Il testo viene quindi impostato con l'allineamento predefinito a sinistra nel selettore #container */
	color: #333366;
	font-size:14px;
}

#outsidecontainer { 
	background:url(../images/bg2.jpg) repeat-x; height:768px;
}
 
#container { 
	width: 850px;  /* utilizzando 20 px in meno rispetto alla dimensione piena di 800 px, si lascia spazio per gli elementi grafici e strutturali del browser e si evita che venga visualizzata una barra di scorrimento orizzontale */
	margin: 0 auto; /* i margini auto (insieme a una larghezza) centrano la pagina */
}
 
#header {
	height:150px;
	padding: 0 10px 0 20px;  /* questo padding corrisponde all'allineamento a sinistra degli elementi nei div sottostanti. Se in #header viene utilizzata un'immagine anziché un testo, può essere utile rimuovere il padding. */
}

#logo {
	position:relative;
	top:15px;
}

#content { 
	border: 1px solid #333366;
	height:418px;
	width:850px;
	background: #FFF;
	text-align:justify;
}

#content a { color:#333366; text-decoration:none; }

#content a:hover { color:#CC0; text-decoration:none; }

#content a img { border:0px; }

#content a:hover img { filter:alpha(opacity=60);
	-moz-opacity:.60;
	opacity:.60; }

#contentindex {
	background:url(../images/content_index.jpg) no-repeat right;
	border: 1px solid #333366;
	height:418px;
	width:850px;
	background-color: #FFF;
	text-align:justify;
}
#contentpun {
	background:url(../images/content_pun.jpg) no-repeat left;
	border: 1px solid #333366;
	height:418px;
	width:850px;
	background-color: #FFF;
	text-align:justify;
}

#contentpun a { text-decoration:none; color:#333366; }

#contentpun a:hover { text-decoration:none; color:#CC0; }

#contentcon {
	background:url(../images/content_con.jpg) no-repeat center;
	border: 1px solid #333366;
	height:418px;
	width:850px;
	background-color: #FFF;
	text-align:justify;
}

#contentcon a { text-decoration:none; color:#333366; }

#contentcon a:hover { text-decoration:none; color:#CC0; }

#contentord {
	background:url(../images/content_ord.jpg) no-repeat center;
	border: 1px solid #333366;
	height:418px;
	width:850px;
	background-color: #FFF;
	text-align:justify;
}

#footer { 
	padding: 0 0px 0 0px; /* questo padding corrisponde all'allineamento a sinistra degli elementi nei div sovrastanti. */
} 

#footer p {
	margin: 0; /* azzerando il valore margin del primo elemento del footer si evita il rischio di compressione del margine, con la creazione di uno spazio tra i div */
	padding: 10px 0; /* il padding di questo elemento crea uno spazio, così come avverrebbe specificando un valore margin, senza il problema della compressione del margine */
}

.clearfloat { /* questa classe deve essere inserita in un elemento div o break e deve essere l'elemento finale prima della chiusura di un contenitore che deve contenere per intero un elemento mobile */
	clear:both;
    height:0;
    font-size: 1px;
    line-height: 0px;
}

ul#menu {
	font-family:Arial, Helvetica, sans-serif;
	margin:0px;
	margin-top:10px;
	padding:0px;
	width:850px;
	color:#fff;
}

ul#menu li {
	list-style:none;
	text-transform:uppercase;
	display:inline;
	font-size:14px;
	letter-spacing:3px;
}

ul#menu li a {
	text-decoration:none; color:#fff;
}

ul#menu li a:hover {
	text-decoration:none; color:#CC0;
}

#activelink {
	color:#CC0;
	font-weight:bold;
}

ul { list-style:none; }

#colonnaunica { float:left; width:830px; margin-left:20px; margin-top:10px; }

#singolacolonna { float:left; width:220px; margin-left:60px; margin-top:10px; }

#doppiacolonna { float:left; width:440px; margin-left:60px; margin-top:10px; }

#minicolonna { float:left; width:160px; margin-left:90px; margin-top:10px; text-align:center; }

#minicolonna2 { float:left; width:160px; margin-left:45px; margin-top:10px; text-align:center; }

#microcolonna { float:left; width:120px; height:125px; margin-left:20px; margin-top:20px; margin-bottom:20px; text-align:center; }

.arancione { color:#ff9900; text-transform:uppercase; }

.blu { color:#333366; font-weight:bold; }

.titolo { font-weight:bold; font-size:20px; font-style:italic; }

.bold { font-weight:bold; }

.legenda { font-size:10px; }