@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@100;200;300;400;500;600;700;800;900&display=swap');



/* GLOBAL */	

	*{
		box-sizing: border-box;
		/* text-wrap: balance; */
		/* background-color:rgba(255,0,0,0.3); */
	}

	html{
		height: 100%;
		background: var(--mc-white);
		scroll-behavior: smooth;
		overflow: scroll;
		scroll-padding-top: 50px;
	}
	html.html-freezed{
		overflow-y: hidden;
	}
	body{
		display: flex;
		flex-direction: column;
		min-height: 100vh;
		max-width: 2000px;
		font-family: var(--mf-primary);
		font-size:1.025rem;
		margin:0 auto;
		color:var(--mc-text);
		background-color: #FFF;
		/* background-image: url(../images/vector.png); 
		background-repeat: no-repeat;
		background-position: 45vw -50vh;*/
		/*background-position: top right;*/
	}
	body.body-wo-bg{
		background: unset;
	}

	body > div::before{
		content: '';
		background-color: red;
		display: block;
		width: 100%;
		height: 100%;
		position: absolute;
		z-index: 1000;
		opacity: 1;
		animation: expand var(--anim-intro) ease forwards;
		pointer-events: none;
	}

		@keyframes expand {
			0% {
			transform: translateY(0);
			opacity: 1;
			}
			99% {
			transform: translateY(100vh);	
			opacity: 1;	  
			}
			100%{
				opacity: 0;
			}
	  	}
	
	img,
	picture,
	svg{
		max-width: 100%;
		display: block;
	}
	img{
		height: auto;
		font-style: italic;
		background-repeat: no-repeat;
		background-size: cover;
	}

	button {
		appearance: none;
		border: 0;
		background: transparent;
		cursor: pointer;
	}

	a{color:var(--mc-secondary);text-decoration:none;-moz-transition: color 0.2s ease-in-out 0s;-webkit-transition: color 0.2s ease-in-out 0s;transition: color 0.2s ease-in-out 0s;}
	a:hover{text-decoration:none;color:var(--mc-primary);}
	a:focus{text-decoration:none;color:var(--mc-primary);box-shadow:none !important;}
	a.disabled {color:#CCC !important;pointer-events: none;}

	a.fb {color: #3B5A9A;}
	a.tw {color: #00AEF0;}
	a.ig {color: #D93175;}
	a.lk {color: #007BB6;}
	a.yt {color: #FF0000;}

	.text-muted{
		color:var(--mc-lightgrey);
	}
	
	.h1 span{
		display: block;margin-bottom: 1em;
		font-weight: 600;
		line-height: 1em;
		letter-spacing: -2px;
	}
	.h2, h2 {
		font-family: var(--mf-primary);
		color:var(--c-title);
		font-size: clamp(1.5em,2vw,2rem);
		margin: 0;
		text-wrap: balance;
	}
	.h3, h3{
		font-family: var(--mf-primary);
		font-size: 1.7em;
		text-wrap: balance;
	}
	.h4, h4{
		font-family: var(--mf-primary);
		font-size: 1.5em;
		text-wrap: balance;
	}
	.h5, h5{
		font-family: var(--mf-primary);
		font-size: 1.3em;
		text-wrap: balance;
	}
	hr{display:block;height:2px;background:#CCC;margin:0 5px;}

	.titre_rubrique {
		letter-spacing: -1px;
		font-size: 1.5rem;
		font-weight: 500;
		color: var(--mc-primary);
	}

	ul{list-style-type:none;padding:0;}
	.ul_custom{list-style-type:square;margin-left: 25px;}
	label{font-weight: normal;}

	.d-none{display: none !important;}
	.inline-block{display: inline-block;}

	.text-center{text-align: center;}
	.text-left{text-align: left;}
	.text-right{text-align: right;}

	.ml-auto{margin-left:auto !important;}
	.mr-auto{margin-right:auto !important;}

	.container{
		max-width: unset;
		width:min(var(--w-container), calc(100% - 1.5em));
		margin-inline:auto;
	}

	.nav-tabs > li.active > a, .nav-tabs > li.active > a:hover, .nav-tabs > li.active > a:focus {background-color: transparent;border:0 none;}
	.tooltip{letter-spacing: 0.5px;font-size: 14px;font-family:var(--mf-primary);}
	.annotation{font-size: 12px;font-style: italic;}

	.placeholder-img{object-fit: scale-down !important;opacity: 0.3;border: 1px solid #CFCFCF;}
	.ck-img-float-right{margin-bottom: 15px;margin-left: 15px;float:right;}
	.ck-img-float-left{margin-bottom: 15px;margin-right: 15px;float:left;}

	.alerte{
		font-size: 0.9rem;
		margin: 1rem;
	}
	.alerte-ok{
		color:darkgreen;
	}
	.alerte-ko{
		color:firebrick;
	}

	@media (max-width: 768px) {
		html{
			overflow-x: hidden;
		}
		.h1:where(.text-left,.text-right){
			padding-inline: unset !important;
		}
	}

	@media (max-width: 480px) {
		.ck-img-float-right, .ck-img-float-left{float: none;
		display: flex;-ms-align-items: center;align-items: center;}
	}

	/* ie9+ */
	.visually-hidden:not(:focus):not(:active) {
		clip: rect(0 0 0 0); 
		clip-path: inset(50%);
		height: 1px;
		overflow: hidden;
		position: absolute;
		white-space: nowrap; 
		width: 1px;
	}

/* FORMS */
	/* details des forms dans la section Pages plus bas*/

	

	form{
		width: fit-content;
	}
	
	form input:not(.spec):focus,
	form input:not(.spec):focus-visible,
	form textarea:not(.spec):focus,
	form textarea:not(.spec):focus-visible{
		outline: 0;
	}

	form :where(.ligne,.ligne-inline,.ligne-inline2){
		margin-top: 10px;
	}

	form .ligne{		
		position: relative;
		display: flex;
		flex-direction: column;
		margin-bottom: 1em;
		width: min(300px, 100% - 1em);
		margin:1em auto;
	}
	form .ligne,
	form .ligne-inline > div{
		display: flex;
		flex-flow: row wrap;
		gap:0.5em;
	}
	form .ligne-column{
		flex-direction: column;
	}
	form .ligne-inline:not(.ligne-inline2) div:nth-child(2){
		flex-grow: 1;
	}
	form .ligne-inline2 div{
		min-width: 170px;
	}
	form .ligne .champ{
		display: flex;
		flex-direction: column-reverse;
	}
	form .ligne .champ.champ_center{
		align-items: center;
	}
	form .ligne .champ.champ_fullw{
		width: 100%;
	}
	form .ligne label{
		display: block;
		margin-top: 0.75em;
		font-size: 0.9em;
	}
	form .ligne input:not([type='checkbox']){
		color: var(--mc-darkgrey);
		display: inline-flex;
		font-size: 15px;
		line-height: 1.3333333;
		transition: all .3s ease;
		border: 1px solid #b3b2c2;
		background: #fff 0 0 no-repeat padding-box;
		border-radius: 8px;
		height: 50px;
		padding: 0 40px 0 20px;
		font-family: var(--mf-primary);
	}
	form .ligne textarea{		
		font-family: var(--mf-primary);
		color: var(--mc-darkgrey);
		display: inline-flex;
		font-size: 15px;
		line-height: 1.3333333;
		transition: all .3s ease;
		border: 1px solid #b3b2c2;
		background: #fff 0 0 no-repeat padding-box;
		border-radius: 8px;
		height: 50px;
		padding: 5px 40px 0 20px;
	}

	form .cp{
		width:140px;
	}

	form .lien_motdepasseoublie a{
		color: var(--mc-primary);
	}
	form .lien_motdepasseoublie a:hover,
	form .lien_motdepasseoublie a:focus-visible{
		color: var(--mc-secondary);
	}

	form .ligne_full{
		width: 100%;
	}
	form .ligne_submit{
		justify-content: center;
		text-align: center;
		margin: 2em;
	}

	form.form_anim .ligne input{
		color: var(--mc-darkgrey);
		display: inline-flex;
		font-size: 15px;
		line-height: 1.3333333;
		transition: all .3s ease;
		border: 1px solid #b3b2c2;
		background: #fff 0 0 no-repeat padding-box;
		border-radius: 8px;
		height: 50px;
		padding: 0 40px 0 20px;
	}
	form.form_anim .ligne input:focus-visible{
		box-shadow: 0 1px 1px rgba(0,0,0,.5);
	}
	form.form_anim .ligne .champ{
		position: relative;
	}
	form.form_anim .ligne label {
		color: var(--mc-darkgrey);
		cursor: pointer;
		display: inline-block;
		font-weight: 400;
		margin: 0;
		position: absolute;
		transition: all .2s ease;
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
		max-width: 90%;
		letter-spacing: 0;
		top: 50%;
		left: 20px;
		translate: 0 -50%;
		font-size: 15px;
		opacity: 1;
		pointer-events: none;
	}
	form.form_anim .ligne select {
		color: var(--mc-darkgrey);
		display: inline-flex;
		font-size: 15px;
		line-height: 1.3333333;
		transition: all .3s ease;
		border: 1px solid #b3b2c2;
		background: #fff 0 0 no-repeat padding-box;
		border-radius: 8px;
		height: 50px;
		padding: 0 40px 0 20px;
		appearance:none;
	}
	
	form.form_anim .ligne select ~ label,
	form.form_anim .ligne input:focus-visible ~ label,
	form.form_anim input:not(:placeholder-shown) ~ label{
		color:var(--mc-primary);
		top:0;
		left: 20px;
		background:#fff;
		padding:5px 10px;
		font-size:12px;
		text-align:center;
		translate: -10px -50%;
	}
	form.form_anim .ligne select ~ i.icon,
	form.form_anim .ligne input ~ i.icon{
		position: absolute;
		top: 50%;
		right: 20px;			
		translate: 0 -50%;
		color:#ababab;
		cursor:pointer;
	}

	.champ_passwd{
		position: relative;
		max-width: 300px;
	}
	.champ_passwd input{
		width: 100% !important;
	}

	form.form_w_pwdlvl .passwd_level{
		position: absolute;
		display: inline-block;
		top:50%;
		right: 0;
		translate: 150% -50%;
		color:#CCC;
	}
	form.form_w_pwdlvl .passwd_level_libelle{
		font-size: 0.8em;
		color:#ababab;
		font-style: italic;
	}
	form.form_w_pwdlvl .passwd_level.weak{
		color:red;
	}
	form.form_w_pwdlvl .passwd_level.medium{
		color:orange;
	}
	form.form_w_pwdlvl .passwd_level.strong{
		color:green;
	}


	@media (max-width: 768px) {
		form .ligne, form .ligne-inline > div{
			flex-direction: column;
		}
		form.form_anim .ligne select ~ i.icon, form.form_anim .ligne input ~ i.icon{
			right: 2em;
		}
		form .ligne_submit{
			margin: 2em 0;
		}
	}
	@media (max-width: 380px) {
		.champ_passwd{
			padding-right: 2rem;
		}
		.champ_passwd input{
			width: unset;
		}
		form.form_w_pwdlvl .passwd_level{
			right: 0em;
		}
	}
	

/* BTN */
	
	.btn{
		padding: 0.25rem 2rem;
		font-weight: 500;
		line-height: 34px;
		display: inline-flex;
		align-items: center;
		justify-content: center;
		box-shadow: 0 0 1px rgba(0, 0, 0, 0);
		transition: 0.15s ease-in;
		border: 0;	
		font-size: 1rem;
		font-family: var(--mf-primary);
		cursor:pointer;
		border-radius: 10px;
		white-space: nowrap;

		&.btn-first {
			background-color: var(--mc-primary);
			color: var(--mc-white);
			
			&:is(:hover,:focus,:active){
				color: var(--mc-white);
				box-shadow: 0 10px 10px -10px rgba(0, 0, 0, 0.5);
				-webkit-transform: scale(1.05);
				transform: scale(1.05);
			}
		}

		@media (max-width: 768px) {
			font-size: 0.9rem;

		}

	}
	.btn-first:not(.btn-icon) i{margin-left: 1em;}

	.btn-second {
		background-color: var(--mc-secondary);
		color: var(--mc-white);
	}
	.btn-second:hover, .btn-second:focus, .btn-second:active {
		color: var(--mc-white);
		box-shadow: 0 10px 10px -10px rgba(0, 0, 0, 0.5);
		-webkit-transform: scale(1.05);
		transform: scale(1.05);
	}	
	.btn-second:not(.btn-icon) i{margin-left: 1em;}

	.btn-third {
		background-color: var(--mc-tertiary);
		color: var(--mc-white);
	}
	.btn-third:hover, .btn-third:focus, .btn-third:active {
		color: var(--mc-white);
		box-shadow: 0 10px 10px -10px rgba(0, 0, 0, 0.5);
		-webkit-transform: scale(1.05);
		transform: scale(1.05);
	}	
	.btn-third:not(.btn-icon) i{margin-left: 1em;}

	.btn-lightlight {
		padding: 0.25rem 2rem;
		background-color: var(--mc-lightlightgrey);
		color: var(--mc-darkgrey);
		border: 1px solid #CCC;
	}
	.btn-lightlight:hover, .btn-lightlight:focus, .btn-lightlight:active {		
		background-color: var(--mc-primary);
		color: var(--mc-white);
		box-shadow: 0 10px 10px -10px rgba(0, 0, 0, 0.5);
	}
	.btn-lightlight:not(.btn-icon) i{margin-left: 1em;}


	.btn-first:disabled{
		opacity: 0.5;
		transform: unset;
		box-shadow:unset;
		pointer-events: none;
	}
	

/* HEADER */

	.header{
		order:1;
		display: block;
		width: min(var(--w-container),100%);
		margin-inline:auto;
		z-index: 999;
		padding:0;
		transition: all 0.5s;

		& .wrapper{
			display: flex;
			gap:3rem;
			justify-content: space-between;
			align-items: center;
	
			& .logo{
	
				& a{
					display: flex;
					align-items: center;
				}
				& img{
					display: inline-block;
					max-height:110px;
					transition: all 0.5s;
				}
		
			}
		}
	}

	.search_wrapper{
		position: relative;
		flex: 1;
		max-width: 500px;
		z-index: 11;

		& .search_form {
			position:relative;
			width: 100%;
			margin:0;
			z-index: 5;
			display: flex;
		}
		& .search_form-close,
		& .search_form-label {
			display:none;
		}
		& .search_form-input {
			text-align:center;
			padding:13px 35px 13px 45px;
			font-size:12px;
			font-size:.75rem;
			line-height:1.1667;
			display:block;
			width:100%;
			border-radius:10px;
			border:2px solid #f5f5f5;
			background-color:#f5f5f5;
			font-weight:normal;
			font-style:italic;
			outline:#003880
		}
		& .search_form-input:focus,
		& .search_form-input[data-focus="true"],
		& .search_form-input:not([value=""]) {
			text-align:left
		}
		& .search_form-input:focus+button,
		& .search_form-input[data-focus="true"]+button,
		& .search_form-input:not([value=""])+button {
			left:18px;
			position:absolute;
			top:50%;
			-webkit-transform:translateY(-50%);
			-ms-transform:translateY(-50%);
			transform:translateY(-50%)
		}
		& .search_form-input:focus {
			border-color:var(--mc-primary);
		}
		& .search_form-btn,
		& .search_form-cancel {
			display:block;
			width:28px;
			height:28px;
			pointer-events:none
		}
		& .search_form-btn svg,
		& .search_form-cancel svg {
			width:100%;
			height:100%
		}
		& .search_form-btn {
			position:absolute;
			top:50%;
			left:50%;
			-webkit-transform:translate(-50%, -50%);
			-ms-transform:translate(-50%, -50%);
			transform:translate(-50%, -50%);
			left:calc(50% - 125px);
			-webkit-transition:ease-in, 0.25s;
			transition:ease-in, 0.25s;
			border: 0 none;
			background-color: transparent;
		}
		& .search_form-btn path {
			stroke:#434343
		}
		& .search_form-cancel {
			opacity:0;
			position:absolute;
			top:50%;
			-webkit-transform:translateY(-50%);
			-ms-transform:translateY(-50%);
			transform:translateY(-50%);
			background-color:transparent;
			border: 0 none;
			right:18px
		}
		& .search_form-cancel[data-show="true"] {
			opacity:1;
			pointer-events:initial
		}

		& .search_form-results {
			position:absolute;
			background-color:#fff;
			box-shadow:0 5px 10px 0 rgba(67,67,67,0.25);
			width:100%;
			top:calc(100% + 5px);
			left:0;
			font-size:12px;
			font-size:.75rem;
			line-height:1.5;
			border-radius:10px;
			overflow:hidden
		  }
		& .search_form-results-list-item + .search_form-results-list-item {
			border-top:1px solid #f5f5f5
		  }
		& .search_form-results-list-item a {
			display:flex;
			align-items:center;
			position:relative;
			padding:17px 20px;
			-webkit-transition:ease-in 0.25s;
			transition:ease-in 0.25s
		  }
		& .search_form-results-list-item a:hover {
			background-color:#f5f5f5
		  }
		& .search_form-results-list-item a:before {
			content:'';
			width:18px;
			height:18px;
			background-image:url("../img/icon/search.svg");
			background-size:cover;
			background-position:center;
			margin-right:10px
		  }
		& .search_form-results-list-item-title {
			max-width:calc(100% - 28px)
		  }
		& .search_form-results-noresult {
			padding:17px 20px
		}

		& .search_form-input[type="search"]::-webkit-search-decoration,
		& .search_form-input[type="search"]::-webkit-search-cancel-button,
		& .search_form-input[type="search"]::-webkit-search-results-button,
		& .search_form-input[type="search"]::-webkit-search-results-decoration {
			-webkit-appearance:none
		}
		& .search_form-input::placeholder {
			font-size:12px;
			font-size:.75rem;
			line-height:1.1667
		}
		& .search_form-input:-moz-placeholder {
			font-size:12px;
			font-size:.75rem;
			line-height:1.1667
		}
		& .search_form-input::-moz-placeholder {
			font-size:12px;
			font-size:.75rem;
			line-height:1.1667
		}
		& .search_form-input:-ms-input-placeholder {
			font-size:12px;
			font-size:.75rem;
			line-height:1.1667
		}
		& .search_form-input::-webkit-input-placeholder {
			font-size:12px;
			font-size:.75rem;
			line-height:1.1667
		}

	}

	.bottomheader{
		--height:300px;
		position: relative;
		padding-top: 1em;
		padding-bottom: 1em;
		border-top:5px solid #f5f5f5;

		& .wrapper{		
			display: grid;
			grid-template-columns: 1fr 1fr;
			grid-template-rows: auto;
			align-items: center;

			/* & > div:nth-child(2){
				height: 100%;
				background: url(../images/header_bmmoreno.webp) no-repeat center center;
				background-size: cover;
			} */
			
			& .titre{
				display: block;
				z-index: 1;
				font-size: clamp(2rem,2.9vw,3rem);
				font-weight: 800;
				letter-spacing: -0.5px;
				text-transform: uppercase;
				color:var(--mc-primary);
			}

			& .soustitre{
				z-index: 1;
				font-size: clamp(1rem,1.5vw,1.5rem);
				color:var(--mc-grey);
				text-transform: uppercase;
			}
		}
	}

	/* RESPONSIVE */
	@media (max-width:1200px){
		
	}

	@media (max-width:992px){
		.header .wrapper{
			justify-content: space-between;
		}
		.search_wrapper{
			& .search_form-btn {
				left: 25px;
			}
		}
	}
	@media (max-width:768px){
		.header .logo{
			margin-bottom: 0 !important;
			padding: 0 !important;
		}
		.header .logo img, .container-navigation.sticky .logo img{			
			max-height: 55px;
		}
		.bottomheader{
			--height: auto;
			
			.wrapper{
				position: relative;
				grid-template-columns: 1fr;
				grid-gap: 1em;

				& .visuel{
					--height: 150px;
				}
			}	
		}

		.search_wrapper {
			display: block;
			position: fixed;
			z-index: 111;
			width: 100%;
			max-width: initial;
			left: 0;
			padding: 60px 0 20px;
			height: 100vh;
			background: #fff;
			top: -100vh;
			opacity: 0;
			-webkit-transition: ease-in-out 0.25s;
			transition: ease-in-out 0.25s;
		}
		.search_wrapper[data-show="true"] {
			top: 0;
			opacity: 1;
			padding-inline: 1rem;

			& .search_form-close{
				display: block;
				position: absolute;
				top: -50px;
				right: 15px;
				cursor: pointer;
				width: 35px;
				height: 35px;
				border: 0 none;
				background-color: transparent;
			}
		}
	}

/* NAVIGATION */

	@media (min-width: 768px) {

		.nav_mobile{
			display: none;		
		}

		/* NAV TOP */	
			.nav_top{
				display: flex;
				flex-flow: row wrap;
				gap: 2em;
				align-items: center;	

				& > ul{
					display: flex;
					flex-flow: row wrap;
					align-items: center;
					visibility:visible;
					opacity:1;
					margin: 0 0 0 0;

					& > li {
						border: 0;
						position: relative;
						display: flex;
						align-items: center;
						padding-top: 1em;
						padding-bottom: 1em;

						& + li {
							margin-left: 1em;
						}

						& > a {
							display: inline-flex;
							height: 100%;
							align-items: center;text-align: center;
							border-collapse: collapse;
							position: relative;
							width: 100%;
							line-height: 1em;
							font-size: 1rem;
							font-weight: 600;
							padding-inline: 1em;
							font-family: var(--mf-primary);
							color:var(--mc-primary);
							text-decoration: underline;
							transition: all 0.35s;

							&.active{
								color:var(--mc-grey);
							}

							& i{
								font-size: 1.5em;
								margin-right: 0.5em;
							}
						}

						&:hover > a,	
						&:hover::after{
							color:var(--mc-primary);
							text-decoration: none;
						}

						&.nav_item_panier {
							& a{
								padding-right: 0.5rem;
							}
							& .total_panier{
								white-space:nowrap;
							}
						}
					}
				}

				& .has-children{
					&::after{
						content:'\f107';
						font-family: var(--mf-icon-primary);
						display: inline-flex;
						align-items: center;
						margin-left: 0.5em;
					}
		
					& .dropdown{
						position: absolute;
						top: 100%;
						left: 0;
						z-index: 1000;
						display: none;
						flex-direction: column;
						padding: .75rem;
						margin: 0;
						font-size: 1rem;
						color: #212529;
						text-align: left;
						list-style: none;
						background-color: #fff;
						background-clip: padding-box;
						border: 1px solid rgba(0,0,0,.15);
						white-space: nowrap;
		
						& a{
							text-transform: none;
							color:var(--mc-text);
							display: block;
							padding: 0.3em;
							font-weight: 500;
		
							&::before{
								content:'\f105';
								font-family: var(--mf-icon-primary);
								margin-right:2px;
								font-size: 0.8em;
							}
							&:hover{		
								color:var(--mc-primary);
							}
						}
					}
		
					&:hover .dropdown{
						display: flex;
					}
		
				}
			}
	
			.nav_top .spec_social ul{
				display:none;
				gap:0.25em;
				justify-content: space-evenly;
				width: 100%;

				& li a{
					padding: 0 1em;
					display: flex;
					height: 100%;
					align-items: center;
					font-size: 15px;
					color:inherit;
				}
			}
		
		/* NAV MAIN */
			.section_nav_main{
				background:#F5F5F5;
				/* margin-bottom: 2em; */
			}
			.nav_main{
				display: flex;
				flex-flow: row wrap;
				gap: 2em;
				align-items: center;	

				& > ul{
					display: flex;
					flex-flow: row wrap;
					align-items: center;
					width: 100%; /*Important pour décalage eventuel*/
					visibility:visible;
					opacity:1;
					margin: 0 0 0 0;

					& > li {
						border: 0;
						position: relative;
						display: flex;
						align-items: center;
						padding-top: 1em;
						padding-bottom: 1em;

						&:first-child::after{
							content: '|';
							margin-left: 1rem;
							color: var(--mc-grey);
						}

						& + li {
							margin-left: 1em;
						}

						& > a {
							display: inline-flex;
							height: 100%;
							align-items: center;text-align: center;
							border-collapse: collapse;
							position: relative;
							width: 100%;
							line-height: 1.222em;
							font-size: 1.125rem;
							font-weight: 700;
							padding-inline: 0.25rem;
							font-family: var(--mf-primary);
							color:var(--mc-grey);
							text-decoration: none;
							letter-spacing: -0.025rem;
							transition: all 0.35s;

							&.active{
								color:var(--mc-primary);
							}

							& i{
								font-size: 1.5em;
								margin-right: 0.5em;
							}
						}

						&:hover > a,	
						&:hover::after{
							color:var(--mc-primary);
							text-decoration: none;
						}
					}
				}
			}
	}

	@media (max-width: 1199px) {
		
		.container-navigation .nav_wrapper {
			flex:unset;
			display: flex;
			min-height: 75px;
			align-items: center;
			justify-content: end;
			z-index: 10;
			margin-right: 1em;
		}

		.mobile_navs {
			
			& ul li{
				
				border-bottom:1px solid var(--mc-lightgrey);

				&.nav_item_panier{
					display: flex;
					align-items: center;
				}

				& a{
					display: block;
					padding: 16px 20px;
					font-size: 16px;
					line-height: 1.125;
					font-weight: 700;
					color: var(--mc-grey);

					&:hover{						
						color: var(--mc-primary);
					}
				}
			}
		}

		/* Nav mobile avec icones */
		.nav_mobile{
			position: relative;
			display: flex;
			gap: 2em;
			z-index: 100;
			font-size: 1.5rem;
			text-align: right;
			padding: 0;
			cursor: pointer;

			& .item > *{
				position: relative;
				color:var(--mc-text);
			}

			& .item:hover > *{
				color:var(--mc-primary);
			}
			& .cart a::after{
				content:attr(data-nb);
				display: block;
				position: absolute;
				bottom: 0;
				right: 0;
				background-color: red;
				color: #FFF;
				font-size: 0.5em;
				padding: 0.15em 0.5em;
				border-radius: 50px;
			}
		}
		.nav_top{
			/* position: fixed; */
			display: flex;
			justify-content: end;
			gap: 1em;
		}
		.nav_top > ul{
			visibility:hidden;
			opacity:0;
			position: fixed;
			right: 0;
			top:0;
			display: flex;
			gap:1em;
			flex-direction:column;
			justify-content:start;
			width: min(280px,100%);
			z-index: 2000;
			padding:100px 1em 1em;
			margin: 0;
			background: var(--mc-white);
			height: 100vh;
			-webkit-transform: translateX(110%);
			-ms-transform: translateX(110%);
			transform: translateX(110%);
			-webkit-box-shadow: -10px 0 20px -10px rgba(0, 0, 0, 0.1);
			box-shadow: -10px 0 20px -10px rgba(0, 0, 0, 0.1);
			-webkit-transition: .3s all ease-in-out;
			-o-transition: .3s all ease-in-out;
			transition: .3s all ease-in-out;
		}
		.nav_top ul a{
			display: block;
			color:var(--mc-text);
			transition: all 0.35s;
		}
		.nav_wrapper.open .nav_top ul a:hover{
			padding-left: 0.25em;
		}
		.nav_wrapper.open .nav_top > ul{                   
			visibility:visible;
			opacity:1;
			transform:translateX(0%);
		}
		.nav_top > ul > li > a{
			display: block;			
			line-height: 1.3em;
			font-size: 1.2em;
			font-weight: 500;
			font-family: var(--mf-primary);	
			color: var(--mc-primary);		
		}
		.nav_top > ul > li:not(.spec_social) > ul > a:hover{
			padding-left: 0.25em;
		}
		.nav_top > ul > li.spec_search{
			display: none;
		}
		.nav_top .spec_social{
			padding-top: 1em;
			display: unset;
		}
		.nav_top .spec_social::before{
			content: 'Suivez-nous sur :';
			display: none;
			text-align: center;
			padding:1em;
			text-transform: none;
			font-size: 0.9em;
			margin-bottom: 1em;
		}
		.nav_top .has-children .dropdown a{
			padding-top: 0.3em;
			padding-bottom: 0.3em;
		}
		.nav_wrapper.open .burger{
			position: relative;
		}

		.nav_top .spec_social{
			padding-top: 1em;
			display: flex;
			flex-direction: column;
				
			&::before{
				content: 'Suivez-nous sur :';
				text-align: center;
				padding:1em;
				text-transform: none;
				font-size: 0.9em;
				margin-bottom: 1em;
			}

			& ul{
				display: flex;
				flex-flow: row wrap;
				justify-content: center;
				gap: 1em;
			}
		}

		.nav_main li:not(.li_catalogue){
			display: none;
		}
	}

	@media (max-width: 999px){
		/* .container-navigation .wrapper{
			padding-right: 1.5em;
		} */
	}
	@media (max-width: 900px){
		.header{			
			background-color: #FFF;
		}
	}

	@media (max-width: 768px){
		.nav_mobile{
			gap: 1.1rem;
		}
		.nav_main{
			& > ul{
				display: flex;
				flex-flow: row nowrap;
				align-items: center;
				gap:1em;
				overflow-x: scroll;
				scrollbar-width: none;

				& li{
					& a{
						color:var(--mc-primary);
					}
				}
			}
		}
	}
	

/* DIAPORAMA/SLIDER */
	
	.section_slider{
		--swiper-navigation-size:25px;
		position: relative;
		order:2;	
	}
	.mainslider{
		height: 100%;
		width:100%;
		margin-bottom: 0;
		margin-top: 0;
		
		&  div[class^="owl-stage"]{
			height: 100%;
		}

		& .item{
			--height:30vw;
			position: relative;
			height: min(var(--height),600px);
			display: grid;
			grid-template-columns: repeat(2, 1fr);
			background-color: var(--mc-white);

			& .image{
				order:2;

				& img{
					width: 100%;
					height: var(--height);
					object-fit: contain;
				}
			}

			& .caption {
				order:1;
				display: flex;
				flex-direction: column;
				align-items: start;
				justify-content: center;
				margin: 0;
				padding-left: 75px;
				text-align: left;
				transition: all 0.25s;

				& .wrapper{	
					width: min(var(--w-container), 100%);
				}
				& .content{
					width: min(900px, 100%);
					padding: 1em;
					/* background: rgba(255,255,255,0.5);
					clip-path: polygon(0 0, 80% 0%, 100% 100%, 0% 100%); */
				}
				& .titre{
					display: flex;
					margin:var(--margin);
					font-size: clamp(1.2rem,3vw,45px);
					width: min(600px, 100% - 1em);
					line-height: 1em;
					letter-spacing: 0.5px;
					font-family: var(--mf-secondary);
					font-weight: 700;
					color:var(--mc-black);
					transform: translateY(-100%);
					text-transform: uppercase;	
					opacity: 0;
					transition: all 1s ease-out;
				}
				& .texte{
					margin-top: 15px;
					font-size: clamp(15px,1.5vw,40px);		
					line-height: 1;
					color:var(--mc-primary);
					font-family: var(--mf-primary);
					font-weight: 500;
				}
				& .liens{
					display: flex;
					flex-flow: row wrap;
					justify-content:var(--justify-content);
					gap:var(--gap);
					width: 100%;
					margin-top: 15px;
					text-shadow: none;
				}
			}

			&.item-img-fullscreen{
				--height:30vw;

				& .image{
					position: absolute;
					z-index: 2;
					width: 100%;
					height: 100%;

					&[onclick]{
						cursor: pointer;
					}
				}
				& .caption{
					position: absolute;
					z-index: 3;
					width: 100%;
					height: 100%;
				}
			}
		}
	}
	.mainslider .item.swiper-slide-active .caption .titre,
	.mainslider .item:only-child .caption .titre{
		opacity: 1;
		transform: translateY(0%);
	}

	.slider-btn-next, .slider-btn-prev{
		--swiper-navigation-color:#000;
		position: absolute;
		z-index: 100;
		top: 50%;
		transform:translateY(-20px);
		cursor: pointer;
	}
	.slider-btn-prev{
		left: 10px;
		transform:translateY(-20px) rotateY(180deg);
	}
	.slider-btn-next{
		right: 10px;
	}
	.swiper-pagination{
		position: relative;

		& .swiper-pagination-bullet-active{
			background:var(--mc-grey);
		}
	}
	


	@media (max-width: 1200px) {
		.mainslider .item{
			.caption{
				padding: 0;
				--w-container:fit-content;
				transform: unset;
			}
		}
		.slider-btn-next, .slider-btn-prev{
			display: none;
		}
	}
	@media (max-width: 999px) {
		.mainslider .item{
			--height:auto;
			grid-template-columns: 1fr;

			

			& .image{			
				order:1;

				& img{
					--height:30vh;
				}
			}
			& .caption{				
				order:2;

				& .wrapper{
					width: 100%;
				}
				
				& .titre{
					width: unset;
					justify-content: center;
					font-size: 1.5em;
				}
				& .texte{
					text-align: center;
				}
				& .liens{
					justify-content: center;
					& .btn{
						padding: 0.15rem 1rem;
						font-size: 0.8rem;
					}
				}
			}
		}
		.swiper-button-next, .swiper-button-prev {
			bottom: 60px;
		}		
	}
	@media (max-width: 768px) {
		.item:not(.swiper-slide-active) .image {
			opacity: 0;
		}
		.mainslider .item{	
			& .image{
				& img{
					--height:unset;
				}
			}
		}
		.swiper-pagination{
			bottom: unset !important;
		}
		
	}
	@media (max-width: 480px) {
		.mainslider .item{
			--height:auto;
		}
	}

	.go_to_bottom a img{position:absolute;bottom:0px;left:50%;z-index:990;transform:translateX(-50%);}



/* FOOTER */
	
	#footer{order:4;
		position: relative;
		display: flex;
		flex-direction: column;
		padding: 0;
		background-color: var(--mc-white);
		color:var(--mc-text);

		& h2{
			font-weight: bold;
			margin-bottom: 1em;
		}
	}

	#footer .top_footer{
		background-color: var(--mc-lightlightgrey);
		color: var(--mc-primary);
		padding-top: 1.5rem;
		padding-bottom: 1.5rem;
		margin-top: 3rem;
		margin-bottom: 3rem;

		& ul{
			display: grid;
			grid-template-columns: repeat(auto-fit,minmax(200px,1fr));
			gap:2rem 2rem;

			& .item{
				display: flex;
				flex-flow: column;
				justify-content: center;
				align-items: center;
				gap: 1rem;				
				font-size: 0.9rem;

				& .titre{
					font-weight: 600;
				}
				& .texte{
					text-align: center;
				}
			}
		}
	}

	#footer .middle_footer{
		display: grid;
		grid-template-columns: repeat(3, 1fr);
		gap:1em;
		justify-content: center;
		align-items: center;
		padding:2rem 1rem;

		& .titre{

		}
	}

	#footer .bottom_footer{padding: 1em 0;}

	#footer .logo img{
		width: 160px;
		height:160px;
		object-fit: scale-down;
	}

	#footer .coordonnees{
		display: flex;
		justify-content: center;
		align-items: center;
		gap:1em;
		padding: 2em 0.5em;
		font-size: 0.9em;
	}
	#footer .coordonnees > div{margin: 0;line-height: 1.5em;}
	#footer .coordonnees .nom{
		font-size: 1.1em;
	}
	#footer .coordonnees .nom *{
		display: block;
	}
	#footer .coordonnees .tels{
		font-size: 2em;
		color:var(--mc-secondary);
		font-weight: 600;
		padding: 0.5em 0;
		letter-spacing: -1px;
	}
	#footer .coordonnees .tel::before{
		content:'\f095';
		font-family: var(--mf-icon-primary);
		font-size: 0.9em;
		margin-right:8px;
	}

	#footer .informations{
		position: relative;

		& > .titre{
			font-size: 1.125rem;
			font-weight: 600;
			text-transform: unset;
		}
	}

	#footer .menus{
		display: flex;
		flex-direction:column;
		justify-content: start;
		gap:0.5em;
	}
	#footer .menus li{
		padding:0px 5px;
	}
	#footer .menus li a{
		color:inherit;
		font-size: 0.9em;
	}
	#footer .menus li a::before{
		content:"\f105";
		font-family: var(--mf-icon-primary);
		margin-right:5px;
	}
	#footer .menus li a:hover{
		color:var(--mc-primary);
	}

	#footer .suiveznous{
		padding-top: 2rem;
		padding-bottom: 2rem;
		text-align: center;

		& .titre{
			font-size: 1.5em;
			font-weight: bold;
			color:var(--mc-grey);
		}

		& ul{
			display: flex;
			justify-content: center;
			gap: 1.5em;
			width: 100%;
			flex-flow: row wrap;
			align-items: center;

			& li a{
				font-size: 2em;
			}
		}
	}
	/* copyright */
		#footer .copyright{text-align: center;padding:15px 0;background-color: #EFEFEF;color:#333;font-size: 12px;}
		#footer .copyright a{color:var(--mc-black);}
		#footer .copyright a:hover{color:var(--mc-darkgrey2);text-decoration: none;}
		#footer .copyright .auteur{display: inline-block;}

	/* RESEAUX SOCIAUX */
		#footer .reseausocial{text-align: center;}
		#footer .reseausocial a {background-color: #ffffff; border-radius: 50%;color: #555555; display: inline-flex;justify-content: center;align-items: center;
			font-size: 14px;width: 36px;height: 36px;line-height: 36px;text-align: center;
			transition-delay: 0s; transition-duration: 0.25s;transition-property: all;transition-timing-function: ease;	}
		#footer .reseausocial a:hover {background-color: var(--mc-black);color: #FFF;}
		#footer .reseausocial a i{transition-delay: 0s;transition-duration: 0.3s;transition-property: all;transition-timing-function: ease;}
		#footer .reseausocial a:hover i {animation-delay: 0s;animation-direction: normal;animation-duration: 0.3s;animation-fill-mode: forwards;animation-iteration-count: 1;animation-name: toRightFromLeft;animation-play-state: running;animation-timing-function: ease;color: #ffffff;}
		
		


	@media (max-width: 768px) {
		#footer .top_footer{
			margin-top: 1rem;

			& ul{
				grid-template-columns: repeat(2, 1fr);
			}
		}
		#footer .middle_footer{
			grid-template-columns: repeat(2, 1fr);

			& .titre{
				text-align: center;
			}
		}
		#footer .informations::after{display: none;}
		#footer .logo{max-width: 200px;}
		#footer .coordonnees{flex-direction: column;}
		#footer .menus{flex-direction: column;justify-content: center;margin-left: 0;padding: 2em 0;}

	}
	@media (max-width: 580px) {
		#footer .coordonnees{text-align: center;}
		#footer .coordonnees .part2{padding-left: unset;}
	}


/* PAGES */
	.pg{
		order:3;
		min-height: 75vh;
		margin-top: 2rem;

		&:has(.pg_home, .pg_produit, .pg_catalogue){
			margin-top: 0;
		}

		& .pg_header{
			position: relative;

			& img{
				width: 100%;
				height: 300px;
				object-fit:cover;
			}
		}
		& .no_pg_header{
			position: relative;min-height: 80px;background-color: var(--mc-secondary);
		}
	}
	
	.pg_content {
		& .h1 span{		
			font-size: 40px;
		}
		& .texte{
			& iframe{
				margin-inline: auto;
			}
		}
			
	}

	.h1.titre_page span{
		color:var(--c-title);
	}
	.h1 span::before{
		background-color: var(--bgc-title);
	}
	.texte{
		color:var(--c-text);
	}
	
	@media (max-width: 768px) {
		.pg .pg_content{
			--c-title:var(--mc-primary);

			& .h1 span::before{
				height: 0;
			}
			& .format_7 .h1 span{
				color:#000;
			}
			& .texte{
				& iframe{
					width:100%;
					height:30vh;
				}
			}
		}
	}

	/* HOME */

		.pg_home{
			color:var(--mc-darkgrey2);
			min-height:10px;
			padding: 0;
			padding-bottom: 1em;

			& .pg_header{
				display: none;
			}

			& .texte{
				margin-top: 1.5em;
				font-size: 0.9rem;
			}
		}		
		
		/**/
		.offre_choix_livraison_close {
			position: absolute;
			top: 5px;
			right: 10px;
			appearance: none;
			border: 0;
			background: 0;
			cursor: pointer;
			font-size: 1.3em;

			&:hover{
				color: var(--mc-secondary);
			}
		}

		dialog{
			border:0;
			border-radius: 20px;
			
			&::backdrop{
				background-color: rgba(0, 0, 0, 0.5);
			}
			&[open] {
				animation: showDialog 1s ease normal;
				-webkit-animation: showDialog 1s ease normal;
			}
			&.closing {
				animation: closingDialog 1s ease normal;
				-webkit-animation: closingDialog 1s ease normal;
			}
		}

		@keyframes showDialog{
			from {
				transform: translateX(200%);
			}
			to {
				transform: translateX(0%);
			}
		}
		@keyframes closingDialog{
			from {
				transform: translateX(0%);
			}
			to {
				transform: translateX(-200%);
			}
		}
		

		.pg_content{
			position: relative;
		}
		.pg_home .pg_content{
			transform: unset;
		}


		@media (max-width: 580px) {
			
			.offre_magasins .wrapper{
				display: flex;
				flex-direction: column-reverse;
			}
			.offre_magasins .plan{
				order:1;
				text-align: center;
			}
			.offre_magasins .liste{
				grid-template-columns: unset;
			}
			.offre_magasins .liste .item{
				width: 100%;
			}
			.offre_magasins .item a{
				flex-direction: row;
				height: unset;
				padding-top: 0.5em;
				padding-bottom: 0.5em;
			}

			.offre > .wrapper .sav{
				opacity:0.2;
			}

			.offre_close .alert_close{
				top: 25%;
			}
			
		}
		@media (max-width: 480px) {
			
			.offre {
				display: flex;
				flex-direction: column;
			}
			
			.offre .tarifs{
				justify-content: center;
			}
			.offre .tarifs > div{
				font-size: 2.5em;
			}
			
			.offre_magasins{
				width: 100%;
				padding: 1em 0;
			}
			.offre_magasins > *{
				padding-inline: 1em;
			}
		}

		@media (max-width: 920px) {
			.offre > .wrapper{
				display: flex;
				flex-direction: column;
				gap: 2em;	
			}
			.offre > .wrapper .visuel{
				text-align: center;
			}						
			.offre > .wrapper .visuel img{
				width: min(550px, 100% - 1em);
				margin: 0 auto;
				transform: unset;
			}
			.offre .visuel{
				order:3;
			}
			.offre .visuel img{
				transform: unset;
			}
			.offre .surtitre{
				order:1;
			}
			.offre .titre_soustitre {
				order:2;
			}
			.offre .infos{
				order:4;
			}

		}
		@media (max-width: 768px) {
			.offre > .wrapper .visuel{
				width: min(450px, 100% - 1em);
				margin: 0 auto;
				text-align: center;
			}	
			.offre > .wrapper .visuel img{
				height: auto;
			}
			.offre > .wrapper .tarifs{
				flex-direction: column;
				gap: 0;
			}

			.offre_choix_livraison > .wrapper{
				flex-direction: column;
			}
			.offre_choix_domicile{
				padding: 0;
			}
			.offre_choix_domicile::before{
				display: none;
			}
		}
		@media (max-width: 1290px) {
			.offre > .wrapper .visuel img{
				width: 100%;
				padding:0 1em;
				transform: unset;
			}
		}
		
	
	/* RESA */
		.form_order{
			--w-container:850px;
			padding-bottom: 2em;
			margin-bottom: 2em;
			min-height: 400px;

			& form{
				width: 100%;
				margin:0;
				padding:2em;
				background:conic-gradient(at top right, #EFF0F1, #eeeef2);
				border-radius:20px;

				&:first-of-type{
					border-radius: 20px 20px 0 0;
				}
				&:last-of-type{
					border-radius: 0 0 20px 20px;
				}
				& .lieu_retrait{
					font-weight: bold;
		
					& span{
						&.libelle{
							color: var(--mc-primary);
						}
						.lieu{
							color: var(--mc-secondary);
						}
					}
				}
				& .ligne{
					&.ligne-inline{
						width: unset;

						& > div{
							flex: 1;
						}
					}
					&.ligne_checkbox{
						position: relative;
						display: block;

						& label{
							margin: 0 0 0 30px;
						}
						& input[type='checkbox']{
							width:unset;
							position: absolute;
							top: 0;
							left: 0;
						}
					}
					& input:not([type='checkbox']){
						width: min(calc( 2 / 3 * var(--w-container)), 100% - 1em);
						border: none;
					}
				}
				& .cta{
					padding:1em;
					text-align: center;
				}
				& .logos-paiement img{
					width: 100%;
					object-fit: scale-down;
				}
			}
			& .section_selection{
				padding:0 2em;

				& .titre_section_simple {
					text-transform: unset;
				}

				& .section_selection__panier{
					
                    display:flex;
                    flex-direction:column;	
                    padding:1rem;
                    font-size: 0.9rem;

					& .ligne_details_header{
						display:flex;
						align-items: end;
						width:100%;
						gap:1rem;

						& .head{
							padding:0.5rem;
							border-bottom:1px solid #CCC;
							
							&.qte{
								text-align: center;
							}
						}
					}
					& .ligne_details_item{
						display:flex;
						width:100%;
						gap:1rem;

						& .qte{
							text-align: center;
						}
					}
				}
				& .ligne_total_final{
					padding:1rem 0.5rem;
					text-align: right;
					
					& b{
						text-transform: uppercase;
						color: var(--mc-primary);
						padding-right: 1rem;
					}
				}
			}
			& form.form_order_recap .section_selection{
				padding:0;
			}
			& .titre_section {
				font-weight: 600;
				text-transform: uppercase;
				color: var(--mc-primary);

				&:not(.titre_section_simple)::before {
					content: '';
					width: 10px;
					aspect-ratio: 1;
					background-color: var(--mc-secondary);
					display: inline-block;
					margin-right: 10px;
				}
			}

			@media (max-width: 1199px) {
				& form{
					width: auto;
					padding-inline:0.5rem;
				}
			}
			@media (max-width: 768px) {

				& .form_adresses .liste_adresses,
				& .form_order_recap .liste_adresses{
					flex-direction: column;
				}				
				& .section_selection{
					padding:1rem 0;

					& .section_selection__panier{
						padding-inline: 0;
					}
				}
			}
			@media (max-width: 580px) {
				& form .ligne.ligne_checkbox {
					display: flex;
					flex-direction: column-reverse;
					justify-content: start;
					align-items: start;
				}
			}
		}
		
		#form_order_crea input:not([type='checkbox']){
			width: min(calc( 0.4 * var(--w-container)), 100% - 1em);
		}
		#form_order_crea input#email{			
			width: min(calc( 0.6 * var(--w-container)), 100% - 1em);
		}

		#form_order_crea .ligne select ~ i.icon,
		#form_order_crea .ligne input ~ i.icon{
			position: absolute;
			top: 50%;
			right: 20px;			
			translate: 0 -50%;
			color:#ababab;
			cursor:pointer;
		}
		
		#form_order_crea .champ_cpville{
			display: flex;
			flex-flow: row;
		}
		
		#form_order_crea .champ_cpville .champ{
			width: unset;
		}
		#form_order_crea .champ_cpville .cp {
			width: 100px;
			padding: 0 20px 0 20px;
		}

		/* ETAPE CHOIX ADRESSES SI CONNECTE */
			.form_adresses{
				padding:2em;
				background:conic-gradient(at top right, #EFF0F1, #eeeef2);
				border-radius:20px;
			}
			.form_adresses .liste_adresses{
				display:flex;
				flex-flow: row wrap;
				gap:2em;
			}
			.form_adresses .liste_adresses .bloc_adresse{
				flex:1;
			}
			.form_adresses .liste_adresses .bloc_adresse > .titre{
				font-weight: bold;
				color: var(--mc-primary);
			}
			.form_adresses .bloc_adresse .content{
				background:#FFF;
				padding:1em;
				border-radius:20px;
				margin-top:1em;
			}
			.form_adresses .bloc_adresse_livraison .liste{
				margin: 0;
			}
			.form_adresses .bloc_adresse_livraison .liste li{
				display: flex;
				flex-flow: column wrap;
				padding-bottom: 1em;
				border-bottom: 1px solid var(--mc-lightgrey);
			}
			.form_adresses .bloc_adresse_livraison .liste li:not(:first-child) {
				padding-top: 10px;
			}
			.form_adresses .bloc_adresse_livraison .liste li label{
				cursor: pointer;
			}
			.form_adresses .bloc_adresse_livraison .liste li label:focus-visible{
				background:var(--mc-lightlightgrey);
			}
			.form_adresses .bloc_adresse_livraison .liste li input ~ label{
				position: relative;
				padding-left: 30px;
			}
			.form_adresses .bloc_adresse_livraison .liste li input:checked ~ label{
				color:var(--mc-primary);
			}
			.form_adresses .bloc_adresse_livraison .liste li input:checked ~ label::before {
				content: '\f00c';
				font-family: var(--mf-icon-primary);
				display: inline-flex;
				font-weight: bold;
				position: absolute;
				left: 0;
			}
			.form_adresses .bloc_adresse_livraison .lien{
				text-align: right;
				font-size: 0.8em;
			}

			#modal_nouvelle_adresse {
				position: fixed;
				inset: 0;
				padding: 2em;
				z-index: 1000;
				width: min(590px, 100% - 1em);
				min-height: 400px;
				overflow-x: hidden;
			}
				.modal_nouvelle_adresse_close{
					position: absolute;
					top: 1em;
					right: 1em;
				}
			#modal_nouvelle_adresse form{
				background-color: #f5f5f5;
			}
			#modal_nouvelle_adresse form .ligne{
				margin: 1em;
			}
			#modal_nouvelle_adresse form .ligne-inline{
				width: unset;
			}
			#modal_nouvelle_adresse form .ligne-inline > div{
				flex: 1;
			}
			#modal_nouvelle_adresse form input:not([type='checkbox']){
				width: min(calc( 2 / 3 * var(--w-container)), 100% - 1em);
				border: none;
			}
			#modal_nouvelle_adresse form .ligne-submit{
				display: flex;
				justify-content: center;
				width: 100%;
			}
		
		/* ETAPE RECAPITULATIF AVANT PAIEMENT*/

			.form_order_recap{
				padding:2em;
				background:conic-gradient(at top right, #EFF0F1, #eeeef2);
				border-radius:20px;
			}
			.form_order_recap > section{
				margin-bottom: 3em;
			}
			.form_order_recap .liste_adresses{
				display:flex;
				flex-flow: row wrap;
				gap:2em;
			}
			.form_order_recap .liste_adresses .bloc_adresse{
				flex:1;
			}
			.form_order_recap   .liste_adresses .bloc_adresse > .titre{
				font-weight: bold;
				color: var(--mc-primary);
			}
			.form_order_recap .bloc_adresse .content{
				background:#FFF;
				padding:1em;
				border-radius:20px;
				margin-top:1em;
			}
			.form_order_recap .bloc_adresse_livraison .liste{
				margin: 0;
			}

		/**/

	/* CONTACT */

		#form_contact .actions{
			padding-top: 2em;
		}

		
		.contact_retour {
			text-align: center;
			display: flex;
			justify-content: center;
			align-items: center;
			padding: 1em 5em;
			/* background: #CCC; */
			width: fit-content;
			margin-inline: auto;
			margin-top:2em;
			/* color: #000; */
			flex-direction: column;
		}
		.contact_retour .success::before {
			content: '\f00c';
			display: block;
			font-family: var(--mf-icon-primary);
			font-size: 3em;
			color:var(--mc-primary);
		}
		.contact_retour .error::before {
			content: '\f057';
			display: block;
			font-family: var(--mf-icon-primary);
			font-size: 4rem;
			color:darkred;
		}
	/* CONFIRMATION */
		
		.confirmation .resume b{
			color: var(--mc-primary);
		}
		.confirmation .magasin{
			display: flex;
			gap: 1em;
			flex-direction: row-reverse;
			justify-content: space-between;
			width: min(800px,100% - 1em);
			margin: 2em auto;
			padding: 2em;
			background-color: var(--mc-lightlightgrey);
			border-radius: 20px;
		}
		.confirmation .magasin p{
			margin: 0;	
		}
		.confirmation .magasin .visuel{
			width: min(400px, 100% - 1em);
			text-align: center;
		}
		.confirmation .magasin .visuel img{
			height:200px;
			object-fit: scale-down;
			border-radius: 20px;
		}
		.confirmation .magasin .infos > div{			
			margin-bottom: 0.5em;
		}
		.confirmation .magasin .titre{
			font-size: 1.5em;
			text-transform: uppercase;
			color: var(--mc-primary);
			font-weight: bold;
		}
		.confirmation .magasin .contact{
			position: relative;
		}
		.confirmation .magasin .contact p{
			padding-left: 30px;
		}
		.confirmation .magasin .contact::before{
			content: '\f3c5';
			display: block;
			position: absolute;
			font-family: var(--mf-icon-primary);
			color:var(--mc-secondary);
			font-size: 1.3em;
		}
		.confirmation .magasin .horaires{
			position: relative;
		}
		.confirmation .magasin .horaires p{
			padding-left: 30px;
		}
		.confirmation .magasin .horaires::before{
			content: '\f017';
			display: block;
			position: absolute;
			font-family: var(--mf-icon-primary);
			color:var(--mc-secondary);
			font-size: 1.3em;
		}

		@media (max-width: 768px) {
			.confirmation .magasin{
				flex-direction: column;
				padding-inline: 0;
			}
			.confirmation .magasin .visuel img{
				height: unset;
				width: 100%;
			}
		}

	/**/

/* SIDEBAR GENERALE */
	
	#sidebar{
		position: fixed;
		z-index:101;
		top: 0;
		right: 0;
		width: min(350px, 90%);
		height: 100vh;
		background-color: rgba(255,255,255,0.98);
		padding:1rem;
		visibility: hidden;
		translate:100% 0;
		transition: translate 0.3s ease-in-out;

		&.open{
			visibility: visible;
			translate:0;
			transition: translate 0.3s ease-in-out;
		}

		& .close {
			display: block;
			width: 100%;

			& svg{
				float: right;
			}
		}

		& .sidebar__wrapper > div:not(.show){
			display: none;
		}

		

		
	}

/* PRODUITS */

	/* CATALOGUE */

		.pg_catalogue{
			margin-top: 2rem;

			& .pope_texte_court{
				width: 100%;
				padding: 2rem;
				background-color: #f8f8f8;
			}
		}

		/* liste globale des catégories de produits */
		.global_categorie_wrapper{
			display: none;

			&.open{
				display: block;
			}

			& .list_items{
				display:flex;
				flex-flow: row wrap;
				align-items:center;
				justify-content:center;
				gap:1em;
				
				& .item{
					width: min(300px, 100% - 1rem);
					border:1px solid #CCC;
					border-radius:15px;

					& a{
						display:flex;
						align-items:center;
						gap:1em;
						justify-content:center;
						padding:1em;
						color:var(--mc-darkgrey);
						font-size: 0.9rem;

						& img,
						& svg{
							width: 44px;
							height: 44px;
						}
					}

					&:hover{
						background:var(--mc-primary);
						
						& a{
							color: var(--mc-white);

							
						}
						& svg{
							fill: white;
						}
					}
				}
			}
		}

		.li_catalogue a{
			text-decoration: none !important;
			color: var(--mc-darkgrey) !important;

			&::before{
				content:'\f550';
				font-family: var(--mf-icon-primary);
				margin-right: 0.5rem;
			}
		}

		.header_product_list{
			display: flex;
			flex-flow: row wrap;
			justify-content: space-between;
			align-items: center;
			margin-top: -2rem;

			& .catalogue_filtres > button{
				padding:0.5em 1em;
				background-color: var(--mc-primary);
				color:var(--mc-white);
				border: 0 none;
				border-radius: 10px;
			}
		}

		/* Filtres */

			.btn_toggle_catalogue {
				display: flex;
				flex-flow: row nowrap;
				gap: 1em;
				align-items: center;

				& svg{
					width: 15px;
					aspect-ratio: 1;
					fill:#FFF;
				}
			}
			
		.catalogue_filtres__wrapper{
			position: absolute;
			visibility: hidden;
			opacity: 0;
		}
		.catalogue_filtres{
			&.show{

				& .catalogue_filtres__wrapper{
					position: relative;
					visibility: visible;
					opacity: 1;
				}
			}

			& .catalogue_filtres__form{
				width: 100%;
			}

			& .catalogue_filtres__titre{
				text-align: center;
				font-weight: bold;
				color: var(--mc-darkgrey);
			}

			& .catalogue_filtres__items{
				margin-top: 1rem;

				& .filtre__titre{
					font-weight: bold;
				}

				& ul li{
					padding:0.25rem 0;
					border-bottom: 0 none;
				}

				& .values .range::after{
					content: '€';
				}
			}
			& .action{
				text-align: center;
			}
		}

		

		/* test range slider */
			.rangeSlide{
				-webkit-appearance: none;
				-moz-appearance: none;
				appearance: none;
				width: 100%;
				outline: none;
				position: absolute;
				margin: auto;
				top: 0;
				bottom: 0;
				background-color: transparent;
				pointer-events: none;
			}
			.slider-track{
				width: 100%;
				height: 5px;
				position: absolute;
				margin: auto;
				top: 0;
				bottom: 0;
				border-radius: 5px;
				background-color: #dadae5;
			}
			.rangeSlide::-webkit-slider-runnable-track{
				-webkit-appearance: none;
				height: 5px;
			}
			.rangeSlide::-moz-range-track{
				-moz-appearance: none;
				height: 5px;
			}
			.rangeSlide::-ms-track{
				appearance: none;
				height: 5px;
			}
			.rangeSlide::-webkit-slider-thumb{
				-webkit-appearance: none;
				height: 1.2em;
				width: 1.2em;
				background-color: var(--mc-primary);
				cursor: pointer;
				margin-top: -9px;
				pointer-events: auto;
				border-radius: 50%;
			}
			.rangeSlide::-moz-range-thumb{
				-webkit-appearance: none;
				height: 1.2em;
				width: 1.2em;
				cursor: pointer;
				border-radius: 50%;
				background-color: var(--mc-primary);
				pointer-events: auto;
			}
			.rangeSlide::-ms-thumb{
				appearance: none;
				height: 1.2em;
				width: 1.2em;
				cursor: pointer;
				border-radius: 50%;
				background-color: var(--mc-primary);
				pointer-events: auto;
			}
			.rangeSlide:active::-webkit-slider-thumb{
				background-color: #ffffff;
				border: 1px solid var(--mc-primary);
			}
	
	/* LISTE */
	
		.product_list{
			/* --grid-nb-columns:5; */
			display: grid;
			grid-template-columns: repeat(var(--grid-nb-columns, 5), 1fr);
			gap: 2em 0.5em;
			justify-items: center;
			align-items: stretch;

			&.carousel{
				display: flex;
				justify-items: unset;
				align-items: start;
				gap: unset;
			}

			& > li{
				display: flex;
				justify-content:center;
				height: auto !important;

				& .product_list__item_wrapper{					
					position: relative;
					display: flex;
					flex-direction: column;
					flex-grow: 1;
					gap: 0.25rem 1.5rem;
					max-width:338px !important;
					background:var(--mc-lightlightgrey);
					border-radius: 15px;
					overflow: hidden;
					padding-bottom: 1.5em;

					& .image{
						overflow: hidden;
						cursor: pointer;
						
						& img{
							width: 100%;
							height:250px;
							object-fit: cover;
							transition: scale 250ms ease;
						}
					}
					
					& .operation{
						position: absolute;
						z-index: 10;
						top: 0.5rem;
						right: 0.5rem;
						display: flex;
						justify-content: end;

						& img{	
							width:50%;
							height:auto;
							object-fit: scale-down;
						}
					}
					& .marque {
						height: 2px;
						padding-left: 1.5rem;
						
						& img{
							width: 70px;
							height: 35px;
							object-fit: scale-down;
							translate: 0 -100%;
						}
					}
					& .titre{
						padding: 1rem;
						line-height: 1;
						text-transform: uppercase;
						color:var(--mc-grey);
						font-size: clamp(1rem,3vw,1.25rem);	
					}
					& .soustitre{
						display: block;
						font-size: 0.8em;
					}
					& .resume{
						display: -webkit-box;
						-webkit-line-clamp: 3;
						line-clamp: 3;
						-webkit-box-orient: vertical;
						overflow: hidden;
						padding:0 1rem 0;
						margin-bottom: 1rem;
						font-size: 0.9rem;
					}	
					& .prix{
						position: relative;
						display: grid;
						grid-template-columns: 1fr 1fr;
						grid-template-areas: 
							'prix_barre prix_ttc'
							'prix_barre prix_ht'
						;
						padding:0.75rem 1rem;	
						margin-top:auto;
						color:var(--mc-primary);
						white-space:nowrap;		
			
						&.prix_multiples::before{
							content:'A partir de';
							display: block;
							position: absolute;
							top: -0.25rem;
							left: 0;
							font-size: 0.9rem;
							font-weight: bold;
						}
						& .prix_barre{
							grid-area: prix_barre;
							font-size: 1.8rem;
							text-align: center;
							font-weight: 600;
							color:var(--mc-lightgrey);

							& span{
								position: relative;

								&::after {
									content: '';
									position: absolute;
									top: 50%;
									left: 0;
									width: 100%;
									height: 2px;
									background-color: var(--mc-primary);
									rotate: -10deg;
								}
							}
							
						}
						& .prix_ttc{
							grid-area: prix_ttc;
							text-align: center;
							font-size: 1.8rem;
							font-weight: 600;
							color:var(--mc-secondary);
						}
						& sup{
							position: absolute;
							font-size: 0.8rem;
							translate: -100% -50%;
						}
						& .prix_ht{		
							grid-area: prix_ht;
							text-align: center;

							& sup{
								position: unset;
							}
						}
					}
					& .actions{
						display: flex;
						flex-flow: row wrap;
						justify-content: center;
						align-items: center;
						gap: 1rem;
						padding-inline: 1rem;

						& a{
							font-size: 0.9rem;
							padding-inline: 1.25rem;
							
							&.btn-icon{
								padding:1em !important;
							}
						}		
					}
				}

				
				&:hover .image img{
					scale: 1.02;
				}
			}

			@media (max-width: 990px) {
				--grid-nb-columns:3;
				& > li{
					& .image{
						& img{
							height: auto;
						}
					} 
				}
			}
			@media (max-width: 768px) {
				--grid-nb-columns:2;
				& > li{
					& .image{
						& img{
							height: auto;
						}
					} 
				}
			}
			@media (max-width: 480px) {
				--grid-nb-columns:2;

				& > li{
					width: 100%;
					align-items: center;
					text-align: center;

					& .product_list__item_wrapper{
						& .prix{
							display: flex;
							flex-direction: column;
						}
						& .image{
							& img{
								height: 200px;
							}
						}
					}
				}
			}
		}
			/* .product_list > li .prix::before{
				--border-width:5px;
				content:'';
				display: block;
				width: 50%;
				height: 75%;
				position: absolute;
				top:calc(var(--border-width) * -2);
				left:calc(var(--border-width) * -2);
				border-top: var(--border-width) solid var(--mc-secondary);
				border-left: var(--border-width) solid var(--mc-secondary);
			} */

		.offredumois{
			& > .wrapper{
				display: grid;
				grid-template-columns: 1fr auto;
				grid-template-rows: repeat(3, auto);
				gap: 2em;
				margin-top: 1em;

				& .visuel { 
					grid-area:  1 / 2 / 4 / 3;

					& img{ 
						width: 650px;
						height: 550px;
						object-fit: scale-down;
						/* transform: scale(1.2);
						transform-origin:right; */
						
						animation-delay: calc(var(--anim-intro) + 0.2s);
						animation-duration: 0.8s;
					}
				}
				& .surtitre { 
					grid-area: 1 / 1 / 2 / 3;
					font-size: clamp(1.3em,2vw,2.2em);
					color: var(--mc-secondary);
					font-weight: 800;
					text-transform: uppercase;
					display: none;
					height: 0;
				}
				& .titre_soustitre { 
					grid-area: 1 / 1 / 2 / 2;
				}
				& .infos { 
					grid-area: 2 / 1 / 4 / 2;
				}
				& .titre { 	
					margin-top: 2em;		
					font-size: clamp(1.3em,2.5vw,2em);
					color: black;
					font-weight: 800;
					letter-spacing: -2px;
					line-height: 1.7em;
					animation-delay: calc(var(--anim-intro) + 0.1s);
					animation-duration: 1s;

					& h1{
						margin: 0;
					}
					& span{ 
						display: block;
						font-size: 0.5em;
						/* line-height: 1em; */
					}
				}
				& .texte{	
					padding-right: 1em;		
					animation-delay: calc(var(--anim-intro) + 0.2s);
					animation-duration: 1.3s;
				}
				& .tarifs{
					display: flex;
					justify-content: start;
					flex-wrap: wrap;
					align-items: center;
					gap:2em;
					margin-top: 1em;

					& > div{
						font-size: 3.5em;
						font-weight: 700;
						letter-spacing: -2px;
					}
					& .prix_barre{
						position: relative;
						color:var(--mc-lightgrey);			
						animation-delay: calc(var(--anim-intro) + 0.5s);
						animation-duration: 1.5s;
						
						&::after{
							content: '';
							position: absolute;
							top:50%;
							left: 0;
							width: 100%;
							height: 5px;
							background-color: var(--mc-primary);
							rotate: -20deg;
						}
					}
					& .prix_promo{
						color:var(--mc-secondary);
						animation-delay: calc(var(--anim-intro) + 0.7s);
						animation-duration: 1.5s;

						&::after{
							content: attr(data-prix-ht);
							font-size: 1.3rem;
							position: absolute;
							bottom: -0.5rem;
							right: 0;
							color: var(--mc-primary);
							font-weight: 600;
							letter-spacing: -1px;
						}
					}					
				}
				& .info_supp{
					margin: 1.5em;
					text-align: center;
					color: var(--mc-secondary);
				}
				& .cta{
					display: flex;
					flex-flow: row wrap;
					align-items: center;
					gap: 1em;
					margin-top: 3em;
					
					& .fa{
						--animate-duration: 2s;
					}
					& > span{
						position: relative;
						white-space: nowrap;
						padding-left: 1em;
					}
				}
			}

			@media (max-width: 768px) {
				& > .wrapper{
					display: flex;
					flex-direction: column;
					& .visuel {
						& img{
							height: 25vh;
						}
					}
					& .titre {
						margin-top: 0.25em;
					}
					& .tarifs {
						justify-content: center;
					}
					& .cta{						
						justify-content: center;
					}
				}
			}

		}

		.offre_qte{
			-webkit-appearance: none;
			-moz-appearance: none;
			appearance: none;
			/* Add some styling */                                            
			display: block;
			width: 100%;
			max-width: 320px;
			height: 50px;
			float: right;
			margin: 5px 0px;
			padding: 0px 50px 0 60px;
			font-size: 16px;
			line-height: 1.75;
			color: #333;
			background-color: #ffffff;
			background-image: none;
			border: 1px solid #cccccc;
			border-radius:10px;
			-ms-word-break: normal;
			word-break: normal;

			& .offre_qte_wrapper{
				display: flex;
				align-items: center;
	
				&::before{
					content: 'Qté:';
					translate: 40px 0;
					pointer-events: none;
				}
				&::after{
					content: '\f107';
					font-family: var(--mf-icon-primary);
					translate: -40px 0;
					pointer-events: none;
				}
			}
		}	


	/* FICHE */

		.pg_produit {
			margin-top: 2rem;

			& .fiche {

				& h2, & .h2{
					--c-title:var(--mc-grey);
					font-size:1.125rem;
				}
				& .fiche__header{
					display: flex;
					gap: 4em;
					margin-bottom: 2em;
				}
				& .visuels{
					width: 40%;

					& .main{
						text-align: center;

						& img{
							width: min(500px, 100%);
						}
					}

					& .autres img{
						width: 100px;
						height: 100px;
						object-fit: scale-down;
					}
				}
				& .infos{
					flex-grow:1;
					max-width: 60%;

					& .titre{
						font-size: 2.5rem;
						font-weight: 800;
						margin: 0;
						line-height: 1;
					}
					& .soustitre{
						font-weight: 800;
						text-transform: uppercase;
						color:var(--mc-grey);
					}
					& .libelle_qte{
						display: none;
					}
					& .accroche{
						margin-top: 2em;
						margin-bottom: 2em;
					}
					& .fichiers{
						& ul{
							& li{
								padding:0.25rem;
								font-size: 0.85rem;

								& a{
									color:var(--mc-text);
								}
							}
						}
					}
					& .tarifs{
						margin-bottom: 1em;
					}
					& .marque img{
						height: 50px;
						width: 100px;
						object-fit: contain;
					}
					& .prix {
						position: relative;
						display: flex;
						flex-direction: column;
						align-items: start;
						justify-content: start;
						padding: 0.75rem 1.5rem;
						white-space: nowrap;
						
						
						& > div:not(.apartirde){				
							font-size: 2rem;
						}
						& .prix_normal{
							display: grid;
							grid-template-columns: repeat(2, 1fr);
							grid-template-areas: 
								'prix_ttc '
								'prix_ht'
							;
							gap:0 1rem;
						}
						& .prix_promo{							
							display: grid;
							grid-template-columns: repeat(3, 1fr);
							grid-template-areas: 
								'prix_barre prix_ttc'
								'vide prix_ht'
							;
							gap:0 1rem;
						}
					}
					& sup{
						font-size: 0.8rem;
					}
					& .prix_barre{		
						grid-area: prix_barre;
						position: relative;				
						color: var(--mc-lightgrey);				
						font-weight: 600;

						&::after {
							content: '';
							position: absolute;
							top: 50%;
							left: 0;
							width: 100%;
							height: 2px;
							background-color: var(--mc-primary);
							rotate: -10deg;
						}
					}
					& .prix_ttc{
						grid-area: prix_ttc;
						color: var(--mc-secondary);				
						font-weight: 600;
						text-align: right;
					}
					& .prix_ht{
						grid-area: prix_ht;
						font-size: 1rem;
						text-align: right;

						& sup{
							font-size: 0.8rem;
						}
					}
					& .references{
						display:table;
						flex-direction:column;
						width:min(750px, 100%);
						margin-top:2em;
						& .ligne{
							display:table-row;
							flex-flow:row wrap;
							gap:1em;
							width: 100%;
					
							&.ligne_head{
								display:table-row;
								flex-flow:row wrap;
								gap:1em;
								width: 100%;
								border-bottom:1px solid #000;		
								font-size: 0.8em;
								
								& > div{
									vertical-align: bottom;
								}
							}
					
							& > div{
								display: table-cell;			
								padding:0.5em;
								border-bottom:1px solid #000;

								&.tarif_w_promo{
									& span{
										color:var(--mc-tertiary);
										text-decoration-line: line-through;
									}
								}

								&.action{
									color: var(--mc-white);
								}			
							}
							&.disabled, &.disabled *{
								color:#CCC !important;								
							}
							&.disabled i{
								display: none;
							}
							&:not(.ligne_head):not(.disabled){
								cursor: pointer;
								& a > div:not(:nth-child(1),:nth-child(2)){
									text-align: right;
								}
								&.active{
									background-color: var(--mc-primary);
									color:#FFF;
								}
								
							}
							& a > div:nth-child(2){
								flex: 2;
							}
						}
					}
					& .actions form{
						display: flex;
						flex-flow: row wrap;
						align-items: center;
						gap: 1em;
						width:fit-content;
						margin-top: 2em;
						padding: 1em 2em;
						background:#f5f5f5;
						border-radius: 15px;
						
						& .libelle_ref{
							display: none;
						}
						& #select_ref {
							display: none;
							/* appearance: none; */
							background: #FFF;
							border: 0;
							padding: 0.60em 1em;
							border: 1px solid #96969d;
							border-radius: 2px;
							width: 100px;
						}
				
						& .qte_ajout_panier a{
							display: inline-flex;
							align-items: center;
							justify-content: center;
							width: 25px;
							height: 25px;
							background-color: var(--mc-primary);
							color:#FFF;
							border-radius: 50px;
						}
					}
				}
				
				& .fiche__desc{
					margin-top: 1rem;
					padding-top: 1rem;
					border-top: 1px solid #E8E8E8;
			
					& .texte{
						padding: 2rem 0;
					}
					
				}
			}
		}

		.pg_produit .fiche .fiche__assoc{
			display: block;

			& .product_list {			

				& > li{
					width:100%;

					& .actions {
						& .add_to_cart{
							display: none;
						}
					}
				}
			}
		}

		
		@media (max-width: 999px) {
			& .infos {		
				flex-direction: column;
				align-items: center;
			}
		}
		@media (max-width: 768px) {
			.pg_produit {
				& .fiche {
					& .fiche__header{
						flex-wrap: wrap;
					}
					& .visuels{
						width: 100%;

						& .main{
							& img{
								width: min(250px, 100% - 1em);
								margin-inline: auto;
							}
						}
					}
					& .infos {
						max-width: unset;
						
						& .prix {
							margin:auto;
						}
						& .references{
							position: relative;
							display: block;
							height: 50vh;
							overflow-y: auto;

							&::before{
								content:'Références';
								font-weight: bold;
								padding: 0.25rem;
							}
							& .ligne_head{
								display: none !important;
							}
							& .ligne{
								display: grid;
								grid-template-areas: 
									"check reference reference reference"
									"check texte texte texte"
									"check tarif_ht tarif_ht tarif_ht"
									"check tarif_ttc tarif_ttc tarif_ttc"
									"check ecopart ecopart ecopart";
								grid-gap: 0;
								align-items: center;
								margin-bottom: 1em;
								padding: 1em;
								border-radius: 10px;
								& > div{
									display: flex;
									padding: 0.25em;
									border:0 none;
									&::before{
										content:attr(data-label);
										font-weight: bold;
										padding-right: 1em;
									}
								}
								& .action{
									grid-area:check;
								}
								& .reference{
									grid-area:reference;
								}
								& .texte{
									grid-area:texte;
								}
								& .tarif_ht{
									grid-area:tarif_ht;
								}
								& .tarif_ttc{
									grid-area:tarif_ttc;
								}
								& .ecopart{
									grid-area:ecopart;
									font-size: 0.7rem;
								}
							}

						}
						& .actions form{
							justify-content: center;
						}
					}
					& .fiche__assoc{
						&::before{
							content:'';
							display: block;
							width: 50%;
							height: 2px;
							margin-inline: auto;
							background-color: var(--mc-primary);
							margin-bottom: 1rem;
						}
						& .h2{
							text-align: center;
							font-size: 1.5rem;
							color: var(--mc-primary);;
						}
						& .resume{
							display: none;
						}
					}
				}
			}
		}


/* PANIER */

	.pg_panier {

		& .container > .wrapper{
			--wrapper-width:1150px;
			display: grid;
			grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
			justify-content: center;
			width:min(var(--wrapper-width),100%);
			margin-inline:auto;

			& > h2{
				display: none;
			}

			& .magasins{
				width:min(calc(var(--wrapper-width)*0.4),100%);
				background:#f5f5f5;
				padding:1em;

				.choix .titre{
					display: inline-block;
					padding-top: 1em;
					padding-bottom: 1em;
					color: var(--mc-primary);
					font-weight: bold;
					text-decoration: underline;

					&:hover{
						text-decoration: none;
					}
				}

				.agences .item{
					display:flex;
					justify-content:space-between;
					align-items:center;	
					margin-bottom:0.5em;
					padding-bottom: 0.5em;
					border-bottom: 1px solid #CCC;

					& span{
						display:inline-block;
						padding:1em;

						& i{
							color:var(--mc-secondary);
							font-size: 1.5em;
						}
					}
				}
			}

			& .selection{
				flex-grow: 1;
				background:#fff;
				padding:1em;

				& .h2{
					margin-bottom: 1rem;
				}
		
				& .items{
					margin-top:0px;
		
					& .item .wrapper{
						display:grid;
						grid-template-areas: 
							"visuel titre titre tarif"
							"visuel reference reference reference"
							"visuel quantites quantites supprimer"
						;
						grid-template-columns: auto 1fr 1fr auto;
						align-items: center;
						grid-gap:0.5em;
						background:#f5f5f5;
						margin-bottom:1em;
						padding: 1em;
						border-radius:15px;
		
						& .visuel {
							grid-area: visuel;

							& img{
								width:150px;
								height: 150px;
								object-fit:scale-down;
							}
						}		
						& .reference{
							grid-area: reference;
							align-self: start;
							font-size: 0.9rem;
						}
						& .titre{
							grid-area: titre;
							font-weight:bold;
						}
						& .tarif{
							grid-area: tarif;
							text-align: right;
							color: var(--mc-primary);

							& .prix_barre{
								position: relative;
								color: var(--mc-black);

								&::after{
									content: '';
									position: absolute;
									top:50%;
									left: 0;
									width: 100%;
									height: 2px;
									background-color: var(--mc-primary);
									rotate: -20deg;
								}
							}
						}		
						& .quantites{
							grid-area: quantites;
							display:flex;
							justify-content:space-between;
							align-self:center;
						}
						& .supprimer{
							grid-area: supprimer;
							align-self:center;
							text-align: end;
							& i{
								display: none;
							}
						}
					}
				}
			}
		}

		@media (max-width:768px){
			& .container > .wrapper{
				grid-template-columns: 1fr;
				justify-items: center;

				& > h2{
					display: unset;
				}
				& .magasins{
					& .choix{
						text-align: center;
					}
				}
				& .selection{
					padding:0 0 0 0 !important;
					& .items{
						& .item .wrapper{
							padding: 1em;
							grid-template-areas: 
							"visuel titre     titre     tarif    " 
							"visuel reference reference reference" 
							"visuel quantites quantites supprimer"
							;
							grid-template-rows: 1rem 1rem 1rem;

							& .visuel{
								& img{
									width:50px;
									height: 50px;
								}
							}
							& .titre{
								font-size: 0.9rem;
							}
							& .reference{
								font-size: 0.7rem;
							}
							& .tarif{
								display: flex;
								flex-direction: column;
								text-align: unset;
							}
							& .supprimer{
								& i{
									display: initial;
								}
								& span{
									display: none;
								}
							}
						}
						& .poursuivre{
							text-align: center;

							& .btn{
								background-color: unset;
								color: var(--mc-secondary);
							}
						}
					}
				}
			}
		}
	}

	.pg_panier .quantite input{
		width:50px;
		text-align: center;
		pointer-events: none;
	}
	.pg_panier .quantite a:where(.btn-cart-minus, .btn-cart-plus){
		display: inline-flex;
		align-items: center;
		justify-content: center;
		width: 25px;
		height: 25px;
		background-color: var(--mc-primary);
		color:#FFF;
		border-radius: 50px;
	}

	

	.popin_panier{
		display:none;
		position:fixed;
		z-index: 50;
		inset:0;
		background:rgba(0,0,0,0.5);
		width:100%;
		height:100%;

		& .wrapper{
			position:relative;
			margin:auto;
			background:#FFF;
			width:40vw;
			height:auto;
			border-radius:15px;
			padding:1.5em;

			& > .close {
				position: absolute;
				top: 0.5rem;
				right: 1rem;
				font-size: 1.5rem;
			}

			.h2{
				line-height:1;
				font-weight:bold;
			}

			.subtitle{
				margin-top:1em;
			}

			& .details .visuel{
				text-align:center;
				display: flex;
				flex-flow:row wrap;
				justify-content: start;
				padding: 2em;

				& img{
					width:200px;
					height:100px;
					object-fit:contain;
				}

				.titre_produit{
					font-weight:bold;
				}

				.nb_produuits{
					margin-top:20px;
					text-align:center;
				}
			}

			.boutons{
				display:flex;
				flex-flow:row wrap;
				align-items:center;
				justify-content:center;
				gap:2em;
			}
		}

		@media (max-width:580px){
			
			& .wrapper{
				width:75vw;
			}

		}

		@media (max-width:768px){
			
			& .wrapper{
				width:95vw;

				
				& .details .visuel{
					flex-direction: column;
					justify-content: center;
					align-items: center;
					padding-bottom: 0.25rem;
				}
			}

		}
	}
	

/* ARIANE */

	.ariane{
		display: none;
		border-bottom: 0px solid #f5f5f5;
		margin-bottom: 20px;
		display: flex;
		align-items: center;
	}
	.ariane ul{
		display: flex;
		flex-wrap: wrap;
		padding: 0.5em 0;
		margin-bottom: 0;
		margin-top: 0;

		& li{
			line-height: 1.5em;
			&:not(:first-child){
				padding-left: 1em;
			}
			&+li::before {
				content: '/ ';
				padding-inline: 1em;
				color:var(--ariane-c-sep);
			}

			& a{
				color:var(--ariane-c-text);
			}
			&.active a{
				color:var(--ariane-c-text-active);
			}
		}
	}

		.pg_news #ariane,
		.pg_catalogue #ariane,
		.pg_moteur #ariane{
			display: flex;
			transform: unset;
		}

	@media (max-width: 768px) {
		.ariane{display: none;}
	}

/* BLOC PAGE */

	.pg_home .home_section .home_section_ligne_item{
		position: relative;
		overflow-x: hidden;
		z-index: 2;
	}
	/* .pg_home .home_section .home_section_ligne_item::after{
		content:'';
		position: absolute;
		inset:0;
		background:var(--mc-primary);
		z-index:-1;
		width:100%;
		left:-100%;
		transition: all 750ms ease-in-out;
	}
	.pg_home .home_section .home_section_ligne_item:hover::after{
		left:100%;
	}	 */
	.pg_home .home_section .home_section_ligne_item.bgsliding::before{
		content:'';
		position: absolute;
		inset:0;
		background:var(--mc-primary);
		z-index:0;
		width:100%;
		left:-100%;
		transition: all 750ms ease-in-out;
	}
	.pg_home .home_section .home_section_ligne_item.bgsliding:hover::before{
		left:100%;
	}

	.home_section .home_section_ligne:first-child{padding-top:0;}
	.home_section .home_section_ligne_item.format_1{padding-bottom: 0;}


	/* FORMAT 1 
		TITRE TEXTE SIMPLE */

		.format_1{padding: 2em 0;}
		.format_1 .soustitre{font-weight: bold;}

	/* FORMAT 6 BANDEAU IMAGE */
		.format_6{padding:0;background-color: transparent;}
		.format_6 .wrapper{
			background-color: #DDD;
			background-image: var(--bg-image),var(--bg-image-fallback);background-size:cover;background-position-y: center;
			background-blend-mode: multiply;			
			display: flex;justify-content: center;align-items: center;
			height: var(--height);
		}
		.format_6 .h1 span{
			--c-title:var(--mc-white);
			font-size: 1.5em;
			text-transform: uppercase;
		}
		.format_6 .soustitre{font-size: 1.5em;color:#FFF;margin-bottom: 1em;}
		.format_6 .texte{
			color:#FFF;
			line-height: 12px;
			font-size: 1.2em;
		}

	/* FORMAT 2 
		TITRE + VISUEL DROITE/GAUCHE */
		.home_section .item-format2{
			display: grid;
			grid-template-columns: 1fr 1fr;
			column-gap: 1em;
			row-gap: 0.5em;
		}
		.home_section .item-format2 .bloc_contenu{
			display: flex;
			flex-direction: column;

			&.top-left{
				justify-content: start;
				align-items: start;	
			}
			&.top-center{
				justify-content: start;
				align-items: center;	
			}
			&.top-right{		
				justify-content: start;
				align-items: end;
			}
			&.center-left{
				justify-content: center;
				align-items: start;	
			}
			&.center-center{
				justify-content: center;
				align-items: center;	
			}
			&.center-right{
				justify-content: center;
				align-items: end;		
			}
			&.bottom-left{
				justify-content: end;
				align-items: start;	
			}
			&.bottom-center{
				justify-content: end;
				align-items: center;		
			}
			&.bottom-right{
				justify-content: end;
				align-items: end;	
			}
		}
		.home_section .item-format2 .titre{
			/* color: var(--c-title); */
			grid-area: 1 / 2 / 2 / 3;
		}
		.home_section .item-format2 .soustitre{
			margin:1em 0;
			font-size: 1.3em;
			grid-area: 2 / 2 / 3 / 3;
		}
		.home_section .item-format2 .visuel{
			grid-area: 1 / 1 / 4 / 2;			
			display: grid;
			width: 100%;
			height: 100%;
			justify-content: center;
			align-items: center;

			&.top-left{			
				align-items: start;	
				justify-content: start;
			}
			&.top-center{		
				align-items: start;		
				justify-content: center;
			}
			&.top-right{		
				align-items: start;		
				justify-content: end;
			}
			&.center-left{			
				align-items: center;	
				justify-content: start;
			}
			&.center-center{		
				align-items: center;		
				justify-content: center;
			}
			&.center-right{		
				align-items: center;		
				justify-content: end;
			}
			&.bottom-left{			
				align-items: end;	
				justify-content: start;
			}
			&.bottom-center{		
				align-items: end;		
				justify-content: center;
			}
			&.bottom-right{		
				align-items: end;		
				justify-content: end;
			}

		}
		.home_section .item-format2 .visuel img{
			width: 100%;
			height:auto;
			object-fit: var(--img-fit, scale-down);
		}
		.home_section .item-format2 .texte{
			grid-area: 3 / 2 / 4 / 3;
		}
		.home_section .item-format2 .lien{
			grid-area: 4 / 1 / 5 / 5;
			margin:1em 0;
		}
		/*img à droite*/
		.home_section .item-format2-droite .titre{
			grid-area: 1 / 1 / 2 / 3;
		}
		.home_section .item-format2-droite .soustitre{
			margin:1em 0;
			font-size: 1.3em;
			grid-area: 2 / 1 / 3 / 3;
		}
		.home_section .item-format2-droite .visuel{
			grid-area: 1 / 2 / 4 / 3;
			display: grid;
			justify-content: center;
		}
		.home_section .item-format2-droite .texte{
			grid-area: 3 / 1 / 4 / 2;
		}
		/*img au dessus*/
		.home_section .item-format2-dessus .titre{
			margin-top:0.5em;
			grid-area: 2 / 1 / 3 / 3;
		}
		.home_section .item-format2-dessus .soustitre{
			margin: 0;
			font-size: 1.3em;
			grid-area: 3 / 1 / 3 / 3;
		}
		.home_section .item-format2-dessus .visuel{
			grid-area: 1 / 1 / 2 / 3;
		}
		.home_section .item-format2-dessus .texte{
			grid-area: 4 / 1 / 4 / 3;
		}
		/*img entre titre et texte*/
		.home_section .item-format2-entre .titre{
			margin-top:0.5em;
			grid-area: 1 / 1 / 2 / 3;
		}
		.home_section .item-format2-entre .soustitre{
			margin: 0;
			font-size: 1.3em;
			grid-area: 3 / 1 / 3 / 3;
		}
		.home_section .item-format2-entre .visuel{
			grid-area: 2 / 1 / 3 / 3;
		}
		.home_section .item-format2-entre .texte{
			grid-area: 4 / 1 / 4 / 3;
		}
		/*img en dessous*/
		.home_section .item-format2-dessous .titre{
			margin-top:0.5em;
			grid-area: 1 / 1 / 2 / 3;
		}
		.home_section .item-format2-dessous .soustitre{
			margin: 0;
			font-size: 1.3em;
			grid-area: 2 / 1 / 3 / 3;
		}
		.home_section .item-format2-dessous .visuel{
			grid-area: 4 / 1 / 4 / 3;
		}
		.home_section .item-format2-dessous .texte{
			grid-area: 3 / 1 / 3 / 3;			
		}

		/* STRUCTURE AVEC COLONNES */
			.home_section .item-format2.col_structure{
				display: flex;
				flex-flow: row wrap;
			}
			.home_section .item-format2.col_1-1{
				flex-flow: row wrap;
			}
			.home_section .item-format2.col_1-1 > div:nth-child(1){
				flex:1;
			}
			.home_section .item-format2.col_1-1 > div:nth-child(2){
				flex:1;
			}
			.home_section .item-format2.col_2-1 > div:nth-child(1){
				flex:1;
			}
			.home_section .item-format2.col_2-1 > div:nth-child(2){
				flex:3;
			}
			.home_section .item-format2.col_1-2 > div:nth-child(1){
				flex:3;
			}
			.home_section .item-format2.col_1-2 > div:nth-child(2){
				flex:1;
			}
			/* 66 - 33 */
			.home_section .item-format2.col_66-33 > div:nth-child(1){
				flex:1;
			}
			.home_section .item-format2.col_66-33 > div:nth-child(2){
				flex:2;
			}
			/* 33 - 66 */
			.home_section .item-format2.col_33-66 > div:nth-child(1){
				flex:1;
			}
			.home_section .item-format2.col_33-66 > div:nth-child(2){
				flex:2;
			}
			.home_section .col_structure.item-format2-droite{
				flex-flow: row-reverse wrap;
			}

		.home_section .item-format2-bgimg{
			display:flex;
			flex-direction: column;
			justify-content: center;
			width:100%;
			background-size:cover;
			height:var(--bg-height,300px);
			background-image: var(--bg-image, 'none');
		}
		.home_section .item-format2-bgimg h1{
			padding-left: 0 !important;
		}
		.home_section .item-format2-bgimg .visuel{
			display: none;
		}
		.home_section .item-format2-bgimg .infos{
			width: 100%;
		}
		
	/* FORMAT 3 GALERIE PHOTO */

		.format_3 h2{
			margin-bottom: 1em;
			color: var(--c-title);
		}
		.format_3 .lien{text-align: center;}
		.galerie_carousel{overflow-x: hidden;}
		
		.items-format3.type-1{/*mosaique 3 col*/
			display: grid;
			grid-template-columns: repeat(3, 1fr);
		}
		.items-format3.type-1 .item{flex:1;padding:1em;}
		.items-format3 .item img{
			width:100%;
			height:var(--img-h);
			object-fit:cover;
			transition: transform 0.3s;}

		.items-format3.type-2{/*mosaique 4 col*/
			display: grid;
			grid-template-columns: repeat(4, 1fr);
		}
		.items-format3.type-2 .item{
			padding:1em;
		}

		.items-format3.type-3{/*carousel 1/2/3 col*/
			display: flex;
		}
		.items-format3.type-3 .item{
			padding:1em;
		}

		.items-format3 a{
			position: relative;
			display: block;
			overflow: hidden;
			line-height: 0;
		}
		.items-format3 a::before{
			content:'';
			display: block;
			position: absolute;
			inset: 0;
			background-color: rgba(0, 0, 0, 0.3);
			opacity: 0;
			transition: opacity 0.25s ease-in-out;
		}
		.items-format3 a:hover::before{
			opacity: 1;
		}
		.items-format3 a::after{
			content:'\f002';
			font-family: var(--mf-icon-primary);
			position: absolute;
			inset: 0;
			display: flex;
			justify-content: center;
			align-items: center;
			color:#FFF;
			font-size: 5em;
			opacity: 0;
			transition: all 0.25s ease-in-out;
		}
		.items-format3 a:hover::after{
			font-size: 2em;
			opacity: 1;
		}

		.home_section .home_section_ligne .item-common h2{font-size: 26px;letter-spacing: 1px !important;}


	/* FORMAT 5 : X icones */
		
		/* VERSION SIMPLE */
		.format_5{
			--bgc:var(--mc-lightlightgrey);
			--c:var(--mc-secondary);
			--c-text:var(--mc-text);
		}
		.format_5 .simple{
			display: block;
			padding-top: 2rem;
			/* box-shadow: 0 0 0 100vmax;
			clip-path: inset(0 -100vmax); */
		}
		.format_5 .simple h1{
			position: relative;
			padding: 0;
			color:inherit;
		}
		.format_5 .simple h1 span{
			position: relative;
			display: inline-flex;
			padding:1rem;
			background-color: var(--bgc);
			z-index: 2;
		}
		.format_5 .simple .item{
			position:relative;
			display: flex;
			flex: 1;
			flex-direction: column;
			align-items: center;
			padding: 1em;
			margin: 1em 1em;
			text-align: center;
			background-color: #FFF;
			color: var(--c-title) ,var(--mc-primary);
			border: 2px solid #FFF;
			--border-color-hover:#e5e5e5;
		}
		.format_5 .simple .item .wrapper{
			z-index:2;
		}
		.format_5 .simple .liste{
			display: flex;
			justify-content: space-around;
			flex-wrap: wrap;
		}
		
		.format_5 .simple .item .span_img{
			order:1;
			position: relative;
			display: flex;
			width: 100%;
			justify-content: center;
		}		
		.format_5 .simple .item img{
			display: block;margin:0;
			transition:all 0.3s;
		}	
		.format_5 .simple .item .titre{order:2;
			padding:1em 1em 0.5em 1em;
			font-family: var(--mf-primary);
			color:var(--c-title);
			font-size: 1.5em;
			letter-spacing: 2px;
			text-align: center;
			font-weight: 600;
			text-transform: uppercase;
			line-height: 1em;
		}
		
		.format_5 .simple .item .texte{order:3;
			color:var(--c-text);
			line-height: 1.2em;
			font-size: 1em;
			padding:0 0.5em 1em 0.5em;
			margin-top: 0;
		}
		.format_5 .simple .item .lien{order:4;
			display: flex;
			justify-content: center;
			padding: 0 auto 2em auto;
			margin-top: auto;
			width: 100%;
		}
		.format_5 .simple .item:hover .infos{transform: translateY(0%);transition: transform 0.3s ease-in-out;}
		.format_5 .simple .item:hover img{opacity: 0.9;}

		/* VERSION avancée avec texte hover image*/
		.format_5 .special{display: block;}
		.format_5 .special .item{
			position:relative;
			overflow:hidden;
			text-align: center;
			display: flex;
			flex: 1;
			justify-content: center;
			flex-direction: column;
			text-align: center;
			margin: 1em 2em;
			border-radius: 10px;
		}
		.format_5 .special .liste{display: flex;justify-content: space-around;align-items: start;flex-wrap: wrap;}
		.format_5 .special img{display: block;width: 100%;height: 448px;object-fit: cover;margin:0;transition:all 0.3s;}
		.format_5 .special .infos{position: absolute;bottom:0;left: 0;right: 0;transform: translateY(67%);padding:0.5em;transition: transform 0.3s ease-in-out;
			background: -moz-linear-gradient(top,  rgba(0,0,0,0) 0%, rgba(0,0,0,1) 97%);
			background: -webkit-linear-gradient(top,  rgba(0,0,0,0) 0%,rgba(0,0,0,1) 97%);
			background: linear-gradient(to bottom,  rgba(0,0,0,0) 0%,rgba(0,0,0,1) 97%);
			filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#000000',GradientType=0 );
		}
		.format_5 .special .titre{margin-top: 1em;text-transform: uppercase;font-size: 1.3em;color:var(--mc-white);font-family: var(--mf-primary), sans-serif;letter-spacing: 5px;
			
		}
		.format_5 .special .texte{min-height: 60px;line-height: 1.2em;color:var(--mc-white);font-size: 0.9rem;}
		.format_5 .special .lien{margin-top: 1.5em;}
		.format_5 .special .item:hover .infos{transform: translateY(0%);transition: transform 0.3s ease-in-out;}
		.format_5 .special .item:hover img{opacity: 0.9;}
	
	
	/* CONTACT 7 */
		
		#form_contact{
			width:min(900px,100% - 1em);
			margin-inline:unset;
			background: conic-gradient(at top right, #EFF0F1, #eeeef2);

			& textarea{
				height: 100px;
			}

			& .part1{
				display: grid;
				grid-template-columns: repeat(2,1fr);
				grid-template-areas: 
					'nom nom'
					'email tel'
				;
				padding-inline:0.5rem;
				
				width: calc(100% - 1rem);

				& > div{					
					margin: unset;
					flex-direction: column;
				}

				& > div:nth-child(1){
					grid-area: nom;
				}
				& > div:nth-child(2){
					grid-area: email;
				}
				& > div:nth-child(3){
					grid-area: tel;
				}
			}

			& .part2{
				& .ligne{
					width: calc(100% - 1rem);
					margin-top:1.5em;
					& .champ{						
						gap: 0.5rem;
					}
				}
			}
		}

	/* FORMAT 8 */

		.format_8{position: relative;}
		.format_8 h2{
			margin-bottom: 1em;
			color: var(--c-title);
		}
		.format_8 iframe{border:0;}
	
	/* FORMAT 9 REALISATIONS */
		
		.format_9 .titre:first-child{margin-top: 2em;}

		.items-format9{position: relative;
			display: flex;
			gap:2em;
			margin-top: 50px;
		}
		.items-format9 .item{
			width:min(350px, 100% - 1em);
			background:linear-gradient(#f6f6f6 50%,#fff 90%);
			transition: all 0.25s;
		}
		.items-format9 .item:hover{
			transform: scale(1.02);
			box-shadow: rgba(255, 255, 255, 0.1) 0px 1px 1px 0px inset, rgba(50, 50, 93, 0.25) 0px 50px 100px -20px, rgba(0, 0, 0, 0.3) 0px 30px 60px -30px;
		}
		.items-format9 .item .titre{
			background-color: var(--mc-primary);color:var(--mc-white);font-size: 22px;padding: 0.25em 0.5em;}
		.items-format9 .item img{
			width:100%;height:150px;object-fit:cover;
		}
		.items-format9 .item .details{
			padding: 0.5em;
			margin:0.5em;
		}
		.items-format9 .item .details li{
			margin: 0.5em 0.25em;
		}
		.items-format9 .item .details li i{
			margin-right: 0.5em;
		}
		.items-format9 .item .actions{
			display: grid;gap:1em;padding:0.5em;
			grid-template-columns: 1fr 1fr;
		}
		.items-format9 .item .actions .etat{
			display: flex;
			align-items: center;
			gap:10px;
		}
	
	/* FORMAT 10 LOGOS MARQUES */

		.format_10 .liste_logos{
			display:flex;
			gap:2em;
			justify-content:center;
			flex-wrap: wrap;
			width:min(var(--w-container), 100%);
			margin-inline:auto;
		}
		.format_10 .liste_logos li{
			transition: all 0.25s;
		}
		.format_10 .liste_logos li:hover{
			transform: scale(1.1);
		}
		.format_10 .liste_logos img{
			width:80px;
			height:80px;
			object-fit:scale-down;
		}

	/* FORMAT 11 COMPTEURS */
		.format_11 .wrapper{
			padding: 0 !important;
		}
		.format_11 .counters{
			display: flex;
			flex-wrap: wrap;
			gap:30px;
			width:min(1000px,90%);
			padding:4em 2em;
			justify-content: center;
			align-items: center;
			margin-inline:auto;
			background-color:#000;
		}
		.format_11 .counters .item{
			flex:1;
			font-size: 60px;
			text-align: center;
			color:#2FAD25;
		}
		.format_11 .counters .item span{
			font-family: var(--mf-primary);
			font-weight: bold;
		}
		.format_11 .counters .libelle{
			font-size: 14px;
			color: var(--mc-white);
		}

	/* FORMAT 12 TEMOIGNAGES */
		
		.format_12 .texte_apres{
			display: flex;
			flex-direction: column;
		}
		.format_12 .texte_apres .titre{
			order: 1;
		}
		.format_12 .texte_apres .texte{
			order: 3;
		}
		.format_12 .texte_apres .section_liste_temoignages{
			order: 2;
		}

		.liste_temoignages .item{
			height: auto !important;
			overflow: hidden;
		}
		.liste_temoignages .item .wrapper{
			display: flex;
			flex-direction: column;
			gap:1em;
			padding: 1em 2em;
			height: calc(100% - 1em);
			text-align: center;
			background-color: #f8f8f8;
			border-radius: 15px;
			background: url(../images/bg_comment.png) no-repeat center center;
			transition: transform 250ms ease-in-out;
		}
		.liste_temoignages .item:hover .wrapper{
			transform: scale(1.05);
		}
		.liste_temoignages .item .wrapper .note{
			font-size: 1.2em;
		}
		.liste_temoignages .item .wrapper .note .oui{
			color: darkgoldenrod;
		}
		.liste_temoignages .item .wrapper .note .non{
			color: var(--mc-lightgrey);
		}
		.liste_temoignages .item .wrapper .auteur{
			font-weight: bold;
		}
		.liste_temoignages .item .wrapper .texte{
			font-style: italic;
			margin-top: 0;
			font-size: 0.9em;
		}
		.liste_temoignages .item .wrapper .date{
			font-size: 0.8em;
			text-align: right;
		}

		/* COLONNES */
		.liste_temoignages.colonne{
			display: grid;
			gap:1.5em;
		}
		.liste_temoignages.colonne.items_2{
			grid-template-columns: 1fr 1fr;
		}
		.liste_temoignages.colonne.items_3{
			grid-template-columns: 1fr 1fr 1fr;
		}
		.liste_temoignages.colonne.items_4{
			grid-template-columns: 1fr 1fr 1fr 1fr;
		}
		/* CAROUSEL */

	/* FORMAT LISTE AGENCES */
		
		.liste_agences {
			display: grid;
			gap: 2em;
			grid-template-columns: repeat(auto-fit,minmax(200px,1fr));
		}
		.liste_agences .item .visuel img{
			width:100%;
			aspect-ratio: 3 / 2;
			object-fit: cover;
			border-radius: 20px;
			transition: opacity 300ms ease;
		}
		.liste_agences .item:hover .visuel img{
			opacity: 0.8;
		}
		.liste_agences .item .titre{
			font-size: 1.3em;
			font-weight: 700;
			margin-bottom: 0.5em;
		}
		@media (max-width: 768px) {
			.liste_agences {
				grid-template-columns: repeat(2, 1fr);
			}
			
		}

	/* FORMAT SIGN UP NEWSLETTER */

		.format_14 .wrapper > div{
			display: grid;
			grid-template-columns: 1fr 1fr;
			gap:2em;
		}
		.format_14 .form {
			/* margin-top: 3em; */
			padding: 1em 2em;
			background: #f5f5f5;
			border-radius: 20px;
		}
		.format_14 .form label{
			font-size: 0.9em;
		}
		.format_14 .form .ligne{
			width: 100%;
		}
		.format_14 .form input{
			background-color: #fff;
		}
		.format_14 form .ligne input:not([type="checkbox"]){
			width: 250px;
		}
		.format_14 .form .ligne.ligne_checkbox{
			display: flex;
			flex-direction: row-reverse;
			justify-content: start;
			align-items: center;
		}
		.format_14 .form .ligne.ligne_checkbox label{
			flex: 1;
			margin-top:0;
		}
		.format_14 .form .ligne.ligne_checkbox input{
			width:auto;
		}
		.format_14 .form select{
			font-size: 15px;
			height: 50px;
			border-radius: 8px;
			border: 1px solid #b3b2c2;
			background: #FFF;
			padding: 0 20px;
			color: var(--mc-primary);
		}

		.format_14 form .action{
			text-align: center;
			padding-top: 1em;
		}

	/* RESPONSIVE */

		@media (max-width: 1024px) {
			.home_section .items-format3 .liste{flex-wrap: wrap;}
			.home_section .items-format3 .item a img{width: unset;max-width: 400px;}

			.items-format9{
				display: flex;
				justify-content: space-around;				
			}
		}
		@media (max-width: 990px) {
			.items-format3:where(.type-1,.type-2){				
				display: flex !important;
				flex-wrap: wrap;
				justify-content: center;
			}
			.items-format3:where(.type-1,.type-2) .item{
				text-align: center;
				flex:none !important;
			}

			.liste_agences{
				gap: 2em;
			}
		}
		@media (max-width: 768px) {
			.pg_home .home_section .home_section_ligne_item{
				padding-top: var(--gbl-padding-top) !important;
				padding-bottom: var(--gbl-padding-bottom) !important;
				margin-top: var(--gbl-margin-top) !important;
				margin-bottom: var(--gbl-margin-bottom) !important;
			}
			
			.home_section .home_section_ligne .item-common h2{
				font-size: 1.5em;
			}

			/* FORMAT 7 */
			#form_contact{
				& .part1{
					grid-template-columns: 1fr;
					grid-template-areas: 
						'nom nom'
						'email email'
						'tel tel'
					;
				}
			}


			/* FORMAT 3 */
			.home_section .items-format3 .item{text-align: center;}
			.items-format3.type-1,
			.items-format3.type-2{				
				grid-template-columns: repeat(1, 1fr);
			}

			/* FORMAT 2 */
			.home_section .item-format2{
				column-gap:unset;
			}
			.home_section .item-format2 .visuel, .home_section .item-format2 .infos{width: 100%;transform: unset;}
			.home_section .item-format2 .infos{padding: 2em 0;}
			.home_section .item-format2 .visuel{
				grid-area: 3 / 1 / 4 / 4;
			}
			.home_section .item-format2 .texte{
				grid-area: 4 / 1 / 5 / 5;
			}
			.home_section .item-format2 .lien{
				grid-area: 5 / 1 / 6 / 6;
			}

			.format_5 .simple .liste{
				flex-wrap: unset;
			}
			.format_5 .special .liste{flex-direction: column;align-items: unset;}
			.format_5 .special .infos{transform:translateY(0);}

			.format_5 .simple .liste{flex-direction: column;align-items: unset;}
			
			/* FORMAT 9 */
			.items-format9{
				flex-wrap: wrap;
				justify-content: center;
			}
			.items-format9 .item::after{
				content: '';
				display: block;
				height: 1px;
				width: 100%;
				background-color: var(--mc-lightgrey);
				margin:2em 0;
			}
			/* FORMAT 11 */
			.format_11 .counters{
				padding-inline: 0;
				flex-direction: column;
			}
			/* FORMAT 14 */
			.format_14 .wrapper > div{
				display: flex;
				flex-direction: column;
			}
		}
		@media (max-width: 580px) {
			.items-format3.type-1,
			.items-format3.type-2{				
				grid-template-columns: repeat(1, 1fr);
			}
		}

		@media (max-width: 480px) {
			.home_section .items-format3 h2{font-size: 24px;}
			.home_section .items-format3 .item a{padding-left: 0.5em;padding-right: 0.5em;}
			.home_section .items-format3 .item a img{width: unset;max-width: calc(100% - 1em);--img-h:unset !important;}

			
		}
	/**/

/* BACK TO TOP */

	#back-to-top {
		display: none;
		position: fixed;
		z-index: 20;
		bottom: 1rem;
		right: 1rem;
		width: 48px;
		height: 48px;
		text-decoration: none;
		transition: all 0.25s ease;
		transform:rotateY(180deg);
		fill:var(--mc-primary);

		& path:nth-child(2){
			scale: 0.6;
			transform-origin: center;
		}

		&:hover{
			scale:1.05;
		}
	}
/* ESPACE CLIENT */

	.box_acces{
		position: relative;
		display: flex;
		justify-content: center;
	}
	.pg_ec_acces form{
		display: none;
	}
	.pg_ec_acces form.active{
		display: block;
	}
	.pg_ec_acces form.opening {
		display: block;
		position: absolute;
		z-index:1;
		animation: showingForm 1s ease normal;
		-webkit-animation: showingForm 1s ease normal;
	}
	.pg_ec_acces form.closing {
		animation: closingForm 1s ease normal;
		-webkit-animation: closingForm 1s ease normal;
	}
	@keyframes showingForm{
		from {
			transform: translateX(200%);
		}
		to {
			transform: translateX(0%);
		}
	}
	@keyframes closingForm{
		from {
			transform: translateX(0%);
		}
		to {
			transform: translateX(-200%);
			opacity: 0;
		}
	}

	.form_classic{
		margin: auto;
		background-color: var(--mc-white);
		padding: 1em;
		border-radius: 20px;
	}
	.form_classic .ligne .champ{
		width: 100%;
	}


	.header_espace_client {
		display: flex;
		justify-content: space-between;
		align-items: center;
		gap: 1em;
		padding: 1em;
	}
	.header_espace_client .lien_logout{
		display: flex;
		justify-content: space-between;
		align-items: center;
	}
	.header_espace_client .lien_logout i{
		margin: unset;
	}
	.header_espace_client .lien_logout span{
		margin-left: 1em;
	}
	.page_espace_client .main_espace_client{
		display: flex;
		flex-flow: row wrap;
		gap: 2em;
		padding: 1em 0 2em 0;
	}
	.page_espace_client .main_espace_client > div{
		background:#f5f5f5;
		border-radius: 20px;
	}

	@media (max-width:768px){
		.header_espace_client .lien_logout span{
			display: none;
		}
		
	}

	/*EFFECTS*/

	.blur{
		filter: blur(5px);
		-webkit-filter: blur(5px);
	}

/* COOKIE CONSENT */
	.cc_icon{
		position: fixed;
		z-index: 20;
		bottom: 1.2rem;
		left: 1rem;
		width: 50px;

		& a{
			display: block;
			width: 48px;
			height: 48px;
			transition: scale 0.25s ease;

			& svg path:nth-child(1){
				fill:var(--mc-primary);
			}

			&:hover{
				scale:1.05;
			}
		}
	}

/* FIN */