html {
	background-image:url(../fig/sfondo-body.jpg);

}

body {
	margin:0px;
	padding:0px;
	background-image:url(../fig/bordopagina.jpg);
	background-repeat:repeat-y;
	background-position:1000px 0px;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:12px; 
	/*imposto al body il font e la grandezza di carattere di default cosė non lo devo specificare di volta in volta ma solo quando mi serve di cambiare font o grandezza */
}

#box {
	width:1000px;
	
}

#testa {
	height: 462px;
	background-image:url(../fig/escursioni-mtb.jpg);
	background-repeat:no-repeat;
}

#utility {
	color:#000;
	font-size:14px;
	line-height:18px;
	min-height:23px; 
	height:auto !important; 
	height:23px;
}

#utility ul {
	list-style-type:none; /* definisce il margine sopra-sotto (il primo valore) e destra-sinistra (il secondo valore)*/
	margin-top: 0px;
	margin-right: 10px;
	margin-bottom: 0px;
	margin-left: 29px;
}

#utility ul li {
	display:inline; /* faccio in modo che le voci dell'elenco stiano una accanto all'altra e non una sopra l'altra*/
	margin:0px;
}


#corpo {
	height:480px;
	width:630px; 
	padding-left:20px; /* evito che il testo che va oltre la foto si attacchi al margine sinistro */
	overflow:hidden; /* se il testo si allunga troppo non si vede altrimenti sballa l'impaginazione al piede. Per questo motivo ho tolto l'altezza minima e lasciato un'altezza fissa */

}

#filetto {
	background-color: #ffde75; /* il valore esatto lo ricavo con photoshop */
	height:49px; /*anche l'altezza la ricavo da photoshop */
}

#piede {
	background-image:url(../fig/sfondo-piede-sabina.jpg);
	background-repeat:repeat-x; /*si deve ripetere solo in orizzontale */
	min-height:190px;
	height:auto !important;
	height:190px;
	background-color: #057012;
}

#piede a:link {
	color: #FFFFFF;
	text-decoration: underline;
}

#piede a:visited {
	text-decoration: underline;
	color: #EAE9C6;	
}

#piede a:hover {
	text-decoration: none;	
}

#logo {
	position:absolute;
	top:8px; /* a tentativi individuo le giuste coordinate */
	left:12px; /* a tentativi individuo le giuste coordinate */
	height:320px; /* verifico la larghezza e altezza con photoshop */
	width:316px; /* verifico la larghezza e altezza con photoshop */
	z-index:10; /* mi assicuro che questo div stia sempre sotto al div del logo */
}


#tagline {
	position:absolute;
	top:30px; 
	left:350px; 
	height:80px; 
	width:400px; 
	z-index:20;/* mi assicuro che questo div stia sempre sopra al div del logo */
	color:#fff;
	font-size:16px;
	font-weight:bold;
	
}


#tagline p {
	margin:0px;

}


#mtb {
	position:absolute;
	top:385px; /* a tentativi individuo le giuste coordinate */
	left:637px; /* a tentativi individuo le giuste coordinate */
	height:177px; 
	width:295px; 
}

#accessori {
	position:absolute;
	top:570px; 
	left:669px; 
	height:148px; 
	width:263px; 
}

#associazione {
	position:absolute;
	top:750px; 
	left:646px; 
	height:164px; 
	width:286px; 
}


#guida {
	position:absolute;
	top:901px; 
	left:11px; 
	height:153px; 
	width:144px; 
}


#fotopiede {
	position:absolute;
	top:969px; 
	left:773px;
	height:173px;
	width:217px; 
	background-color: #eee; 
}

#corpo img {
	float:left; 
	padding:20px 20px 20px 10px;
	margin:0px;

}

#corpo h1 {
	color:#0198cd;
	margin:0px; 
	font-size:18px;
	padding:20px 0px 10px 80px; 
}



#corpo p {
	margin:0px;
	padding-top:10px;
}

#corpo h1 a:link {
	color:#0198cd;
	text-decoration: underline;
}

#corpo h1 a:visited {
	color:#C0A243;
	text-decoration: underline;
}

#corpo h1 a:hover {
	text-decoration: none;
}

#filetto p {
	font-size:18px;
	padding-top:15px;
	color: #C32F2D;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 229px;
}

#filetto p a:link {
	color: #C32F2D;
	text-decoration: underline;
}

#filetto p a:visited {
	text-decoration: underline;
	color: #C0A243;
}

#filetto p a:hover {
	text-decoration: none;
}

#indirizzo {
	margin: 15px 0px 10px 0px;
}

#keywords {
	
}


#piede h3 {
	color:#fff;
	text-align:center;
	margin:0px;
	padding-top:5px;
	
}

#piede p {
	color:#fff;
	text-align:center;
	margin:0px
}

#clic { 
	padding:20px 0px 0px 30px;
}

#clic p {
	margin:0px;
	color:#FFFFFF;
	text-align:left;
}

#keywords p {
	color:#FFFFFF;
	margin: 0px;
	text-align:center;
	font-weight:bold;
}

#indirizzo p {
	margin:0px;
	color:#FFFFFF;
	text-align: center;
}


#linkmtb {
	position:absolute;
	top:529px;
	left:658px;
}

#linkmtb h2 a:link {
	color: #FFFFFF;
	text-decoration: underline;
}

#linkmtb h2 a:visited {
	text-decoration: underline;
	color: #EAE9C6;
}

#linkmtb h2 a:hover {
	text-decoration: none;
}

#linkaccessori h2 a:link {
	color: #FFFFFF;
	text-decoration: underline;
}

#linkaccessori h2 a:visited {
	text-decoration: underline;
	color: #EAE9C6;
}

#linkaccessori h2 a:hover {
	text-decoration: none;
}

#linkaccessori {
	position:absolute;
	top:684px;
	left:690px;
}

#linkassociazione h2 a:link {
	color: #FFFFFF;
	text-decoration: underline;
}

#linkassociazione h2 a:visited {
	text-decoration: underline;
	color: #EAE9C6;
}

#linkassociazione h2 a:hover {
	text-decoration: none;
}

#linkassociazione {
	position:absolute;
	top:882px;
	left:662px;
}

#linkmtb h2, #linkassociazione h2, #linkaccessori h2 { 
	font-size:12px;
	font-weight:bold;
	color:#fff;
	width:200px;
	margin:0px;

}

#tagline p.invito {
	font-size:12px;
	font-weight:normal;
	font-style:italic;

}

#corpo p.cappello {
	font-size:14px;
	font-style:italic;
	color:#000066;
}

#corpo strong {
	color:#000066;
}

#utility ul li a:link {
	color: #0066CC;
	
}

#utility ul li a:hover {
	color: #CC0033;
	text-decoration:none;
	
}

#utility ul li a:visited {
	color: #CC0033;
}