/* =============================================
	FONTS
 =============================================*/
@import url('https://fonts.googleapis.com/css?family=Ubuntu:300');
@import url(http://fonts.googleapis.com/css?family=Lato:300,400,100);
/*font-family: 'Open Sans Condensed', sans-serif;
font-family: 'Encode Sans Condensed', sans-serif;
font-family: 'Comfortaa', cursive;
*/
html {font-family: sans-serif;-ms-text-size-adjust: 100%;-webkit-text-size-adjust: 100%;}
fieldset {border: 0px solid #c0c0c0;margin: 0 2px;padding: 0.35em 0.625em 0.75em;}
legend {border: 0;/* 1 */padding: 0; /* 2 */}

/* =============================================
	CLASSES
 =============================================*/
.clear,.ligne,.row {clear: both;}
.clearfix::after,.line::after {content: "";display: table;clear: both;border-collapse: collapse;}
/* text and contents alignment */
.center {margin-left: auto;margin-right: auto;}
.txtleft {text-align: left;}
.txtright {text-align: right;}
.txtcenter {text-align: center;}
.text-bigger{font-size: bigger;}

/* floating elements */
.fl {float: left;margin-right: auto;}
img.fl {margin-right: 1rem;}
.fr {float: right;margin-left: auto;}
img.fr {margin-left: 1rem;}
img.fl,img.fr {margin-bottom: 0.5rem;}

i,.italic{font-style: italic;}
/* inline-block */
.inbl {display: inline-block;vertical-align: top;}

/*conteneur fluide*/
.flex-contain{display: -webkit-flex;display: flex;-webkit-flex-direction: row;flex-direction: row;justify-content: flex-start ;flex-wrap: wrap;align-items: flex-start}/*wrap = passage à la ligne*/
.flex-contain> *{ }
.flex-item{-webkit-flex: 1 auto;flex: 1 auto;}/*flex 1 : tous les éléments se répartissent l'espace */

.display{display: block;}
.hide{display: none;}
.no-border{border: 0px;}
/* colonnes */
.colonne_1{display: inline-block; width:68%;padding-right:20px;}
.colonne_2{display: inline-block; width:28%;vertical-align:top;}

/* ========================================= 
	GENERAL
===========================================*/
html {font-size: 100%}

body {font-family: 'Lato', Calibri, Arial, sans-serif;font-weight: 300;font-size: 1.2rem;line-height: 1.5;color: #F4F4F4;margin-bottom:150px;
	background-color: #291F18;
/*	background-color: #0d0d0d;
	background-image: url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M54.627 0l.83.828-1.415 1.415L51.8 0h2.827zM5.373 0l-.83.828L5.96 2.243 8.2 0H5.374zM48.97 0l3.657 3.657-1.414 1.414L46.143 0h2.828zM11.03 0L7.372 3.657 8.787 5.07 13.857 0H11.03zm32.284 0L49.8 6.485 48.384 7.9l-7.9-7.9h2.83zM16.686 0L10.2 6.485 11.616 7.9l7.9-7.9h-2.83zm20.97 0l9.315 9.314-1.414 1.414L34.828 0h2.83zM22.344 0L13.03 9.314l1.414 1.414L25.172 0h-2.83zM32 0l12.142 12.142-1.414 1.414L30 .828 17.272 13.556l-1.414-1.414L28 0h4zM.284 0l28 28-1.414 1.414L0 2.544V0h.284zM0 5.373l25.456 25.455-1.414 1.415L0 8.2V5.374zm0 5.656l22.627 22.627-1.414 1.414L0 13.86v-2.83zm0 5.656l19.8 19.8-1.415 1.413L0 19.514v-2.83zm0 5.657l16.97 16.97-1.414 1.415L0 25.172v-2.83zM0 28l14.142 14.142-1.414 1.414L0 30.828V28zm0 5.657L11.314 44.97 9.9 46.386l-9.9-9.9v-2.828zm0 5.657L8.485 47.8 7.07 49.212 0 42.143v-2.83zm0 5.657l5.657 5.657-1.414 1.415L0 47.8v-2.83zm0 5.657l2.828 2.83-1.414 1.413L0 53.456v-2.83zM54.627 60L30 35.373 5.373 60H8.2L30 38.2 51.8 60h2.827zm-5.656 0L30 41.03 11.03 60h2.828L30 43.858 46.142 60h2.83zm-5.656 0L30 46.686 16.686 60h2.83L30 49.515 40.485 60h2.83zm-5.657 0L30 52.343 22.343 60h2.83L30 55.172 34.828 60h2.83zM32 60l-2-2-2 2h4zM59.716 0l-28 28 1.414 1.414L60 2.544V0h-.284zM60 5.373L34.544 30.828l1.414 1.415L60 8.2V5.374zm0 5.656L37.373 33.656l1.414 1.414L60 13.86v-2.83zm0 5.656l-19.8 19.8 1.415 1.413L60 19.514v-2.83zm0 5.657l-16.97 16.97 1.414 1.415L60 25.172v-2.83zM60 28L45.858 42.142l1.414 1.414L60 30.828V28zm0 5.657L48.686 44.97l1.415 1.415 9.9-9.9v-2.828zm0 5.657L51.515 47.8l1.414 1.413 7.07-7.07v-2.83zm0 5.657l-5.657 5.657 1.414 1.415L60 47.8v-2.83zm0 5.657l-2.828 2.83 1.414 1.413L60 53.456v-2.83zM39.9 16.385l1.414-1.414L30 3.658 18.686 14.97l1.415 1.415 9.9-9.9 9.9 9.9zm-2.83 2.828l1.415-1.414L30 9.313 21.515 17.8l1.414 1.413 7.07-7.07 7.07 7.07zm-2.827 2.83l1.414-1.416L30 14.97l-5.657 5.657 1.414 1.415L30 17.8l4.243 4.242zm-2.83 2.827l1.415-1.414L30 20.626l-2.828 2.83 1.414 1.414L30 23.456l1.414 1.414zM56.87 59.414L58.284 58 30 29.716 1.716 58l1.414 1.414L30 32.544l26.87 26.87z' fill='%23423f47' fill-opacity='0.4' fill-rule='evenodd'/%3E%3C/svg%3E");*/
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;}
section{max-width:1024px;padding:0px 10px;}
p{padding-bottom:20px;}
a, a:visited, a:active{color: #F4F4F4;text-decoration: ;}
a:hover {text-decoration:underline;color: #CC0000;}
a:focus-visible {outline: 2px dashed darkorange;}
h1, h2, h3{font-family: 'Ubuntu', sans-serif;}
.h1-title{font-size: 2.2rem;color:#422816;margin: 20px 0px;padding-right:70px;}
.h1-like{font-size: 2.2rem;margin: 15px auto;}
/* h2 le display:inline permet d'adapter la taille du block a la taille du texte*/
.h2-like{font-size: 1.4rem;}
.h3-like{font-size: 1.2rem;}

/* ================================================= 
	MAIN CONTENU
================================================= */
.cd-main-content {
	margin: 2rem auto;
  /*padding: 60px 5% 2em;*/
  padding: 60px 2em;
  overflow: hidden;
}

.cd-main-content p {}

@media only screen and (min-width: 1024px) {/*Styles au-dessus de 1024px */
  .cd-main-content {width:100%;max-width:1260px;
    padding-top: 80px;
  }
  .cd-main-content.sub-nav {
    padding-top: 150px;
  }
  .cd-main-content.sub-nav-hero.secondary-nav-fixed {
    margin-top: 70px;
  }
  .cd-main-content p {
  }
}

/*========================================== 
	PAGES
==========================================*/
.gallery{padding-top:35px;}

 /*---------menu mentions ----------*/  
footer{vertical-align:bottom;}
#menu_mentions{height:;margin:auto ;text-align:center}
#menu_mentions li + li{border-left:1px solid #fff;}
#menu_mentions li a{font-weight: 300;font-size: 1.0em;color:#fff;padding:0 12px}
#menu_mentions li a.lien_normal:link,#menu_mentions li a.lien_normal:active,#menu_mentions li a.lien_normal:visited {text-decoration:none;color:#fff}
#menu_mentions li a.lien_normal:hover{text-decoration:underline;color:#fff}
.mentions{width:100%;margin:auto}
.mentions p {font-size: 1.0em;}

/*================================
	PAGE CONTACT
=================================*/
fieldset{width:90%;min-height:120px;border:px solid #cbc9c4;margin:10px 0 5px 15px;padding:20px 30px;}
label{display:block;width:75%;font-size:14px;margin-left:10px;cursor:default;}
input, textarea{display:block;background-color:#f7ead2;border:0px;resize:none;padding:0 10px;outline:none;}
textarea{width:80%}
::placeholder{color:#999999;}
::placeholder:focus{color:#fff;}
input[type="text"],input[type="email"]{width:60%;height:28px;}
input[type="text"]:hover,textarea:hover{background-color:#FFF;border-left:4px solid #f78d1d;}
textarea:focus, input[type="text"]:focus {background-color:#FFF;border-left:4px solid #f78d1d;outline:none;}
input[type="submit"]{display:block;outline:none;cursor:pointer;text-align:center;text-decoration:none;padding:.5em 2em .55em;
	border-radius:5px;box-shadow:0 1px 2px rgba(0,0,0,.2);font-size:1.6rem;margin-top: 5px;color:#fef4e9;border:solid 1px #da7c0c;background: #f78d1d;
		background: -webkit-gradient(linear, left top, left bottom, from(#faa51a), to(#f47a20));
		background: -moz-linear-gradient(top,  #faa51a,  #f47a20);
		background: -o-linear-gradient(top,  #faa51a,  #f47a20);
}
.captcha{font-weight:bold;cursor:text;}
.remarque{display: none}/*classe du champ caché anti-spam*/
.erreur{color:#FF0000;font-size:16px;font-weight:400;padding:2px 5px;/*background-color: #FAB9AD;*/}
.erreur-bordure{caret-color: #FF0000;border: 1px solid red;border-left:2px solid red !important;}

/*===================
	ACCORDEON
 ==================*/
#faq {
width:70%;
  max-width: 700px;
  margin: 30px auto;
  padding: 0 15px;
  text-align: center;
}

section.faq {
  padding-top: 2em;
  padding-bottom: 3em;
}

#faq ul {
  text-align: left;
}
.transition, p, ul li i:before, ul li i:after {
  transition: all 0.3s;
}

#faq .no-select, #faq h2 {
  -webkit-tap-highlight-color: transparent;
  -webkit-touch-callout: none;
  user-select: none;
}

#faq h3 {
  color: #cc071e;
  line-height: 34px;
  text-align: left;
  padding: 15px 15px 0;
  text-transform: none;
  font-weight: 300;
  letter-spacing: 1px;
  display: block;
  margin: 0;
  cursor: pointer;
  transition: .2s;
}

#faq p {
  color: #333;
  text-align: left;
  font-family: 'hm_light', sans-serif;
  font-size: 14px;
  line-height: 1.45;
  position: relative;
  overflow: hidden;
  max-height: 250px;
  will-change: max-height;
  contain: layout;
  display: inline-block;
  opacity: 1;
  transform: translate(0, 0);
  margin-top: 5px;
  margin-bottom: 15px;
  padding: 0 50px 0 15px;
  transition: .3s opacity, .6s max-height;
  hyphens: auto;
  z-index: 2;
}

#faq ul {
  list-style: none;
  perspective: 900;
  padding: 0;
  margin: 0;
}
#faq ul li {
  position: relative;
  overflow: hidden;
  padding: 0;
  margin: 0;
  /*padding-bottom: 4px;*/
  /*padding-top: 18px;*/
  background: #dedcd9;
  box-shadow: 0 3px 10px -2px rgba(0,0,0,0.1);
  -webkit-tap-highlight-color: transparent;
}
#faq ul li + li {
  margin-top: 15px;
}
#faq ul li:last-of-type {
  padding-bottom: 0;
}
#faq ul li i {
  position: absolute;
  transform: translate(-6px, 0);
  margin-top: 28px;
  right: 15px;
}
#faq ul li i:before, ul li i:after {
  content: "";
  position: absolute;
  background-color: #cc071e;
  width: 3px;
  height: 9px;
}
#faq ul li i:before {
  transform: translate(-2px, 0) rotate(45deg);
}
#faq ul li i:after {
  transform: translate(2px, 0) rotate(-45deg);
}
#faq ul li input[type=checkbox] {
  position: absolute;
  cursor: pointer;
  width: 100%;
  height: 100%;
  z-index: 1;
  opacity: 0;
  touch-action: manipulation;
}
#faq ul li input[type=checkbox]:checked ~ h2 {
  color: #000;
}
#faq ul li input[type=checkbox]:checked ~ p {
  /*margin-top: 0;*/
  max-height: 0;
  transition: .3s;
  opacity: 0;
  /*transform: translate(0, 50%);*/
}
#faq ul li input[type=checkbox]:checked ~ i:before {
  transform: translate(2px, 0) rotate(45deg);
}
#faq ul li input[type=checkbox]:checked ~ i:after {
  transform: translate(-2px, 0) rotate(-45deg);
}
@media (max-width: 768px) {
	#faq {width:100%;}
}
/* ======== VIDÉO RESPONSIVE ======== */
.video-wrapper {
    width: 80%;              /* taille en % */
    max-width: 1000px;
    margin: auto;
    aspect-ratio: 16 / 9;    /* format 16/9 moderne */
    overflow: hidden;
}

.video-wrapper video {
    width: 100%;
    height: 100%;
    object-fit: cover;
}


/*========================================== 
	AUTO-HIDING NAVIGATION
==========================================*/
.cd-auto-hide-header .logo img {
	width:70px;height:auto;padding-top:22px;margin-right:5px;
}

.cd-auto-hide-header {
	border-top:10px solid #291F18;
	position: fixed;/*margin-top:20px;*/
	z-index: 2;
	top: 0;
	left: 0;
	width: 100%;
	height: 80px;
	background-color: #ffffff;
	/* Force Hardware Acceleration */
	-webkit-transform: translateZ(0);
		  transform: translateZ(0);
	will-change: transform;
	-webkit-transition: -webkit-transform .5s;
	transition: -webkit-transform .5s;
	transition: transform .5s;
	transition: transform .5s, -webkit-transform .5s;
}
.cd-auto-hide-header::after {
	clear: both;
	content: "";
	display: block;
}
.cd-auto-hide-header.is-hidden {
	-webkit-transform: translateY(-100%);
	  -ms-transform: translateY(-100%);
		  transform: translateY(-100%);
}
@media only screen and (min-width: 1024px) {
  .cd-auto-hide-header {
    /*height: 80px;*/height: 100px;
  }
}

.cd-auto-hide-header .logo,
.cd-auto-hide-header .nav-trigger {
	position: absolute;
	top: 50%;
	bottom: auto;
	-webkit-transform: translateY(-50%);
	  -ms-transform: translateY(-50%);
		  transform: translateY(-50%);
}

.cd-auto-hide-header .logo {
  left: 5%;
}
.cd-auto-hide-header .logo a, .cd-auto-hide-header .logo img {
  display: inline-block;
}

.cd-auto-hide-header .nav-trigger {
	/* vertically align its content */
	display: table;
	height: 100%;
	padding: 0 1em;
	font-size: 1.2rem;
	text-transform: uppercase;
	color: #25283D;
	font-weight: bold;
	right: 0;
	border-left: 1px solid #f2f2f2;
}
.cd-auto-hide-header .nav-trigger span {
	/* vertically align inside parent element */
	display: table-cell;
	vertical-align: middle;font-weight: normal;
}
.cd-auto-hide-header .nav-trigger em, .cd-auto-hide-header .nav-trigger em::after, .cd-auto-hide-header .nav-trigger em::before {
	/* this is the menu icon */
	display: block;
	position: relative;
	height: 2px;
	width: 22px;
	background-color: #25283D;
	-webkit-backface-visibility: hidden;
		  backface-visibility: hidden;
}
.cd-auto-hide-header .nav-trigger em {
	/* this is the menu central line */
	margin: 6px auto 14px;
	-webkit-transition: background-color .2s;
	transition: background-color .2s;
}
.cd-auto-hide-header .nav-trigger em::before, .cd-auto-hide-header .nav-trigger em::after {
	position: absolute;
	content: '';
	left: 0;
	-webkit-transition: -webkit-transform .2s;
	transition: -webkit-transform .2s;
	transition: transform .2s;
	transition: transform .2s, -webkit-transform .2s;
}
.cd-auto-hide-header .nav-trigger em::before {
	/* this is the menu icon top line */
	-webkit-transform: translateY(-6px);
	  -ms-transform: translateY(-6px);
		  transform: translateY(-6px);
}
.cd-auto-hide-header .nav-trigger em::after {
	/* this is the menu icon bottom line */
	-webkit-transform: translateY(6px);
	  -ms-transform: translateY(6px);
		  transform: translateY(6px);
}
@media only screen and (min-width: 1024px) {
	.cd-auto-hide-header .nav-trigger {
	display: none;
  }
}

.cd-auto-hide-header.nav-open .nav-trigger em {
	/* transform menu icon into a 'X' icon */
	background-color: rgba(255, 255, 255, 0);
}
.cd-auto-hide-header.nav-open .nav-trigger em::before {
	/* rotate top line */
	-webkit-transform: rotate(-45deg);
	  -ms-transform: rotate(-45deg);
		  transform: rotate(-45deg);
}
.cd-auto-hide-header.nav-open .nav-trigger em::after {
	/* rotate bottom line */
	-webkit-transform: rotate(45deg);
	  -ms-transform: rotate(45deg);
		  transform: rotate(45deg);
}

.cd-primary-nav {
	display: inline-block;
	float: right;
	height: 100%;
	padding-right: 5%;
}
.cd-primary-nav > ul {
	position: absolute;
	z-index: 2;
	top: 60px;
	left: 0;
	width: 100%;
	background-color: #ffffff;
	display: none;
	box-shadow: 0 14px 20px rgba(0, 0, 0, 0.2);
}
.cd-primary-nav > ul a {
	/* target primary-nav links */
	display: block;
	height: 50px;
	line-height: 50px;
	padding-left: 0%;
	color: #422816;
	font-size: 1.4rem;font-weight:400;
	text-decoration: none;
}
.cd-primary-nav > ul a:hover, .cd-primary-nav > ul a.active {
	color: #CC0000;font-weight:400;
}

@media only screen and (min-width: 1024px) {
  .cd-primary-nav {
    /* vertically align its content */
    display: table;
  }
  .cd-primary-nav > ul {
	/* vertically align inside parent element */
	display: table-cell;
	vertical-align: middle;
	/* reset mobile style */
	position: relative;
	width: auto;
	top: 0;
	padding: 0;
	background-color: transparent;
	box-shadow: none;
  }
  .cd-primary-nav > ul::after {
	clear: both;
	content: "";
	display: block;
  }
  .cd-primary-nav > ul li {
	display: inline-block;
	float: left;
	margin-right: 1.5em;
  }
  .cd-primary-nav > ul li:last-of-type {
    margin-right: 0;
  }
  .cd-primary-nav > ul a {
    /* reset mobile style */
    height: auto;
    line-height: normal;
    padding: 0;
    border: none;
  }
}

.nav-open .cd-primary-nav ul,
.cd-primary-nav ul:target {
  /* show primary nav - mobile only 
  	:target is used to show navigation on no-js devices
  */
  display: block;
}
@media only screen and (min-width: 1024px) {
  .nav-open .cd-primary-nav ul,
  .cd-primary-nav ul:target {
    display: table-cell;	
  }
}

/* -------------------------------- 
   MEDIA QUERIES
-------------------------------- */

@media only screen and (max-width: 1023px) {
	.cd-auto-hide-header .logo img {width:58px;padding-top:26px;}
	.cd-primary-nav > ul a {padding-left: 5%;}
}

@media only screen and (max-width: 960px) {
	body{font-size:1.2em;}
	.cd-auto-hide-header .logo img {width:56px;padding-top:20px;}
	.colonne_1, .colonne_2 {display:block; width:100%;}
}

@media (max-width: 768px) {
	body{font-size:1.2em;}
	.logo .h1-title{font-size: 1.4em;}
	.cd-main-content {margin: 4rem auto;padding: 2px}
	.cd-auto-hide-header .logo img {width:56px;padding-top:10px;}
	.h1-like{font-size: 1.6em;}
	.h2-like{font-size: 1.2em;}
	.h3-like{font-size: 1.1em;padding-top: 10px}
	.cd-primary-nav > ul a,
	.cd-primary-nav > ul a:hover,
	.cd-primary-nav > ul a.active {font-weight:300;}
	.colonne_1, .colonne_2 {display:block; width:100%;}
	input[type="text"], input[type="email"]{width:70%;}
	textarea{width:90%;}
	input[type=submit]{margin:10px;}
	label{text-align:left;}
	#faq {width:100%;}
}
@media (max-width: 480px) {
	body{font-size:1.1em;}
	.logo .h1-title{font-size: 1.4em;}
	.cd-auto-hide-header .logo img {}
	.h1-like{font-size: 1.8rem;}
	.h2-like{font-size: 1.2rem;}
	.h3-like{font-size: 1.1rem;padding-top:5px}
	input[type="text"], input[type="email"]{width:90%;}
	textarea{width:100%;}
	/*ACCORDEON*/
	#faq {width:100%;}
}

}	/* ! BALISE IMPORTANTE ???? NE PAS SUPPRIMER ! */


/*===================
	CAROUSSEL
 ==================*/
#container {
	max-width: 100%;
	margin: auto;
	overflow: hidden;
}
.css-carousel {
	position: relative;
	aspect-ratio: 1024 / 500;
	/*padding-bottom: 48.8%;  hauteur = 500 / 1024  */
	height: auto;
	overflow: hidden;
	margin: 15px auto;
}
.css-carousel .css-img {
	max-width: 100%;
	position: absolute;
	left: 0;
	right: 0;
	opacity: 0;
	animation: css-carousel-fade 35s ease-in-out infinite;
	/* Ci-dessus mettre le total des secondes de TOUTES les images.  Ici 7 X 5 secondes= 35s */
}

/* Délai d’apparition des images (35s / 7 images = 5s par image) */
.css-carousel .css-img:nth-child(1) { animation-delay: 0s; }
.css-carousel .css-img:nth-child(2) { animation-delay: 5s; }
.css-carousel .css-img:nth-child(3) { animation-delay: 10s; }
.css-carousel .css-img:nth-child(4) { animation-delay: 15s; }
.css-carousel .css-img:nth-child(5) { animation-delay: 20s; }
.css-carousel .css-img:nth-child(6) { animation-delay: 25s; }
.css-carousel .css-img:nth-child(7) { animation-delay: 30s; }

/* Animation fluide du fondu */
@keyframes css-carousel-fade {
 0% { opacity: 0; }
 5% { opacity: 1; }   /* Apparition progressive */
 20% { opacity: 1; }  /* Image visible */
 25% { opacity: 0; }  /* Disparition progressive */
 100% { opacity: 0; } /* Attente avant la boucle */
}