/* 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:1px solid #333;
/* Impostiamo un leggero margine interno */
padding:7px;
/* 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: 350px;
height: 350px;*/
/* 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: -333px;
margin-top: -230px;
text-align:center;
/* Impostiamo un'ombra con CSS3 */
-webkit-box-shadow: 0px 0px 10px #525252;
-moz-box-shadow: 0px 0px 10px #525252;
}
#chiudi{
	position:absolute;
	cursor:pointer;
	margin: -30px 0px 0px 650px;
}