﻿/* ------------------------------------------------------ */
/* --- GESTIONE MENU e VOCI MENU ------------------------ */
/* --- VA ABBINATO A Menu.js ---------------------------- */
/* ------------------------------------------------------ */

#Div-Menu
{
	position:fixed;
	width:90px;
	height:60px;
	top:10px;
	left:20px;				
	
	z-index:91;
	
	cursor:pointer;
	
	background-image:url('../Images/Menu.png'); 
	
	/*
	transition-property: height; /*standard* /
	transition-duration: 1s;
	 
	-webkit-transition-property: height;/*Safari e Chrome * /
	-webkit-transition-duration: 1s;  
	         
	-o-transition-property: height;      /*Opera* /
	-o-transition-duration: 1s; 
	  
	-moz-transition-property: height;    /*Firefox* /
	-moz-transition-duration: 1s;*/  
}
/*#Div-Menu:hover{
	height:300px;
}*/
	




.sez-menu
{
	display:none;
	position:fixed;

	z-index:98;
	
	top:1px;
	left:1px;
	bottom:1px;
	
	
	/* Giustifica verticalmente (parte dall'alto) tutti gli elementi inseriti all'interno che sono flex */
	-webkit-align-items: flex-start;
			align-items: flex-start;
			
	/* Giustifica orizzontalmente (Centra) tutti gli elementi inseriti all'interno di sezione che sono flex */
	-webkit-justify-content: left;
			justify-content: left;	

	/* Dispone verticalmente gli elementi flex contenuti*/ 						
	-webkit-flex-direction: column;
			flex-direction: column; 											
			
	width:25%;	
	max-width:460px;	
	
	padding:20px;
	
	opacity: 80%;
	background-color:#111;
	border-right:solid 2px #888;
	
	
	
	font-family: Verdana, Helvetica, Arial;
	font-size: 20px;
	color:#FFF;
	text-decoration:none;

	
}


		.VociMenu
		{
			width:100%;
			margin:1px 0 1px 0;
			padding-top:6px;				
			padding-bottom:6px;
			
			-webkit-box-sizing: border-box;
			-moz-box-sizing: border-box;
			box-sizing: border-box; 
						
										
			font-family: Verdana, Helvetica, Arial;
			font-size: 20px;
			text-decoration:none;							
			
			color:#FFF;
			-webkit-transition: 0.6s;
			-moz-transition: 0.6s;
			-o-transition: 0.6s;
			transition: 0.6s;								
							
		}		
		.VociMenu:hover 
		{
			/* escursione del box verso l'alto */
			/* top:-180px; */
			color:#d50707;
		}	







		Menu-link:link, a:visited{
			font-family: Verdana, Helvetica, Arial;
			font-size: 13px;
			color:#FFF;
			text-decoration:none;
		}		
		Menu-link:hover{
			font-family: Verdana, Helvetica, Arial;
			font-size: 13px;
			color:green;
			text-decoration:none;
		}	





/* -------------------------------------------------------------------------------------------------------------------------------- */
/* ---------- gestione versione MOBILE sotto i 980px ----------------------------------------------------------------------------- */
/* -------------------------------------------------------------------------------------------------------------------------------- */
@media screen and (max-width: 980px) 
{





/*#Div-Menu
{
	position:fixed;
	width:100%;
	height:40px;
	top:0px;
	

	background-image:url('../Images/MenuMobile.png');
	background-repeat:no-repeat;
	background-position:center top;
		
}
*/




.sez-menu
{
	width:50%;	
	max-width:600px;	
}