@charset "UTF-8";

#content {
	width: 845px;
	margin: 0 auto; /* i margini auto (insieme a una larghezza) centrano la pagina */
	text-align: justify;
	position: relative;
	top: 30px;
	-moz-box-shadow: 0 0 30px #CCC;
	-webkit-box-shadow: 0 0 30px #CCC;
	border: dotted #f0f0f0 1px;
	background-image: url(../img/trasp2.png);
} 

#header {
	padding: 0px 0px 0px 30px;
} 

#header h1 {

	margin: 0; /* azzerando il valore margin dell'ultimo elemento del div #header si evita la compressione del margine, con la creazione di uno spazio inspiegabile tra i div. Se il div ˆ® circondato da un bordo, questo accorgimento non ˆ® necessario perchˆ© anche il bordo impedisce la compressione del margine */

	padding: 10px 0; /* l'uso del valore padding al posto di margin consente di distanziare l'elemento dai bordi del div */

}

#sidebar1 {
	float: right; /* poichˆ© questo elemento ˆ® mobile, occorre specificare una larghezza */
	width: 218px; /* il colore di sfondo verrˆÝ visualizzato per tutta la lunghezza del contenuto all'interno della colonna, ma non oltre */
	padding: 0px 0px 0px 0px;
	text-align: left;
}

#mainContent {
	margin: 0 225px 0 0; /* il margine destro di questo elemento div crea la colonna sul lato destro della pagina; indipendentemente dalla quantitˆÝ di contenuto presente nel div sidebar1, lo spazio della colonna rimane inalterato. ˆà possibile rimuovere questo margine se si desidera che il testo del div #mainContent riempia lo spazio di #sidebar1 quando il contenuto di #sidebar1 finisce. */
	padding: 0px 0px 0px 30px;
} 

#gronchi {
	width: 125px;
	position: relative;
	height: 110px;
	top: -95px;
	background-image: url(../img/gronchirosa.png);
	background-repeat: no-repeat;
	z-index: 4;
	left: 70px;
	margin: 0 auto;
}

#footer {
	padding: 0px 0 15px 0;
	text-align: center;
	width: 847px;
	margin: 0 auto;
	top: 30px;
	position: relative;
} 

.fltrt { /* questa classe puˆ¾ essere utilizzata per rendere mobile un elemento a destra nella pagina. L'elemento reso mobile deve precedere l'elemento al quale deve essere affiancato sulla pagina. */
	float: right;
	margin-left: -200px;
}