/* CSS per menu javascript free */

/* -----correzione per j-D------ */
.navbar-nav{
	margin: 0 !important;
	padding: 0 !important;
/*
	overflow-x: hidden;
	overflow-y: visible;
*/
}
/* Screen reader only */
.sr-only {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0,0,0,0);
	border: 0;
}
/* stile del TOGGLE */
#main-menu-toggle {
	position: fixed;
	color: #1accb9;
	background-color: #333;
/* 	background-image: linear-gradient(white 1%, #1accb9 10%, #333 30%); /* Standard syntax (must be last) */ */
	border-radius: 1em;
	z-index: 87654321;
	bottom: 0;
	right: 0;
	height: 5em;
	text-align: center;
	padding: 1em 2.2em;
	opacity: 0.95;
}
.icon-bar{
	display: block;
	width: 31px;
	height: 3px;
	background-color: #1accb9 !important;
	margin: 4px 0 2px 0px;
}
.menu-toggle:hover,
.menu-toggle:focus {
  	background-color: transparent;
}
/*  il toggle X che chiude */
.main-menu .menu-close {
	position: fixed;
	color: white;
	border: 0px;
	bottom: 0;
	right: 0.4em;
	padding: 0 0.4em;
	font-size: 36px;
	text-decoration: none !important;
	margin-bottom: 15px;
	text-align: right;
	z-index: 1234567890;
}
.main-menu .menu-close:hover{
	 background-color: transparent;
}

/* MENU e posizione di partenza */
.main-menu {
	position: relative;
	transform: translatey(-120%);
	left: 0%;
	top: 0;
	margin-top: 0;
	padding: 2em;
	width: 100%;
	height: 100%;
	overflow-y: scroll;
	overflow-x: hidden;
	z-index: 123456789;
	background: #333;
	background-image: linear-gradient( #333 60%,  #1accb9 95%, white 100%);	
	opacity: 0.8;
	text-align: center;
/* 	font-family: 'Nokia_Pure_Headline_Light' !important; */

/* 	animation: top 0.3s ease; */
	transition: all ease 1.2s;
	transition-delay: 0.33s;
}
.main-menu ul {
	list-style: none;
	margin: 0;
	padding: 0em;
	margin-top: 3.5em;
/* 	min-height: 100%; */
}
/*
.main-menu li{
	margin-bottom: 1em;
}
*/
/*  le voci di menu */
.main-menu a {
	display: block;
	padding: 8px 0px 10px;
	font-size: 2.2em;
	color: white;
	transform: translateY(0);
}
/*
.main-menu a.secondario{
	font-size: 16px;
	line-height: 2px;
}
*/
.main-menu a:hover,
.main-menu a:focus {
	background: #1accb9;
	color: white;
}

/* Il menu quando è FUORI */
.main-menu:target, .main-menu[aria-expanded="true"] {
	width: 100%;
	transform: translateX(0%);
	outline: none;
	opacity: 0.92;
}

/* lo sfondo grigio */
.main-menu:target + .backdrop,
.main-menu[aria-expanded="true"] + .backdrop {
  position: absolute;
  display: block;  
  content: "";
  right: 0;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: 1998;
  cursor: default;
}
/* ----------barra traduzioni temp---------- */
#traduzione{
	position: relative;
	background-color: transparent;
	color: white;
	margin-top: 1em;
}
a.glink {
	text-decoration: none;
	display: inline-block !important;
	margin-right: 18px;
	padding: 0em;
}


@supports (position: fixed) {
  .main-menu,
  .main-menu:target + .backdrop,
  .main-menu[aria-expanded="true"] + .backdrop {
    position: fixed;
  }
}
/* Sotto 350 px mediaquery derivazione apple*/
@media only screen and (max-width: 450px){
	.main-menu ul {
		margin-top: 5.5em;
	}
}
/*
 Larger screen styling
 Horizontal menu
*/
@media (min-width: 768px) {
	.menu-toggle,
	.main-menu .menu-close {
		display: none !important;
	}
	/* il menu desktop, apero e chiuso è uguale */
	.main-menu , .main-menu:target, .main-menu[aria-expanded="true"] {
		position: relative;
		right: 0px;
		height: auto;
		opacity: 1;
		background-color: transparent;
		background-image: none;
		overflow-y: visible;
		transform: translateX(0%);
		width: 620px;
		float: right;
	}
	.main-menu ul {
		display: block;
		padding: 0;
		height: auto;
		width: 100%;
		background-color: transparent !important;
		margin-top: 11px	
	}
	.main-menu li{
/* 		text-align: right; */
		display: inline-block;
/* 		float: right; */
	}
	.main-menu a {
		color: white;
		border: 0 !important;
		display: inline-block;
		padding: 5px 8px;
		font-size: 20px;
		transition: all 0.3s ease;
		
		border-radius: 3px;
	}
	.main-menu a:hover,
	.main-menu a:focus {
/* 		transform: translateX(-10px); */
	}
	.main-menu li a.secondario{
		display: none;
	}
	.main-menu li a.highlighted{
		border: 2px solid aqua !important;
	}	
	.main-menu li a.highlighted:hover{
		background-color: inherit !important;
		transform: translateY(-5px);
		pointer-events: auto;
	}	
	.main-menu li a.highlighted{
		animation-name: dondola;
		animation-duration: 0.8s;
		animation-delay: 5s;
		animation-iteration-count: 2;
	}	
	@keyframes dondola {
		0%   {transform: translateY(0px);}
		40%  {transform: translateY(-5px);}
		75%   {transform: translateY(0px);}
		100%   {transform: translateY(0px);}
	}

	/* ----------barra traduzioni temp---------- */
	#traduzione{
		position: relative;
		background-color: transparent;
		color: white;
		margin-top: 1em;
	}
	#selezionalingua{
		position: relative;
		transform: translateX(3.5em);
		margin-top: 6px;
	}
	#selezionalingua a{
		color: white !important;
		text-transform: uppercase;
	}
	#selezionalingua h4{
		font-size: 10px;
		text-align: left;
	}
	a.glink span{
		margin-right: 0;
	}
	a.glink {
		margin-right: 10px;
		padding: 0px 7px 2px 7px !important;
		text-align: center;
	}
}
/* ------------Query speciale per webcat----------- */
@media screen and (min-color-index:0) and(-webkit-min-device-pixel-ratio:0) { 
    @media {
		/* stile del TOGGLE */
		#main-menu-toggle {
			bottom: 2.5em;
			right: 0;
			height: 5em;
			text-align: center;
			padding: 1em 2em;
			opacity: 0.95;
		}
		/* MENU chiuso */
		.main-menu {
			position: fixed;
			left: 0px;
			top: 0px;
			width: 100%;
			padding-top: 7em;
			margin-top: 0px;
			height: 100%;
			opacity: 0;
			overflow: hidden;
			visibility: hidden;

			animation: right 0.3s ease;
			transition: all ease-in 0.5s;
		}
		/* Il menu aperto */
		.main-menu:target,
		.main-menu[aria-expanded="true"] {
			width: 100%;
			outline: none;
			visibility: visible;
			opacity: 0.95;
		}
		/*  il toggle X che chiude */
		.main-menu .menu-close {
			bottom: 1em;
			right: 0;
			padding: 0 0.6em;
		}

    }
}
/* ------------Query speciale per Nokia N9----------- */
@media only screen and (device-width: 480px) and (orientation: portrait) {
		/* stile del TOGGLE */
		#main-menu-toggle {
			position: fixed;
			background-color: #333;
			top: 0;
			right: 1em;
			text-align: center;
			padding: 1.4em 1em 0em 95%;
			border: none;
		}
		/* MENU chiuso */
		.main-menu {
			position: fixed;
			left: 0px;
			top: 0px;
			width: 100%;
			padding-top: 7em;
			margin-top: 0px;
			height: 100%;
			opacity: 0;
			overflow: hidden;
			visibility: hidden;

			animation: right 0.3s ease;
			transition: all ease-in 0.5s;
		}
		/* Il menu aperto */
		.main-menu:target,
		.main-menu[aria-expanded="true"] {
			width: 100%;
			outline: none;
			visibility: visible;
			opacity: 0.97;
		}
		/*  il toggle X che chiude */
		.main-menu .menu-close {
			position: fixed;
			width: 25px;
			top: 0;
			right: 0.3em;
			padding: 0 35px;

		}
}
@media only screen and (max-device-width: 1080px) and (orientation: landscape){
		.menu-toggle,
		.main-menu .menu-close {
			display: block;
		}
		/* stile del TOGGLE */
		#main-menu-toggle {
			position: fixed;
			color: #1accb9;
			background-color: #333;
		/* 	background-image: linear-gradient(white 1%, #1accb9 10%, #333 30%); /* Standard syntax (must be last) */ */
			border-radius: 1em;
			z-index: 87654321;
			bottom: 3.5em;
			right: 0;
			height: 5em;
			text-align: center;
			padding: 1em 2.2em;
			opacity: 0.95;
		}
		/* MENU chiuso */
		.main-menu {
			position: fixed;
			left: 0px;
			top: 0px;
			width: 100%;
			padding-top: 7em;
			margin-top: 0px;
			height: 100%;
			opacity: 0;
			overflow: hidden;
			visibility: hidden;

			animation: right 0.3s ease;
			transition: all ease-in 0.5s;
		}
		/* Il menu aperto */
		.main-menu:target,
		.main-menu[aria-expanded="true"] {
			width: 100%;
			outline: none;
			visibility: visible;
			opacity: 0.97;
		}
		/*  il toggle X che chiude */
		.main-menu .menu-close {
			position: fixed;
			width: 25px;
			top: 0;
			right: 0.3em;
			padding: 0 35px;

		}
}