/*****************************************************************************************************************************/
/* Reset - Redefinitions des balises HTML */
/*****************************************************************************************************************************/
/*****************************************************************************************************************************/
*{margin:0; padding:0;}
*, *:after, *::before{-webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;}

body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, code, form, fieldset, legend, input, select, textarea, blockquote{font-family:'Poppins', sans-serif; font-size:1.3vw; color:#003c32; font-weight:400;}

fieldset, img{border:0}
address, caption, cite, code, dfn, em, strong, th, var{font-style:normal; font-weight:normal;}

a, button{color:#003c32; text-decoration:none; cursor:pointer; outline:none; transition:all 0.3s ease 0s;}
a:hover{color:#d76e1e;text-decoration:none;}

input:focus, a:focus, textarea:focus, select:focus, button:focus{outline:none;}

select option{padding:0 3px;}

ul li{list-style:none;}

table{border-collapse:collapse; border-spacing:0;}

iframe{border:none;}

hr{display:none;}

textarea{resize:none;}

img{vertical-align:middle;}

::-moz-selection{background:#b3d4fc; text-shadow:none;}
::selection{background:#b3d4fc; text-shadow:none;}



/*****************************************************************************************************************************/

/*****************************************************************************************************************************/
/* CLASS génériques */
/*****************************************************************************************************************************/
	strong{font-weight:normal;}
	em{font-style:italic;}

	.img-responsive{max-width:100%; height:auto;}
	.img-cover{width:100%; height:100%; object-fit:cover;}

	.hide-desk{display:none;}
	.hide-mob{display:inline-block;}

	.hidetext{font-size:0; text-indent:-9999px;}
	.txt-center{text-align:center;}



/*****************************************************************************************************************************/

/*****************************************************************************************************************************/
/* Structure generale */
/*****************************************************************************************************************************/
	body {
		text-align: center;
		background: #fff;
		-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
	}

	header, 
	#middle,
	footer,
	.page,
	.page-alt {
		position: relative;
		width: 100%;
		margin: 0 auto;
		text-align: left;
	}

	.page {
		width: 66.25vw;
		max-width: 1060px;
	}

	.page-alt {
		width: 80.6vw;
		max-width: 1290px;
		padding-left: 7.2vw;
	}

	.pad-top {
		padding-top: 5vw;
	}

	.d-flex {
		display: flex;
	}


	/* bouton */
	.btn {
		transition: all 0.3s ease 0s;
	}


	/* -------------- header -------------- */
	header {
		height: 10.9vw;
		padding-top: 1.3vw;
		background: url(../img/visuel-header.jpg) no-repeat;
		background-size: cover;
	}

	.pg-index header {
		height: 40vw;
		background-image: url(../img/visuel-header-home.jpg);
	}

		header .page {
			display: flex;
			align-items: center;
			justify-content: space-between;
			width: 90.6vw;
			max-width: 1450px;
			height: 7.2vw;
			padding: 0 3.5vw;
			background-color: #ffebaa;
		}
		

		/* logo */
		header .logo {
			width: 9.25vw;
		}


		/* burger */
		.burger {
			width: 30px;
			height: 24px;
			display: none;
			transform: rotate(0deg);
			transition: .5s ease-in-out;
			cursor: pointer;
			z-index: 10;
		}

			.burger span {
				position: absolute;
				left: 0;
				width: 100%;
				height: 3px;
				background: #003c32;
				border-radius: 1px;
				opacity: 1;
				display: block;
				transform: rotate(0deg);
				transition: .25s ease-in-out;
			}
			.burger span:nth-child(1) {
				top: 0px;
			}

			.burger span:nth-child(2),.burger span:nth-child(3) {
				top: 10px;
			}

			.burger span:nth-child(4) {
				top: 20px;
			}

			.burger.menuOpen span:nth-child(1) {
				top: 10px;
				left: 50%;
				width: 0%;
			}

			.burger.menuOpen span:nth-child(2) {
				transform: rotate(45deg);
			}

			.burger.menuOpen span:nth-child(3) {
				transform: rotate(-45deg);
			}

			.burger.menuOpen span:nth-child(4) {
				top: 10px;
				left: 50%;
				width: 0%;
			}


		/* nav */
		header .menu-mob {
			display: block;
		}

		header .inner-menu, 
		header .nav ul {
			display: flex;
			align-items: center;
			justify-content: flex-end;
		}

			header .nav ul li {
				font-weight: 500;
				text-transform: uppercase;
			}

			header .nav ul li + li {
				margin-left: 3.6vw;
			}

				header .nav ul .nav-on a {
					font-weight: 700;
				}


		/* reseaux */
		.reseaux {
			display: flex;
		}

		header .reseaux {
			margin-left: 4.5vw;
		}

			.reseaux a {
				height: 2.1vw;
				background-repeat: no-repeat;
				background-size: 100% auto;
			}

			.reseaux a:hover {
				opacity: 0.5;
			}

			.reseaux a + a {
				margin-left: 1.4vw;
			}

			.reseaux .ico-insta {
				width: 1.8vw;
				background-image: url(../img/picto-insta.png);
			}

			.reseaux .ico-fb {
				width: 1.1vw;
				background-image: url(../img/picto-fb.png);
			}

			.reseaux .ico-twt {
				width: 2vw;
				background-image: url(../img/picto-twt.png);
			}


	/* -------------- middle -------------- */
	#middle {
		padding-top: 4.5vw;
		overflow: hidden;
	}


		/* titre h1 */
		h1 {
			font-size: 2.6vw;
			font-weight: 800;
			text-transform: uppercase;
		}


		/* textes */
		.paragraphe, 
        .sstt {
			line-height: 1.6vw;
		}

		.notes {
			margin-top: 2.2vw;
			font-size: 1.1vw;
			line-height: 1.4vw;
		}

        .sstt {
            margin-top: 5px;
            font-style: italic;
        }


	/* -------------- footer -------------- */
	footer {
		padding: 4vw 0 3.4vw;
		background-color: #c3e1f0;
	}


		/* texte */
		.txt-footer {
			font-size: 2.2vw;
			font-weight: 800;
			text-transform: uppercase;
		}


		/* contact */
		footer .contact {
			display: flex;
			align-items: center;
			justify-content: space-between;
			margin-top: 4.25vw;
		}

			footer .contact .txt-contact {
				font-size: 2.5vw;
				font-weight: 300;
				text-transform: uppercase;
			}

				footer .contact .txt-contact:before {
					content: '';
					width: 3.3vw;
					height: 3.8vw;
					margin-right: 1.2vw;
					background: url(../img/logo-bas.png) no-repeat;
					background-size: 100% auto;
					display: inline-block;
					vertical-align: middle;
				}

			footer .contact .email-contact {
				font-size: 1.7vw;
				font-weight: 300;
			}


		/* textes et liens bas */
		footer .liens-bas {
			display: flex;
			align-items: center;
			justify-content: space-between;
			margin-top: 10.6vw;
		}

			footer .liens-bas p {
				font-size: 1.05vw;
				font-weight: 300;
			}



/*****************************************************************************************************************************/

/*****************************************************************************************************************************/
/* Bloc css de la page produits */
/*****************************************************************************************************************************/
/* slider */
.slider-produits {
	margin: 2.5vw 0 10vw;
}

	.slider-produits .inner-prod {
		position: relative;
		height: 41.25vw;
	}

		.slider-produits .inner-prod h2 {
			position: absolute;
			bottom: 3.6vw;
			left: 4vw;
			width: 55vw;
			font-size: 1.6vw;
			color: #000000;
			text-transform: uppercase;
			line-height: 2.2vw;
		}



/*****************************************************************************************************************************/

/*****************************************************************************************************************************/
/* Bloc css de la page faq */
/*****************************************************************************************************************************/
/* chapo */
.chapo {
	margin-top: 2.1vw;
	padding-right: 4vw;
	font-size: 1.9vw;
	text-transform: uppercase;
	line-height: 2.25vw;
}

.chapo.pad {
	padding-right: 14vw;
}


/* accordion */
.accordion {
	width: 100%;
	margin-bottom: 7.5vw;
}

	.accordion-control {
		position: relative;
		width: 100%;
		margin-top: 4vw;
		padding-right: 6.25vw;
		font-weight: 700;
		line-height: 1.6vw;
		cursor: pointer;
		transition: 0.4s;
	}

	.accordion-control:after {
		content: '';
		position: absolute;
		top: 0;
		right: 0.5vw;
		width: 1.4vw;
		height: 1.4vw;
		background: url(../img/acc-plus.gif) no-repeat;
		background-size: 100% auto;
		display: block;
		transition: all 0.3s ease 0s;
		transform: none;
	}

	.accordion-control.panel-open:after {
		content: '';
		background-image: url(../img/acc-moins.gif);
		transform: rotate(-180deg);
	}

	.accordion-panel {
		margin-top: 2vw;
		display: none;
		overflow: hidden;
	}



/*****************************************************************************************************************************/

/*****************************************************************************************************************************/
/* Bloc css de la page ou nous trouver */
/*****************************************************************************************************************************/
/* slider */
.slider-shops {
	margin-bottom: 6.25vw;
}

	.inner-shop .visuel-shop {
		height: 39.1vw;
	}

	.inner-shop .bandeau-shop {
		display: flex;
		min-height: 8.75vw;
		background-color: #fff0af;
	}

		.inner-shop .bandeau-shop .bd-logo {
			display: flex;
			align-items: center;
			justify-content: center;
			width: 27.1%;
		}

			.inner-shop .bandeau-shop .bd-logo .img-responsive {
				max-width: 80%;
			}

		.inner-shop .bandeau-shop p {
			width: 24.3%;
			padding: 2.4vw 10px 0.9vw 0;
			font-size: 1.25vw;
			line-height: 1.6vw;
		}

	.inner-shop .txt-shop {
		padding-top: 0.3vw;
	}

		.inner-shop .txt-shop h2 {
			margin-bottom: 1.75vw;
			font-size: 1.9vw;
			text-transform: uppercase;
		}

		.inner-shop .txt-shop .paragraphe {
			font-weight: 700;
			line-height: 1.6vw;
		}



/*****************************************************************************************************************************/

/*****************************************************************************************************************************/
/* Bloc css de la page partenaires */
/*****************************************************************************************************************************/
/* slider */
.slider-partners {
	margin: 4.6vw -0.3vw 0;
}

	.slider-partners .inner-prtn {
		position: relative;
		height: 25vw;
		margin: 0 0.3vw;
		cursor: pointer;
	}

		.slider-partners .inner-prtn .picto-info {
			display: flex;
			align-items: center;
			justify-content: center;
			position: absolute;
			bottom: 1vw;
			right: 1vw;
			width: 1.9vw;
			height: 1.9vw;
			border: 1px solid #fff;
			border-radius: 1.9vw;
			font-size: 1.4vw;
			color: #fff;
			opacity: 1;
			transition: opacity 0.3s ease 0s;
		}

		.slider-partners .inner-prtn:hover .picto-info {
			opacity: 0;
		}

		.slider-partners .inner-prtn .overlay-prtn {
			position: absolute;
			top: 0;
			bottom: 0;
			left: 0;
			right: 0;
			padding: 1.9vw 1.9vw 0;
			background-color: rgba(255, 255, 255, 0.9);
			opacity: 0;
			transition: opacity 0.3s ease 0s;
		}

		.slider-partners .inner-prtn:hover .overlay-prtn {
			opacity: 1;
		}

			.slider-partners .inner-prtn h2 {
				margin-bottom: 1.3vw;
				font-size: 2.2vw;
				font-weight: 800;
				line-height: 2.6vw;
			}

			.slider-partners .inner-prtn .paragraphe {
				max-height: 11.3vw;
				overflow: auto;
			}

			.slider-partners .inner-prtn .reseaux {
				position: absolute;
				bottom: 1.9vw;
				left: 1.9vw;
			}

				.slider-partners .inner-prtn .reseaux a + a {
					margin-left: 1.9vw;
				}


/* bloc bg couleur */
.bloc-bg {
	margin-top: 7.2vw;
	padding: 4.9vw 0 8.75vw;
	background-color: #ffd2b4;
}

	.bloc-bg .cadre {
		display: flex;
		margin-top: 4.7vw;
		background-color: #fff;
	}

		.bloc-bg .cadre .col-txt {
			width: 55.2%;
			padding: 3.6vw 2.5vw 2.4vw 3.1vw;
		}

			.bloc-bg .col-txt .logo-prtn {
				height: 5.9vw;
				margin-bottom: 2.7vw;
			}

				.bloc-bg .col-txt .logo-prtn .img-responsive {
					width: auto;
					height: 100%;
				}

			.bloc-bg .col-txt strong {
				font-weight: 700;
			}

		.bloc-bg .cadre .col-visu {
			width: 44.8%;
		}

			.bloc-bg .col-visu .visu-top {
				height: 36.6vw;
			}

			.bloc-bg .col-visu .visu-bot {
				height: 28.4vw;
			}



/*****************************************************************************************************************************/

/*****************************************************************************************************************************/
/* Bloc css de la page index */
/*****************************************************************************************************************************/
.pg-index #middle {
	padding-top: 0;
}


/* titre h1 */
.bot-header {
	position: absolute;
	bottom: 2.2vw;
	left: 50%;
	transform: translateX(-50%);
	width: 66.25vw;
	max-width: 1060px;
}

	.bot-header h1 {
		color: #fff;
		font-weight: 400;
	}

		.bot-header h1 strong {
			font-weight: 800;
			display: block;
		}


/* engagements */
.engagements {
	padding: 3.6vw 0 5.6vw;
	background: url(../img/bg-engagements.gif) no-repeat bottom center;
	background-size: 100% auto;
}


	/* titres h2 */
	.pg-index h2 {
		font-size: 2.6vw;
		font-weight: 800;
		text-transform: uppercase;
	}


	/* colonnes texte */
	.bloc-3cols {
		display: flex;
		justify-content: space-between;
		margin-top: 2.6vw;
	}

		.bloc-3cols .col-txt {
			width: 29.7%;
		}

			.bloc-3cols .col-txt h3 {
				margin-bottom: 1.25vw;
				font-size: 1.9vw;
				font-weight: 600;
			}

			.bloc-3cols .col-txt .paragraphe {
				font-size: 1.6vw;
				line-height: 1.9vw;
			}

			.bloc-3cols .col-txt .mea {
				margin-left: -1.1vw;
				padding: 0.7vw 1.1vw;
				background-color: #c3e1f0;
				font-size: 1.7vw;
				font-weight: 700;
				line-height: 2vw;
			}

			.bloc-3cols .col-txt .paragraphe + .mea {
				margin-top: 1.25vw;
			}

			.bloc-3cols .col-txt .mea + .paragraphe {
				margin-top: 0.7vw;
			}


	/* slider */
	.slider-eng {
		margin: 4.6vw 0 0;
	}

		.slider-eng .inner-prod {
			height: 24.4vw;
		}


/* agroecologie */
.agroecologie {
	position: relative;
	padding: 0 0 5.6vw;
}

	.pg-index .visuel {
		position: relative;
		width: 100%;
		height: 26.9vw;
	}

	.agroecologie h2 {
		position: absolute;
	    bottom: 2.2vw;
	    left: 50%;
	    transform: translateX(-50%);
	    width: 66.25vw;
	    max-width: 1060px;
		color: #fff;
	}

	.agroecologie .txt-agro {
		margin-top: 3.6vw;
		font-size: 2.2vw;
		text-transform: uppercase;
		line-height: 2.6vw;
	}


/* equipe */
.equipe {
	padding-bottom: 5.6vw;
	background-color: #d2e6c8;
}

	.equipe .visuel {
		margin-bottom: 3.3vw;
	}

	.equipe .txt-equipe {
		margin-top: 1.4vw;
		font-size: 1.7vw;
		font-weight: 600;
	}

	.equipe .liste-eqp {
		display: flex;
		justify-content: space-between;
		margin-top: 3.1vw;
	}

		.equipe .liste-eqp .col-eqp {
			width: 23.1%;
		}

			.equipe .col-eqp .visu-eqp {
				width: 90%;
				max-width: 233px;
				margin-bottom: 1.9vw;
			}

			.equipe .col-eqp h3 {
				margin-bottom: 1.25vw;
				font-weight: 700;
				text-transform: uppercase;
			}

			.equipe .col-eqp h4 {
				margin-bottom: 0.3vw;
				font-weight: 700;
			}
		

/* manifesto */
.txt-manifesto {
	padding: 3.5vw 0 6vw;
	font-size: 2.2vw;
	font-weight: 600;
	line-height: 2.6vw;
}

	.txt-manifesto strong {
		color: #dc6e1e;
		font-weight: 800;
	}

	.txt-manifesto .txt-caps {
		text-transform: uppercase;
	}

/* banner bg */
.banner {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 80px;
    background-color: #fff0af;
}

.banner-title {
    font-size: 1.1em;
    font-family: arial;
    background-size: cover;
    background-position: center;
}



/*****************************************************************************************************************************/

/*****************************************************************************************************************************/
/* Bloc css de la page ouverture */
/*****************************************************************************************************************************/
/* intro */
.intro {
	margin-top: 2.1vw;
	font-size: 2.4vw;
    text-transform: uppercase;
}

	.intro strong {
		font-size: 2.5vw;
		font-weight: 800;
	}

    .txt-color {
        color: #dc5f26;
    }

	.intro .txt-color {
		font-weight: 600;
	}


/* visuel */
.visu-single {
    position: relative;
    margin-top: 2.6vw;
}

    .visu-single .adresse {
        position: absolute;
        bottom: 14px;
        left: 50%;
        transform: translateX(-50%);
        width: 84%;
        padding: 0.6vw 10px;
        background-color: #ffebaa;
        font-size: 1.1vw;
        font-weight: 500;
        text-align: center;
        line-height: 1.4vw;
    }


/* texte */
.txt-alt {
    margin-top: 2vw;
    font-size: 1.3vw;
    line-height: 1.6vw;
}

    .txt-alt strong, 
    .txt-alt a {
        font-weight: 700;
    }

    .txt-alt a {
        text-decoration: underline;
    }

    .txt-alt a:hover {
        text-decoration: none;
    }


/* bandeau texte */
.bandeau-txt {
    margin-top: 3.1vw;
    padding: 2.1vw 0 2.25vw;
    background-color: #ffebaa;
    font-size: 2.1vw;
    font-weight: 500;
    text-align: center;
    text-transform: uppercase;
    line-height: 2.7vw;
}


/* liste produits */
.liste-produits {
    display: flex;
    flex-wrap: wrap;
    margin-top: 3.1vw;
}

    .liste-produits .prod-item {
        position: relative;
        width: 136px;
        margin: 0 3.75vw 0 -12px;
        padding-top: 24px;
        text-align: center;
    }

        .liste-produits .prod-item .visu-prod {
            width: 108px;
            height: 146px;
            margin: 0 auto;
            border: 2px solid #003c32;
        }

        .liste-produits .prod-item .txt-prod {
            padding: 10px 5px 64px;
            font-size: 12px;
        }

            .liste-produits .prod-item .txt-prod strong {
                font-weight: 700;
            }

        .liste-produits .prod-item .etiquette {
            position: absolute;
            top: 0;
            right: 0;
            width: 93px;
            height: 66px;
            padding: 2px 8px 0 0;
            background: url(../img/etiquette.png) no-repeat;
            background-size: 100% 100%;
            font-size: 12px;
            color: #fff;
            font-weight: 300;
            font-style: italic;
            text-align: right;
            line-height: 15px;
        }

            .liste-produits .prod-item .etiquette strong {
                font-weight: 700;
                font-style: italic;
            }

