/*
^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
Foglio Definizione Stile - Annotazioni - Guide (in fndo alla pagina)
^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
*/





/* --------------------------------- */
/*      Impostazioni Pagina          */
/* --------------------------------- */
BODY
{
    background-color: white;
    color: #333399;
    margin: 0;
    padding:0;
    font-family: verdana;
    text-align :justify;
    font-size: 76%;
    /* NOTA SULLA DIMENSIONE DEL FONT SIZE  
    /* Dimensionare il font-size del body con una misura relativa di modo che sia possibile 
    /* ridimensionare il font tramite le opzioni del browser. 
    /* Una misura percentuale accettabile universalmente è stata suggerita, in un articolo ormai 
    /* diventato "storico" (http://www.thenoodleincident.com/tutorials/typography/), 
    /* da Owen Briggs: Sane css typography ed è 76%. 
    /* Questa percentuale empirica dice al browser: metti il font-size al 76% della tua misura di 
    /* default (con un font size del 76% e un carattere medio impostato via browser, il risultato 
    /* è all' incirca pari a 12 pixels). */
}





/* --------------------------------- */
/*      Impostazioni Link            */
/* --------------------------------- */
A:link
{
    color: #333399;
}

A:visited
{
    color:#808080;
}

A:hover
{
    color: #FF0000;
}





/* --------------------------------- */
/*      Impostazioni Div             */
/* --------------------------------- */
#Contenitore
{
    background-color: white;
    margin:0;
    padding:0;
}

#PagTop
{
    background: url(Images/BarraTop.jpg) no-repeat center center;
    background-color : #333399;
    height:80px;
    margin:0;
    padding:0;    
}

#Navigazione
{
    width: 130px;
    margin: 5px 0 0 5px;
    padding:0;
    float: left;
}

#Contenuto
{
    margin: 0;
    padding: 0 30px 20px 170px;
}

#PagPiede
{
    clear: both;
    background-color: #333399;
    color: White;
    padding: 5px 5px 15px 5px;
    margin: 0 0 10px 0;
    text-align: center;
    line-height: 150%;    
}

#News
{
    width: 70%;
    padding: 0 4% 0 4%;
    float: left;
}

#NewsDx
{
    width: 22%;
    padding: 0;
    float: right;
}

.DataNotizia
{
    font-style: italic;
    font-size: 80%;
    color: #A3ABB7;
}

.Info
{
    border-color: #009C00;
    border-style: solid;
    border-width: thin;
    color: #333399;
    text-align: center;
    margin: 6% 0 0 0;
}

#Modulo
{
    width:75%;
    margin: 0 0 0 10%;
    padding:0;
}


#Cda
{
    background:url(Images/Cda.jpg) no-repeat center center;
}

#IsoSx
{
    float:left;
    width: 18%;
    margin: 1%;
}

#IsoCentro
{
    float: left;
    width: 50%;
    padding: 0;
    margin: 0;
}

#IsoDx
{
    float: right;
    width: 18%;
    margin: 1%;
}

#Selezione
{
    background:url(Images/Personale.jpg) no-repeat center center;
  
}

.BandiGara
{
    background:url(Images/Bandi.jpg);
    margin: 2% 5% 2% 5%;
    padding: 2%;
    border: solid 2px #009C00;
}

.ServIntro
{
    font-weight: bold;
    line-height: 140%;
}

#TeleriscaldamentoSx
{
    margin:auto;
    float:left;
    width:60%;
}


#TeleriscaldamentoDx
{
    margin:auto;
    float:right;
    width:40%;
}

#TeleriscaldamentoPiede
{
    margin:auto;
    clear:both;
    width:85%;
}

#TeleriscaldamentoTesto
{
    margin:auto;
    clear:both;
    width:100%;
}

#TeleriscaldamentoTesto p
{
    padding: 0.5% 1% 0.5 1%;
}

#TeleriscaldamentoNews
{
    margin:auto;
    padding:0;
    clear:both;
    width:98%;
    border-bottom:#dedede 1px solid;
    border-top:#dedede 1px solid; 
}

#Servizio
{

}

.Informazione
{
    width:100%;
}


#AcquaDati
{
    clear:both;
    margin: 0 0 0 8%;
}

#ServizioInfo
{
   margin:5% 20% 4% 20%;
   padding:1%;
   border-top:#009C00 1px solid; 
   border-bottom:#009C00 1px solid;
}

#ServizioSx
{
    float:left;
}

.Comunicazione
{
    float:left;
    width:15%;
    margin: 6% 3% 0% 2%;
}



.ModuloRiga
{
    width:100%;
    margin-left:10%;
}




#PiattaformaSx
{
    float:left; 
}

#PiattaformaDx
{
    float:right;     
}


/* --------------------------------- */
/*      Impostazioni Menu            */
/* --------------------------------- */

.DivMenu
{
    margin: 0 0 10px 0;
    padding: 0 0 10px 0;
    background-color: #333399; /* Colore di sfondo del Menu*/
}

.DivImgDx
{
    background: url(Images/BordoDx.gif) no-repeat right top /* Immagine destra*/
}

.MenuTitolo
{
    display: block;
    color: White;
    font-weight:bold;
    text-align: center;
    padding: 5px 0 5px 0;
    background: url(Images/BordoSx.gif) no-repeat left top; /* Immagine sinistra*/
}

.MenuElenco
{
    padding: 0;
    margin: 0;
    border: #333399 1px solid;
    background: white;
    list-style-type: none;
}

.MenuElencoVoce
{
    list-style-type: none;
    display: block;
    border-bottom: #333399 1px solid;

}
.MenuLink
{
    padding: 2px 5px 3px 5px;
    display: block;
    text-align: left;
    width: 115px;        /* La dimensione dovrebbe essere 120px ma con Mozzilla è + largo del menu*/
    line-height:120%;
}

a.MenuLink:active {
    background-color: #009C00;
}

a.MenuLink:hover {
    color: red;
}



/* --------------------------------- */
/*      Immagini                     */
/* --------------------------------- */

IMG
{
    border-style: none;
    padding:0;
    margin:0;
}

.NewsImg
{
    float: left;
    padding: 0 1% 0 0;
}

.NewsImgNoFloat
{
    padding: 0 1% 0 0;
}

.ImgStoria
{
    margin: 2em;
}

.ImgIsoSx
{
    float: left;
}

.ImgIsoDx
{
    float: right;
}

.ImgLetture
{
    margin: 4em 0 4em 0;
}

#ServImg
{
    float:left;
    margin: 0 3% 0 0;
}

.GrattaParcheggia
{
    float:left;
    margin: 0 3% 1.5% 3%;
}

.Lennt
{
    float:left;
    margin: 0 1% 0 0;
}


.ImgLeft
{
    float:left;
    margin: 0 1% 0 0;
}

.ImgLink
{
    margin-bottom:2em;
    margin-top:2em;
}

/* --------------------------------- */
/*      Form                         */
/* --------------------------------- */

.Input1
{
    background-color: #FEE21D;
    width: 30em;
}    

.Input2
{
    background-color: #FEE21D;
    width: 30em;
    height: 18em;
} 

.Input3
{
    background-color: #333399;
    color: #FEE21D;
    width: 30em;
    text-align: center;
} 

.TitoloForm
{
    text-align: center;
    font-weight: bold;
    background-color: #333399;
    color: #FEE21D;
    padding :5px;
    margin: 0;
}





/* --------------------------------- */
/*      Impostazioni Testo           */
/* --------------------------------- */

p
{ 
    margin: 0;
    padding: 0;
}

h1
{
    color: #009C00;
    font-size: 180%;
    text-align: center;
    margin: 0.5em 0 1em 0;
}

h2
{
    color: #009C00;
    font-size: 140%;
    text-align: center;
    font-weight: bold;
    margin: 0;
}

h3
{
    background-color: #333399;
    margin: 2em 0 0 0;
    padding: 0.4%;
    color: White;
    font-size: 120%;
    font-weight: bold;
    width: 99.2%;
}

h4
{
    color: #009C00;
    text-align: center;
    font-size: 120%;
    font-weight: bold;
    margin:2em 0 1em 0;
    clear:both;
}

h5
{
    color: #333399;
    text-align: justify;
    font-size: 100%;
    font-weight: normal;
    line-height: 140%;
}

.NewsDxTitolo
{
    background-color: #009C00;
    text-align: center;
    color: White;
    font-weight: bold;
    line-height: 150%;
    padding: 0.8% 0 0.8% 0;
}


.NewsDxTitoloA
{
}

a.NewsDxTitoloA:visited {
    color: red;
}

.NewsDxTesto
{
    text-align: center;
    color: #333399;
    font-weight: bold;
    line-height: 140%;
    padding: 0.8% 0.2% 0.8% 0.2%;
}

.pCentro
{
    text-align: center;   
}

.FontBold
{
    font-weight: bold;
}

.Blu100CeBold
{
    color: #333399;
    font-size: 100%;
    text-align: center;
    font-weight: bold;
    line-height: 160%;
}

.Rosso100CeBold
{
    color: #FF8080;
    font-size: 100%;
    text-align: center;
    font-weight: bold;
    line-height: 160%;
}

.TitoloTabellaCariche
{
    color: #009C00;
    text-align: left;
    font-weight: bold;
    padding: 3em 0 0 0;
    margin:0;
}

.Blu80Sx
{
    color: #333399;
    font-size: 80%;
    text-align: left;
}

.ServTitolo
{
    color: #009C00;
    text-align: center;
    font-size: 120%;
    font-weight: bold;
    margin: 2% 3% 0.2% 3%;
}

.TitoloTabella
{
    color: #009C00;
    text-align: left;
    font-size: 120%;
    font-weight: bold;
    margin: 2% 3% 2% 3%;
    clear: both;
}

.TitoloTabellaCe
{
    color: #009C00;
    text-align: center;
    font-size: 120%;
    font-weight: bold;
    margin: 2% 3% 2% 3%;
    clear: both;
}

.DatiAcq
{
    margin: 0 0 0 1.8em;
}

.Interlinea150
{
    line-height:150%;
}

.pBold
{
    font-weight:bold;
}

.pCorsivo
{
    font-style:italic;
}

.Didascalia
{
    margin:0;
    padding:0;
    font-style:italic;
    text-align:center;
}

.pAccessoDati
{
   padding: 0 0 0 0;
   color:#333399;
   text-align:justify;
   line-height:140%;
   margin: 0;
}

.pImgCentro
{
    text-align:center;
    margin:1% 0 0 0; 
}

.Verde100CeBold
{
    color:#009C00;
    font-size:100%;
    text-align:center;
    font-weight:bold;
}

.Verde100SxBold
{
    color:#009C00;
    text-align:left;
    font-weight:bold;
    line-height:140%;
    margin: 3% 0% 1% 0%;   
}

.Blu100Gi
{
    text-align:justify;
    line-height:140%;
}

.Blu100Ce
{
    text-align:center;
    line-height:140%;  
}

.Blu100CeLink
{
    text-align:center;
    line-height:140%;
    padding-left:10em;
    padding-right:10em;   
}

.Blu100SxLink
{
    text-align:left;
    line-height:140%;
    padding-left:10em;
    padding-right:10em;   
}

.ServizioInfo
{
    color:#009C00;
    font-size:120%;
    text-align:center;
    font-weight:bold;
}

.Comunicazioni
{
    color:#333399;
    text-align:center;
    font-weight:bold;
}

.Margini1
{
    padding-left:7em;
    padding-right:17em;
    background-color:Red;
}


ul 
{
    padding:0 0 0 3%;
    margin:0.5% 0 0.5% 1%;
    text-indent:0;
    list-style-type:disc;
}

.ElencoSx
{
    padding:0 0 0 3%;
    margin:0.5% 0 0.5% 1%;
    text-indent:0;
    list-style-type:disc;
    text-align:left;
}

.PiscinaAttivita
{
    margin:0.5em 0 2em 5em;
    font-weight:bold;
}

.PiscinaScuolaNuoto
{
    background: url(Images/PiscinaScuolaNuoto.jpg) no-repeat top left;
    padding:0.5em 0 2em 190px;
    margin:0.5em 0 2em 5em;
    text-indent:0;
    list-style-type:disc;    
}

.PiscinaFitness
{
    background: url(Images/PiscinaFitness.jpg) no-repeat top left;
    padding:0.5em 0 2em 190px;
    margin:0.5em 0 2em 5em;
    text-indent:0;
    list-style-type:disc;    
}

.PiscinaBimbi
{
    background: url(Images/PiscinaBimbi.jpg) no-repeat top left;
    padding:0.5em 0 2em 190px;
    margin:0.5em 0 2em 5em;
    text-indent:0;
    list-style-type:disc;    
}

.PiscinaTitolo
{
    color:#009C00;
    font-size:140%;
    text-align:center;
    font-weight:bold;
    margin:2em 0 2em 0
}

.PiscinaSottoTitolo
{
    color: #333399;
    font-size: 140%;
    text-align: center;
    line-height: 160%;
    margin:1em 0 1em 0;
}


li 
{
    line-height:150%;
}


/* --------------------------------- */
/*      Linee                      */
/* --------------------------------- */

.LineaVerde
{
    color: #009C00;   
}


/* --------------------------------- */
/*      Tabelle                      */
/* --------------------------------- */

.Tabella1
{
    width: 80%;  
    border-collapse: collapse;
    margin: auto;     
}

.Tabella1Titolo
{
    color: #333399;
    border-bottom: #333399 1px solid;
    padding: 0 0 1em 0
}

.Tabella1TdSx
{
    width: 40%;
    border-right: #dedede 1px solid;
    border-bottom: #dedede 1px solid;
    padding: 0.7%;
    text-align:left;
}

.Tabella1TdDx
{
    width: 40%;
    border-bottom: #dedede 1px solid;
    padding: 0.7%;
    text-align:left;
}

.Tabella3
{
    border-collapse: collapse;
    margin: auto;
    margin-top: 3em; 
    margin-bottom: 2em;
}

.Tabella3Titolo
{
    color: #009C00;
    font-size: 100%;
    text-align: center;
    font-weight: bold;
    padding: 0 0 2em 0;
}

.Tabella3Td
{
    padding: 0 0 0 2%;
    text-align: left;
}

.Tabella4
{
    margin: auto;
    margin-top: 5em;
    margin-bottom: 3em;
    border: solid 2px #009C00;
    width: 60%
}

.Tabella4Td
{
    padding: 1em;
    text-align: center;
    border: solid 2px #009C00;
    width: 20%;
}

.Tabella5
{
    margin: auto;
    margin-top: 5em;
}

.TblContatti
{
    background: url(Images/Contatti.jpg) no-repeat top right;
    width: 80%;  
    border-collapse: collapse;
    margin: auto;
    margin-top: 4%;
    margin-bottom: 5%; 
}

.TitoloTblContatti
{
    color: #009C00;
    border-bottom: #333399 1px solid;
    padding: 0 0 3px 0
}

.TblContattiTd
{
    width: 40%;
    border-bottom: #dedede 1px solid;
    padding: 0.7%;
}


.TblDati
{
    border-collapse: collapse;
    margin: auto;
    margin-top: 4%;
    margin-bottom: 5%;
}

.TitoloTblDati
{
    background-color:#EFE9E9;
    color: #009C00;
    border: #333399 1px solid;
    text-align:center;
    padding: 0.3%;
}

.TblDatiTd
{
    border: #333399 1px solid;
    text-align:center;
    padding: 0.3%;
}



.Tabella2
{ 
    border-collapse:collapse;
    margin:auto; 
    width:98%;
}

.Tabella2TdSxTitolo
{
    width:40%;
    color:#333399;
    border:#333399 1px solid;
    padding:0 0 3px 0;
}

.Tabella2TdDxTitolo
{
    width:10%;
    color:#333399;
    border:#333399 1px solid;
    padding:0 0 3px 0;
    text-align:center;
    background-color:#DED8D8;
}

.Tabella2TdSx
{
    width:40%;
    border:#333399 1px solid;
    padding:0.7%;
    background-color:#DED8D8;
}

.Tabella2TdDx
{
    width:10%;
    border:#333399 1px solid;
    padding:0.7%;
    text-align:right;
}

.TabellaGruppoAsm
{
    width: 80%;  
    border-collapse: collapse;
    margin: auto;     
}

.TabellaGruppoAsmTitolo
{
    border: #dedede 1px solid;
    padding: 0.7%;
    text-align:center;
    font-weight:bold;
}

.TabellaGruppoAsmTitoloTd
{
    width: 33.33%;
    border-right: #dedede 1px solid;
    border-left: #dedede 1px solid;
    padding: 1em;
    text-align:center;
    font-weight:bold;
}

.TabellaGruppoAsmTd1
{
    width: 33.33%;
    border-right: #dedede 1px solid;
    border-left: #dedede 1px solid;
    text-align:center;
    font-weight:bold;
    background: url(Images/SfTbl2.jpg) no-repeat center center;
}

.TabellaGruppoAsmTd2
{
    width: 33.33%;
    height: 120px;
    border-right: #dedede 1px solid;
    border-left: #dedede 1px solid;
    text-align:center;
    font-weight:bold;
    background: url(Images/SfTbl1.jpg) no-repeat center center;
}

.TabellaGruppoAsmTd3
{
    width: 33.33%;
    border-right: #dedede 1px solid;
    border-left: #dedede 1px solid;
    text-align:center;
    font-weight:bold;
    background: url(Images/SfTbl3.jpg) no-repeat center center;
}

.TabellaGruppoAsmTd4
{
    width: 33.33%;
    border-right: #dedede 1px solid;
    border-left: #dedede 1px solid;
}

.TabellaGruppoAsmTdRiga
{
    background: url(Images/Dot.jpg) repeat-y center center;
    height:30px;
    border-right: #dedede 1px solid;
    border-left: #dedede 1px solid;      
}


.TabellaPartecipateAsmTd
{

    height:30px;
    border: #dedede 1px solid;
    text-align:left;   
}

.TabellaPartecipateAsmTdTitolo
{
    font-weight:bold;
    height:30px;
    border: #dedede 1px solid;   
}

.TabellaPartecipateAsmTdCentro
{

    height:30px;
    border: #dedede 1px solid; 
    text-align:center;
}



/* --------------------------------- */
/*      Albo Fornitore               */
/* --------------------------------- */

.AlboNuovo 
{
    float:left;
    border: solid 2px #009C00;
    padding:70px 20px 20px 20px;
}

.AlboModifica 
{
    float:right;
    border: solid 2px #009C00;
    width:40%;
    padding:20px;
}

.pAlboTitoloSezione
{
    background-color: #333399;
    color: White;
    font-weight:bold;
    padding: 5px;
    margin: 30px 0 15px 0;
    text-align: center; 
}

.AlboTbl1
{ 
    border-collapse:collapse;
    margin:auto; 
    width:98%;
}

.AlboTblTd
{
    padding: 1em;
    text-align: center;
    border: solid 2px #009C00;
}

.AlboTblTdRx
{
    padding: 0.2em;
    text-align: right;
}

.AlboTblTdSx
{
    padding: 0.2em;
    text-align: left;
}


.AlboCategoria1
{
    color:#009C00;
    background-color:#909090;
    padding:0.2em 0 0.5em 0.2em;
    font-size:1.5em;
    font-weight:bold;
}

.AlboCategoria2
{
    color:#009C00;
    font-weight:bold;
    background-color:#B4B4B4;
    padding:0.5em 0 0.5em 0.2em;
    margin: 0.8em 0 0.2em 0;
}

.AlboCategoria3
{
    color:#009C00;
    font-weight:bold;
    background-color:#EFEFEF;
    padding:0.5em 0 0.5em 0.2em;
    margin: 0.8em 0 0.2em 0;
}

.AlboDivCategoria1
{
    background-color:#ECE6E6 ;
    margin: 3em 0 0 0;
    border: solid 2px #009C00;
      
}


.AlboFornitoreGestione
{
    width:70%;
    margin: auto;
}


.TblAlboFornitore
{
    border-collapse: collapse;
    margin: auto;
    margin-top: 4%;
    margin-bottom: 5%;
    margin: auto;
}

.TitoloTblAlboFornitore
{
    background-color:#EFE9E9;
    color: #009C00;
    border: #333399 1px solid;
    text-align:center;
    padding: 0.3%;
    font-size: 1.4em;
}

.TblDatiAlboFornitoreTd
{
    border: #333399 1px solid;
    text-align:left;
    padding: 0.3%;
}




#GridView1
{
    margin: auto;
}


#CodiceEtico
{
    background: url(Images/CodiceEtico.jpg) no-repeat center center;
    margin-top:2.5%;
    padding:5%;
    text-align:center;
    font-size:1.5em;
}


.TdEle
{
    padding-left: 30px;
    padding-right: 30px;
    padding-bottom: 20px;
    text-align: left;
}
.Sottotitolo
{
    font-style:italic
}



/*

^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
Annotazioni: Problemi Compatibilità
^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^

- Margini percentuale

Css:

body 
{
    margin:0;
}

#Sx
{
    background-color: red;

    margin: 0 0 0 3%;
    Su Ie con questa impostazione i 2 div superano il 100% della pagina e non restano allineati
    Se il 3% di margine lo imposto a destra invece che a sinistra i due div restano allineati
    Mozzilla invece interpreta correttamente

    margin: 0 3% 0 0;
    width: 37%;
    float: left;
}

#Dx
{
    background-color:gray;
    width: 60%;
    float: right;
}

html:

<body>

    <div id="Contenitore">

        <div id="Sx">
            Navigazione
        </div>
        
        <div id="Dx">
            Contenuto
        </div>

    </div>

</body>



^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
Statistiche
^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^

Statistica sulle risoluzioni utilizzate http://www.w3schools.com/browsers/browsers_display.asp

                Higher  1024x768    800x600     640x480     Unknown 
January 2007    26%     54%         14%         0%          6%        
January 2006    17%     57%         20%         0%          6%      
January 2005    12%     53%         30%         0%          5%    
January 2004    10%     47%         37%         1%          5%  
January 2003    6%      40%         47%         2%          5% 



Statistica sui browser utilizzati http://www.w3schools.com/browsers/browsers_stats.asp

		        IE7	    IE6	    IE5	    Fx	    Moz
January	2007	13.3%	42.3%	3.0%	31.0%	1.5%
January	2006	0.2%	60.3%	5.5%	25.0%	3.1%
January	2005	        64.8%	9.7%	16.6%	3.4%
January	2004		    68.9%	15.8%		    5.5%
January	2003		    55.3%	29.3%		    4.0%



Statistica su javascript http://www.w3schools.com/browsers/browsers_stats.asp

		        JavaScript On	JavaScript Off
January	2007	94%	            6%
January	2006	90%	            10%
January	2005	89%	            11%
January	2004	92%	            8%
January	2003	89%	            11%



Statistica sui sistemi operativi http://www.w3schools.com/browsers/browsers_stats.asp

		        WinXP	W2000	Win98	Vista	W2003	Linux	Mac
January	2007	76.1%	7.7%	1.0%	0.6%	1.9%	3.6%	3.8%
January	2006	72.3%	13.1%	2.4%	0.3%	1.7%	3.3%	3.5%
January	2005	61.3%	21.6%	5.3%	1.0%	1.2%	3.2%	2.8%
January	2004	44.1%	33.6%	10.4%	3.0%		    2.7%	2.4%



^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
Obbligo di inserimento Partita IVA su Home Page. 
^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^

Chi è in possesso di Partita IVA ha l'obbligo di esporla sulla Home Page del sito web aziendale 
in base al DPR 633/72 Dicembre 2001 Articolo 35 - comma 1
La mancata esposizione del numero di Partita IVA è perseguibile con una sanzione amministrativa 
variabile da 258,23 a 2.065,83 euro, trattandosi di violazione agli obblighi di comunicazione 
prescritti da legge tributaria. 



^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
Accessibilità: Legge 4 del 9 gennaio 2004 "Legge Stanca"
^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^

Si applica alle pubbliche amministrazioni, agli enti pubblici economici, alle aziende private 
concessionarie di servizi pubblici, alle aziende municipalizzate regionali, agli enti di 
assistenza e di riabilitazione pubblici, alle aziende di trasporto e di telecomunicazione a 
prevalente partecipazione di capitale pubblico e alle aziende appaltatrici di servizi informatici.



^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
Unità di Misura
^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^

I margin e i padding verticali sono espressi in em o in % in modo da rendere uniforme il comportamento di 
Ie e di Mozzilla: variando le dimensioni variano proporzionalmente alla dimensione del carattere.
Esprimendo invece i valori in pixel Mozzilla li fa variare proporzionalmente alla dimensione del carattere
Ie li mantiene fissi.
Il valore orizzontale è preferibile esprimerlo in % in modo da avere valore proporzionale alla larghezza 
del contenitore ad esempio con padding sinistro e destro del 3% si può impostare la with a 94%, mettendo 
un valore in em la proporzionalità è rispetto al carattere.

La larghezza è espressa in % in modo da avere un valore proporzionale alla larghezza del contenitore ad 
esempio un div con larghezza 100% occuperà tutta la pagina esprimendo i valori in em la proporzionalità è 
rispetto al carattere e quindi non è proporzionale alla larghezza della pagina.
La lunghezza è espressa in em in quanto il valore espresso in % non viene considerato.



^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
Lista di controllo Accessibilità:
^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^

- Attributo TITLE nei tag A per una descrizione del collegamento



^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
Lista di controllo Motori di Ricerca:
^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^

- Inserire il metatag DESCRIPTION per fornire una descrizione del sito, alcuni motori di ricerca la 
    visualizzano nei risultati
    <meta name="description" content="DESCRIZIONE DEL CONTENUTO DEL SITO" /> 

- Inserire il metatag KEYWORDS contenente le parole chiave da suggerire al motore di ricerca
    <meta name="keywords" content="ELENCO PAROLE CHIAVE SEPARATE DA VIRGOLA E SPAZIO" />

- Inserire le chiavi di ricerca nel titolo della pagina

- Inserire le chiavi di ricerca nel nome e nel tag Alt delle immagini.



^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
Lista di controllo xhtml:
^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^

- Deve essere indicato il DOCTYPE cioè le specifiche seguite nella scrittura del documento
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">

- Deve essere indicato il set di caratteri utilizzato
    <meta http-equiv="Content-Type" content="text/html;  charset=ISO-8859-1" />



^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^

DOCTYPE "Document Type Declaration"

Informa i browser e i validatori su quale versione di (X)HTML si sta usando, gli standard vengono 
definiti dal W3C

I documenti SGML (Standard Generalized Markup Language) devono conformarsi ad una DTD. 
Il consorzio per gli standard del web, W3C, ha esplicitamente definito l'HTML - a partire dalla versione 
3.2 - come un'applicazione SGML che, pertanto, deve aderire agli standard internazionali ISO 8879.

La DTD (Document Type Definition) di un documento (X)HTML definisce i marcatori (tag) e la sintassi 
utilizzata per creare il documento stesso.

Una pagina (X)HTML valida deve dunque contenere il <!DOCTYPE> che ne dichiara la versione ed la 
relativa DTD cui è conforme.

Esempio <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

La prima parte, o TopElement, definisce il tipo di documento SGML dichiarato, ovvero HTML.

Il secondo elemento, Availability, specifica se il FPI (Formal Public Identifier) è un oggetto 
pubblicamente disponibile PUBLIC, oppure SYSTEM nel caso di una risorsa di sistema come un file 
locale o un URL.

La Registration indica se l'organizzazione che ha definito il <!DOCTYPE> è registrata all'ISO. 
I valori che la Registration può assumere sono + nel caso di registrazione o - quando il nome 
dell'organizzazione non è registrato all'ISO.
Il W3C (World Wide Web Consortium) e la IETF (Internet Engineering Task Force), ad esempio, non sono 
organizzazioni registrate all'ISO.

La Organization indica l'organizzazione che ha creato e mantiene il DTD cui si riferisce la <!DOCTYPE> 
declaration (in questo caso il W3C).

Il Type specifica il tipo di oggetto cui si riferisce il <!DOCTYPE>, ovvero un DTD

La Label si riferisce al nome del testo referenziato dal DTD e ne può contenere anche la versione 
(nell'esempio XHTML 1.1).

La Definition indica la definizione del tipo di documento. Nell'HTML 4.0 e 4.01, nonché nell'XHTML 1.0 
esso può assumere tre valori: Strict, Transitional e Frameset:

Strict esclude gli elementi di presentazione per tag ed attributi che vengono affidati ai CSS 
Transitional comprende tag ed attributi "deprecati" a carattere presentazionale 
Frameset viene utilizzato quando una pagina viene suddivisa in frames, al posto dell'elemento body 
si trova l'elemento frameset, ma per il resto è identica alla Definition Transitional 

Language specifica la lingua utilizzata (nel caso dell'(X)HTML l'inglese, EN) che viene espressa con 
una sigla di due lettere maiuscole.

Infine l'URI specifica dove si trova l'oggetto (DTD) in questione. 
In questo caso http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd

^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^



^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^

L’elemento <html>

L’elemento <html> è la radice di tutti gli altri elementi; non ci devono quindi essere elementi al di 
fuori di esso. 
In XML, l’elemento radice <html> viene dichiarato con almeno questi attributi:
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="it" lang="it">
xmlns indica il namespace, cioè l’elenco di elementi ed attributi definiti nella DTD e in XHTML va 
indicato esplicitamente.
xml:lang e lang sono due metodi per identificare la lingua in cui è scritto il documento, da usare 
entrambi per compatibilità. L’informazione sulla lingua è importante per l’accessibilità; inoltre, si 
può utilizzare per gestire al meglio siti multilingua.
Il tag <html> deve contenere una <head> e un <body>.

^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^



^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^

Tipi di layout

I layout delle pagine web si suddividono sostanzialmente in tre categorie:
layout fisso, layout fluido (o liquido) e layout elastico.

Un layout fisso è generalmente studiato per una dimensione standard e pertanto non è possibile variare la 
larghezza ridimensionando la finestra del browser o cambiando la dimensione del testo.
La larghezza dei vari componenti che compongono la pagina è specificata solitamente in unità di misura 
assoluta generalmente espressa in pixel (.px).
Vi sono tre principali larghezze utilizzate per questo tipo di layout: 600px 760px e 960px che tengono conto 
rispettivamente delle più diffuse risoluzioni del monitor: 640x480 pixel - 800x600 pixels - 1024x768 pixels.
Il layout fisso è senza dubbio più facile da realizzare e offre maggiori possibilità di personalizzazione 
grafica rispetto al layout liquido.
È importante considerare che un buon layout fisso deve essere progettato per servire bene la maggior parte 
degli utenti, soprattutto senza scrolling orizzontale.

Una pagina web caratterizzata da un layout fluido è una pagina web che occupa sempre tutto lo spazio 
disponibile della finestra del browser qualunque sia la risoluzione del monitor.
La larghezza dei vari componenti che compongono la pagina è specificata solitamente in percentuale (%).
Ridimensionando la finestra del browser anche la pagina web verrà ridimensionata. Il disegno della pagina 
web non è però influenzato dai cambiameti del formato testo.
Il layout fluido è più versatile per l'utente poichè si presta ad uno spettro più ampio di risoluzioni.
La sua realizzazione può risultare un po' più complessa rispetto al layout fisso, per le limitate 
possibilità grafiche soprattutto in casi di layout liquidi con colonne percentuali.
Questo tipo di layout consente una gestione migliore in fase di stampa della pagina web a differenza delle 
pagine con layout fissi che sovente hanno come risultato il taglio dei contenuti su uno o entrambi i lati.

Il layout elastico usa il dimensionamento in unità relative (.em) sia per il testo che per la larghezza 
degli elementi che compongono la pagina web.
Si differenzia dal fluido in quanto non si adatta solo alla risoluzione del monitor ma ridimensiona anche 
tutti i contenuti secondo le preferenze dell'utente cosicchè solo ridimensionando il carattere del browser 
è possibile agire sulla larghezza della pagina.

Vi è poi anche il layout ibrido che è una miscela di due (o di tre) dei layout citati sopra. 
Un esempio potrebbe essere il caso in cui la larghezza della pagina web è di tipo fluido (espressa in %) 
mentre la colonna che contiene il menu di navigazione è di tipo elastico e quindi con dimensioni espresse 
in em.

^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^

*/