/* Alcune righe di codice di convenzione */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em,  
font, img, ins, kbd, q, s, samp, small, strike, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody,  
tfoot, thead, tr, th, td {  
border:0pt none;  
font-family:inherit;  
font-size:100%;  
font-style:inherit;  
font-weight:inherit;  
margin:0pt;  
padding:0pt;  
vertical-align:baseline;  
}  
/* Ci servirà per oscurare la pagina */
#nero{
/* Imposto il colore nero */
background-color:#000000;
/* Imposto come puntatore la manina */
cursor:pointer;
/* Imposto i valori di altezza e larghezza a 100% */
height:100%;
width:100%;
/* Ci servirà in modo tale che non ci siano margini */
left:0;
top:0;
/* Impostiamo come posizione la fissa */
position:fixed;
/* Aggiungiamo i codice per opacizzare lo sfondo. */
opacity: 0.65;
-moz-opacity: 0.65;
filter:alpha(opacity=65);
/* E' utile nel caso in cui ci siano altri oggetti in posizione assoluta o fissa */
z-index:1000;
/* Lo rendiamo non visibile */
display:none;
}

/* Questo sarà il nostro popup */
.messaggio{
/* Impostiamo il bianco come colore di sfondo e creiamo un piccolo bordo */
background-color:#FFFFFF;
border:3px solid #AAAAAA;
/* Impostiamo un leggero margine interno */
padding:5px;
/* Impostiamo la posizione come fissa. Ci servirà in modo tale che il popup segua lo scrolling della pagina */
position:fixed;
/* Impostiamo lo z-index come 1001. Lo z-index è una sorta di gestore di livelli. Chi avrà il numero maggiore si troverà davanti a chi ha numero minore. Facile no? */
z-index:1001;
/* Rendiamo il popup non visibile */
display: none;
/* Impostiamo la grandezza del box. Ci servirà in quanto così possiamo facilmente impostare il box centrato nella pagina */
width: 567px;
height: 284px; 
/* Impostiamo i valori di top e left a 50% */
left: 50%;
top: 50%;
/* Il margin left e top dovrà essere pari alla metà delle dimensioni del box. Ci servirà per centrare il box */
margin-left: -300px;
margin-top: -200px;
text-align:center;
/* Impostiamo un'ombra con CSS3 */
-webkit-box-shadow: 0px 0px 10px #525252;
-moz-box-shadow: 0px 0px 10px #525252;
}
#chiudi{
cursor:pointer;
position:absolute;
right:0;
top:0;
width:34px;
}