.headervideo{
	width: 100%;
	height: 95vh;
	background-color: var(--noir);
	position: relative;
}
.headervideo video{
	width: 100%;
	height: 100%;
	object-fit: cover;
	opacity:0;
	transition: opacity 1s ease-out;
}
.headervideo .overlay{
	content:"";
	display: block;
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	z-index: 4;
	background-color: rgba(0,0,0,0.3);
}
.headervideo .overtext{
	position: absolute;
	width: 100%;
	height: 100%;
	z-index: 5;
	top: 0;
	left: 0;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-ms-align-items: center;
	align-items: center;
	justify-content: center;
	-webkit-flex-direction: column;
	-moz-flex-direction: column;
	-ms-flex-direction: column;
	-o-flex-direction: column;
	flex-direction: column;
}
.headervideo .overtext h1{
	color:var(--color1);
	font-size: calc(15px + 7.2vw);
}
.headervideo .overtext h1 strong{
	font-family:var(--sec-font);
	font-size: calc(10px + 5.2vw);
	font-weight:500;
	color:var(--color5);
	margin-bottom: 1.6vw;
}
.headervideo .overtext h1 span{
	animation-delay: calc(1s + 0.1s * var(--nth-child-rand))
}
.headervideo video{
	position: relative;
}
.valeurs{
	padding:var(--pad);
	background-color: var(--color1);
}
.valeurs h2{
	text-align: center;
}
.valeurs .values{
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-webkit-flex-wrap: wrap;
	-moz-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	-o-flex-wrap: wrap;
	flex-wrap: wrap;
	-ms-align-items: flex-start;
	align-items: flex-start;
	justify-content: center;
}
.valeurs .values > div{
	flex-basis: 20%;
	min-width: 150px;
	max-width:270px;
}
.valeurs .values > div div.icon{
	padding: 15%;
	width: 60%;
	max-width:150px;
	margin: 0 auto;
	position: relative;
}
.valeurs .values > div div.icon svg{
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
}
.valeurs .values > div div.icon img{
	z-index: 2;
	position: relative;
}
.valeurs .values > div{
	padding: 2vw;
}
.valeurs .values p{
	text-align: center;
	text-transform: uppercase;
	color:var(--blanc);
}
.products, .certifications{
	overflow: hidden;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
}
.products > .content, .certifications > .content{
	display: none;
	flex-basis: calc(100% - 200px);
	-ms-align-items: center;
	align-items: center;
	justify-content: center;
	padding: 0 6vw;
	background-color: #fff;
}
.products > .content.active{
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	animation: fadeInLeft 0.4s 0s 1 ALTERNATE ease-in-out forwards;
}
.products > .content > .img{
	flex-basis: 50%;
}
.products > .content > .content{
	flex-basis: 50%;
}
.products > .content .img > div, .certifications > .content > .img > div{
	position: absolute;
}
.products .content .img{
	position: relative;
	padding: 6%;
}
.products .content .img > img, .certifications .content .img > img{
	position: relative;
	z-index: 10;	
	transition:transform .3s cubic-bezier(.25,-.25,.35,2);
}
.products .content:hover .img > img, .certifications .content:hover .img > img, .products .content.hover .img > img, .certifications .content.hover .img > img{
	transition:transform .3s cubic-bezier(.25,-.25,.35,2);
	transform: scale(1.1) rotate(-5deg);
}
.products > .content .img > div img{
	width: 100%;
	height: 100%;
	object-fit: contain;
	object-position: center center;
}
.products > .content .img > div{
	width: 0;
	height: 0;
	top: 50%;
	left: 50%;
}
.products > .content.active .img.play > div, .certifications > .content .img.play > div{
	animation: shapeanim .8s calc(0.1s * var(--nth-child-rand)) 1 ALTERNATE cubic-bezier(.25,-.25,.35,2) forwards;
	transition:transform 0.4s ease-in-out;
	transform:scale(1, 1) rotate(0deg);
}
.products > .content.active .img.play:hover > div, .certifications > .content .img.play:hover > div, .products > .content.active .img.play.hover > div, .certifications > .content .img.play.hover > div{
	transition:transform 0.4s ease-in-out;
	transform:scale(1.2, 1.2) rotate(var(--rotate));
}
.products > .content .img > div:nth-of-type(odd), .certifications > .content .img > div:nth-of-type(odd){
	--rotate: -15deg;
}
.products > .content .img > div:nth-of-type(even), .certifications > .content .img > div:nth-of-type(even){
	--rotate: 15deg;
}
.content.active .img.play .sp1{
	z-index: 1;
	--shapewidth: 100%;
	--shapeheight: 100%;
	--shapeleft: -10%;
	--shapetop: 0;
}
.content.active .img.play .sp2{
	z-index: 2;
	--shapewidth: 20%;
	--shapeheight: 20%;
	--shapeleft: 75%;
	--shapetop: 70%;
}
.content.active .img.play .sp3{
	z-index: 3;
	--shapewidth: 30%;
	--shapeheight: 30%;
	--shapeleft: 60%;
	--shapetop: 0%;
}
.content.active .img.play .sp4{
	z-index: 1;
	--shapewidth: 50%;
	--shapeheight: 50%;
	--shapeleft: 0%;
	--shapetop: 8%;
}
.content.active .img.play .sp5{
	z-index: 2;
	--shapewidth: 15%;
	--shapeheight: 15%;
	--shapeleft: -5%;
	--shapetop: 30%;
}
.content.active .img.play .sp6{
	z-index: 3;
	--shapewidth: 30%;
	--shapeheight: 30%;
	--shapeleft: 20%;
	--shapetop: -5%;
}
.content.active .img.play .sp7{
	z-index: 3;
	--shapewidth: 10%;
	--shapeheight: 10%;
	--shapeleft: 80%;
	--shapetop: 80%;
}
.content.active .img.play .sp8{
	z-index: 2;
   --shape width: 36%;
    --shapeheight: 32%;
    --shapeleft: 9%;
    --shapetop: -2%;
}
.content.active .img.play .sp9{
	z-index: 1;
	--shapewidth: 25%;
	--shapeheight: 25%;
	--shapeleft: 5%;
	--shapetop: 5%;
}
.content.active .img.play .sp10, .certifications .content .img.play .sp10{
	z-index: 2;
	--shapewidth: 20%;
	--shapeheight: 20%;
	--shapeleft: 15%;
	--shapetop: 80%;
}
.content.active .img.play .sp11, .certifications .content .img.play .sp11{
	z-index: 1;
	--shapewidth: 100%;
	--shapeheight: 100%;
	--shapeleft: 5%;
	--shapetop: 0;
}
@keyframes shapeanim {
  to {
    width: var(--shapewidth);
	height: var(--shapeheight);
	left: var(--shapeleft);
	top: var(--shapetop);
  }
}
@keyframes shapeanim2 {
	0%{
		width: var(--shapewidth);
		height: var(--shapeheight);
		left: var(--shapeleft);
		top: var(--shapetop);
	}
	50% {
		width: calc(var(--shapewidth)*1.5);
		height:  calc(var(--shapeheight)*1.5);
		left:  calc(var(--shapeleft)*1.5);
		top:  calc(var(--shapetop)*1.5);
	}
	100%{
		width: var(--shapewidth);
		height: var(--shapeheight);
		left: var(--shapeleft);
		top: var(--shapetop);
	}
}
.products > .sidebar, .certifications > .sidebar{
	flex-basis: 200px;
	padding: 80px 40px;
	background-color: var(--color2);
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-webkit-flex-direction: column;
	-moz-flex-direction: column;
	-ms-flex-direction: column;
	-o-flex-direction: column;
	flex-direction: column;
	-ms-align-items: center;
	align-items: center;
	justify-content: center;
}
.products > .sidebar h5{
	font-size: 27px;
}
.sidebar a{
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-ms-align-items: center;
	align-items: center;
	justify-content: center;
	position: relative;
	width: 100px;
	aspect-ratio:1 / 1;
	margin-bottom: 30px;
}
.sidebar a svg{
	left: -5%;
	top: -5%;
	position: absolute;
	width: 110%;
	height: 110%;
}
.sidebar a span{
	position: relative;
	z-index: 10;
	text-transform: uppercase;
	font-family: var(--sec-font);
	color:var(--color2);
	font-size: 20px;
}
.sidebar a.active span{
	color:var(--blanc);
}
.sidebar a.active .st0{
	fill:var(--color1);
}
.sidebar a.active svg{
	filter: drop-shadow(4px 0 0 #f0974f) drop-shadow(-4px 0 0 #f0974f) drop-shadow(0 4px 0 #f0974f) drop-shadow(0 -4px 0 #f0974f) drop-shadow(1px 0 0 #f0974f) drop-shadow(-1px 0 0 #f0974f) drop-shadow(0 -1px 0 #f0974f) drop-shadow(0 1px 0 #f0974f);
}
/*
.recettes{
	position: relative;
	min-height:100vh;
	width: 100%;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-ms-align-items: center;
	align-items: center;
	justify-content: center;
	background-color: var(--color2);
	text-align: center;
}
.recettes .content{
	position: relative;
	z-index: 2;
}
.recettes > a{
	display: block;
	position: absolute;
	width: 15vw;
	aspect-ratio: 1/1;
	border-radius: 25px;
	overflow: hidden;
}
.recettes > a:nth-of-type(1){
	left: 5%;
	top: 35%;
}
.recettes > a:nth-of-type(2){
	left: 30%;
	top: 5%;
}
.recettes > a:nth-of-type(3){
	left: 20%;
	top: 65%;
}
.recettes > a:nth-of-type(4){
	left: 55%;
	top: 60%;
}
.recettes > a:nth-of-type(5){
	left: 70%;
	top: 15%;
}
.recettes > a:nth-of-type(6){
	left: 75%;
	top: 70%;
}
.recettes > a:nth-of-type(7){
	right: 0%;
	top: 40%;
}
.recettes > a:nth-of-type(8){
	left: 5%;
	top: -5%;
}
.recettes > a img{
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center center;
	transition: transform .3s cubic-bezier(.25,-.25,.35,2);
}
.recettes > a:hover img{
	transform: scale(1.2, 1.2);
}
.recettes > a span{
	position: absolute;
	padding: 20px;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	opacity: 0;
	-ms-align-items: center;
	align-items: center;
	justify-content: center;
	transition: opacity 0.4s ease-in;
	background-color: rgba(26,61,51,0.8);
	font-family:var(--sec-font);
	color:var(--blanc);
	text-transform: uppercase;
	font-size: 22px;
	line-height: 120%;
}
.recettes > a:hover span{
	opacity:1!important;
}
*/
.recettes{
	background-color: var(--color5);
}
.recettes > .content{
	text-align: center;
	margin-bottom: 8vh;
	padding-top: 10vh;
}
.galerie_recette {
    overflow: hidden;
   padding: max(5vw, 65px) 0 8vw;
}
.galerie_recette > div:not(.content){
    display: flex;
    gap: 15px;
    justify-content: center;
}

.galerie_recette > div img {
    aspect-ratio: 2 / 3;
    max-width: 16vw;
    object-fit: cover;
    border-radius: 2vw;
}

.galerie_recette > div a:nth-child(odd){
	position: relative;
	top: -65px;
}
.galerie_recette a span {
    position: absolute;
    padding: 20px;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    opacity: 0;
    -ms-align-items: center;
    align-items: center;
    justify-content: center;
    transition: opacity 0.4s ease-in;
    background-color: rgba(26, 61, 51, 0.8);
    font-family: var(--sec-font);
    color: var(--blanc);
    text-transform: uppercase;
    font-size: 22px;
    line-height: 120%;
	border-radius:2vw;
}
.galerie_recette a:hover span {
    opacity: 1 !important;
}
.trucsetastuces{
	background-color: var(--color3);
	padding:var(--pad);
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-ms-align-items: center;
	align-items: center;
	justify-content: center;
}
.trucsetastuces > div:nth-of-type(2):hover{
	transition:transform .3s cubic-bezier(.25,-.25,.35,2);
	transform: scale(1.1) rotate(-5deg);
}
.trucsetastuces > div{
	padding: 0 4vw;
	flex-basis: 50%;
	flex-grow: 1;
	min-width: 400px;
}
.trucsetastuces > div > img{
	border-radius: 100% 0 100% 100%;
	aspect-ratio:1/1;
	object-fit: cover;
	object-position:center center;
}
.certifications > .sidebar a{
	width: 100%;
	display: block;
	padding: 20px;
	position: relative;
}
.certifications > .sidebar a img{
	width: 100%;
	aspect-ratio: 1/1;
	object-fit: contain;
	object-position: center center;
}
.certifications > .content{
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-ms-align-items: center;
	align-items: center;
	justify-content: center;
}
.certifications > .content > div{
	padding:4vw;
	flex-basis: 50%;
}
.certifications > .content > .img {
	position: relative;
	margin: 10vh 0;
}
.certifications > .content > .img > img{
	position: relative;
	z-index: 5;
	border-radius: 0% 100% 100% 100%;
	aspect-ratio:1/1;
	object-fit: cover;
	object-position:center center;	
}
.tracabilite{
	background-color: var(--color3);
	min-height:100vh;
	width: 100%;
	position: relative;
}
.tracabilite .texture{
	pointer-events: none;
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
}
.tracabilite .texture img{
	width: 100%;
	height: 100%;
	object-fit: cover;
	z-index: 0;
}
.tracabilite .content svg{
	width: 40%;
	height: 40%;
	position: absolute;
	top: 0;
	left: 0;
}
.tracabilite .content{
	position: absolute;
	background-color: var(--color3);
	width: 100%;
	height: 100%;
	padding:var(--pad);
	left: 0;
	top: 0;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-ms-align-items: center;
	align-items: center;
	justify-content: space-between;
	z-index: 1;
	clip-path: url(#myClip);
}
.tracabilite .content .text{
	flex-basis: 35%;
	min-width: 500px;
	justify-self:flex-end;
}
.tracabilite .content .title{
	flex-basis: 35%;
	min-width: 500px;
	position: relative;
}
.tracabilite .content::after{
	content:url(../img/svg/ligne.svg);
	display: block;
	position: absolute;
	left: 15%;
	top: 45%;
	width: 45%;
}
.tracabilite .content .text h1{
	color:var(--blanc);
	line-height: 100%;
}
.tracabilite .content .text h1 strong{
	color:var(--color1);
}
#lepath{
	transform: scale(5) translate(27%, -7%);
}
.map{
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-ms-align-items: stretch;
	align-items: stretch;
	justify-content: center;
	background-color: var(--color5);
}
.map .content{
	flex-basis: 60%;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	justify-content: space-between;
	-webkit-flex-wrap: wrap;
	-moz-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	-o-flex-wrap: wrap;
	flex-wrap: wrap;
}
.map .content .text{
	padding: var(--pad);
}
.map .img{
	flex-basis: 40%;
	position: relative;
    align-self: stretch;
}
.map .img img{
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center center;
}
.map .pos{
	width: 100%;
	padding: 12vh 8vw 3vh 0vw;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-webkit-flex-wrap: wrap;
	-moz-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	-o-flex-wrap: wrap;
	flex-wrap: wrap;
	background-image: url(../img/svg/wave.svg);
	-webkit-background-size: cover;
	background-size: cover;
	background-repeat: no-repeat;
	background-position: top left;
}
.map .pos img{
	mix-blend-mode: darken;
	flex-basis: 33%;
	max-width: 350px;
	width: 33%;
	aspect-ratio:2/1;
	object-fit: contain;
	object-position:center center;
	padding: 1vh 3vw;
}
.map .pos img:nth-of-type(2){
	margin-right: 33%;
}
@media screen and (max-width:1540px){
	.tracabilite .content::after{
		width: 40%;
	}
}
@media screen and (max-width:1300px){
	.tracabilite .content::after{
		width: 35%;
		top: 50%;
	}
}
@media screen and (max-width:1200px){
	.tracabilite .content{
		align-items:flex-start;
	}
	.tracabilite .content .title {
		min-width: 0;
	}
	.tracabilite .content .text{
		flex-basis: 65%;
		min-width: 0;
	}
	.tracabilite .content::after{
		width: 25%;
        top: 20%;
        left: 9%;
        transform: rotate(15deg);
	}
}
@media screen and (max-width:1024px){
	.tracabilite .content{
		clip-path: none;
		position: relative;
	}
	.tracabilite .texture{
		display: none;
	}
	.tracabilite{
		min-height:0;
	}
	.tracabilite .content::after{
		top: 35%;
	}
	.certifications > .content{
		flex-wrap: wrap;
	}
	.certifications > .content > div{
		flex-basis: 100%;
	}
	.certifications > .content > .img{
		padding: 0 10vw;
	}
	.map{
		position: relative;
		-webkit-flex-wrap: wrap;
		-moz-flex-wrap: wrap;
		-ms-flex-wrap: wrap;
		-o-flex-wrap: wrap;
		flex-wrap: wrap;
	}
	.map .content{
		flex-basis: 100%;
	}
	.map .content .text{
		padding-right: 50%;
	}
	.map .img{
		position: absolute;
		top: 5vh;
		right: 5vw;
		width: 40%;
		aspect-ratio:1 / 1;
		object-fit: cover;
		object-position: center center;
		overflow: hidden;
		background-color: #fff;
		border-radius: 100% 0% 100% 100%;
	}
	.map .img{
		mix-blend-mode: multiply;
	}
	.map .pos{
		padding-right: 0;
	}
}
@media screen and (max-width:860px){
	.headervideo{
		height: 55vh;
	}
	.trucsetastuces{
		-webkit-flex-wrap: wrap;
		-moz-flex-wrap: wrap;
		-ms-flex-wrap: wrap;
		-o-flex-wrap: wrap;
		flex-wrap: wrap;
	}
	.trucsetastuces > div{
		min-width: 0px;
		flex-basis: 100%;
	}
	.trucsetastuces > div:nth-of-type(2){
		padding-top: 5vh;
	}
	.certifications > .sidebar a{
		width:120px;
	}
	.products, .certifications{
		-webkit-flex-wrap: wrap;
		-moz-flex-wrap: wrap;
		-ms-flex-wrap: wrap;
		-o-flex-wrap: wrap;
		flex-wrap: wrap;
	}
	.products > .content, .certifications > .content{
		flex-basis: 100%;
		order:2;
		padding-top: 5vh;
		padding-bottom: 5vh;
	}
	.products > .sidebar, .certifications > .sidebar{
		flex-basis: 100%;
		order:1;
		-webkit-flex-direction: row;
		-moz-flex-direction: row;
		-ms-flex-direction: row;
		-o-flex-direction: row;
		flex-direction: row;
		justify-content: space-around;
		-webkit-flex-wrap: wrap;
		-moz-flex-wrap: wrap;
		-ms-flex-wrap: wrap;
		-o-flex-wrap: wrap;
		flex-wrap: wrap;
		padding-bottom: 20px;
	}
	.products > .sidebar h5{
		flex-basis: 100%;
		text-align: center;
	}
	.products > .sidebar br{
		display: none;
	}
	.sidebar a span{
		text-align: center;
	}
	.galerie_recette > div img{
		max-width: 25vw;
	}
}
@media screen and (max-width:760px){
	.galerie_recette > div:not(.content){
		justify-content: flex-start;
	}
	.formulaire .colonne_01{
		width: 100%;
	}
	.galerie_recette{
		overflow-x: scroll;
	}
	.galerie_recette > div img{
		max-width: 35vw;
	}
	.galerie_recette a span{
		opacity: 1;
		height: auto;
		font-size: 15px;
	}
	.tracabilite .content{
		-webkit-flex-wrap: wrap;
		-moz-flex-wrap: wrap;
		-ms-flex-wrap: wrap;
		-o-flex-wrap: wrap;
		flex-wrap: wrap;
	}
	.tracabilite .content .title{
		flex-basis: 100%;
		text-align: center;
		order: 1;
	}
	.tracabilite .content .text{
		flex-basis: 100%;
		text-align: center;
		order: 3;
	}
	.tracabilite .content::after {
        width: 25vh;
        top: auto;
        left: auto;
		margin: 0 auto;
		aspect-ratio: 1 / 1;
        align-content: center;
        transform: rotate(90deg);
		position: relative;
		order:2;
    }
	.map .img {
        position: relative;
        width: 100%;
		flex-basis:100%;		
        height: auto;
		padding-bottom: 50%;
        aspect-ratio: auto;
        border-radius: 0;
        top: auto;
        left: auto;
		right: auto;
    }
	.map .img img{
		position: absolute;
		width: 100%;
		height: 100%;
		object-fit: cover;
		object-position: center center;
	}
	.map .content .text{
		padding: var(--pad);
	}
}