/*QUESTO LAYOUT SERVE PER LIQUIDO A DUE COLONNE
LA COLONNA DI SINISTRA E' FONDAMENTALE PER SPINGERE IL FOOTER VERSO IL BASSO*/


/*Eliminiamo i margini e il padding predefiniti dal browser per il tag BODY, 
eliminiamo anche gli horizontal-rule, inutili nel layout che realizzeremo.*/
body { margin:0; padding:0; text-align:center;}
/*-----------------------------------------------------------------------------------------------------------------------------------*/
html { font-family:Georgia, "Times New Roman", Times, serif;font-size:11px;color:#666666;}
/*-----------------------------------------------------------------------------------------------------------------------------------*/
/*Fra le varie sezioni sono stati inseriti degli HR, 
il cui scopo è quello di evidenziare la separazione dei contenuti 
anche quando il browser non è in grado di leggere o interpretare il foglio di stile.*/
hr { display:none;} 
/*-----------------------------------------------------------------------------------------------------------------------------------*/
/*questi sono i div che compongono il corpo centrale del mio sito
Per posizionare le colonne laterali in maniera assoluta, 
prendendo come riferimento la sezione #corpo, 
quest'ultima deve essere posizionata in maniera relativa.

#corpo*/
div#header {
	width:780px;
	height:70px;
	margin:0 auto;
	text-align:right;
	background-attachment: scroll;
	background-image: url(../images/logo-jaycees_02.jpg);
	background-repeat: no-repeat;
	background-position: left top;
	padding:30px 20px 0 0;
}
/*-----------------------------------------------------------------------------------------------------------------------------------*/
/*#banner*/
div#banner {width:800px;margin:0 auto;text-align:left;}
/*-----------------------------------------------------------------------------------------------------------------------------------*/
/*#menu*/
div#menu {width:800px;margin:0 auto;text-align:left;background-image: url(../images/bg-menu_11.jpg); background-repeat: no-repeat; background-position: left top;}

a img {border-width: 0px;}

#home img {
	background-image: url(../images/button-home_11.jpg); background-repeat: no-repeat; background-position: left top;
}

#home:hover img {
	background-image: url(../images/roll_home.jpg); background-repeat: no-repeat; background-position: left top;
}

#who img {
	background-image: url(../images/button-who-we-are_12.jpg); background-repeat: no-repeat; background-position: left top;
}

#who:hover img {
	background-image: url(../images/roll_who-we-are.jpg); background-repeat: no-repeat; background-position: left top;
}

#creed img {
	background-image: url(../images/button-the-creed_13.jpg); background-repeat: no-repeat; background-position: left top;
}

#creed:hover img {
	background-image: url(../images/roll_the-creed.jpg); background-repeat: no-repeat; background-position: left top;
}

#events img {
	background-image: url(../images/button-events_14.jpg); background-repeat: no-repeat; background-position: left top;
}

#events:hover img {
	background-image: url(../images/roll_events.jpg); background-repeat: no-repeat; background-position: left top;
}

#contact img {
	background-image: url(../images/button-contact-us_15.jpg); background-repeat: no-repeat; background-position: left top;
}

#contact:hover img {
	background-image: url(../images/roll_contact-us.jpg); background-repeat: no-repeat; background-position: left top;
}
/*-----------------------------------------------------------------------------------------------------------------------------------*/
div#corpo {
	width:800px;
	margin:20px auto ;
	text-align:left;
	position:relative;
	background-attachment: scroll;
	background-image: url(../images/bg-main_21.jpg);
	background-repeat: repeat-y;
	background-position: left top;
}
/*-----------------------------------------------------------------------------------------------------------------------------------*/
div#footer {width:800px;margin:0 auto;text-align:left;background-image: url(../images/bg-footer_29.jpg); background-repeat: no-repeat; background-position: left top; color:#FFFFFF; font-size:10px;}

#leftfooter {width:420px; float:left; text-align:left; margin:25px 0 15px 15px;}

#rightfooter {width:320px; float:right;  text-align:right; margin:25px 25px 15px 0px;}

div#tencom {margin:0px auto;text-align:right; font-size:10px; padding-right:20px; padding-bottom:20px;}
/*-----------------------------------------------------------------------------------------------------------------------------------*/
/*Adesso è possibile posizionare le colonne laterali. 
La prima colonna sarà posta a sinistra e larga ....... pixel*/
#left {width:490px; height: auto !important; height: 490px; min-height: 480px;}

#left h1 {font-size:14px;color:#009966;}

#breadcrumbs {width:490px;margin-bottom:20px;}

#title {
	width:490px;
	margin-bottom:20px;
	padding-bottom:10px;
	border-bottom: 1px dashed #CCCCCC;
}

#descriptions {width:470px;margin-bottom:30px; height: auto !important; height: 120px; min-height: 120px;}

#textdescriptions{margin:5px 0 10px 0; text-align:justify;}

#more{ text-align:right;}

#descriptions img{margin: 0 10px 10px 0px; border: 1px solid #CCCCCC;}

#apexes{
	background-attachment: scroll;
	background-image: url(../images/chimesforcharity_23.jpg);
	background-repeat: no-repeat;
	background-position:left top;
	text-align:center;
	font-family: "Lucida Calligraphy", "Times New Roman", Times, serif;
	font-size:16px;
	color: #006633;
	height:50px;
}
/*-----------------------------------------------------------------------------------------------------------------------------------*/
/*La seconda colonna avrà il width pari a i pixel rimanenti per chiudere il corpo 
e il right pari a zero che lo spinge dall'altra parte del corpo*/
#right {position:absolute;top: 0; right: 0;width:290px;}

#calendar {width:265px;}

#calendar img{margin:0 0 10px 0;}

.descriptionright{ text-align:justify; padding:5px 0 15px 0;}

#donations {width:265px; margin-top:20px;}

#donations img{margin:0 0 10px 0;}

.descriptionright{ text-align:justify; padding:5px 0 15px 0;}
/*-----------------------------------------------------------------------------------------------------------------------------------*/
/*generic classes*/

p,h1,h2,h3 {padding:0px;margin:0px;}

img {border:0px;}

.textmiddle {vertical-align:middle;} 

img {border:0px;}

.textmiddle {vertical-align:middle;} 

.redbold11 {font-size: 11px;font-weight: bold;color: #CC3300;}

.redbold12 {font-size: 12px;font-weight: bold;color: #CC3300;}

.bold {font-weight: bold;}

.size14 {font-size: 14px;}

ul{ margin-left: 10px; padding-left: 10px;}

li{ margin-bottom: 10px; }

/*-----------------------------------------------------------------------------------------------------------------------------------*/
/*a classes*/

a {color:#009966;}

a:hover {text-decoration:none;}

a.red { color:#CC3300}

a.red:hover {text-decoration:none;}

a.yellow { color: #FFCC00;}

a.yellow:hover {text-decoration:none;}

a.white { color: #FFf;}

a.white:hover {text-decoration:none;}

/*-----------------------------------------------------------------------------------------------------------------------------------*/
/*Site map section*/

#sitemap { width:480px; border-bottom:dashed #CCCCCC 1px; padding:0 0 5px 10px; margin-top:20px; font-size:14px;}

ul.sitemap{ margin-top: 5px; padding-left: 10px;}

li.sitemap{ padding-top: 5px; }