@charset "UTF-8";
body  {
	font: 100% Arial, Helvetica, sans-serif;
	background: #cccc99;
	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: #000000;
	}
	
	h1 {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	color: #993300;
	}
	
	h2 {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #993300;
	}
	
	p {
	/*color: #844406;*/
	color: #333333;
	}
	
	a:link {
	color: #993300;
	}
	a:visited {
	color: #993300;
	}
	a:hover {
	color: #FFCC00;
	}

.studiojb_3a #container { 
	width: 980px;  /* 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 */
	background: #cc9900;
	margin: 0 auto; /* i margini auto (insieme a una larghezza) centrano la pagina */
	border: 1px solid #000000;
	text-align: left; /* sostituisce l'impostazione text-align: center nell'elemento body. */
} 


mainContent  {
	text-align: center; /* centra il contenitore nei browser IE 5*. Il testo viene quindi impostato con l'allineamento predefinito a sinistra nel selettore #container */
	}



.studiojb_3a #header {
	padding: 0 0px 0 0px;
} 

.studiojb_3a #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 */
}


.menuNavigazione{
	color:#000;
	margin:0;
	padding:0.5em 0;
	border-bottom:1px solid #000;
	text-align:center;
	position: relative;
	top: -29px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
}

.menuNavigazione li{
display:inline;
}

.menuNavigazione a{
height:0;
padding:0.5em 0;
text-decoration:none;
margin:-0.5em 1em;
}

.menuNavigazione a:link,
.menuNavigazione a:visited{
	color:#993300;
	text-decoration: underline;
}

.menuNavigazione a:hover,
.menuNavigazione a:focus,
.menuNavigazione a:active{
	color:#993300;
	border-bottom:0.4em solid #FFCC00;
	padding-bottom:0.1em;
}

.menuNavigazione .voceCorrente a:link,
.menuNavigazione .voceCorrente a:visited,
.menuNavigazione .voceCorrente a:hover,
.menuNavigazione .voceCorrente a:focus,
.menuNavigazione .voceCorrente a:active{
	color:#000000;
	padding-bottom:0.1em;
	border-bottom-width: 0.4em;
	border-bottom-style: solid;
	border-bottom-color: #993300;
}


.studiojb_3a #sidebar1 {
	float: left; /* poiché questo elemento è mobile, occorre specificare una larghezza */
	width: 150px; /* il padding consente di distanziare dai bordi il contenuto del div */
	background-color: #cc9900;
	background-repeat: no-repeat;
	padding-top: 3px;
	padding-right: 10px;
	padding-bottom: 15px;
	padding-left: 10px;
	font-size: 12px;
}

#sidebar1 a {
	padding-left: 0px;
}

#attivita {
	background-image: url(../images/bk_box_att.gif);
	background-repeat: no-repeat;
	font-family: Arial, Helvetica, sans-serif;
	color: #993300;
	position: relative;
	top: 0px;
	border: 1px solid #FFCC00;
	padding: 6px;
	margin-bottom: 10px;
	list-style-type: none;
	list-style-image: url(../images/ooo.jpg);
}

#sidebar2 {
	float: right; /* poiché questo elemento è mobile, occorre specificare una larghezza */
	width: 160px; /* il padding consente di distanziare dai bordi il contenuto del div */
	/*background-color: #cc9900;*/
	padding-top: 5px;
	padding-right: 10px;
	padding-bottom: 15px;
	padding-left: 10px;
	font-size: 12px;
	/*background-color: #CCCCCC;*/
}

.box_ds {
	font-family: Arial, Helvetica, sans-serif;
	color: #993300;
	position: relative;
	border: 1px solid #FFCC00;
	margin-bottom: 8px;
	padding-top: 0px;
	padding-right: 6px;
	padding-bottom: 6px;
	padding-left: 6px;
	background-image: url(../images/bk_box_ds_.gif);
	background-repeat: repeat-x;
	/*background-position: bottom;*/
}

/*.box_ds img {
	vertical-align: middle;
}*/

#box_ds h2 span{
	/*background-image: url(../images/bk_box_ds.jpg);
	background-repeat: no-repeat;*/
	width:150px;
	height:10px;
	display:block;
	padding-top: 1px;
	padding-right: 0px;
	padding-bottom: 1px;
	padding-left: 2px;
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 10px;
	text-decoration: underline overline;
}

#box_cn {
	width: 580px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #993300;
	position: relative;
	top: 5px;
	border: 1px solid #FFCC00;
	padding: 6px;
	margin-bottom: 10px;
}

#box_cn_int_sn {
	float: left;
	width: 340px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #993300;
	position: relative;
	border: 0px solid #FFCC00;
	padding: 6px;
	margin-bottom: 10px;
}

#box_cn_int_ds {
	float: left;
	width: 190px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #993300;
	position: relative;
	top: 25px;
	border: 0px solid #FFCC00;
	padding: 6px;
	margin-bottom: 10px;
}

#box_cn_snds {
	position: relative;
	width: 586px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #993300;
	border: 0px solid #FFCC00;
	padding: 4px;
	margin: auto; /* i margini auto (insieme a una larghezza) centrano la pagina */	/*margin-bottom: 10px;*/
}

#mainContent {
	background-color: #cc9900;
	padding-top: 0;
	padding-right: 10px;
	padding-bottom: 0;
	padding-left: 10px;
	float: left;
	width: auto;
}

#presenta_home {
	position: relative;
	left: 105px;
	top: 10px;
	width: 386px;
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 14px;
	padding: 7px;
	text-align: justify;
	border: 0px solid #FFCC00;
	margin-top: 10px;
	margin-right: 1px;
	margin-bottom: 1px;
	margin-left: 1px;	/*background-color: #cccc99;*/
}

#presenta_home h3 {
	color:#993300;
}



#box_cn_home {
	background-image: url(../images/bk_home.jpg);
	background-repeat: no-repeat;
	position: relative;
	width: 586px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #993300;
	border: 0px solid #FFCC00;
	margin: 0 auto; /* i margini auto (insieme a una larghezza) centrano la pagina */	/*margin-bottom: 10px;*/
	margin-top: 10px;
}

#presenta_servizi {
	position: relative;
	width: 670px;
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 14px;
	padding: 10px;
	text-align: left;
	left: 10px;
	top: 1px;
	color: #844406;
}

#footer {
	width: 800px;
	background-color: #cc9900
} 
#footer h1 {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 9px;
	position: relative;
	color: #993300;
	top: 50px;
	left: 94px;
}

.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: 8px;
}

.fltlft { /* questa classe può essere utilizzata per rendere mobile un elemento a sinistra nella pagina.*/
	float: left;
	margin-right: 8px;
}

.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;
}
textarea {
	background-color: #EDD681;
	color: #993300;
}

input {
	background-color: #EDD681;
	color: #993300;
}

#hr {
	color: #FFFF00;
}
#foto_gallery {
	text-align: center;
}

/* Syle per galleria*/
.galleria{
list-style:none;
width:200px;
}
.galleria li {
display:block;
width:80px;
height:80px;
overflow:hidden;
float:left;
margin:0 10px 10px 0;
}
.galleria li a{
display:none;
}
.galleria li div{
position:absolute;
display:none;
top:0;
left:180px;
}
.galleria li div img{
cursor:pointer;
}
.galleria li.active div img,.galleria li.active div{
display:block;
}
.galleria li img.thumb {
cursor:pointer;
top:auto;
left:auto;
display:block;
width:auto;
height:auto;
 }
/*.galleria li .caption{
display:block;
padding-top:.5em;
}*/
* html .galleria li div span{
width:400px;
} /* MSIE bug */

	.jb h1,h2{
	font:bold 80% 'helvetica neue',sans-serif;
	letter-spacing:3px;text-transform:uppercase;
	}
	.caption{
	font-style:italic;
	}
	.jb{
	position:relative;
	margin-top:2em;
	}
	.jb h1{
	text-align: center;
	font-size: 11px;
	}

	
	.gallery_jb{
	width:561px;
	}
	
	.gallery_jb li{
	width:68px;
	height:50px;
	border:3px double #111;
	background-color: #cc9900;
	margin-top: 1px;
	margin-right: 1px;
	margin-bottom: 1px;
	margin-left: 1px;
	}
	/*.gallery_jb li div{
	left:40px;
	}*/
	.gallery_jb li div .caption{
	font:italic 0.7em/1.4 georgia,serif;
	}
	
	#main_image{
	margin:0 auto 25px auto;
	height:443px;
	width:561px;
	background-color: #CC9900;
	border: 1px solid #FFCC00;
}
	#main_image img{
	margin-bottom:10px;
	}
	
	.nav{
	padding-top:5px;
	clear:both;
	font:80% 'helvetica neue',sans-serif;
	letter-spacing:3px;
	text-transform:uppercase;
	text-align: center;
	}

/*login area riservata spazio libero*/
#libero {
	float: right;
	width:400px;
	height:450px;
	text-align:center;
	background-color:#cc9900;
	border:1px solid #FFCC00;
	margin-top: 10px;
	margin-right: 0;
	margin-bottom: 0;
	margin-left: 0;
	padding-top: 10px;
	padding-right: 10px;
	padding-bottom: 10px;
	padding-left: 10px;
}