body > header {
	left: 0;
	right: 0;
	z-index: 10;
	text-align: center;
	padding: 1em 0 0;
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	max-width: 100vw;
	text-transform: uppercase;
	transition: all 0.3s linear}
body.scroll > header,
body.hide > header,
body.overlay > header {
	padding: 0.65em 0;
	box-shadow: 0 7px 15px rgba(0,0,0,0.025);
	transition: all 0.3s linear}
header > .background_header {
	top: 0;
	left: 0;
	right: 0;
	bottom: 0}
body:not(.scroll) > header > .background_header {
	opacity: 0;
	transition: all 0.3s linear}
body.scroll header .background_header {	
	opacity: 1;
	background: #fff;
	z-index: -1;
	transition: all 0.3s linear}
body > header .center {	position: relative}
body > header .center.flex > .container_flex.xsmall {
	width: 14.5%;
	line-height: 0}
body > header .center.flex > .container_flex.large {	width: 83%}
body header #logo a {
	display: inline-block;
	line-height: 0;
	position: relative}
body header #logo img {	
	max-height: 4.5em;
	position: relative;
	z-index: 1;
	transition: all 0.3s linear}
body.scroll header #logo img {	transition: all 0.15s 0.15s linear}
body:not(.mentions_legales):not(.erreur):not(.scroll) header #logo img {	filter: brightness(100);}
body header > .center > .container_flex.large > .flex > .container_flex.xxsmall,
body header > .center > .container_flex.large > .flex > #nav > div > ul {	transition: 0.3s all linear 0s}
body.de header > .center > .container_flex.large > .flex > #nav > div > ul.flex.wrap {	flex-wrap: nowrap}
body header > .center > .container_flex.large > .flex > .container_flex.xxsmall.opacity,
body header > .center > .container_flex.large > .flex > #nav > div > ul.opacity {	opacity: 0}
body header > .center > .container_flex.large > .flex > #nav ul + ul {	margin-top: 0.5em}
body header > .center > .container_flex.large > .flex > nav {
	width: 80%;
	margin: 0 4% 0 0}
body header > .center > .container_flex.large > .flex > #nav > div > ul > li,
body header > .center > .container_flex.large > .flex > #nav > div > ul + ul > li ul > li,
body header > .center > .container_flex.large > .flex > #nav ul > li > span {	margin: 0 0.5em}
body header > .center > .container_flex.large > .flex > #nav ul + ul > li > span {	margin: 0 1em}
body header > .center > .container_flex.large > .flex > #nav ul > li:last-child,
body header > .center > .container_flex.large > .flex > .no_flex,
body header > .center > .container_flex.large > .flex > #nav ul > li > span:last-child,
body header > .center > .container_flex.large > .flex > li:last-child,
body header > .center > .container_flex.large > .flex > ul > li:last-child {	margin-right: 0}	
body header > .center > .container_flex.large > .flex > #nav ul > li:first-child,
body header > .center > .container_flex.large > .flex > #nav ul > li > span:first-child,
body header > .center > .container_flex.large > .flex > li:first-child {	margin-left: 0}
body header > .center > .container_flex.large > .flex > #nav ul > li a,
body header > .center > .container_flex.large > .flex > #nav ul > li span {	display: block}
body:not(.mentions_legales):not(.erreur):not(.scroll) header > .center > .container_flex.large > .flex > #nav ul > li a,
body:not(.mentions_legales):not(.erreur):not(.scroll) header > .center > .container_flex.large > .flex > #nav ul > li span {	font-size: 1.2rem}
body:not(.mentions_legales):not(.erreur):not(.scroll) header > .center > .container_flex.large > .flex > #nav ul > li:not(#active):not(.active) a,
body:not(.mentions_legales):not(.erreur):not(.scroll) header > .center > .container_flex.large > .flex > #nav ul > li:not(#active):not(.active) span {	color: #fff}
body header > .center > .container_flex.large > .flex > #nav ul > li#active a,
body header > .center > .container_flex.large > .flex > #nav ul > li#active span,
body header > .center > .container_flex.large > .flex > #nav ul > li.active li#active a,
body header > .center > .container_flex.large > .flex > #nav ul > li.active > span,
body header > .center > .container_flex.large > .flex > #nav ul > li.active li#active span,
body header > .center > .container_flex.large > .flex > #nav ul > li .active,
body header > .center > .container_flex.large > .flex > #nav ul#switch_langue > li > span {	color: #abc4be}
body header > .center > .container_flex.large > .flex > #nav ul#switch_langue > li > span {	color: #abc4be !important}
body header > .center > .container_flex.large > .flex > #nav > div > ul > li.ssmenu > span {
	padding-right: 1.5em;
	position: relative;
	cursor: pointer}
body header > .center > .container_flex.large > .flex > #nav > div > ul > li.ssmenu > span svg {
	position: absolute;
	right: 0;
	bottom: 0;
	width: 1em;
	height: 1em;
	transform: rotate(0);
	transform-origin: center;
	transition: 0.15s all linear 0s}
body header > .center > .container_flex.large > .flex > #nav > div > ul > li.ssmenu.hover > span svg {	transform: rotate(180deg)}
body header > .center > .container_flex.large > .flex > #nav > div > ul > li.ssmenu > ul.absolute {
	top: 100%;
	left: -0.5em;
	z-index: 2;
	overflow: hidden;
	max-height: 0;
	padding: 0 0.5em;
	transition: 0.3s all linear 0s}
body header > .center > .container_flex.large > .flex > #nav > div > ul > li.ssmenu.hover > ul.absolute {
	max-height: 50vh;
	padding: 0.5em 0.5em}
body header > .center > .container_flex.large > .flex > #nav > div > ul > li.ssmenu > ul.absolute > li {
	white-space: nowrap;
	margin: 0.5em 0 0;
	font-size: 0.85em}
header a:not(.button) {	letter-spacing: -0.05em}
header #change-langue {
	color: #969696;
	background: none;
	border-color: transparent;
	text-transform: uppercase}
body header > .center > .container_flex.large > .flex:nth-child(n+3) {	margin: 1em 0 0}
body header > .center > .container_flex.large p {	margin: 0 0.5em 0}
body header > .center > .container_flex.large p:first-child {	margin-left: 0}
body header > .center > .container_flex.large p:last-child {	margin-right: 0}
body header > .center > .container_flex.large p a span {	font-size: 0.8em}
body header > .center > .container_flex.large p img {	
	max-height: 3em;
	max-width: 5em;
  vertical-align: top}
body#accueil:not(.scroll) header > .center > .container_flex.large p a span,
body#accueil:not(.scroll) header > .center > .container_flex.large p img {	
	opacity: 0;
	transition: all 0.3s linear}
body#accueil header #logo img,
body#accueil.scroll header > .center > .container_flex.large p a span,
body#accueil.scroll header > .center > .container_flex.large p img {	
	opacity: 1;
	margin: 5px 0 0;
	transition: all 0.3s linear}
body#accueil.scroll header > .center > .container_flex.large p svg,
body#accueil.scroll header > .center > .container_flex.large p span svg {
	color: #e7c377;
	fill: #e7c377}
header .button_menu_container {	display: none}
body header > .center > .container_flex.large > .flex > .container_flex.xxsmall .button {
	width: auto;
	border: none;
	position: relative;
	text-shadow: none;
	overflow: hidden;
	background: #485e59;
	text-transform: uppercase;
	border: 1px solid #485e59;
	font-family: 'Josefin Sans';
	color: #fff;
	font-size: 0.7em;
	line-height: 1.5em;
	padding: 0.4em 0.75em 0.2em}
body header > .center > .container_flex.large > .flex > .container_flex.xxsmall .button:hover {
	color: #485e59;
	border: #abc4be solid 1px;
	transition: 0.5s cubic-bezier(0.4, 0, 1, 1)}
body header > .center > .container_flex.large > .flex > .container_flex.xxsmall .button::before {
	content: '';
	position: absolute;
	z-index: 0;
	width: 200%;
	height: 500%;
	border-radius: 100%;
	background: #abc4be;
	z-index: 1;
	transform: translate(-110%, 10%) translateZ(0);
	transition: 0.5s cubic-bezier(0.4, 0, 1, 1)}
body header > .center > .container_flex.large > .flex > .container_flex.xxsmall .button:hover::before {  transform: translate(-45%, -34%) translateZ(0)}
body header > .center > .container_flex.large > .flex > .container_flex.xxsmall .button > span{
	position: relative;
	z-index: 2}
	
	@media screen and (max-width: 1280px) {
		body header > .center > .container_flex.xsmall,
		body header > .center > .container_flex.large {	width: auto}
	}
	@media screen and (max-width: 1152px) {
		body > header,
		body.scroll > header,
		body.hide > header,
		body.overlay > header,
		body.mentions_legales > header {	padding: 0.65em 0.5em}
		body header > .center.flex.content_between {	justify-content: space-between}
		body header > .center > .container_flex.xsmall {
			margin: 0 0 0 !important;
			width: 33% !important}	
		body header > .center > .container_flex.xsmall > .container_flex {	margin: 0 0 0 !important}
		body header > .center > .container_flex.large {	width: 64% !important}
		body header > .center > .container_flex.large > .flex > nav {
			position: fixed;
			top: 0.5em;
			right: 1em;
			width: auto !important;
			margin: 0 0 0 !important;
			z-index: 1;}
		header .button_menu_container {
			display: inline-block;
			padding: 0 0;
			overflow: hidden;
			position: relative;
			z-index: 11;
			cursor: pointer;
			transition: 0.36s cubic-bezier(0.4, 0, 1, 1) 0s}
		body > header .button_menu_container a {
			display: block;
			height: 100%;
			width: 100%;
			border-top-right-radius: 2em;
			border-bottom-right-radius: 2em;
			padding: 0.5em 0 0.5em 1em;
			font-size: 1.4rem;
			text-align: center;
			overflow: hidden;
			transition: background 0s linear 0.72s;
			color: #706666}
		body:not(.mentions_legales):not(.scroll) header .button_menu_container a:not(.show) {
			color: #fff;
			transition: background 0s linear 0s}
		body > header .button_menu_container a:not(.show) {}
		body > header .button_menu_container a.show {}
		body > header .button_menu_container a > span {
			text-transform: uppercase;
			vertical-align: middle;
			transition: 0.36s linear 0.36s}
		body > header .button_menu_container a.show > span {}
		body > header .button_menu_container a > span.menu {
			margin-right: 0.5em;
			transition: all 0.36s linear 0s}
		body > header .button_menu_container a > span.open {
			display: inline-block;
			overflow: hidden;
			color: #706666;
			transition: all 0.72s cubic-bezier(.19,1,.22,1) 0s}
		body > header .button_menu_container a:not(.show) span {}
		body > header .button_menu_container a.show span.open {	transform: rotate(45deg)}
		body > header .button_menu_container a span > .line {
			display: block;
			height: 3px;
			width: 20px;
			background: #706666;
			border: 1px solid transparent;
			border-radius: 10px;
			margin: 0 auto 5px;
			transform: translateX(0%);
			transition: all 0.72s cubic-bezier(.19,1,.22,1) 0s}
		body > header .button_menu_container a span > .line:last-child {	margin: 0 auto 0}
		body > header .button_menu_container a:not(.show) span > .line {	background: #706666}
		body:not(.mentions_legales):not(.scroll) header .button_menu_container a:not(.show) span > .line {	background: #fff}
		body > header .button_menu_container a.show span > .line {}
		body > header .button_menu_container a.show span > .line:nth-child(1),
		body > header .button_menu_container a.show span > .line:nth-child(3) {	transition: all 0.72s cubic-bezier(.19,1,.22,1) 0s}
		body > header .button_menu_container a.show span > .line:nth-child(1) {
			transform: rotate(90deg) translateX(40%) scale(1.01);
			transform-origin: 50%}
		body > header .button_menu_container a.show span > .line:nth-child(3) {
			opacity: 0;
			transform: translateY(-8px)}
		body header > .center > .container_flex.large > .flex > nav > div > ul#menu {
			flex-direction: column;
			justify-content: center;
			position: fixed;
			top: 0;
			left: auto;
			right: 0;
			bottom: 0;
			padding: 5.5em 0 5.5em;
			transform: translateX(100vw);
			font-size: 1em;
			z-index: 2;
			text-align: left;
			background: #fff;
			overflow-y: scroll;
			transition: transform 0.3s ease-in}
		body header > .center > .container_flex.large > .flex > nav > div > ul#menu.show {	transform: none}
		body header > .center > .container_flex.large > .flex > #nav > div > ul > li.ssmenu > ul.absolute {
			background: #fff;
			left: 0}
		body header > .center > .container_flex.large > .flex > nav > div > ul#menu > li {
			padding: 0 2em 0;
			margin: 0 0 1em}
		body header > .center > .container_flex.large > .flex > nav > div > ul#menu > li:last-child {	margin: 0 0 0}
		body header > .center > .container_flex.large > .flex > nav > div > ul#menu > li.content_end,
		body header > .center > .container_flex.large > .flex > nav > div > ul#menu > li.autres {
			padding-top: 1em;
			border-top: 1px solid #eee}
		body header > .center > .container_flex.large > .flex > nav > div > ul#menu > li::after {
			content: '';
			display: none}
		body header > .center > .container_flex.large > .flex > #nav ul > li a,
		body header > .center > .container_flex.large > .flex > #nav ul > li span {	display: inline}
		body header > .center > .container_flex.large > .flex > nav > div > ul#menu > li:not(#active):not(.active) a,
		body header > .center > .container_flex.large > .flex > nav > div > ul#menu > li:not(#active):not(.active) span:not(.active) {	color: #706666 !important}
		body header > .center > .container_flex.large > .flex > nav > div > ul#menu > li:not(#active):not(.active) span.active {	color: #e7c377 !important}
		body header > .center > .container_flex.large p svg,
		body header > .center > .container_flex.large p span svg {
			color: #e7c377;
			fill: #e7c377}
		body header > .center > .container_flex.large > .flex > nav > div > ul#menu > li.content_end,
		body header > .center > .container_flex.large > .flex > #nav ul > li ul.content_end {	justify-content: flex-start}
		body header > .center > .container_flex.large > .flex > nav > div > ul#menu > li.content_end > span {	margin-left: 0}
		body header > .center > .container_flex.large p.align_center {	margin: 0 0 1em}
		body#accueil:not(.scroll) header > .center > .container_flex.large p.align_center:last-child {	margin: 0 0 0}
		body#accueil:not(.scroll) header > .center > .container_flex.large p a span,
		body#accueil:not(.scroll) header > .center > .container_flex.large p img {	opacity: 1}
		body header > .center > .container_flex.large > .flex > .container_flex.xxsmall {
			width: auto !important;
			margin: -1em 12em 0 0 !important;
			z-index: 0}
		body.overlay header > .center > .container_flex.large > .flex > .container_flex.xxsmall {
			opacity: 0.4;
			z-index: -1}
		body header > .center > .container_flex.large > .flex > nav > div > ul#menu > li:last-child {	margin-top: 3em}
		body header > .center > .container_flex.large > .flex > nav > div > ul#menu > li.others h3 {	margin-bottom: 1em}
		body header > .center > .container_flex.large > .flex > nav > div > ul#menu > li.others img {	max-height: 3em}
	}
	@media screen and (max-width: 640px) {
		body header > .center > .container_flex.xsmall {
			margin: 0 0 0 !important;
			width: 24% !important}
		body header > .center > .container_flex.large {	width: 74% !important}
	}
	@media screen and (max-width: 576px) {
		body header > .center > .container_flex.large > .flex > .container_flex.xxsmall {
			position: fixed;
			bottom: 0;
			left: 0;
			right: 0;
			width: auto !important;
			margin: 0 0 0 !important;
			z-index: 1}
		body header > .center > .container_flex.large > .flex > .container_flex.xxsmall .button {
			height: 100%;
			display: block;
			width: 100%;
			font-size: 0.8em}
		body header > .center > .container_flex.large > .flex > .container_flex.xxsmall .button::after {
			content: url('data:image/svg+xml; utf8, <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512" class="icon only"><path fill="%23eee" d="M438.6 278.6l-160 160C272.4 444.9 264.2 448 256 448s-16.38-3.125-22.62-9.375c-12.5-12.5-12.5-32.75 0-45.25L338.8 288H32C14.33 288 .0016 273.7 .0016 256S14.33 224 32 224h306.8l-105.4-105.4c-12.5-12.5-12.5-32.75 0-45.25s32.75-12.5 45.25 0l160 160C451.1 245.9 451.1 266.1 438.6 278.6z"/></svg>');
			display: inline-block;
			height: 0.9em;
			width: 0.9em;
			margin-left: 1em;
			position: relative;
			top: 3px;
			vertical-align: top;}
		body header > .center > .container_flex.large > .flex > .container_flex.xxsmall .button br {	display: none}
		body header > .center > .container_flex.large > .flex > .container_flex.xxsmall .button .font_small {	margin: 0 0 0 1em}
	}
	@media screen and (max-width: 380px) {
		body header > .center > .container_flex.large > .flex > .container_flex.xxsmall .button::after {	display: none}
		body header > .center > .container_flex.large > .flex > .container_flex.xxsmall .button .font_small {	margin: 0 0 0 0.5em}
	}
	@media screen and (max-width: 284px) {
		body header > .center > .container_flex.large > .flex > .container_flex.xxsmall .button {	font-size: 0.7em}
	}