#menu-orizzontale {
	float: left;
	position: relative;
	z-index: 2000;
	width: 100%;
	font-family: Arial,Helvetica,sans-serif;
	border-bottom: 2px solid #CCC;
border-top: 3px solid #A61212;
}

.toggle,

[id^=drop] {

	display: none;

}



/* Giving a background-color to the nav container. */

nav {
	margin:0;
	padding: 0;
	background-color: #fff;
}




/* Since we'll have the "ul li" "float:left"

 * we need to add a clear after the container. */



nav:after {

	content:"";

	display:table;

	clear:both;

}



/* Removing padding, margin and "list-style" from the "ul",

 * and adding "position:reltive" */

nav ul {

	float: left;

	padding:0;

	margin:0;

	list-style: none;

	position: relative;

	}

	

/* Positioning the navigation items inline */

nav ul li {
	margin: 0px;
	display:inline-block;
	float: left;
	background-color: #fff;
	}



/* Styling the links */

nav a {
	display:block;
	padding:15px 13px;
	color: #6B5858;
	font-size:14px;
	text-decoration:none !important;
}


nav ul li ul li:hover {
	background-color: #ffffff;
}



/* Background color change on Hover */

nav a:hover {
	background-color: #ffffff;
	color: #911;
}



/* Hide Dropdowns by Default

 * and giving it a position of absolute */

nav ul ul {

	display: none;

	position: absolute; 

	/* has to be the same number as the "line-height" of "nav a" */

	top: 50px; 

}

	

/* Display Dropdowns on Hover */

nav ul li:hover > ul {

	display:inherit;

}

	

/* Fisrt Tier Dropdown */

nav ul ul li {
	width:220px;
	float:none;
	display:list-item;
	position: relative;
	background-color: #fff;
}



/* Second, Third and more Tiers	

 * We move the 2nd and 3rd etc tier dropdowns to the left

 * by the amount of the width of the first tier.

*/

nav ul ul ul li {

	position: relative;

	top:-60px;

	/* has to be the same number as the "width" of "nav ul ul li" */ 

	left:220px; 

}



	

/* Change ' +' in order to change the Dropdown symbol */

li > a:after { content:  ' +'; }

li > a:only-child:after { content: ''; }





/* Media Queries

--------------------------------------------- */



@media all and (max-width : 768px) {




	nav {

		margin: 0;

	}



	/* Hide the navigation menu by default */

	/* Also hide the  */

	.toggle + a,

	.menu {

		display: none;

	}



	/* Stylinf the toggle lable */

	.toggle {

		display: block;

		/*background-color: rgba(225, 225, 225, 0.67);*/

		padding:14px 20px;	

		color: #8A7E7E;

		font-size:14px;

		text-decoration:none;

		border:none;

	}



	.toggle:hover {

		/*background-color: #e9eeef;*/

	}



	/* Display Dropdown when clicked on Parent Lable */

	[id^=drop]:checked + ul {

		display: block;

	}



	/* Change menu item's width to 100% */

	nav ul li {

		display: block;

		width: 100%;

		}



	nav ul ul .toggle,

	nav ul ul a {

		padding: 0 40px;

	}



	nav ul ul ul a {

		padding: 0 80px;

	}



	nav a:hover,

 	nav ul ul ul a {

		/*background-color: e9eeef;*/

	}

  

	nav ul li ul li .toggle,

	nav ul ul a,

  nav ul ul ul a{

		padding:14px 20px;	

		color: #514E4E;

		font-size:15px; 

	}

  

  

	nav ul li ul li .toggle,

	nav ul ul a {

		/*background-color: #e9eeef;*/

	}



	/* Hide Dropdowns by Default */

	nav ul ul {

		float: none;

		position:static;

		color: #ffffff;

		/* has to be the same number as the "line-height" of "nav a" */

	}

		

	/* Hide menus on hover */

	nav ul ul li:hover > ul,

	nav ul li:hover > ul {

		display: none;

	}

		

	/* Fisrt Tier Dropdown */

	nav ul ul li {

		display: block;

		width: 100%;

	}



	nav ul ul ul li {

		position: static;

		/* has to be the same number as the "width" of "nav ul ul li" */ 



	}



}



@media all and (max-width : 330px) {



	nav ul li {

		display:block;

		width: 94%;

	}



}
