body {
  font-family: "trebuchet ms";
  text-align: center;
}
h1{
  font-size: 2em;
}
a.button,a.button:visited {    
  text-decoration: none;
  font-weight: bold;
  font-size: 0.8em;
  color: white;
}
a.button:hover{color: black;} 

#wrapper {
 width: 900px;
 position: relative;
 margin-left: auto;
 margin-right: auto;
 text-align: left;
}
#navigation { 
 position: absolute;
 left: 0px;
 top: 0px;
 text-align: center;
}
#bordertop {
 width: 900px;
 position: absolute;
 left: 0px;
 top: 28px;
}
#bordercenter {
 width: 900px;
 position: absolute;
 left: 0px;
 top: 39px;
}
#borderbottom {
 width: 900px;
 position: absolute;
 left: 0px;
 top: 589px;
}
#linkbottom {
 width: 900px;
 position: absolute;
 left: 0px;
 top: 596px;
}
div#contentsx{
  float: left; 
  width: 370px;
}
div#contentdx{
  float: left;
  overflow: auto;
  width: 435px;
  height: 530px;
  font-size: 0.9em;
  text-align: left;
  margin: 10px 0px 10px 0px;  
  scrollbar-face-color: "#ffffff";
  scrollbar-arrow-color: "#000000";
  scrollbar-shadow-color: "#ffffff";
  scrollbar-darkshadow-color: #ffffff;
  scrollbar-track-color: #ffffff;
  scrollbar-3dlight-color: #ffffff 
}


/* bottone azzurro */
div#btnazzurrosx{
  background-image: url('../images/b10.png');
  background-repeat: no-repeat;
  float: left;
  width: 10px;
  height: 28px;
}
div#btnazzurrobg{
  background: url('../images/b11.png');
  background-repeat: repeat-x;
  float: left;
  line-height: 2em;
  height: 28px;
  width: 100px;
}
div#btnazzurrodx{
  background-image: url('../images/b12.png');
  background-repeat: no-repeat;
  float: left;
  width: 10px;
  height: 28px;
}

/* bottone marrone */
div#btnmarronesx{
  background-image: url('../images/b20.png');
  background-repeat: no-repeat;
  float: left;
  width: 10px;
  height: 28px;
}
div#btnmarronebg{
  background: url('../images/b21.png');
  background-repeat: repeat-x;
  float: left;
  line-height: 2em;
  height: 28px;
  width: 100px;
}
div#btnmarronedx{
  background-image: url('../images/b22.png');
  background-repeat: no-repeat;
  float: left;
  width: 10px;
  height: 28px;
}

/* bottone verde */
div#btnverdesx{
  background-image: url('../images/b30.png');
  background-repeat: no-repeat;
  float: left;
  width: 10px;
  height: 28px;
}
div#btnverdebg{
  background: url('../images/b31.png');
  background-repeat: repeat-x;
  float: left;
  line-height: 2em;
  height: 28px;
  width: 130px;
}
div#btnverdedx{
  background-image: url('../images/b32.png');
  background-repeat: no-repeat;
  float: left;
  width: 10px;
  height: 28px;
}

/* bottone rosso */
div#btnrossosx{
  background-image: url('../images/b40.png');
  background-repeat: no-repeat;
  float: left;
  width: 10px;
  height: 28px;
}
div#btnrossobg{
  background: url('../images/b41.png');
  background-repeat: repeat-x;
  float: left;
  line-height: 2em;
  height: 28px;
  width: 100px;
}
div#btnrossodx{
  background: url('../images/b42.png');
  background-repeat: no-repeat;
  float: left;
  width: 10px;
  height: 28px;
}

/* bottone giallo */
div#btngiallosx{
  background-image: url('../images/b50.png');
  background-repeat: no-repeat;
  float: left;
  width: 10px;
  height: 28px;
}
div#btngiallobg{
  background: url('../images/b51.png');
  background-repeat: repeat-x;
  float: left;
  line-height: 2em;
  height: 28px;
  width: 100px;
}
div#btngiallodx{
  background: url('../images/b52.png');
  background-repeat: no-repeat;
  float: left;
  width: 10px;
  height: 28px;
}

/* bottone arancione */
div#btnarancionesx{
  background-image: url('../images/b60.png');
  background-repeat: no-repeat;
  float: left;
  width: 10px;
  height: 31px;
}
div#btnarancionebg{
  background: url('../images/b61.png');
  background-repeat: repeat-x;
  float: left;
  line-height: 2em;
  height: 31px;
  width: 100px;
}
div#btnarancionedx{
  background: url('../images/b62.png');
  background-repeat: no-repeat;
  float: left;
  width: 10px;
  height: 31px;
}

/* bottone blu */
div#btnblusx{
  background-image: url('../images/b70.png');
  background-repeat: no-repeat;
  float: left;
  width: 10px;
  height: 31px;
}
div#btnblubg{
  background: url('../images/b71.png');
  background-repeat: repeat-x;
  float: left;
  line-height: 2em;
  height: 31px;
  width: 100px;
}
div#btnbludx{
  background: url('../images/b72.png');
  background-repeat: no-repeat;
  float: left;
  width: 10px;
  height: 31px;
}

/* bordo azzurro */
div#angoloaltolineaazzurrasx{
  background: url('../images/angolo azzurro sx alto.png');
  background-repeat: no-repeat;
  float: left;
  width: 15px;
  height: 11px;
}
div#lineaazzurraorizzontale{
  background: url('../images/linea azzurra orizzontale alta.png');
  background-repeat: repeat-x;
  float: left;
  width: 874px;
  height: 11px;
}
div#angoloaltolineaazzurradx{
  background: url('../images/angolo azzurro dx alto.png');
  background-repeat: no-repeat;
  float: right;
  width: 11px;
  height: 11px;
}
div#lineaazzurraverticalesx{
  background: url('../images/linea azzurra verticale sx.png');
  background-repeat: repeat-y;
  float: left;
  width: 14px;
  height: 550px;  
}
div#lineaazzurraverticaledx{
  background: url('../images/linea azzurra verticale dx.png');
  background-repeat: repeat-y;
  float: right;
  width: 11px;
  height: 550px;  
}
div#verticalseparatorazzurro{
  background: url('../images/vertical separator azzurro.png');
  background-repeat: no-repeat;
  float: left;
  width: 55px;
  height: 545px;
  margin: 0px 0px 0px 0px;
}
div#angolobassolineaazzurrasx{
  background: url('../images/angolo azzurro sx basso.png');
  background-repeat: no-repeat;
  float: left;
  width: 15px;
  height: 11px;
}
div#lineaazzurraorizzontalebassa{
  background: url('../images/linea azzurra orizzontale bassa.png');
  background-repeat: repeat-x;
  float: left;
  width: 874px;
  height: 11px;
}
div#angolobassolineaazzurradx{
  background: url('../images/angolo azzurro dx basso.png');
  background-repeat: no-repeat;
  float: right;
  width: 11px;
  height: 11px;
}

/* bordo marrone */
div#angoloaltolineamarronesx{
  background: url('../images/angolo marrone sx alto.png');
  background-repeat: no-repeat;
  float: left;
  width: 15px;
  height: 11px;
}
div#lineamarroneorizzontale{
  background: url('../images/linea marrone orizzontale alta.png');
  background-repeat: repeat-x;
  float: left;
  width: 874px;
  height: 11px;
}
div#angoloaltolineamarronedx{
  background: url('../images/angolo marrone dx alto.png');
  background-repeat: no-repeat;
  float: right;
  width: 11px;
  height: 11px;
}
div#lineamarroneverticalesx{
  background: url('../images/linea marrone verticale sx.png');
  background-repeat: repeat-y;
  float: left;
  width: 14px;
  height: 550px;  
}
div#lineamarroneverticaledx{
  background: url('../images/linea marrone verticale dx.png');
  background-repeat: repeat-y;
  float: right;
  width: 11px;
  height: 550px;  
}
div#verticalseparatormarrone{
  background: url('../images/vertical separator marrone.png');
  background-repeat: no-repeat;
  float: left;
  width: 55px;
  height: 545px;
  margin: 0px 0px 0px 0px;
}
div#angolobassolineamarronesx{
  background: url('../images/angolo marrone sx basso.png');
  background-repeat: no-repeat;
  float: left;
  width: 15px;
  height: 11px;
}
div#lineamarroneorizzontalebassa{
  background: url('../images/linea marrone orizzontale bassa.png');
  background-repeat: repeat-x;
  float: left;
  width: 874px;
  height: 11px;
}
div#angolobassolineamarronedx{
  background: url('../images/angolo marrone dx basso.png');
  background-repeat: no-repeat;
  float: right;
  width: 11px;
  height: 11px;
}

/* bordo verde */
div#angoloaltolineaverdesx{
  background: url('../images/angolo verde sx alto.png');
  background-repeat: no-repeat;
  float: left;
  width: 15px;
  height: 11px;
}
div#lineaverdeorizzontale{
  background: url('../images/linea verde orizzontale alta.png');
  background-repeat: repeat-x;
  float: left;
  width: 874px;
  height: 11px;
}
div#angoloaltolineaverdedx{
  background: url('../images/angolo verde dx alto.png');
  background-repeat: no-repeat;
  float: right;
  width: 11px;
  height: 11px;
}
div#lineaverdeverticalesx{
  background: url('../images/linea verde verticale sx.png');
  background-repeat: repeat-y;
  float: left;
  width: 14px;
  height: 550px;  
}
div#lineaverdeverticaledx{
  background: url('../images/linea verde verticale dx.png');
  background-repeat: repeat-y;
  float: right;
  width: 11px;
  height: 550px;  
}
div#verticalseparatorverde{
  background: url('../images/vertical separator verde.png');
  background-repeat: no-repeat;
  float: left;
  width: 55px;
  height: 545px;
  margin: 0px 0px 0px 0px;
}
div#angolobassolineaverdesx{
  background: url('../images/angolo verde sx basso.png');
  background-repeat: no-repeat;
  float: left;
  width: 15px;
  height: 11px;
}
div#lineaverdeorizzontalebassa{
  background: url('../images/linea verde orizzontale bassa.png');
  background-repeat: repeat-x;
  float: left;
  width: 874px;
  height: 11px;
}
div#angolobassolineaverdedx{
  background: url('../images/angolo verde dx basso.png');
  background-repeat: no-repeat;
  float: right;
  width: 11px;
  height: 11px;
}

/* bordo rosso */
div#angoloaltolinearossosx{
  background: url('../images/angolo rosso sx alto.png');
  background-repeat: no-repeat;
  float: left;
  width: 15px;
  height: 11px;
}
div#linearossaorizzontale{
  background: url('../images/linea rossa orizzontale alta.png');
  background-repeat: repeat-x;
  float: left;
  width: 874px;
  height: 11px;
}
div#angoloaltolinearossodx{
  background: url('../images/angolo rosso dx alto.png');
  background-repeat: no-repeat;
  float: right;
  width: 11px;
  height: 11px;
}
div#linearossaverticalesx{
  background: url('../images/linea rossa verticale sx.png');
  background-repeat: repeat-y;
  float: left;
  width: 14px;
  height: 550px;  
}
div#linearossaverticaledx{
  background: url('../images/linea rossa verticale dx.png');
  background-repeat: repeat-y;
  float: right;
  width: 11px;
  height: 550px;  
}
div#verticalseparatorrosso{
  background: url('../images/vertical separator rosso.png');
  background-repeat: no-repeat;
  float: left;
  width: 55px;
  height: 545px;
  margin: 0px 0px 0px 0px;
}
div#angolobassolinearossosx{
  background: url('../images/angolo rosso sx basso.png');
  background-repeat: no-repeat;
  float: left;
  width: 15px;
  height: 11px;
}
div#linearossaorizzontalebassa{
  background: url('../images/linea rossa orizzontale bassa.png');
  background-repeat: repeat-x;
  float: left;
  width: 874px;
  height: 11px;
}
div#angolobassolinearossodx{
  background: url('../images/angolo rosso dx basso.png');
  background-repeat: no-repeat;
  float: right;
  width: 11px;
  height: 11px;
}

/* bordo giallo */
div#angoloaltolineagiallosx{
  background: url('../images/angolo giallo sx alto.png');
  background-repeat: no-repeat;
  float: left;
  width: 15px;
  height: 11px;
}
div#lineagiallaorizzontale{
  background: url('../images/linea gialla orizzontale alta.png');
  background-repeat: repeat-x;
  float: left;
  width: 874px;
  height: 11px;
}
div#angoloaltolineagiallodx{
  background: url('../images/angolo giallo dx alto.png');
  background-repeat: no-repeat;
  float: right;
  width: 11px;
  height: 11px;
}
div#lineagiallaverticalesx{
  background: url('../images/linea gialla verticale sx.png');
  background-repeat: repeat-y;
  float: left;
  width: 14px;
  height: 550px;  
}
div#lineagiallaverticaledx{
  background: url('../images/linea gialla verticale dx.png');
  background-repeat: repeat-y;
  float: right;
  width: 11px;
  height: 550px;  
}
div#verticalseparatorgiallo{
  background: url('../images/vertical separator giallo.png');
  background-repeat: no-repeat;
  float: left;
  width: 55px;
  height: 545px;
  margin: 0px 0px 0px 0px;
}
div#angolobassolineagiallosx{
  background: url('../images/angolo giallo sx basso.png');
  background-repeat: no-repeat;
  float: left;
  width: 15px;
  height: 11px;
}
div#lineagiallaorizzontalebassa{
  background: url('../images/linea gialla orizzontale bassa.png');
  background-repeat: repeat-x;
  float: left;
  width: 874px;
  height: 11px;
}
div#angolobassolineagiallodx{
  background: url('../images/angolo giallo dx basso.png');
  background-repeat: no-repeat;
  float: right;
  width: 11px;
  height: 11px;
}

/* bordo arancione */
div#angoloaltolineaarancionesx{
  background: url('../images/angolo arancione sx alto.png');
  background-repeat: no-repeat;
  float: left;
  width: 15px;
  height: 11px;
}
div#lineaarancioneorizzontale{
  background: url('../images/linea arancione orizzontale alta.png');
  background-repeat: repeat-x;
  float: left;
  width: 874px;
  height: 11px;
}
div#angoloaltolineaarancionedx{
  background: url('../images/angolo arancione dx alto.png');
  background-repeat: no-repeat;
  float: right;
  width: 11px;
  height: 11px;
}
div#lineaarancioneverticalesx{
  background: url('../images/linea arancione verticale sx.png');
  background-repeat: repeat-y;
  float: left;
  width: 14px;
  height: 550px;  
}
div#lineaarancioneverticaledx{
  background: url('../images/linea arancione verticale dx.png');
  background-repeat: repeat-y;
  float: right;
  width: 11px;
  height: 550px;  
}
div#verticalseparatorarancione{
  background: url('../images/vertical separator arancione.png');
  background-repeat: no-repeat;
  float: left;
  width: 55px;
  height: 545px;
  margin: 0px 0px 0px 0px;
}
div#angolobassolineaarancionesx{
  background: url('../images/angolo arancione sx basso.png');
  background-repeat: no-repeat;
  float: left;
  width: 15px;
  height: 11px;
}
div#lineaarancioneorizzontalebassa{
  background: url('../images/linea arancione orizzontale bassa.png');
  background-repeat: repeat-x;
  float: left;
  width: 874px;
  height: 11px;
}
div#angolobassolineaarancionedx{
  background: url('../images/angolo arancione dx basso.png');
  background-repeat: no-repeat;
  float: right;
  width: 11px;
  height: 11px;
}

/* bordo blu */
div#angoloaltolineablusx{
  background: url('../images/angolo blu sx alto.png');
  background-repeat: no-repeat;
  float: left;
  width: 15px;
  height: 11px;
}
div#lineabluorizzontale{
  background: url('../images/linea blu orizzontale alta.png');
  background-repeat: repeat-x;
  float: left;
  width: 874px;
  height: 11px;
}
div#angoloaltolineabludx{
  background: url('../images/angolo blu dx alto.png');
  background-repeat: no-repeat;
  float: right;
  width: 11px;
  height: 11px;
}
div#lineabluverticalesx{
  background: url('../images/linea blu verticale sx.png');
  background-repeat: repeat-y;
  float: left;
  width: 14px;
  height: 550px;  
}
div#lineabluverticaledx{
  background: url('../images/linea blu verticale dx.png');
  background-repeat: repeat-y;
  float: right;
  width: 11px;
  height: 550px;  
}
div#verticalseparatorblu{
  background: url('../images/vertical separator blu.png');
  background-repeat: no-repeat;
  float: left;
  width: 55px;
  height: 545px;
  margin: 0px 0px 0px 0px;
}
div#angolobassolineablusx{
  background: url('../images/angolo blu sx basso.png');
  background-repeat: no-repeat;
  float: left;
  width: 15px;
  height: 11px;
}
div#lineabluorizzontalebassa{
  background: url('../images/linea blu orizzontale bassa.png');
  background-repeat: repeat-x;
  float: left;
  width: 874px;
  height: 11px;
}
div#angolobassolineabludx{
  background: url('../images/angolo blu dx basso.png');
  background-repeat: no-repeat;
  float: right;
  width: 11px;
  height: 11px;
}