/* @override
	http://127.0.0.1/~jlm/www/css/navigation.css
*/

/* primary navigation
--------------------------------------------------------------------- */
#nav-wrap, #nav-wrap ul, #nav-wrap li, #nav-wrap a {
	 margin: 0;
	 padding: 0;
	 border: none;
	 outline: none;
}

/* nav-wrap */
#nav-wrap {
	font: 12px 'opensans-bold', sans-serif;
	text-transform: uppercase;
	letter-spacing: 2px;   
	background: #F5F4F3;
	border-bottom: 1px solid #EAE8E8;
	width: 100%;
	float: left;
	position: absolute;
	top: 6px;
	left: 0;
	z-index: 1;
}

/* hide toggle button */
#nav-wrap  > a { display: none; }

ul#nav {
	min-height: 50px;
	width: auto;
	margin-left: 20px;
	float: left;
	position: relative;
	top: 0;   
	text-align: left;    
}
ul#nav li {
	position: relative;
	list-style: none;
	height: 50px;
	display: inline-block;   
	padding-top: 10px;
}

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

/* Links */
ul#nav li a {
	display: inline-block;
	padding: 0 15px;
	line-height: 40px;
	text-decoration: none;
	color: #666666;  
	transition: color .2s ease-in-out;
}

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

/* sub menu */
ul#nav ul {
	position: absolute;
	top: 52px;
	left: 0px;
	padding-bottom: 12px;
	background: #F5F4F3;
	min-width: 100%;
	border: 1px solid #EAE8E8;
	border-top: none;
	border-radius: 0 0 3px 3px;
	opacity: 0;
	filter: alpha(opacity=0);
	transition: opacity .25s ease .1s;
}

ul#nav ul li {
	padding: 0;
	display: block;
	text-align: left;
	height: 0;
	overflow: hidden;
	transition: height .25s ease .1s;
}

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

/* sub menu anchor links */
ul#nav 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;   
}

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

/* issu de layout */
ul#navigation {
	background: transparent;
	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;
	transition: color .2s ease-in-out;
}

ul#navigation li a:active { background-color: transparent !important; }
ul#navigation li.current > a {
/*	background: var(--color_scheme_background);	*/
	border-right: 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: 30px;
	overflow: visible;
}

/* sub menu anchor links */
ul#navigation ul li a {
	padding: 3px 10px;
	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 li.languages ul li a {
	padding-top: 5px;
	padding-bottom: 0px;
	padding-left: 15px;
}

ul#navigation li.languages li a.langue_courante img,
ul#navigation li.languages li a:hover img {
	width: 32px;
}

a.langue_courante {
	font-size: 2em;
}

ul#navigation li.languages li a.langue_courante,
ul#navigation li.languages li a:hover {
	font-size: 3em;
}


ul#navigation ul {
	background: var(--color_scheme_background);
}

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

	/* mobile navigation
	-------------------------------------------------------------------- */

	ul#navigation {
	/*	background: var(--color_scheme_background);*/
	}
	/* hide menu panel */
	#nav-wrap ul#navigation {
		padding: 12px 30px;
		margin: 0;
		display: none;
		clear: both;
		/*width: auto; */
		width: 100%;
		float: none;
		position: relative;
		top: 0;
		right: 0; /*lorsque le menu est ouvert */
}

	/* 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; /* 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; }
	#nav-wrap ul#nav { display: block !important; }
}

/* screenwidth less than 768px - mobile/smaller tablets
---------------------------------------------------------------------- */
@media only screen and (max-width: 767px) {
	
	/* mobile navigation
	-------------------------------------------------------------------- */
	#nav-wrap {
		z-index: 999;
		float: none;
		position: absolute;
		top: 0;
		right: 0;
		border-top: 6px solid #9FCC7F;
	}
	#nav-wrap > a {
	text-align: left;
	border: none;
	font-size: 12px;
	height: 54px;
	line-height: 54px;
	font: 0/0 a;
	text-shadow: none;
	color: transparent;
	float: right;
	position: relative;
	top: 0px;
	right: 36px;
	}
	#nav-wrap > a:before {
		font-family: 'FontAwesome';
		content: "\f0c9";
		color: #666666;
		margin: 0;
		font-size: 25px;
		line-height: 54px;
		text-align: left;
		display: block;
		float: right;
	}

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

	/* display toggle buttons */
	.no-js #nav-wrap:not( :target ) > a:first-of-type,
	.no-js #nav-wrap:target > a:last-of-type {
		display: block;
	}
	.js #nav-wrap a { display: block; }

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

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

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

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

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

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

	/* sub menu	 */
	ul#nav ul {
		position: static; /* change position to static */
		border-radius: none;
		border: none;
		padding-bottom: 0;
	}
	
	/* sub menu anchor links */
	ul#nav ul li a { padding: 6px 15px 6px 8px; }

	/* on hover */
	ul#nav li.has-children:hover > a:after { content: "-"; }

	/* content
	-------------------------------------------------------------- */
	#content-wrap { padding-top: 0; }
	#content-wrap #main { padding-right: 30px;}	

}


/* screenwidth less than or equal 480px - mobile wide
-------------------------------------------------------------------------- */
@media only screen and (max-width: 480px) {
	/* mobile navigation
	--------------------------------------------------------------- */
	#nav-wrap > a { right: 30px; }
	#nav-wrap { width: 100%; }
	#nav-wrap ul#nav { width: 100%; }
}

/* screenwidth less than or equal 420px - mobile narrow
-------------------------------------------------------------------------- */
@media only screen and (max-width: 420px) {
	/* content
	-------------------------------------------------------------- */
	#content-wrap { margin-top: -24px; }
}
/* primary navigation
--------------------------------------------------------------------- */
/* $HauteurBarreMenus : 40px */
/* $CouleurLiensNavigation : #627da9 */
ul#navigation {
	min-height: 40px;
	width: 100%;
	margin-left: 0;
	padding-bottom: 0px;
}
ul#navigation li a {
	line-height: 40px;
}
/*
ul#navigation li.current > a {
	color: var(--color_scheme_over_tab_background); 
}
*/

/* 7. Forms  --------------------------------------------------------- */

input[type="text"],
input[type="password"],
input[type="email"],
textarea,
select {
	display: inline-block;
	margin-bottom: 0px;
}

/* a. Default Overrides and Common Styles
/* ------------------------------------------------------------------ */

strong, b {
	font-family: var(--font-family);
	line-height: var(--line-height);
	font-weight: 550;
}

/* c. Content
--------------------------------------------------------------------- */

#content-wrap {
	background-color: var(--color_scheme_background_light);
}

/* ------------------------------------------------------------------ */
/* d. Grid
--------------------------------------------------------------------- */

/* default
--------------------------------------------------------------- */
.row {
	margin: 0 auto;
}


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

#nav-wrap {
	text-transform: none;
	position: static;
	background-color: var(--color_scheme_background_light);
/*   background: #F5F4F3;*/
}

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


ul#nav li a {
	color: var(--color_scheme_text_color); 
/*	color: #627da9;*/
}

ul#nav ul {
/*	background: #F5F4F3;*/
}