/* @override 
	http://127.0.0.1/~jlm/Jean-Luc.Mounier/Jean-Luc.Mounier/css/navigation.css
*/

/* primary navigation
--------------------------------------------------------------------- */

#nav-wrap .row #navigation {
	z-index: 1;
}

/* issu de layout */
ul#navigation {
	width: auto;
	margin-left: 20px;
	float: left;
	position: relative;
	top: 0;
	/* left align the menu */
	text-align: left;
}
ul#navigation li {
   position: relative;
   list-style: none;
}

/* float left to remove gaps between 1st level list items */
ul#navigation > li { float: left; }

/* Links */
ul#navigation li a {
	display: inline-block;
	padding: 0 15px;
	text-decoration: none;

	-webkit-transition: color .2s ease-in-out;
	-moz-transition: color .2s ease-in-out;
	-o-transition: color .2s ease-in-out;
	-ms-transition: color .2s ease-in-out;
	transition: color .2s ease-in-out;
}

ul#navigation li a:active { background-color: transparent !important; }
ul#navigation li.current > a {
	background: #fff;	
	border-right: 1px solid #EAE8E8;
	border-top: 1px solid #EAE8E8;
	border-left: 1px solid #EAE8E8; 
	border-radius: 3px 3px 0 0;   
}

/* sub menu j'ai supprimé ul#nav ul, ul#nav ul li */

ul#navigation.sf-menu ul {
	box-shadow: 4px 4px 6px rgba(0,0,0,.2);
	border: 1px solid #c0c0c0;
}

ul#navigation.sf-menu.mobile ul li ul {
	margin-left: 10px;
}

/* on hover */
ul#navigation li:hover > ul { 
	opacity: 1; 
	filter: alpha(opacity=100); 
}
ul#navigation li:hover > ul li {
	height: 42px;
	overflow: visible;  
}

/* sub menu anchor links */
ul#navigation ul li a {
	padding: 6px 20px;
	margin: 0;
	white-space: nowrap;
	font-size: 13px;
	font-family: 'opensans-regular', sans-serif;
	text-transform: none;
	letter-spacing: 0;   
	line-height: 28px;
	width: 100%;
}

ul#navigation ul {
	background: #F5F4F3;
}

/* screenwidth less than 768px - mobile/smaller tablets
---------------------------------------------------------------------- */
@media only screen and (max-width: 767px) {

	/* mobile navigation
	-------------------------------------------------------------------- */
	/* hide menu panel */
	#nav-wrap ul#navigation {
		padding: 12px 30px;
		margin: 0;      
		height: auto;
		display: none;
		clear: both;
		/*width: auto; */
		width: 100%; 
		float: none;
		position: relative;
		top: 0;
		right: 0;
	}

	/* display menu panels - no JS*/
	.no-js #nav-wrap:target ul#navigation  {
		display: block;           
	}

	/* remove float left on 1st level list items */
	ul#navigation > li { float: none; }

	ul#navigation > li {
		display: block;
		height: auto;
		text-align: left;
		border-bottom: 1px dotted #D3D5DA;
		padding: 6px 0;
	}

	ul#navigation > li:first-child {
		border-top: 1px dotted #D3D5DA;
	}

	ul#navigation li a {
		display: block;
		width: auto;
		line-height: 16px; /* reset line-height from 40px */
		border: none;
	} 
	ul#navigation li.current > a {
		background: none;
		border-radius: none;
		border: none;
		padding: 12px 0;
	} 

	ul#navigation li.has-children > a:after {
		content: "+";
		display: inline;
		padding-left: 8px;
		font-weight: bold;
		font-size: 18px;

		position: absolute;
		right: 10px;
		top: 4px;	
	}

	/* sub menu has children*/
	ul#navigation li ul li.has-children > a:after {
		right: 30px;
	}

	/* sub menu	 */
	ul#navigation li {
		display: inline;
	}


	ul#navigation ul {
		position: static; /* change position to static */
		border-radius: none;
		border: none;
		padding-bottom: 0;
	}

	/* sub menu anchor links */
	ul#navigation ul li a { padding: 6px 15px 6px 8px; }

	ul#navigation li.has-children ul li ul li a {
		padding-left: 18px;
	}
	/* on hover */
	ul#navigation li.has-children:hover > a:after { content: "-"; }  
}


/* screenwidth less than or equal 480px - mobile wide
  -------------------------------------------------------------------------- */
@media only screen and (max-width: 480px) {   
	#nav-wrap ul#navigation { width: 100%; }         
}
/* make sure the menu is visible on larger screens
  -------------------------------------------------------------------------- */

@media only screen and (min-width: 768px) {
	#nav-wrap ul#navigation { display: block !important; }
}


