header {
	padding: 0.5em 0;
	width: 100%;
	position: fixed;
	top: 0;
	left: 0;
	z-index: 10;
	font-size: 1rem;
	transition: all 0.5s linear}
header > .background_header {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: -1;
	background: #000;
	transition: 0.36s cubic-bezier(0.4, 0, 1, 1) 0s}
body:not(.scroll) header > .background_header {
	transform: translateY(-100%);
	visibility: hidden;
	opacity: 0}
body.scroll header > .background_header {	box-shadow: 0 4px 12px rgba(0,0,0,0.4)}
header > .no_flex {	width: 100%}
header > .no_flex > .flex {	height: 2.6em}
header > .no_flex > .flex > #logo {
	width: 15%;
	margin: 0 0;
	padding: 0 0;
	transition: 0.36s cubic-bezier(0.4, 0, 1, 1) 0s}
body:not(.scroll) header > .no_flex > .flex > #logo {
	transform: translateY(-100%);
	visibility: hidden;
	opacity: 0}
body.mentions-legales header > .no_flex > .flex > #logo,
body#erreur header > .no_flex > .flex > #logo {
	transform: none;
	visibility: visible;
	opacity: 1}
body.scroll header > .no_flex > .flex > #logo {	transition: 0.36s cubic-bezier(0.4, 0, 1, 1) 0s}
header > .no_flex > .flex > #logo > a {
	display: inline-block;
	width: auto;
	padding: 0.5em 0.75em;
	margin: 0 0 0;
	height: 100%}
header > .no_flex > .flex > #logo > a > img {transition: 0.36s cubic-bezier(0.4, 0, 1, 1) 0s}
body > header > .no_flex > .flex > #logo > a > img {
	max-height: 6em;
	max-width: 200px;
	background: #000;
	box-shadow: 0 4px 12px rgba(0,0,0,0.4);
	padding: 1em}
header > .no_flex > .flex > .flex.content_start {
	width: 34%;
	margin: 0 1%}
header > .no_flex > .flex > .flex.content_start > li:first-child {	margin-right: 1%}
header > .no_flex > .flex > .flex.content_start > li:last-child {	margin-left: 1%}
header > .no_flex > .flex > .flex.content_start > li > a {	display: inline-block}
header > .no_flex > .flex > .container_flex:nth-child(n+3) {	margin-top: 0.6em}
header nav ul > li {
	overflow: hidden;
	transition: all 0.36s cubic-bezier(0.4, 0, 1, 1) 0s, padding-right 0.36s cubic-bezier(0.4, 0, 1, 1) 0s}
header nav ul > li:hover,
header nav ul > li#active {	padding-right: 2em}
header nav ul > li::after {
	content: '';
	position: absolute;
	right: 0;
	top: 50%;
	transform: translate(100%, -50%);
	height: 2px;
	width: 1.5em;
	background: #e6e6e6;
	transition: transform 0.36s cubic-bezier(0.4, 0, 1, 1) 0s, top 0.36s cubic-bezier(0.4, 0, 1, 1) 0s}
header nav ul > li:hover::after,
header nav ul > li#active::after {	transform: translate(0%, -50%)}
header nav ul > li#active::after {	background: #AC8C65}
header nav > div > ul > li.ssmenu {	padding-right: 1.5em}
header nav > div > ul > li > ul > li.ssmenu {	padding-left: 1.5em}
header nav > div ul > li.ssmenu svg {
	position: absolute;
	top: 0.4em;
	right: 0}
header nav ul > li > a,
header nav ul > li > span {
	text-transform: none;
	padding: 0 0.5em;
	display: block;
	height: 100%;
	text-transform: uppercase;
	font-size: 0.9em;
	transition: 0.36s cubic-bezier(0.4, 0, 1, 1) 0s}
header nav ul > li#active,
header nav ul > li.active,
header nav ul > li:hover {}
header nav ul > li#active > a,
header nav ul > li.active > a,
header nav ul > li#active > span,
header nav ul > li.active > span,
header nav ul > li:hover > a,
header nav ul > li:hover > span {	}
header nav ul > li.hidden > a,
header nav ul > li.hidden > span {	opacity: 0.4}
header nav > div > ul > li > ul {	
	top: 100%;
	left: 50%;
	-webkit-transform: translateX(-50%);
	transform: translateX(-50%);
	max-height: 0;
	z-index: 100;
	overflow: hidden;
	padding: 0 0.5em}
header nav > div > ul > li > ul > li > ul {	
	top: -0.5em;
	right: 100%;
	max-height: 0;
	z-index: 100;
	overflow: hidden;
	padding: 0 0.5em}
header nav ul > li:hover > ul ,
header nav ul > li > ul:hover {	
	max-height: 20em;
	padding: 0.5em 1em;
	overflow: visible}
header nav > div > ul > li > ul > li:hover > ul {	padding: 0.5em 2em 0.5em 1em}
header nav ul > li > a > span > svg.icon,
header nav > div > ul > li > span > span > svg.icon {
	position: absolute;
	top: 0;
	right: 0;
	width: 0.85em;
	height: 0.85em}
header nav > div > ul > li > ul > li a > span > svg.icon,
header nav > div > ul > li > ul > li span > span > svg.icon {
	position: absolute;
	top: 0;
	left: 0;
	width: 0.85em;
	height: 0.85em}
header nav ul > li:not(:hover) > a > span > svg.icon.down,
header nav ul > li:not(:hover) > span > span > svg.icon.down {
	opacity: 1}
header nav ul > li:hover > a > span > svg.icon.down,
header nav ul > li:hover > span > span > svg.icon.down {
	opacity: 0}
header nav ul > li:not(:hover) > a > span > svg.icon.left,
header nav ul > li:not(:hover) > span > span > svg.icon.left {
	opacity: 0}
header nav ul > li:hover > a > span > svg.icon.left,
header nav ul > li:hover > span > span > svg.icon.left {
	opacity: 1}
header nav ul > li > ul {	white-space: nowrap}
header nav ul > li > ul > li {
	position: relative;
	margin: 0 0 1em}
header nav ul > li > ul > li:last-child {	margin-bottom: 0}
header nav ul > li > ul > li > a {	display: block}
body.mobile header > .no_flex > .flex > .container_flex:nth-child(n+3) {	margin-top: 0.3em}
header #button_menu_container {
	display: inline-block;
	width: 2em;
	height: 2em;
	padding: 0.25em;
	overflow: hidden;
	position: absolute;
	top: 0;
	right: 0.5em;
	z-index: 11;
	cursor: pointer;
	transition: 0.36s cubic-bezier(0.4, 0, 1, 1) 0s}
body:not(.mobile) header #button_menu_container {
	opacity: 0;
	visibility: hidden}
body.mobile header #button_menu_container {
	opacity: 1;
	visibility: visible;
	transition: 0.36s cubic-bezier(0.4, 0, 1, 1) 0.72s}
body header #button_menu_container a {
	display: block;
	height: 100%;
	width: 100%}
body header #button_menu_container a > span {
	display: block;
	position: absolute;
	top: 0.25em;
	left: 0.25em;
	right: 0.25em;
	bottom: 0.25em;
	overflow: hidden;
	transition: 0.36s cubic-bezier(0.4, 0, 1, 1) 0s}
body header #button_menu_container a span > .line {
	display: block;
	height: 2px;
	width: 1.5em;
	background: #f7f7f7;
	border: 1px solid transparent;
	margin: 0 0 0;
	border-radius: 10px;
	transition: 0.36s cubic-bezier(0.4, 0, 1, 1) 0s}
body.mobile header #button_menu_container a span > .line {	margin: 0 0 3px}
body.mobile header #button_menu_container a span > .line:nth-child(1) {	transition: 0.36s cubic-bezier(0.4, 0, 1, 1) 0.73s}
body.mobile header #button_menu_container a span > .line:nth-child(2) {	transition: 0.36s cubic-bezier(0.4, 0, 1, 1) 0.735s}
body.mobile header #button_menu_container a span > .line:nth-child(3) {	transition: 0.36s cubic-bezier(0.4, 0, 1, 1) 0.74s}
body.mobile header #button_menu_container a span > .line:nth-child(4) {	transition: 0.36s cubic-bezier(0.4, 0, 1, 1) 0.745s}
body.mobile header #button_menu_container a span > .line:nth-child(5) {	transition: 0.36s cubic-bezier(0.4, 0, 1, 1) 0.75s}
body.mobile header #button_menu_container a span > .line:nth-child(6) {	transition: 0.36s cubic-bezier(0.4, 0, 1, 1) 0.755s}
body.mobile header #button_menu_container a span > .line:last-child {	margin: 0 0 0}	
body.mobile header nav {
	position: absolute;
	right: 0.5em;
	top: 2.5em;
	overflow: hidden}
body.mobile header nav.hidden {
	max-height: 0;
	transition: 0s cubic-bezier(0.4, 0, 1, 1) 0.72s}
body.mobile header nav:not(.hidden) {
	max-height: 50vh;
	overflow: visible}
body.mobile header nav ul#menu.flex {	display: block}
body.mobile.scroll header nav ul#menu.flex > li {
	padding-top: 0.3em;
	padding-bottom: 0.3em;
	background: #000;
	box-shadow: 0 4px 12px rgba(0,0,0,0.4)}
body.mobile header nav.hidden ul#menu.flex > li {	transform: translateX(120%)}
body.mobile header nav:not(.hidden) ul#menu.flex > li {	transform: translateX(0)}
	
	@media screen and (max-width: 1024px) {
		body.mobile header > .no_flex > .flex.content_between {	justify-content: space-between}
		body.mobile header > .no_flex > .flex > #logo {
			margin-right: 0 !important;
			margin-bottom: 0 !important;
			width: 15% !important}
		header > .no_flex > .flex > .flex.content_start {	width: 66%}
		body.mobile header > .no_flex > .flex > .container_flex:nth-child(n+3) {
			width: 15% !important;
			margin-left: 0 !important;
			overflow: visible;
			white-space: nowrap}
		body.mobile > header > .no_flex > .flex > #logo > a {	width: 100%}
		body.mobile > header > .no_flex > .flex > #logo > a > img {
			max-height: 100%;
			max-width: 100%}
	}
	@media screen and (max-width: 768px) {
		body.mobile header > .no_flex > .flex > #logo {
			width: auto !important;
			max-width: 30%}
		body.mobile header > .no_flex > .flex > .flex.content_start {	font-size: 0.8em}
		body.mobile header > .no_flex > .flex > .flex.content_start > .container_flex.medium {
			width: 49% !important;
			font-size: 0.9em}
		body.mobile header > .no_flex > .flex > .flex.content_start > .container_flex.medium:first-child {	margin: 0 1% 0 0 !important}
		body.mobile header > .no_flex > .flex > .flex.content_start > .container_flex.medium:last-child {	margin: 0 0 0 1% !important}
		body.mobile header > .no_flex > .flex > .container_flex:nth-child(n+3) {	width: 2.5em !important}
		body.mobile > header > .no_flex > .flex > #logo > a > img {
			width: 100%;
			max-height: 6em;
			max-width: 200px}
	}
	@media screen and (max-width: 576px) {
		body.mobile header > .no_flex > .flex > #logo {	max-width: 37%}
		body:not(.scroll) header > .no_flex > .flex > .flex.content_start {
			opacity: 0;
			visibility: hidden;
			max-height:0}
		body.mobile header > .no_flex > .flex > .flex.content_start {
			position: fixed;
			left: 0;
			right: 0;
			bottom: 0;
			background: #000;
			width: 100%;
			margin: 0 0 0;
			padding: 0.25em 0;
			text-align: center;
			transition: 0.36s cubic-bezier(0.4, 0, 1, 1) 0s}
		body:not(.scroll) header > .no_flex > .flex > .flex.content_start {
			opacity: 0;
			visibility: hidden;
			max-height:0}
		body.scroll header > .no_flex > .flex > .flex.content_start {
			opacity: 1;
			visibility: visible}
		body.mobile header > .no_flex > .flex > .flex.content_start > .container_flex.medium {
			width: 100% !important;
			font-size: 0.9em}
		body.mobile header > .no_flex > .flex > .flex.content_start > .container_flex.medium:first-child {	margin: 0 0 0 0 !important}
		body.mobile header > .no_flex > .flex > .flex.content_start > .container_flex.medium:last-child {	margin: 0.25em 0 0 0 !important}
		body.mobile header > .no_flex > .flex > .flex.content_start > .container_flex.medium a {
			display: block;
			overflow: hidden;
			text-overflow: ellipsis;
			white-space: nowrap}
		body.mobile header > .no_flex > .flex > .flex.content_start > .container_flex.medium br {	display: none}
		body.mobile header > .no_flex > .flex > .flex.content_start > .container_flex.medium span {	vertical-align: middle}
		body.mobile header > .no_flex > .flex > .flex.content_start > .container_flex.medium span:first-child {	
			display: inline-block;
			/* max-width: 40%; */
			overflow: hidden;
			text-overflow: ellipsis;
			white-space: nowrap}
		body.mobile header > .no_flex > .flex > .flex.content_start > .container_flex.medium span:last-child:before {	content: ' : '}
	}