/*****************************************************************
						TESTO CON OMBRA 
*****************************************************************/


/*******************************************************************/
/********* 	 DIV  a CONTENITORI 	-	 si posiziona precisamente 
*******************************************************************
 ******		CODICE DA COPIARE PER FARE L'OMBRA		****

			<div class="div_riferimento_ombra">					
					<table align="center" border="0" width="100%" height="100%">
							<tr height="<?php echo $altezza_pulsante;?>" >
								<td class="menu_DX" align="left">
								
									<div class="contenitore_ombra"> TESTO TESTO TESTO </p>
											 <p class="Ombra"> TESTO TESTO TESTO</p>		
									</div>	
												 					 
								</td>													
							</tr>
					</table>	
			</div>
*******************************************************************/


.div_riferimento_ombra{ /* disegna il div che funzionerà come riferimento*/
border: 0px solid yellow;
width:100%; height: 100%; }

.contenitore_ombra{ /* si posiziona in base al div di riferimento*/
position:relative; /*relativo al div di riferimento*/
border: 0px solid red; /*bordo :larghezza- stile- colore*/
height: 30px }

.Testo {
	color: #000066; /*il colore del testo BLU */
	font: Bold 18px Arial;/*font stile - dimensione - carattere*/
	position:absolute;
	margin-left:10px;
	margin-top:0px;
	z-index: 2;  /*posizionamento livello div (Sopra il livello OMBRA che ha valore = 1 */
} 
.Ombra {
	color: #999999; /*il colore dell 0mbra GRIGIO CHIARA */
	font-family: Arial;
	font-size: 17px;
	font-weight: Bold;
	position:absolute;
	margin-left:12px;
	margin-top:5px;
	z-index: 1; /*posizionamento livello div (Sopra il livello TESTO che ha valore = 2 */
} 

.Testo_Bianco {
	color: #FFFFFF;/*font stile - dimensione - carattere*/
	position:absolute;
	margin-left:10px;
	margin-top:3px;
	z-index: 2;  /*posizionamento livello div (Sopra il livello OMBRA che ha valore = 1 */
	font-family: Arial;
	font-size: 17px;
	font-weight: Bold;
	text-decoration:none
} 

.Testo_GRANDE {
	color: #000066; /*il colore del testo BLU */
	font: Bold 22px Arial;/*font stile - dimensione - carattere*/
	position:absolute;
	margin-left:10px;
	margin-top:0px;
	z-index: 2;  /*posizionamento livello div (Sopra il livello OMBRA che ha valore = 1 */
} 
.Ombra_GRANDE{
	color: #CCCCCC; /*il colore dell 0mbra GRIGIO CHIARA */
	font: Bold 22px Arial;
	position:absolute;
	margin-left:12px;
	margin-top:2px;
	z-index: 1; /*posizionamento livello div (Sopra il livello TESTO che ha valore = 2 */
} 
/*******************************************************************/
/********* 			 SENZA DIV 		-	 ruba spazio in verticale
buono per pagine che hanno sfondo bianco e spazio dalla scritta
<h1 class="Testo_da_Ombreggiare"> <span> Login 	</span> Login </h1>
*******************************************************************/
.Testo_da_Ombreggiare{
/*la misura dei caratteri*/
font-size:20px;
/*il colore del ombreggiatura del testo*/
color:#CCCCCC;
/*necessario per poi posizionare l’elemento span in modo assoluto*/
position:relative;
/*distanza dal margine sinistro*/
margin-left:10px;
}

.Testo_da_Ombreggiare span{
/*il colore del testo*/
color:#000066;
/*trasformazione da elemento di riga a elemento di blocco*/
display:block;
/*posizione assoluta in rapporto a l’elemento genitore*/
position:absolute;
/*spostamento di 2 px verso l’alto*/
top:-2px;
/*spostamento di 2 px verso la sinistra*/
left:-2px;
} 

/*****************************************************************
						FINE TESTO con OMBRA 
*****************************************************************/


/*************		OMBRA su IMMAGINI (EIT)	 	**************/
/* codice da mettere nella pagina
<div class="pic">
    <img src="sea_small.jpg" alt="Mar Nero" title="Mar Nero">
</div> 

    background: url(inc/Catalogo/img/shadow.png) no-repeat bottom center;

*/

/**********************
OMBRA IMMAGINI PICCOLE
************************/

#pic {
	display: inline-block;
	border: 1px solid;
	border-color: #CCC #CCC #AAA #CCC;
	padding: 5px;
	background: #f6f6f6;
	color:#CCC;
}

#pic:hover {
	border:1px solid #777;
}

div.pic {
margin:0;
padding:0;
float:left;
margin: 20px;
background: url(Catalogo/img/shadow.png) no-repeat bottom center;
padding:0 0 6px 0; /* il terzo parametro definisce la distanza dal bordo basso della IMG
					( direttamente proporzionale alle dimenzioni dell'IMG) */
}



/**********************
OMBRA IMMAGINI GRANDI
************************/

/*
div.pic img {
display: block;
border: 1px solid;
border-color: #CCC #CCC #AAA #CCC;
padding: 5px;
background: #f6f6f6;
}
*/

/* Cornice */
.div_ombra {
	display: inline-block;
	background: #f6f6f6;
	border: 1px solid;
	border-color: #CCC #AAA #AAA #CCC;
	padding: 5px;
	margin: 0 20px 20px 20px;
	/*margin:20px;*/
}

.div_border {
	border: 1px solid #777;
}

.left {
	float:left;
}

.right {
	float:right;
}
/* Fine Cornice */

#pic_big {
	display: inline-block;
	border: 1px solid;
	border-color: #CCC #CCC #AAA #CCC;
	padding: 5px;
	background: #f6f6f6;
	color:#CCC;
}

#pic_big:hover {
	border:1px solid #777;
}

div.pic_big {
	float:right;
	margin: 20px;
	padding:0 0 15px 0;
	background: url(Catalogo/img/shadow_big.png) no-repeat bottom center;
}


/*
div.pic_big img {
display: block;
border: 1px solid;
border-color: #CCC #CCC #AAA #CCC;
padding: 5px;
background: #f6f6f6;
} 
*/