@import url('https://fonts.googleapis.com/css2?family=Roboto+Slab:wght@100..900&display=swap');

/* GLOBAL */	

	*{
		border:0;
		/* background-color: rgba(255,0,0,0.2); */
	}

	html{
		scroll-behavior: smooth;
		height: 100%;
		font-size:15px;
		background: var(--mc-white);
		overflow: scroll;
		scroll-padding-top: 100px;

		&.freezed{
			overflow: hidden;
		}
		&:has(body.stick){			
			scroll-padding-top: 200px;
		}
	}
	body{
		display: flex;
		flex-direction: column;
		min-height: 100vh;
		max-width: 2000px;
		font-family: var(--mf-secondary);
		overflow-x: hidden;
		margin:0 auto;
		color:var(--mc-text);
		background-color: #FFF;
		line-height: 1.5;

		&.stick{
			padding-top: 300px;
		}
	}
	
	a{
		color:var(--_clr-a);
		text-decoration:none;
		transition: color 0.2s ease-in-out 0s;

		&:hover{
			text-decoration:none;
			color:var(--_clr-a-hover);
		}
		&:focus{
			text-decoration:none;
			color:var(--_clr-a-hover);
			box-shadow:none !important;
		}
		&.disabled {
			color:#AAAAAA !important;
			pointer-events: none;
		}
	}
	
	img,
	picture,
	svg {
		max-width: 100%;
		display: inline-block;
	}

	figcaption span:empty + span::before {
		display: none;
	}
	
	figcaption span + span::before {
		content: " - ";
	}

	img {
		height: auto;
		font-style: italic;
		background-repeat: no-repeat;
		background-size: cover;
	}


	h1, .h1{
		color:var(--c-title-h1);
		font-size: clamp(1.7rem,3vw, 2rem);
		text-transform: uppercase;
		font-weight: 600;
		text-wrap:balance;
		letter-spacing: -1px;
	}
	.h2, h2 {
		color:var(--c-title-h2);
		margin:2rem 0 0.5rem 0;
		font-size: clamp(1.7rem,3vw,1.9rem);
		font-weight: 500;
		line-height: 1em;
		text-wrap:balance;
		letter-spacing: -1px;
	}
	.h3, h3{
		font-family: var(--mf-primary);
		color:var(--c-title-h3);
		font-size: clamp(1.1rem,3vw,26px);
		font-weight: 500;
		text-wrap:balance;
		letter-spacing: -1px;
	}
	.h4, h4{
		font-family: var(--mf-primary);
		font-size: 1.1em;
		color:var(--c-title-h4);
		font-weight: 500;
		text-wrap:balance;
		letter-spacing: -1px;
	}
	.h5, h5{
		font-family: var(--mf-primary);
		font-size: 1.3em;
		color:var(--c-title-h5);
		font-weight: 500;
		text-wrap:balance;
		letter-spacing: -1px;
	}
	hr {
		display: block;
		height: 2px;
		background: #CCC;
		margin: 0 5px;
	}

	ul {
		list-style-type: none;
		padding: 0;

		&.ul_custom {
			list-style-type: square;
			margin-left: 25px;
		}

		&.ul_none{
			list-style-type: none !important;

			& ul{
				list-style-type: none !important;
			}
		}
	}
	p{
		font-display: swap;
	}

	figure.image {
		display: flex;
		flex-direction: column;
		margin: 0;

		& figcaption{
			font-size: 0.6rem;
			translate: 10px -110%;
		}
	}


	label {
		font-weight: normal;
	}

	input.form-control,
	select.form-control {
		height: calc(1.5em + .75rem + 10px);
	}

	input.form-control,
	select.form-control,
	textarea.form-control {
		appearance: none;
		border:0 none;
		border-radius: 10px;
		font-family: var(--font-main);
		font-size: 0.9em;
		padding-left: 1rem;
	}

	input.form-control:focus,
	select.form-control:focus,
	textarea.form-control:focus,
	input.form-control:focus-visible,
	select.form-control:focus-visible,
	textarea.form-control:focus-visible {
		-webkit-box-shadow: none;
		box-shadow: none;
		outline:unset;
	}

	.form-control::placeholder {
		color: #aaa;
	}

	.form-control-inline {
		display: inline;
		width: auto;
	}

	.custom_select {
		position: relative;
		width: 100%;
		height: auto;
		overflow: hidden;
		text-overflow: ellipsis;

		&::after{
			content:"";
			position: absolute;
			top: 50%; 
			margin-top: -3px;
			right: 0;  
			display: block; 
			width: 0; height: 0;
			border-color: transparent;
			border-top-color: #444; 
			border-width: 6px;
			border-style: solid;
			pointer-events: none;
			transform: translateX(-150%);
		}

		& select {
			width: 100%;
			appearance: none;
			background-color: #fff;
			border:1px solid var(--mc-grey-light);
			padding: 0 40px 0 20px;
		}
	}

		/* SPEC FORM FILTRES */
		.page_resultats .filtres .custom_select::after{
			transform: translateX(-75%);
		}
	
	/* Autre custom select */
	.select-wrapper {
		position: relative;
		display: inline-block;
	
		select {
			appearance: none; /* supprime l'apparence native */
			-webkit-appearance: none; /* Safari et Chrome */
			-moz-appearance: none; /* Firefox */
			padding: 0.25rem 1rem; /* padding vertical 0.25rem et horizontal 1rem */
			padding-right: 2.5rem; /* espace pour le chevron */
			border-radius: 0.5rem; /* coins arrondis */
			border: 1px solid #ccc; /* bordure légère */
			background-color: #fff;
			font-size: inherit;
			cursor: pointer;
		}
		&::after {
			content: "\f107"; /* ou utiliser une icône SVG ou Font Awesome */
			font-family: 'Font Awesome 6 Free';
			font-weight: 900;
			position: absolute;
			right: 1rem;
			top: 50%;
			transform: translateY(-50%);
			pointer-events: none;
			color: #555;
			font-size: 1rem;
		}
	}


	@media (max-width: 767px) {	
		/* .custom_select{width: max-content;} */
	}

	.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;}
	.text-wrap-auto{text-wrap: auto !important;}
	.text-capitalize{text-transform: capitalize;}

	.text-primary{color:var(--mc-primary);}
	.text-secondary, .text-orange{color:var(--mc-secondary);}
	.text-1_5em{font-size: 1.5em;}

	.strong{font-weight: bold;}

	.alerte{
		position: relative;
		display: flex;
		align-items: center;
		/* flex-direction: column; */
		width: fit-content;
		gap: 2rem;
		margin:auto;
		padding:2rem 2.5rem;
		/* text-align: center; */
		border-radius: 10px;

		&.alerte-ok{
			/* color:var(--mc-primary);
			background-color: var(--mc-grey-light-light); */
			color:var(--mc-white);
			background-color: var(--mc-primary);

			&::before{
				content: '\f164';
				font-family: 'Fontawesome';
				/* position: absolute; */
				top: 0;
				/* left: 50%; */
				width: 50px;
				height: 50px;
				padding: 1rem;
				display: flex;
				align-items: center;
				justify-content: center;
				/* translate: -50% -75%; */
				background-color: var(--mc-secondary);
				color:#000;
				font-size: 2rem;
				border-radius: 50%;
				animation: bounce 2s infinite;
			}
		}
		&.alerte-ko{
			color:var(--mc-danger);
			border:1px solid var(--mc-danger);
		}
		& p{
			margin: 0;
		}
	}

	.blink_text{
		--_blink-text-clr:var(--mc-secondary);
		font-weight:bold;
		animation-duration: 1.2s;
		animation-name: blink-text;
		animation-iteration-count: infinite;
		transition: none;
	}

	/* grilles auto... */
		.auto-grid{
			--min-column-size:22rem;
			display: grid;
			gap: 1rem;
			grid-template-columns: repeat(auto-fit, minmax(min(var(--min-column-size), 100%), 1fr));
		}
		.flexible-grid{
			display: flex;
			flex-wrap: wrap;
			gap: 1rem;

			& > *{
				flex: 1;
			}
		}
		.scroll-snap-grid{
			--gap: 1rem;
			display: grid;
			gap: var(--gap);
			grid-auto-flow: column;
			grid-auto-columns: 33%;
			overflow-x: scroll;
			scroll-snap-type: x mandatory;
			scroll-padding: var(--gap);

			& > *{
				scroll-snap-align: start;
			}
		}

	.oy_hidden {
		overflow-y: hidden;
	}
	/* DIALOG */
		dialog{
			--_h: 80vh;
			border: 0;
			border-radius: 20px;
			height: var(--_h);
			width: min(800px,75vw);
			margin-top: 10vh;
			margin-inline: auto;
			overflow: unset;	
			
			&.fit{
				--_h: fit-content;
				width: fit-content;
				height: var(--_h);
				min-width: 300px;
				padding:1rem 2rem;
				margin-inline:auto;
			}

			&.dialog-sm{
				max-width: 768px;
			}
			&.dialog-md{
				max-width: 999px;
			}
			&.dialog-lg{
				max-width: 1280px;
			}
			.main_dialog_content{
				overflow-x: hidden;
				height: calc(var(--_h) - 4rem);
				padding: 2rem;
			}
			
			&::backdrop{
				width: 100%;
				height: 100vh;
				background-color: rgba(0, 0, 0, 0.9);
			}
			&[open] {
				animation: showDialog 1s ease normal;
				-webkit-animation: showDialog 1s ease normal;
			}
			&.closing {
				animation: closingDialog 0.5s ease normal;
				-webkit-animation: closingDialog 0.5s ease normal;
			}
			& .btn_close_dialog{
				position: absolute;
				z-index:5;
				top: 0;
				right: 0;
				display: flex;
				align-items: center;
				justify-content: center;
				width: 40px;
				height: 40px;
				background-color: var(--mc-primary);
				color:#fff;
				border-radius: 50px;
				translate: 10px -10px;
			}

			@media (max-width:999px) {
				&.fit{
					margin-inline:1rem;
				}
				
			}
			@media (max-width:580px) {
				width: 85vw !important;

				&.fit{
					padding: 1rem;
				}

				.main_dialog_content{
					padding: 0;
				}
			}
		}

		@keyframes showDialog{
			from {
				transform: translateY(-200%);
			}
			to {
				transform: translateY(0%);
			}
		}
		@keyframes closingDialog{
			from {
				transform: translateY(0%);
			}
			to {
				transform: translateY(100vh);
			}
		}

	/* FAKELINK */
		[data-fakelink]{
			cursor: pointer;
		}

	.container{
		max-width: unset;
		width:min(var(--w-container), calc(100% - 2em));
		margin-inline:auto;

		@media (max-width: 999px){
			--w-container:990px;
		}
	}

	.tooltip{letter-spacing: 0.5px;font-size: 14px;font-family:var(--mf-primary);}
	.annotation{font-size: 12px;font-style: italic;}
	.rotate{
		rotate: var(--_rotate,90);
	}

	.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;}

	.splash_logo{
		position: absolute;top:30%;width: 100%;z-index:1000;text-align: center;
	}
	.splash_logo img{
		max-width: 200px;
	}

	@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;}
	}



	.fb{--main-color: #3B5A9A;}
	.tw{--main-color: #00AEF0;}
	.ig{--main-color: #D93175;}
	.lk{--main-color: #007BB6;}
	.yt{--main-color: #FF0000;}

	.divider-bottom {
		position: absolute;
		bottom: 0;
		left: 0;
		width: 100%;
		overflow: hidden;
		line-height: 0;

		& svg {
			position: relative;
			display: block;
			width: calc(100% + 1.3px);
			height: 29px;
		}
		& .shape-fill {
			fill: #FFFFFF;
		}	
	}

	/* Tabs */
	& .tab-content{
		display: none;

		&.active{
			display: block;
		}
	}

	/* Captcha */
	.grecaptcha-badge{
		display: none;
	}

/* HEADER */

	#header {

		& .header__wrapper{

			& .header__top{
				--_minh:35px;
				--_clr-a:#FFF;
				--_clr-a-hover:var(--mc-primary-dark);
				display: flex;
				align-items: center;
				justify-content: end;
				gap: 1rem;
				min-height: var(--_minh);
				padding: 0.25rem 1rem;
				background-color: var(--mc-primary-light);
			}

			& .header__body{
				--_border-bottom: 45px;
				position: relative;
				border-bottom: var(--_border-bottom) solid var(--mc-primary);

				&::after{
					--divider-pattern-height: calc(var(--_border-bottom)/3);
					--divider-pattern-size:25px;
					--divider-pattern-url : url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' preserveAspectRatio='none' overflow='visible' height='100%' viewBox='0 0 20 16' fill='none' stroke='black' stroke-width='5' stroke-linecap='square' stroke-miterlimit='10'%3E%3Cg transform='translate(-12.000000, 0)'%3E%3Cpath d='M28,0L10,18'/%3E%3Cpath d='M18,0L0,18'/%3E%3Cpath d='M48,0L30,18'/%3E%3Cpath d='M38,0L20,18'/%3E%3C/g%3E%3C/svg%3E");
					content:'';
					display: block;
					position: absolute;
					bottom: 0;
					width: 100%;
					min-height: var(--divider-pattern-height);
					-webkit-mask-size: var(--divider-pattern-size) 100%;
					mask-size: var(--divider-pattern-size) 100%;
					-webkit-mask-repeat: repeat-x;
					mask-repeat: repeat-x;
					background-color: rgba(255,255,255,0.5);
					-webkit-mask-image: var(--divider-pattern-url);
					mask-image: var(--divider-pattern-url);
					translate: 0 300%;

				}
				
				& > .wrapper{
					display: grid;
					grid-template-columns: 30% auto;
					align-items: center;
					padding-top: 1rem;
					padding-bottom: 1rem;
				}

				& .logo{
					
					& .logo_text{
						display: none;
					}
					& img {
						display: block;
						height: 70px;
						object-fit: contain;
					}
				}
				& .slogan{

					& img{
						position: absolute;
						top: 0;
						width: 150px;
						aspect-ratio: 1;
						object-fit: scale-down;
						translate:-50% 10%;
					}
				}

				& .coords{
					color:var(--mc-text);
					position: relative;
					padding-right: 100px;
		
					&::after{
						content: '';
						position: absolute;
						top: -24%;
						right: 0;
						display: block;
						width: 100px;
						height: 100px;
						background: transparent url(../../images/call.jpg) right 10px no-repeat;
						background-size: contain;
					}
		
					& .tel {
						font-size: 30px;
						text-align: right;
						padding-right: 45px;
						font-weight: 800;
		
						& .fa {
							color: var(--mc-primary-light);
						}
					}
		
					& .rappel {
						text-align: right;
		
					& .fa {
						font-size: 18px;
					}
		
					& .btn {
						margin-top: 0;
					}
					}
				}

			}
			
		}
		
		& .socials_mobile{
			display: none;
		}
		& .socials{
			display: flex;
			flex-flow: row wrap;
			gap:1rem;
			margin: 0;
		}

		& .nav_mobile{
			display: none;
			padding-right: 1rem;

			& a{
				font-size: 1.5rem;

				& span{
					display: none;
				}
			}
		}

		@media (max-width:768px){
			& .header__wrapper{
				& .header__body{
					& .logo {
						padding: 0;

						& img{
							width:60vw;
							height: unset;
						}
					}
					& .slogan{
						& img{
							display: none;
						}
					}
				}
			}
			& .coords {
				display: none;
			}
			& .socials_mobile{
				display: unset;
			}
			& .socials{
				position: absolute;
				top: calc(var(--_minh) + 0.25rem);
				right: 0;
				z-index: 101;
				translate: 99% 0;
				display: flex;
				flex-flow: column;
				gap: 0.25rem;
				margin-top: 0;
				padding: 1rem;
				background-color: #fff;

				&.show{
					translate: 0 0;

					& a{
						color:var(--mc-primary);
					}
				}
			}
		}
		@media (max-width: 1200px){
			& .nav_mobile{
				display: flex;
				justify-content: end;
				gap: 1rem;
			}
		}
	}


/* FOOTER */

	.prefooter{
		background: linear-gradient(to bottom, #F5F5F5 0%, #FFF 50%);

		& .wrapper{
			display: grid;
			grid-template-columns: repeat(4,1fr);
			gap: 1rem;
			padding: 4rem 1rem;
		}
		& .item{
			display: flex;
			flex-direction: column;
			align-items: center;
			gap: 0.5rem;
			padding: 2rem;
			background-color: #fff;
			border-radius: 20px;

			& .icone{
				font-size: 2rem;
			}
			& .titre{				
				font-size: 1.3rem;
				text-align: center;
				font-weight: 600;
			}
			& .texte{
				text-align: center;	
				font-size: 0.9rem;
			}
		}

		@media (max-width: 768px) {
			& .wrapper{				
				grid-template-columns: repeat(2,1fr);
				padding-inline:0;

				& .icone{
					font-size: 1.5rem;
				}
			}
		}
		@media (max-width: 360px) {
			& .wrapper{				
				grid-template-columns: 1fr;
			}
		}
	}

	.footer{
		--_h_sep:20px;
		--c-title-h1:var(--mc-over-primary);
		position: relative;
		margin-top: 0;
		background-color: var(--mc-primary);
		color:var(--mc-over-primary);

		& .wrapper{

			display: grid;
			grid-template-columns: 1fr 1fr 1fr;
			grid-template-areas:
				'section2 section3 infos '
			;
			gap:1rem;
			padding: 2rem 0 1rem 0;

			& .box_pages_section{

				&.section_2{
					grid-area: section2;
				}
				&.section_3{
					grid-area: section3;
				}
				& ul{
					display: flex;
					flex-direction: column;
					gap: 0.25rem;

					& li{
						display: flex;
						align-items: center;
						
						&::before{
							content:'';
							display: inline-flex;
							width: 5px;
							height: 1rem;
							border-left: 3px solid var(--mc-secondary);
						}
					}
				}

			}
			& .box_infos{
				grid-area: infos;

				& .wrapper{					
					display: grid;
					grid-template-columns: repeat(2, 1fr);
					place-items: center;

					& .infos{	
						display: flex;
						flex-direction: column;
						gap: 1rem;

						& img{
							width: 150px;
							margin-inline: auto;
						}

						& .underline1{
							position: relative;
							display: inline-flex;
							flex-direction: column;
							align-items: center;
							justify-content: center;

							&::after{
								left: unset;
								right: unset;
								height: unset;
								bottom: -15px;
								scale: 0.5;
							}
						}
					}
					& .liens{
						& a{
							display: flex;
							align-items: center;

							&::before{
								content:'';
								display: inline-flex;
								width: 5px;
								height: 1rem;
								border-left: 3px solid var(--mc-secondary);
							}
						}
					}
				}				
			}
		}
		& .reseausocial{
			display: flex;
			justify-content: center;
			align-items: center;
			gap: 1.5rem;
			font-size: 1.5rem;

			& li{
				& span{
					display: none;
				}
			}
		}

		@media (max-width: 999px) {
			& .wrapper{				
				grid-template-columns: 1fr 1fr;
				grid-template-areas:
				'section2 section3'
				'infos  infos'
			;
			}
		}
		@media (max-width: 768px) {
			& .wrapper{				
				grid-template-columns: auto;
				grid-template-areas:
				'section2'
				'section3'
				'infos'
				;
				justify-content: center;
				text-align: center;

				& .box_infos{
					& .wrapper{						
						grid-template-columns: 1fr;
					}
				}
			}
		}
	}

	.copyright{
		& .wrapper{
			padding: 1rem;
			text-align: center;

			& p{				
				font-size: 0.8rem;
			}

			& a{
				--_clr-a:var(--mc-primary-light);
				text-decoration: underline;
				font-weight: 500;
			}
		}
	}

	.mobile_sticky_footer{
		display: none;
		position: fixed;
		z-index: 1000;
		bottom: 0;
		width: 100vw;
		
		&::before{
			width: 100%;
			height: 100%;
			position: absolute;
			backdrop-filter: saturate(180%) blur(5px);
			backface-visibility: hidden;
			content: '';
			z-index: -1;
		}
		& ul{
			display: grid;
			grid-template-columns: repeat(3, 1fr);
			grid-template-rows: auto;
			gap:0rem;
			margin: 0;

			& li{
				padding: 1rem;
				text-align: center;

				a{				
					font-size: 1.5rem;
					padding: 1rem;
					text-align: center;
				}
				&.appel{
					background-color: var(--mc-primary);
					color: var(--mc-over-primary);
				}
				&.devis{				
					background-color: var(--mc-secondary);
					color: var(--mc-over-secondary);
				}
				&.reservation{		
					background-color: var(--mc-grey-dark);
					color:var(--mc-over-grey-dark);		
				}
			}
			
		}

		@media (max-width: 768px) {
			/* display: block; */
			background-color: var(--mc-primary);
		}
	}

/* NAVIGATION */

	@media (min-width:1200px) {
		#section-nav{			
			background-color: var(--mc-primary);
		}
		.main_nav{
			position: relative;
			display: flex;
			justify-content: start;
			align-items: center;
			margin-top: 0px;
			/*margin-bottom: 60px;*/

			& .main_nav_toggle{
				display: none;
			}

			& > ul {
				position: relative;
				display: flex;
				align-items: center;
				gap:1.5rem;
				width: 100%;
				font-size: 1.1rem;

				& > li {
					--_clr-a:var(--mc-text);
					display: inline-block;
					position: relative;
					line-height: 22px;
					text-align: left;
					vertical-align: top;
					border: 0px solid #999;
					margin-right: 15px;

					&:hover{
						& > a {
							text-decoration: none;
							color: var(--_clr-a);
						}	
						& > ul {
							-webkit-transform: translateX(0px);
							-moz-transform: translateX(0px);
							transform: translateX(0px);
							visibility: visible;
							opacity: 1;
						}
					}
					&.li_espacepro{
						margin-left: auto;
					}

					& > a {
						display: inline-block;
						font-weight: 500;
						text-decoration: none;
						padding-top: 0.5rem;
						padding-bottom: 0.5rem;
						-webkit-transition: all 0.25s ease;
						-moz-transition: all 0.25s ease;
						transition: all 0.25s ease;

						&::before {
							position: absolute;
							bottom: 0;
							left: 0;
							visibility: hidden;
							width: 0%;
							height: 2px;
							content: '';
							-webkit-transition: all .3s ease-in-out 0s;
							transition: all .3s ease-in-out 0s;
							background-color: var(--mc-secondary);
						}
						& span {
							white-space: nowrap;
						}
						& .soustitre {
							text-transform: none;
							font-size: 14px;
							letter-spacing: 1px;
						}
					}
					&:has(ul){
						& > a::after {
							content: '\f107';
							font-family: 'Fontawesome';
							vertical-align: unset;
							border: 0 none;
							margin-left:0.25rem;
						}
					}
					& > ul {
						position: absolute;
						top: 37px;
						left: -3px;
						display: flex;
						flex-direction: column;
						margin: 0px;
						padding: 0px;
						padding-top: 10px;
						padding-bottom: 10px;
						list-style-type: none;
						background-color: rgba(255, 255, 255, 0.9);
						text-align: left;
						border: 0 none;
						border-bottom: 1px solid #CCC;
						visibility: hidden;
						opacity: 0;
						box-shadow: none;
						border-radius: 0;
						transition: all 0.25s ease;
						transform: translateX(-10px);

						& li {
							position: relative;
							line-height: 1em;

							&:hover {
								background-color: transparent;

								& > ul {
									-webkit-transform: translateX(0px);
									-moz-transform: translateX(0px);
									transform: translateX(0px);
									visibility: visible;
									opacity: 1;
								}
							}

							& a {
								display: block;
								padding: 8px 15px;
								color: #000;
								font-size: 0.95em;
								text-transform: none;
								letter-spacing: normal;
								white-space: nowrap;

								&:hover {
									text-decoration: none;
									background-color: transparent;
									color: var(--mc-secondary);
									-webkit-transition: all 0.25s ease;
									-moz-transition: all 0.25s ease;
									transition: all 0.25s ease;
								}
							}

							& ul {
								top: 0px;
								left: 100%;
								white-space: nowrap;
								visibility: hidden;
								opacity: 0;
								-webkit-transition: all 0.25s ease;
								-moz-transition: all 0.25s ease;
								transition: all 0.25s ease;
								-webkit-transform: translateX(-10px);
								-moz-transform: translateX(-10px);
								transform: translateX(-10px);
							}

						}
					}
				}
			}
		}

		.main_nav ul li.niv1:hover>a::before,
		.main_nav ul li.niv1>a.active::before {
			visibility: visible;
			width: 100%;
			/*-webkit-transform: scaleX(1);
			transform: scaleX(1);*/
		}	
		.main_nav ul>li


		.main_nav ul>li>ul {
			left: calc(13px);
		}

		.main_nav ul>li:first-child>ul {
			left: 0px;
		}

		.main_nav ul>li ul.dropdown-submenu {
			padding-top: 3px;
		}
	}

	@media (max-width:1200px) {

		/* .main_nav-icon {
			position: relative;
			width: 30px;
			height: 24px;
			margin-right: 1rem;			
			cursor: pointer;
			transition: all 0.3s ease;

			& .line {
				width: 30px;
				height: 4px;
				background-color: #333;
				margin: 4px 0;
				transition: transform 0.3s ease;
			}

			&.open{
				position: fixed;
				z-index: 2001;
				right: 1rem;
			}

			&.open .line:nth-child(1) {
				transform: translateY(8px) rotate(45deg);
			}			
			&.open .line:nth-child(2) {
				transform: scaleX(0);
			}			
			&.open .line:nth-child(3) {
				transform: translateY(-8px) rotate(-45deg);
			}
		} */
				
		.main_nav{
			position: fixed;
			top: 0;
			right: 0;
			z-index: 2000;
			padding: 60px 1rem 1rem;
			background: #fff;
			height: calc(100vh);
			box-shadow: -10px 0 20px -10px rgba(0, 0, 0, 0.1);
			translate: 100% 0;
			opacity: 0;
			visibility: hidden;
			transition: .3s all ease-in-out;
			

			&.open{
				translate: 0 0;
				opacity: 1;
				visibility: visible;
			}
			
			& ul{
				padding: 0;
			}
			& > ul{
				display: flex;
				flex-direction: column;

				& > li{

					& a{
						display: block;
						padding:0.25rem;
					}
					& > a{
						font-size: 1.125rem;
						font-weight: bold;
					}
					& > ul{
						position: relative;
						padding-left: 1rem;
					}
				}
			}
		}

	}

/* SLIDER */

	.slider{
		--swiper-pagination-color:var(--mc-primary-light);
		--swiper-pagination-bullet-inactive-color:var(--mc-grey);
	}
	#sliderHome{
		--_h_slider:400px;
		--_w_form:100%;
		position: relative;
		
		&::before{
			content:'';
			position: absolute;
			z-index: 2;
			display: block;
			width: 100%;
			height: 100%;
			background: linear-gradient(to top, var(--mc-black) 0%, transparent 100%);
		}
		& .bloc_slider{
			position: relative;
			width: 100%;
		}		
		& > .container{	
			position: relative;		
			display: flex;
			flex-direction: row;
			align-items: center;
			gap:1rem;
		}
		& .sliderHome{
			--swiper-pagination-color:var(--mc-secondary);
			height:var(--_h_slider);
		
			& .item{
				position: relative;
				width: 100%;
				background-image: var(--bg-image);
				background-color: transparent;
				background-repeat: no-repeat;
				background-size: cover;
				background-position: center;
				
				&::after{
					content: '';
					display: none;
					position: absolute;
					inset: 0;
					background: linear-gradient(to right, var(--mc-primary), transparent 50%);
				}	
				& img{
					opacity: 0;
					visibility: hidden;
					height: var(--_h_slider);
				}	
				& .item_wrapper{
					position: relative;
					height: var(--_h_slider);
				}	
				& .caption{
					display: none;
					height: var(--_h_slider);
					padding: 2rem;
	
					& .caption_inner{
						position: absolute;
						z-index: 5;
						left:1rem;
						top: 0;
						width: 100%;
						height: 100%;
						display: flex;
						flex-direction: column;
						justify-content: end;
						padding-left: 5rem;
						padding-bottom: 3rem;
		
						& .titre{
							max-width: 70%;
							font-size: clamp(1.2rem,5vw,3rem);
							line-height: 1.1em;
							font-weight: 800;
							color:#FFF;
							text-shadow: 1px 2px 10px #000;
						}
						& .texte{
							max-width: 70%;
							font-size: clamp(1rem,3vw,1.8rem);
							color:#FFF;
							line-height: 1.2em;
							text-shadow: 1px 2px 10px #000
						}
						& .lien{
							margin-top: 1rem;
							margin-bottom: 3rem;
							max-width: 70%;
						}
					}
				}
			}
			& .swiper-pagination-bullet{
				width: 20px;
				border-radius: 5px;
			}
		}		
		
		@media (max-width:999px){
			--_h_slider: 20vh;
			isolation: unset;

			& > .container{		
				width: 100%;
				flex-direction: column;
				margin: 0;
				gap: 0;
			}
			& .bloc_slider{
				width: 100%;

				& .sliderHome{
					& .item{
						background-size: cover;
						background-image: var(--bg-image-g);

						&::after{
							display: none;
						}
						& .caption{

							& .caption_inner{
								justify-content: center;
								align-items: center;
								margin: 0;
								padding: 0;

								& *{
									text-align: center;
								}
								& .lien{
									display: none;
								}
							}
						}
					}
				}
			}
		}
		@media (max-width: 768px){
			& .bloc_slider{
				& .sliderHome{
					& .item{
						background-image: var(--bg-image-m);
					}
				}
			}
			& .swiper-pagination{
				z-index: 2;
				display: none;
			}
			& .swiper-button-prev,
			& .swiper-button-next{
				display: none;
			}
		}

	}
	#bloc_formulaire{
		--_clr_titre:#FFF;
		position: absolute;
		width: var(--_w_form);
		bottom: 0;
		z-index:100;

		& .wrapper{				
			/* width: var(--_w_form); */
			height: calc(var(--_h_slider * 0.75));
			color: #fff;
			padding: 1rem;
			border-radius: 20px;

			& .toggle_form {
				position: absolute;
				display: none;
				align-items: center;
				justify-content: center;
				right: 0;
				top: -10px;
				width: 25px;
				height: 25px;
				color: #FFF;
				background: rgba(0,0,0,0.7);
				border-radius: 50%;
			}
			& .criteres{
				display: flex;
				flex-flow: row wrap;
				align-items: center;
				gap: 1rem;

				& .etou{
					color:var(--_clr_titre);
					font-weight: 700;
				}
			}
			& .titre {
				font-size: clamp(1.1rem,2vw,2rem);
				text-transform: uppercase;
				text-align: center;
				font-weight: 700;
				color: var(--_clr_titre);
				margin-bottom: 1rem;
			}
			& form{
				display: flex;
				align-items: center;
				justify-content: center;
				gap: 1.5rem;
				padding-bottom: 68px;

				& :is(input,select){
					padding:0 40px 0 20px;
				}
				& .bloc{
					display: flex;

					& .champ {
						& input{
							width:100%;
							box-sizing: border-box;

							transition: transform 250ms ease;
							&:focus{								
								width:120%;
							}
						}
					}
					& select{
						width: 150px;
					}
				}
				& label{
					display: none;
				}					
			}
			& .foot{
				display: none;
			}
			
		}

		@media (max-width: 1200px) {
			--_clr_titre:var(--mc-primary);
			width: unset;

			& .wrapper {
				position: fixed;
				z-index:100;
				top: 0.1rem;
				left: 0;
				right: 0;
				height: fit-content;
				display: flex;
				flex-direction: column;
				justify-content: start;
				padding-top:5rem;
				background-color: #fff;
				border-radius: unset;
				translate: 0 -110%;
				transition: translate 0.75s ease-in-out;
				box-shadow: 0 0 25px #000;

				& .titre {
					font-size: clamp(1.1rem,2vw,2rem);
					line-height: 1;
					
					& .underline1{
						&::after {
							top:70%;
							bottom: unset;
						}
					}
				}
				& .criteres{
					flex-direction: column;
				}
				& form{
					flex-direction: column;

					& :is(input,select){
						border: 1px solid var(--mc-grey-light);
					}
				}
				& .foot{
					--_clr-a:black;
					display: unset;
					position: absolute;
					top: 1rem;
					right: 1.5rem;
					font-size: 2rem;
				}
			}
			& .wrapper.open {
				translate: 0 0;
			}
		}
	}
	/* masque le formulaire sur la page annuaire > 999px*/
	@media (min-width: 1200px) {
		#banner #bloc_formulaire{
			& .wrapper{
				display: none;
			}
		}
	}

	.fakesearch{
		--_clr_titre:#FFF;
		display: none;
		cursor: pointer;

		& .wrapper{
			display: flex;
			flex-direction: column;

			& .titre {
				font-size: clamp(1.5rem,2vw,2rem);
				text-transform: uppercase;
				text-align: center;
				font-weight: 700;
				color: var(--_clr_titre);
				margin-bottom: 1rem;
			}
		}

		@media (max-width: 1200px) {
			display: inline-flex;
			position: absolute;
			z-index: 10;
			height: auto;
			justify-content: center;
			align-items: center;
			top: 50%;
			left: 50%;
			transform: translate(-50%,-50%);

			& .criteres{
				position: relative;
				display: flex;

				& input{				
					pointer-events: none;
					padding:0 40px 0 20px;	
					width: 90%;			
				}
				&::after {
					content: '\f002';
					font-family: 'Fontawesome';
					position: absolute;
					right: 2rem;
					font-size: 2rem;
					color: var(--mc-secondary);
				}
			}
		}
		@media (max-width: 999px) {
			width: 100%;

			
			& .criteres{
				display: flex;
			}
			& .titre{
				font-size: 1.5rem;

				& .underline1{
					&::after {
						top:50%;
						bottom: unset;
					}
				}
			}
			& input{
				width: 90%;
			}
		}
	}

	#search_form{
		--_w:615px;

		& .criteres{
			width:var(--_w);
			margin-inline:auto;
			position: relative;

			&::after{
				content: '\f002';
				font-family: 'Fontawesome';
				position: absolute;
				right: 2rem;
				font-size: 2rem;
				color:var(--mc-secondary);
			}
			&.loading{
				&::after{
					content: '\f110';					
					animation: rotateSearchIcon 2s ease infinite;
					-webkit-animation: rotateSearchIcon 2s ease infinite;
				}
			}
			& .search_s{
				display: block;
				width: 100%;
				padding:0.5rem 2rem !important;
				font-size: 1.3rem;
			}
				
			
		}
		& .resultats{
			position: absolute;
			top: calc(57% + 10px);
			background-color: #fff;
			z-index: 10;
			width:var(--_w);
			margin-inline:auto;
			padding-top: 1rem;
			padding-bottom: 1rem;
			height: 20vh;
			overflow-y: auto;
			color:#000;
			border-radius: 0 0 10px 10px;
			outline: 0px solid lime;
			box-shadow: rgba(50, 50, 93, 0.25) 0px 13px 27px -5px, rgba(0, 0, 0, 0.3) 0px 8px 16px -8px;

			& .result-items-dep {
				display: flex;
				overflow-x: auto; 
				scroll-snap-type: x mandatory; 
				gap: 1rem; 
				margin: 0;
				padding:0 1rem 1rem;

				&::-webkit-scrollbar {
					display: none;
				}
				& .result-item-dep {
					scroll-snap-align: center;
					flex: 0 0 auto; 
					min-width: 80px; 
					padding: 0.5rem;

					text-align: center;
					font-size: 0.9rem;
					background-color: #f4f4f4;
					border-radius: 8px;
					cursor: pointer;

					transition: transform 0.3s, background-color 0.3s;

					&:hover {
						transform: scale(1.1);
						background-color: #ddd;
					}
					& a {
						text-decoration: none; 
						color: #333; 
					}
				}
			}			  

			& .result-item{
				
				padding:0.25rem 2rem;
				transition: padding-left 0.25s;

				& > span:first-child{
					font-weight: 600;
				}
				.dep{
					font-weight: 300;
				}

				&::before{					
					content: '\f105';
					font-family: 'Fontawesome';
				}
				&:hover{
					padding-left:2.25rem;
					--_clr-a-hover:var(--mc-secondary);
				}
			}
		}

		@media (max-width: 999px) {
			--_w:100%;
			gap: 0;

			& .criteres{
				flex-direction: unset !important;
			}
			& .resultats{
				position: relative;
				top: unset;
				height: 40vh;

				& .result-item{
					position: relative;
					display: flex;
					align-items: center;
					gap: 0.5rem;
					padding-top: 1rem;
					padding-bottom: 0.5rem;
					border-bottom: 1px solid #CCC;

					& a{
						flex: 1;
						display: flex;
						align-items: center;
						gap: 0.5rem;

						& span.dep{
							position: absolute;
							top: 0;
							right: 10px;
							font-size: 0.8rem;
						}
					}
				}
			}
		}
	}
	.pg #search_form{
		& .criteres{
			&::after{
				font-size: 2rem;
			}
			& .search_s{
				padding:0.5rem 1rem !important;
			}
		}
		& .resultats{
			top: calc(73% + 10px);
			padding-top: 1rem;
		}
	}

/* BLOC INTRO HOME */

	.banner_info {
		position: relative;
		padding: 2rem;
		background-color: #f5f5f5;	

		& .inner {	
			display: grid;
			grid-template-columns: 210px auto;
			grid-template-rows: auto;
			grid-template-areas: 
				'livraison titre'
				'livraison soustitre'
				'livraison avantages'
			;
			width: 80%;
			margin: auto;

			& .livraison{
				grid-area: livraison;
				& img{
					rotate:-10deg;
				}
			}
			& .titre {
				grid-area: titre;
				text-align: center;
				font-size: 35px;
				text-transform: uppercase;
				letter-spacing: -1.5px;
				font-weight: bold;
				line-height: 1.1em;
			}
			& .soustitre {
				grid-area: soustitre;
				text-align: center;
				font-size: 24px;
				text-transform: uppercase;
				letter-spacing: -1px;
				line-height: 1.1em;
			}
			& .avantages {
				grid-area: avantages;
				display: flex;
				align-items: center;
				justify-content: space-around;
				flex-wrap: wrap;
				margin-top: 15px;
				font-family: var(--mf-cursive);

				& li {
					font-size: 1.5rem;
					padding-bottom: 5px;
					border-bottom: 2px solid #f8f8f8;
					transition: 0.5s;
					letter-spacing: -0.2px;

					&:hover {
						border-bottom: 2px solid var(--mc-primary);
						cursor: default;
					}

					& .fa{
						color:var(--mc-primary);
					}
				}
			}
		}
		

		@media (max-width:999px){
			& .inner{
				width: 100%;
			}
		}
		@media (max-width:768px){
			& .inner{
				display: flex;
				flex-direction: column;
				align-items: center;
				grid-template-areas: unset;
				width: 100%;
				
				& .titre {
					font-size: 25px;
				}
				& .soustitre {
					font-size: 12px;
					line-height: 2em;
				}
				& .avantages{
					flex-direction: column;
				}
			}
		}
	}
	
	.page_home .banner_info .titre span,
	.page_home .banner_info .soustitre span {
		color: #ea202e;
	}

/* PAGES */

	.pg{
		min-height: 60vh;
		padding-bottom: 3rem;	

		& a{
			--_clr-a:var(--mc-primary);
			--_fw:600;
			font-weight: var(--_fw);
		}

		& .youtube-embed-wrapper{
			max-width: 640px;
			height: 360px !important;
			margin-inline:auto;
			padding-bottom: unset !important;

			& > iframe{
				width: 100% !important;
				aspect-ratio: 16 / 9;
				height: unset !important;
			}
		}

		@media (max-width: 768px){
			& iframe{
				width: calc(100% - 1rem);
				height: 100%;
				aspect-ratio: 16 / 9;
			}
		}

		
	}	

	#contenu_page{
		min-height: 50vh;

		& .texte{
			& a:not(.btn){
				--_clr-a:var(--mc-primary-dark);
				text-decoration: underline;

				&:hover{
					text-decoration: none;
				}
			}
			& ul{
				list-style-type:disc;
				padding-left: 1rem;
			}
		}
	}

	.body_home {
		& .bloc_formulaire{
			--_w_form:min(var(--w-container),100%);
			left: 0;
			right: 0;
			margin-inline:auto;
		}
		& .contenu{
			background:linear-gradient(to bottom, #F8F8F8, #FFFFFF 100px);
		}
	}

	.page_home{

		& .h2{
			--c-title-h2:var(--mc-primary);
			margin-top: 5rem;
		}

		& #home__avis{
			background-color: #f8f8f8;
			padding-top: 3rem;
			padding-bottom: 5rem;

			& > .titre{
				text-align: center;
			}

			& .liste_temoignage{
				display: grid;
				grid-template-columns: repeat(auto-fit,minmax(250px,1fr));
				gap: 2rem;
				margin-top: 2rem;

				& .item{
					display: flex;
					flex-direction: column;
					justify-content: center;
					text-align: center;

					& .visuel {
						display: flex;
						justify-content: center;
						margin-bottom: 0.5rem;

						& img{
							width: 150px;
							height: 100px;
							object-fit: scale-down;
						}
					}
					& .auteur{
						padding: 1rem;
						color:var(--mc-primary);
					}
				}
		}
		}

	}

	

/* 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{
			& .soustitre{
				font-weight: bold;
			}
		}

	/* FORMAT 2 
		TITRE + VISUEL DROITE/GAUCHE */
		.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%;
			}
		
		@media (max-width: 768px) {
			
			.item-format2{
				column-gap:unset;
				flex-direction: column !important;
				& .infos{
					width: 100%;
					padding: 2em 0;
					transform: unset;
				}
				& .visuel{
					width: 100%;
					grid-area: 3 / 1 / 4 / 4;
					transform: unset;
				}
				& .texte{
					grid-area: 4 / 1 / 5 / 5;
				}
				& .lien{
					grid-area: 5 / 1 / 6 / 6;
				}
			}
		}
		
			
		
	/* 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 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 4 LISTE FICHE */
		
		.format_4{	
			& .liste_resultats{
				display: grid;
				grid-template-columns: repeat(var(--nb-col,4), 1fr);
				justify-items: center;
				padding-inline: 0;

				& .item{
					width: 90%;
					max-width: 263px;
					text-align: center;

					& .visuel{

						& img.img_cover{
							width:100%;
							height:100%;
							object-fit:cover;
						}
						& img.img_profile{
							--_height:200px;
							--_width-logo:calc(var(--_height)/2.5);	
							width: calc(var(--_width-logo));
							height: calc(var(--_width-logo));
							background-color: #f8f8f8;
							border: 4px solid #FFF;
							border-radius: 50px;
							outline: 1px solid #f8f8f8;
							translate: -10% -85%;
						}
					}
				}
			}
			@media (max-width: 999px) {	
				& .liste_resultats{		
					grid-template-columns: repeat(3, 1fr) !important;
				}
			}
			@media (max-width: 768px) {		
				& .liste_resultats{	
					grid-template-columns: repeat(2, 1fr) !important;
				}
			}
			@media (max-width: 580px) {
				& .liste_resultats{
					grid-template-columns: repeat(2, 1fr) !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;}


	/* FORMAT 7 : contact  */
		
		#form_contact{
			width:min(700px,100% - 1em);
			margin-inline:auto;
		}
		#form_contact .ligne{
			margin-top:1.5em;
		}
		#form_contact .ligne label{
			font-size:0.9em;
		}

		.contact_retour{
			display: flex;
			justify-content: center;

			& .success{
				color: darkgreen;
			}
			& .error{
				color: darkred;
			}
		}

	/* 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 */

	/* RECHERCHE CARTE DEPARTEMENT */
		
		#home_map{
			--_padding-bottom:50px;

			& .h1{
				background-color: var(--mc-primary);
				color:var(--mc-over-primary);
				border-radius: 15px 15px 0 0;
				padding: 2rem 1rem var(--_padding-bottom) 1rem;
			}
			& .section_recherche_carte_departement{
				display: grid;
				grid-template-columns: 1fr 33%;
				gap: 1rem;

				& .carte{
					margin-top: calc(var(--_padding-bottom)*-1);
					padding: 2rem 1rem;
					background-color: #fff;
					border-radius: 15px 15px 0 0;

					& path{
						cursor: pointer;

						&.active{
							fill:var(--mc-primary);
						}
						&:hover{
							fill:var(--mc-primary);
						}
					}
				}
				& .liste_select{
					display: none;
				}
				& .resultats{
					display: grid;
					place-items: center;

					& > .wrapper{
						display: flex;
						flex-direction: column;
						align-items: center;
						gap: 1rem;
						background-color: #f5f5f5;
						padding: 2rem;
						border-radius: 15px;
					}
					& .lieu{
						font-size: 2rem;
						font-weight: 700;
					}
					& .nb_pro{
						font-size: 1.5rem;
						font-weight: 600;
						display: flex;
						gap:1rem;

						& .nb_taxi::before{
							content: 'TAXIS : ';
						}
						& .nb_vtc::before{
							content: 'VTC : ';
						}
					}
					& .note{
						font-size: 2rem;

						& i{
							color:var(--mc-secondary);
						}
					}
					& .villes{
						display: flex;
						flex-flow: row wrap;
						justify-content: center;
						gap: 0.25rem 1rem;
						color:var(--mc-primary-dark);
						text-decoration: underline;
					}
					& .infos{
						font-size: 0.9rem;
					}
					& .btn_submit .btn{
						--_effect-hover-border-color:var(--mc-primary);
					}
				}
			}

			@media (max-width: 768px) {
				& .h1{
					padding: 1rem;
					text-align: center;
				}
				& .section_recherche_carte_departement{
					grid-template-columns: 1fr;
					padding-inline:0.5rem !important;
					margin:0;

					& .carte{
						display: none;
					}
					& .liste_select{
						display: initial;
						width: 90vw;
						font-size: 1.3rem;
						padding-left: 0;

						& select{
							width: 90vw;
						}
					}
					& .lieu{
						text-align: center;
					}
				}
			}
		}
	/* FORMAT LISTE LIEUX */
		
		.liste_lieu_categories {
			display:grid;
			grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));
			justify-items: center;
			gap:3rem 1rem;
			flex-wrap: wrap;
			margin-top: 2rem;
			padding: 2rem 1rem;

			& .item{
				width: min(400px, 100%);
				background-color: #fff;
				border-radius: 15px;

				& .head{
					position: relative;
					padding: 1.5rem 5rem 1.5rem 2rem;
					font-weight: 500;
					background-color: var(--mc-primary);
					color:var(--mc-over-primary);
					border-radius: 15px;
					line-height: 1.5em;
					font-size: 1.1em;

					& a{
						color:var(--mc-white);
					}

					& span{
						display: block;
						text-align: right;
						font-size: 1.4em;
						font-weight: 600;
					}
					&::after{
						content:'';
						position: absolute;
						top: 0;
						right: 0;
						background-image: url('../images/logo_small.png');
						background-size: contain;
						display: block;
						width: 85px;
						height: 85px;
						translate: -25% -50%;
					}
				}
				& ul{
					padding: 1rem;

					& li{
						display: flex;
						align-items: center;
						gap: 0.25rem;
						padding-left: 1rem;
						padding-top: 0.25rem;
						padding-bottom: 0.25rem;

						border-bottom: 1px solid #f8f8f8;

						&::before{
							content:'•';
							font-size: 2rem;
							line-height: 1;
							color: var(--mc-secondary);

							transition: color 0.5s;
						}
						& a{
							--_fw:normal;
						}
						&:hover{
							&::before{								
								color: var(--mc-primary);
							}
						}
					}
				}
			}

			@media (max-width: 999px){
				flex-direction: column;	
				align-items: center;				
				grid-template-columns: repeat(auto-fit, minmax(49%, 1fr));
			}
			@media (max-width: 768px){	
				grid-template-columns: 1fr;		
				padding: 1rem 0rem;

				& .item{

					& .head{
						padding:1.5rem 0.5rem;
						border-radius: 5px;
						text-align: center;

						& span{
							display: block;
							text-align: center;
							font-size: 1.2em;
						}
						&::after{
							width: 64px;
							height: 64px;
							translate: -5% -60%;
						}
					}
					& ul{
						padding-top: 0;

						& li{
							padding-left: 0;
						}
					}
				}
			}
		}

	/* FORMAT LISTE ANNONCES -> déplacé espace pro*/

		

	/* 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) {
			
			
			.home_section .home_section_ligne .item-common h2{
				font-size: 1.5em;
			}


			/* 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_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;}

			
		}
	/**/




/* ANNUAIRE */
	
	.page_annuaire{

		& .attente_inscription{
			width: min(900px, 100%);
			margin: 0rem auto;
			
			background:#f8f8f8;
			border-radius:15px;

			& .wrapper{
				padding:2rem;

				& .texte_places{
					line-height:1;
					font-size:1.05rem;
					font-weight: 600;
					color:var(--mc-primary);

					& span{
						font-size: 1.4rem;
					}
				}
			}
			& .visuel{
				& picture{
					width: 100%;
	
					& img{
						width: 100%;
						height: 200px;
						object-fit: cover;
						border-radius: 15px;
					}
				}
			}
			& .inscription{
				font-size: 0.9rem;
			}
		}
		& h1{ 
			display: flex;
			align-items: center;
			gap: 1rem;

			& > span{
				display: flex;
				align-items: center;
				gap: 1rem;

				&::before{
					content:'▶';
					font-size: 0.8rem;
				}
			}
		}
		& .container > .texte{
			display:grid;
			grid-template-columns:1fr 30%;
			gap:2rem;

			.visuel{
				figure{
					display: flex;
					flex-direction: column;
					margin: 0;

					picture{
						display: flex;

						img{
							width: 100%;
							height: 250px;
							object-fit: cover;
							border-radius: 10px;
						}
					}
					figcaption{
						color: var(--mc-grey);
						font-size: 0.8rem;
						font-style: italic;
						text-align: center;
					}
				}
			}
		}
		& .pg_search{
			position:relative;
			background:url(/assets/images/_pg_diapo.jpg) no-repeat center center;
			background-size:cover;

			&::before{
				content:'';
				position: absolute;
				z-index: 2;
				display: block;
				width: 100%;
				height: 100%;
				background: linear-gradient(to top, var(--mc-black) 0%, transparent 100%);
			}	
		}

		& .hidden-text {
			display: none;
			opacity: 0;
			max-height: 0;
			overflow: hidden;
			transition: max-height 0.5s ease-out, opacity 0.5s ease-out;

			&.show {
				display: inline;
				opacity: 1;
				max-height: 500px; /* Ajuster selon besoin */
			}				
		}
		

		& .form_annuaire{
			--_clr_titre:#FFF;
			position: relative;
			width: var(--_w_form);
			bottom: 0;
			z-index:3;

			& .toggle_form {
				position: absolute;
				display: none;
				align-items: center;
				justify-content: center;
				right: 0;
				top: -10px;
				width: 25px;
				height: 25px;
				color: #FFF;
				background: rgba(0,0,0,0.7);
				border-radius: 50%;
			}
			& .criteres{
				display: flex;
				flex-flow: row wrap;
				align-items: center;
				gap: 1rem;

				& .etou{
					color:var(--_clr_titre);
					font-weight: 700;
				}
			}
			& form{
				display: flex;
				align-items: center;
				justify-content: center;
				gap: 1.5rem;
				padding-top: 6rem;
				padding-bottom: 2rem;

				& :is(input,select){
					padding: 0 40px 0 20px;
				}
				& .ligne1{
					
					width:min(250px, 100%);
				}
					
				& input{
					width: 100%;
					box-sizing: border-box;
				}
				& select{
					width: 100%;
					background-color: #fff;
				}
				& label{
					display: none;
				}
			}
		}

		@media (max-width: 999px) {
			& .h1{
				display: flex;
				flex-direction: column;
				gap: 0;
				text-align: center;

				& > span{
					&::before{
						content: none;
						display: none;
					}
				}
			}
			& .h2{
				text-align: center;
			}
			& .container > .texte{
				grid-template-columns:repeat(auto-fit, minmax(min(200px, 100%), 1fr));
			}
			& .container > .texte:not(:has(.visuel img)){
				grid-template-columns: 1fr;
			}
		}
		@media (max-width: 768px) {
			
			& .attente_inscription{
				width: unset;	
			}
			& .container > .texte{
				display:grid;
				grid-template-columns:1fr;
				gap:2rem;
				align-items:center;

				.visuel{
					figure{	
						picture{	
							img{
								width: 50%;
								height: auto;
								object-fit: contain;
								margin-inline: auto;
							}
						}
					}
				}
			}
			& .form_annuaire {
				& form{
					flex-direction: column;
					gap: 1rem;
					padding-top: 1rem;
					padding-bottom: 1rem;
				}
				& .criteres{
					flex-direction: column;
					gap: 0;
				}
			}			
		}
		@media (max-width: 580px) {
			
			& .container > .texte{
				.visuel{
					figure{	
						picture{	
							img{
								width: auto;
								height: auto;
								object-fit: contain;
							}
						}
					}
				}
			}		
		}
	}	

	.liste_resultats{
		display:grid;
		grid-template-columns:repeat(4, 1fr);
		gap:0.5rem;
		padding:1rem 0;

		.item{
			border:1px solid #CCC;
			border-radius:10px;
			padding:1.5rem 1rem;
			text-align: center;

			.visuel{	
				position: relative;
				--_height:200px;
				--_width-logo:calc(var(--_height)/2.5);			
				height: min(var(--_height), 15vh);
				text-align: left;				

				img{
					width:100%;
					height: 100%;
					object-fit:cover;
				}
				.img_profile{
					width: calc(var(--_width-logo));
					height: calc(var(--_width-logo));
					background-color: #f8f8f8;
					border: 4px solid #FFF;
					border-radius: 50px;
					translate: -10% -85%;
				}
			}
			.titre{
				margin-top:1rem;
				margin-bottom: 0.15rem;
				font-size: 1.1rem;
			}
			.texte{
				font-size: 0.8rem;
				font-style: italic;
				padding-top: 0.25rem;
				padding-bottom: 0.75rem;
			}
			.logo-taxi-conventionne{
				display:inline-flex;
				width:25px;
				height:25px;
				object-fit:contain;
			}
			.commune{
				margin-bottom:1rem;
			}
			.note{
				margin-bottom: 0.15rem;
				
				.stars{
					color:var(--mc-secondary);
				}
			}
			.ads_lieu{
				position: absolute;
				z-index: 10;
				bottom:-10px;
				right: 10px;
				padding:5px 10px;

				background-color: var(--mc-secondary);
				border-radius:20px;
				font-size: 0.7rem;
				color: var(--mc-black);
			}
		}
		&.liste_resultats_moinsde{
			display: flex;
			justify-content: center;
			flex-wrap: wrap;

			& .item{
				width: 22%;
				text-align: center;
			}
		}

		&.liste_resultats_detailles{
			grid-template-columns:1fr;

			.item{
				display: flex;
				gap: 1rem;

				.visuel{
					.img_cover{
						width: 200px;
						border-radius: 10px;
					}
					.img_profile{
						translate: -30% -30%;
					}
				}
			}
		}

		@media (max-width: 999px) {
			
			grid-template-columns:repeat(3, 1fr);

			&.liste_resultats_moinsde{
				& .item{					
					width: min(263px, 100%);
				}
			}
		}
		@media (max-width: 768px) {			
			grid-template-columns:repeat(2, 1fr);
		}
		@media (max-width: 580px) {
			display: flex !important;
			justify-content: center;
			flex-direction: column;
			align-items: center;
			padding-inline: 0;

			.item{
				width: 90% !important;
				max-width: unset !important;
				display: grid;
				grid-template-columns: 40% 1fr;
				grid-auto-rows: auto auto auto 1fr;
				grid-template-areas: 'visuel titre' 'visuel note' 'visuel commune' 'visuel lien';
				gap: 0 1rem;
				align-items: center;
				text-align: center;
				padding:1rem 0.5rem;

				.visuel{
					grid-area: visuel;
					--_height:100px;
				}
				.titre{
					grid-area: titre;
					line-height: 1.1;
				}
				.texte{
					grid-area: texte;
					display: none;
					line-height: 1.1;
				}
				.note{
					grid-area: note;
				}
				.commune{
					grid-area: commune;
					line-height: 1.1;
				}
				.lien{
					grid-area: lien;
					display: none;
				}
			}
			
		}
	}

	.product_listing_home{
		position: relative;

		@media (max-width:768px){
			
		}
	}

	.liste_mosaique{
		--_nb_cell:4;
		--_img_height:180px;
		position: relative;
		display: grid;
		grid-template-columns: repeat(var(--_nb_cell), 1fr);
		column-gap: 2rem;
		row-gap: 2rem;
		margin-top: 3rem;

		& li{

			& .wrapper{
				position: relative;
				border: 1px solid #ccc;
				border-radius: 15px;
				padding: 1em;

				& .categorie {
					position: absolute;
					z-index:5;
					top: -0.5rem;
					left: -0.5rem;
					background-color: #fff;
					color: var(--mc-primary);
					padding: 0.25rem 1rem;
					text-transform: uppercase;
					font-weight: 700;
					border-top: 2px solid var(--mc-primary);
					border-bottom: 2px solid var(--mc-primary);
					rotate: -5deg;
				}
				& .visuel{
					height: var(--_img_height);
					margin-bottom: 0.5rem;
					overflow: hidden;

					& img{
						width: 100%;
						height: 100%;
						object-fit: cover;
						transition: scale 0.25s;

						&.logo_marque{
							width: 80px;
							height: 100%;
							object-fit: scale-down;
							margin: auto;
							filter: opacity(20%);
						}
					}

				}
				& .infos{
					display: flex;	
					flex-direction: column;align-items: center;

					& .titre{
						font-size: 1.1rem;
						font-weight: 700;
						line-height: 1.1em;
					}
					& .texte{
						font-size: 0.9rem;
						padding: 0.25rem;
					}
					& .tarifs{
						display: flex;
						justify-content: center;
						align-items: center;
						gap: 1rem;
						width: 100%;

						& .prix_barre{
							position: relative;
							font-size: 1.4rem;
							font-weight: 700;
							color:var(--mc-primary-light);
							white-space: nowrap;

							&::after{
								content:'';
								position: absolute;
								top: 50%;
								left: -5%;
								width: 110%;
								height:2px;
								background-color: var(--mc-primary);
								rotate: -3deg;
							}
						}
						& .pourcent{
							color:var(--mc-primary-light);
						}
						& .prix{
							position: relative;
							font-size: 1.5rem;
							font-weight: 700;

							&.prix_utilitaire{								
								padding-top: 1rem;
							}
							
							& sup{
								position: absolute;	
								font-size: 0.7rem;							
							}
							& .utilitaire_ttc{
								position: absolute;
								top: 0;
								translate: 0;
								white-space: nowrap;
								font-size: 0.9rem;
							}
							& .tarif{
								color:var(--mc-primary);
								white-space: nowrap;						
							}
						}
					}
					& .lien{
						--_h:40px;
						display: flex;
						justify-content: end;
						align-items: end;
						width: 100%;
						height: 50px;

						& a{
							position: relative;
							display: flex;
							width: var(--_h);
							height: var(--_h);
							align-items: center;
							justify-content: center;
							background-color: var(--mc-primary-light);
							color: var(--mc-over-primary-light);
							border-radius: 0 50% 50% 50%;
							rotate: -45deg;
							transition: all 0.25s;

							& i{
								rotate: 45deg;
							}
						}
					}
				}
			}

			&:hover{
				& .wrapper{
					& .visuel img{
						scale:1.05;
					}
					& .lien{
						--_h:45px;
					}
				}
			}
		}

		@media (max-width:999px){
			--_nb_cell:3;
			--_img_height:150px;

		}
		@media (max-width:768px){
			--_nb_cell:2;
			--_img_height:150px;

		}
		@media (max-width:580px){
			--_nb_cell:1;
		}
	}

	.liste_produits_inline{

		& .special{
			font-size: 1.5rem;

			&:not(:first-child)::before{
				content: '';
				display: block;
				width: min(350px, 100% - 1rem);
				height: 2px;
				margin:2rem auto;
				background: linear-gradient(to right, var(--mc-white) 15%, var(--mc-primary), var(--mc-white) 85% );
			}

		}
		& .item{
			display: grid;
			grid-template-columns: 200px 1fr 200px 50px;
			grid-template-rows: auto;
			gap: 1rem;
			margin-top: 1rem;
			margin-bottom: 1rem;
			position: relative;
			border: 1px solid #ccc;
			border-radius: 15px;
			padding: 1em;

			& .visuel{
				& .categorie {
					position: absolute;
					z-index: 5;
					top: -0.5rem;
					left: -0.5rem;
					background-color: #fff;
					color: var(--mc-primary);
					padding: 0.25rem 1rem;
					text-transform: uppercase;
					font-weight: 700;
					border-top: 2px solid var(--mc-primary);
					border-bottom: 2px solid var(--mc-primary);
					rotate: -5deg;
				}

			}
			& .infos{

				& .titre{
					margin-bottom: 1rem;

					& a{
						color: var(--mc-primary);
						font-weight: 700;
					}

				}
				& .details{
					display: grid;
					grid-template-columns: repeat(2, 1fr);

					& .bloc_detail{
						display: flex;
						flex-direction: row;
						flex:1;
						gap: 0.25rem;
						font-size: 0.9rem;
					
						& .icone{display:inline-block;height: 18px;width: 18px;background-color: #000;}
						& .icone-km{mask:url(/assets/images/icons/081-dashboard-3.svg) no-repeat;-webkit-mask:url(/assets/images/icons/081-dashboard-3.svg) no-repeat;}
						& .icone-boite{mask:url(/assets/images/icons/081-gearshift.svg) no-repeat;-webkit-mask:url(/assets/images/icons/081-gearshift.svg) no-repeat;}
						& .icone-energie{mask:url(/assets/images/icons/081-gas-station.svg) no-repeat;-webkit-mask:url(/assets/images/icons/081-gas-station.svg) no-repeat;}
						& .icone-moteur{mask:url(/assets/images/icons/081-engine.svg) no-repeat;-webkit-mask:url(/assets/images/icons/081-engine.svg) no-repeat;}
						& .icone-co2{mask:url(/assets/images/icons/co2.svg) no-repeat;-webkit-mask:url(/assets/images/icons/co2.svg) no-repeat;}
						& .icone-annee{width: 18px;height: 18px;mask:url(/assets/images/icons/calendar.svg) no-repeat;-webkit-mask:url(/assets/images/icons/calendar.svg) no-repeat;}
					}

				}
				
			}
			& .tarif{
				position: relative;
				display: flex;
				justify-content: center;
				font-size: 1.5rem;
				font-weight: 700;
				color:var(--mc-primary);

				&:has(.pourcent){
					flex-direction: column;
					align-items: center;
				}
				& .prix_barre{
					position: relative;
					display: flex;
					width: fit-content;
					font-size: 1.2rem;
					font-weight: 700;
					color:var(--mc-primary-light);

					&::after{
						content:'';
						position: absolute;
						top: 50%;
						left: -5%;
						width: 110%;
						height:2px;
						background-color: var(--mc-primary);
						rotate: -3deg;
					}
				}
				& .pourcent{
					position: absolute;
					top: 0;
					right: 50px;
					width: 50px;
					height: 50px;
					display: flex;
					align-items: center;
					justify-content: center;
					border-radius: 50%;
					color: #FFF;
					font-size: 0.8em;
					font-weight: bold;
					background: linear-gradient(to left, var(--mc-primary) 0%, var(--mc-primary-dark) 100%);
					translate: 50% -50%;
				}
			}
			& .lien{
				--_h: 40px;
				display: flex;
				justify-content: center;
				align-items: center;
				width: 100%;
				height: 100%;

				& a {
					position: relative;
					display: flex;
					width: var(--_h);
					height: var(--_h);
					align-items: center;
					justify-content: center;
					background-color: var(--mc-primary-light);
					color: var(--mc-over-primary-light);
					border-radius: 0 50% 50% 50%;
					rotate: -45deg;
					transition: all 0.25s;

					& i{
						rotate: 45deg;
					}
				}
			}

			&:hover{
				border-color: var(--mc-primary);
				& .lien{
					--_h:45px;
				}
			}
		}

		@media (max-width: 768px) {

			display: grid;
			grid-template-columns: repeat(2, 1fr);

			& .special{
				display: none;
			}
			& .item{
				grid-template-columns: 1fr;

				& .infos{
					& .details{
						grid-template-columns: 1fr;
					}
				}
			}
		}
		@media (max-width: 580px) {
			display: grid;
			grid-template-columns: 1fr;
		}
	}
	
	

/* ARIANE */

	#ariane{
		
		padding: 1rem 0;
		background-color: var(--mc-grey-light-light);

		& .item{

			&::before{
				content: '/';
				color: var(--mc-primary-light);
				margin-inline: 0.5rem;
			}
		}

		@media(max-width: 580px){
			& .item{
				font-size: 0.9rem;

				&::before{
					margin-inline: 0.25rem;
				}
			}
		}
	}


/* FORM */

	form {

		& fieldset{
			padding-top: 1rem;
		}
		& .ligne{		
			position: relative;
			display: flex;
			flex-direction: column;
			margin-bottom: 1em;

			&:has(+ .ligne_annotation){
				margin-bottom: 0;
			}
			&:has(input[required]) label::after {
				content: '*';
			}
			& .champ:not(.champ_radio){
				display: flex;
				flex-direction: column-reverse;
				width: 100%;

				&.champ_center{
					align-items: center;
				}
				&.champ_fullw{
					width: 100%;
				}
				& label{
					display: block;
					margin-top: 0.75em;
					font-size: 0.9em;
				}
				&.champ_rubrique{
					font-size: initial;
					display: flex;
					flex-direction: row;
					align-items: center;
					gap:0.5rem;

					&::before{
						content:'';
						display: inline-block;
						width:10px;
						height:10px;
						background-color: var(--mc-primary);
					}
					& label{
						display: inline-block;
						margin: 0;
					}
				}
				
			}			
			& .champ_radio{
				display: flex;
				align-items: center;
				padding-top: 0.25rem;

				& > span{					
					display: flex;
					align-items: flex-start;
				}
				& input[type='radio'],
				& input[type='checkbox']{
					height: unset !important;
				}
				& label{
					font-size: 0.9rem;
				}
			}
			& input:not([type='checkbox']){
				color: var(--mc-darkgrey);
				display: inline-flex;
				font-size: 14px;
				line-height: 1.3333333;
				transition: all .3s ease;
				border: 1px solid #b3b2c2;
				background: #fff 0 0 no-repeat padding-box;
				border-radius: 8px;
				padding: 0 40px 0 20px;
				font-family: var(--mf-primary);
				height: 50px;

				&.champ_xs{
					width:120px;
				}
				&.champ_sm{
					width:180px;
				}
			}
			& input[type="date"]{
				width: 130px;
			}
			& textarea{		
				font-family: var(--mf-primary);
				color: var(--mc-darkgrey);
				display: inline-flex;
				font-size: 14px;
				line-height: 1.3333333;
				transition: all .3s ease;
				border: 1px solid #b3b2c2;
				background: #fff 0 0 no-repeat padding-box;
				border-radius: 8px;
				height: 100px;
				padding: 10px 40px 0 20px;
			}
			& .cp{
				width:140px;
			}
			& *:focus:invalid {
				color: var(--mc-primary);
				border: none;
				border-bottom: 1px solid var(--mc-primary);
			}
		}
		& .ligne,
		& .ligne-inline > div{
			display: flex;
			flex-flow: row wrap;
			gap:0.5em;
		}
		& .ligne-inline:not(.ligne-inline2) div:nth-child(2){
			flex-grow: 1;
		}
		& .ligne_full{
			width: 100%;
		}
		& .ligne_submit{
			justify-content: center;
			text-align: center;
			margin: 2em;
		}
		& .ligne_tabs{
			display: flex;
			flex-direction: row !important;
			flex-wrap: wrap;
	
			& > div{
				display: flex;
				align-items: center;
				gap:1rem;
	
				& label{
					background-color: var(--mc-over-primary);
					border:1px solid var(--mc-primary);
					margin: 0;
					padding: 0.25rem 1rem;
					border-radius: 10px;
				}
				& input{
					display: none !important;
				}
				& input:checked + label{
					background-color: var(--mc-primary);
					color: var(--mc-over-primary);
				}
			}        
		}
		& .ligne_checkbox{
			& input[type='checkbox']{
				outline: 2px solid transparent;
			}
		}
		/* FORM ANIM */
		&.form_anim{

			& .ligne{
				flex-direction: initial;

				

				& input:not([type="checkbox"]){
					color: var(--mc-darkgrey);
					display: inline-flex;
					font-size: 14px;
					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;
	
					&:focus-visible{
						box-shadow: 0 1px 1px rgba(0,0,0,.2);
					}
				}
				& .champ:not(.champ_radio){
					position: relative;
					width: initial;

					& 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: 14px;
						opacity: 1;
						pointer-events: none;
					}
					& select {
						color: var(--mc-darkgrey);
						display: inline-flex;
						font-size: 14px;
						font-family: var(--mf-primary);
						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;
					}
					& select ~ label,
					& input:focus-visible ~ label,
					& textarea:focus-visible ~ label,
					& input:not(:placeholder-shown) ~ label,			
					& textarea: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%;
					}
				}
				
			}
			
			
			& .ligne select ~ i.icon,
			& .ligne input ~ i.icon{
				position: absolute;
				top: 50%;
				right: 20px;			
				translate: 0 -50%;
				color:#ababab;
				cursor:pointer;
			}
		}
		& .confidentialite{
			font-size: 0.8rem;
		}
		&.form_classic{
			display: flex;
			flex-direction: column;
			padding: 2em;
			background-color: #fff;
			border-radius: 15px;
	
			& .ligne{
				flex-direction: column-reverse;
			}
			& .ligne-inline{
				flex-direction: row !important;
				
				& .champ{
					flex:1;
					width: unset;
				}
			}
		}
	
		&.form_fit{
			width: fit-content;
			margin-inline: auto;
		}
		&#form_signup{
			--_clr-a:var(--mc-primary);

			& .bloc_identification{
				margin-top: 1rem;

				& a{
					text-decoration: underline;
				}
			}

			& .ligne_submit{
				& .champ{
					width: fit-content;
					margin-inline: auto;
				}
			}
			& .ville_search_results:not(:empty){
				position: absolute;
				z-index:10;
				left: 0;
				width:calc(100% - 2rem);
				padding: 1rem;
				background-color: #fff;
				border:1px solid var(--mc-primary-light);
				translate:0 100%;

				& ul{
					margin: 0;
				}
			}
			& .msg_inscription_ok{margin:0.5rem;
				padding:1rem 2rem;
				border:1px solid var(--mc-primary-light);				
				border-radius: 10px;
				
			}
			& .msg_inscription_liste_attente{
				& .wrapper{
					margin:0.5rem;
					padding:1rem 2rem;
					background-color: var(--mc-primary-light);
					color:var(--mc-over-primary-light);
					border-radius: 10px;
					text-wrap: unset;
				}
			}
		}

		.champ_passwd{
			position: relative;
			max-width: 300px;

			& input{
				width: 100% !important;
			}
		}
	
		&.form_w_pwdlvl{

			& .passwd_level{
				position: absolute;
				display: inline-block;
				top:50%;
				right: 0;
				translate: 150% -50%;
				color:#CCC;

				&.weak{
					color:red;
				}
				&.medium{
					color:orange;
				}
				&.strong{
					color:green;
				}
			}
			& .passwd_level_libelle{
				font-size: 0.8em;
				color:#ababab;
				font-style: italic;
			}

		}

		@media (max-width: 768px) {
			&#form_signup{
				padding-inline:0 !important;

				& .bloc_identification{
					padding-inline:1rem;
				}
			}
		}

	}	

	@media (max-width: 768px) {
		form .ligne, form .ligne-inline > div{
			flex-direction: column;
		}
		form.form_w_pwdlvl .passwd_level{
			right: 1em;
		}
		form.form_anim .ligne select ~ i.icon, form.form_anim .ligne input ~ i.icon{
			right: 2em;
		}
		form .ligne_submit{
			margin: 2em 0;
		}

	}

/* TEMOIGNAGES */
	
	.pg_temoignages {
		& .liste_temoignages {
			overflow: hidden;/* Prevent AOS overflow*/
			display: grid;
			grid-template-columns: 1fr 1fr;
			text-align: center;

			& li {
				padding: 0;
				padding: 1rem 2rem;
				font-style: italic;
				border-bottom: 1px solid #999;
				display: flex;
				align-items: center;
				flex-direction: column-reverse;
				gap: 1em;

				&:target{
					outline: 2px solid var(--mc-primary-light);
					border-radius: 20px;
					background: var(--mc-grey-light-light);
					scale: 1.05;
				}

				& .titre {
					display: block;
					margin-top: 1.5em;
					font-style: normal;
					font-weight: normal;
				}
				& .texte {
					font-style: normal;
					& .titre{
						font-weight: 700;
					}
					& .infos{						
						font-size: 0.9rem;
					}
					& a{
						color:var(--mc-primary-dark);
					}
				}
				& blockquote {
					quotes: '\201c' '\201d';
					display: flex;
					align-items: center;
					padding: 1em;
					position: relative;
					font-size: 1em;
					line-height: 1em;
					border-radius: 5px;
					font-style: italic;
					&::before {
						content: open-quote;
						position: absolute;
						top: 0;
						left: 0;
						translate: -100% 0;
						font-size: 2.5rem;
						font-weight: bold;
						color:var(--mc-primary);
					}
					&::after {					
						content: close-quote;
						position: absolute;
						bottom: 0;
						right: 0;
						translate: 100% 0;
						font-size: 2.5rem;
						font-weight: bold;
						color:var(--mc-primary);
					}
				}
			}
		}
		& .bloc_filtres {
			display: flex;
			flex-wrap: wrap;
			justify-content: space-between;
			border-bottom: 1px solid var(--mc-black);
			padding: 1em;

			& .wrapper{
				display: flex;
				align-items: center;
				gap:1rem;
				width: min(500px, 100%);

				& > div{
					white-space: nowrap;
				}
			}
		}
	}

	.pg_temoigner{
		& .wrapper{
			width:min(800px, 100%);
		}
	}

	

	@media (max-width: 999px) {
		.pg_temoignages {
			& .liste_temoignages {
				grid-template-columns: auto;
				& li{
					flex-direction: column;
				}
			}
		}
	}


/* BACK TO TOP */

	#back-to-top {
		position: fixed;
		z-index: 20;
		bottom: 1rem;
		right: 1rem;
		display: flex;
		justify-content: center;
		align-items: center;
		width: 36px;
		height: 36px;
		font-size: 1rem;
		font-weight: 700;
		text-decoration: none;
		rotate: 45deg;
		transition: all 0.25s ease;
		background-color:var(--mc-primary);
		color: var(--mc-over-primary);
		border-radius: 50%;
		visibility: hidden;
		opacity: 0;

		& i{
			rotate: -45deg;
		}
		&.show{
			visibility: visible;
			opacity: 1;

			
		}

		&:hover{
			scale:1.05;
		}
	}

/* LOGIN */

/* Login page */
	.pg_accesspro{
		.access_part1{
			display:grid;
			gap:1rem;
			grid-template-columns:1fr 1fr;
			align-items:start;

			& > div:first-child{
				display: grid;
				grid-template-columns: 1fr 2fr;
				grid-template-areas: 
					' titre titre '
					' logo texte '
				;
				align-items: center;
				gap: 1rem;

				& .titre{
					grid-area: titre;
				}
				& .logo{
					grid-area: logo;
					width: 20ch;
					height: 20ch;
					object-fit: contain;
				}
				& .texte{
					grid-area: texte;
				}
			}
		}
		.table_inscription{
			width:min(600px, 100% - 1em);
			margin-inline: auto;

			td{
				text-align: center;
				background: #f8f8f8;
				padding: 1rem;
			}
		}
		
		@media (max-width: 768px){
			& .access_part1{
				display: flex;
				flex-direction: column-reverse;
				align-items: center;

				& > div:first-child{
					display: flex;
					flex-direction: column;
				}
			}
		}
	}

	

	form.ec_forms{
		display: none;
	}
	form.ec_forms.active{
		display: flex;
	}
	form.ec_forms.opening {
		position: absolute;
		display: flex;
		left: 0;
		right: 0;
		width: fit-content;
		z-index:1;
		animation: showingForm 1s ease normal;
		-webkit-animation: showingForm 1s ease normal;
	}
	form.ec_forms.closing {
		position: absolute;
		left: 0;
		right: 0;
		animation: closingForm 1s ease normal;
		-webkit-animation: closingForm 1s ease normal;
	}

	@keyframes showingForm{
		from {
			opacity: 0;
		}
		to {
			opacity: 1;
		}
	}
	@keyframes closingForm{
		from {
			opacity: 1;
		}
		to {
			opacity: 0;
		}
	}


/**/

/* CUSTOM PAGE BLOC */

	@media (max-width: 999px) {
		.intro_logo .visuel{
			margin-top: 10px !important;

			& img{
				width: 40vw !important;
				height: 40vw !important;
				--img-fit: contain !important;
			}
		}
	}

.underline1{
	position: relative;

	&::after {
		content: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTcyIiBoZWlnaHQ9IjEwIiB2aWV3Qm94PSIwIDAgMTcyIDEwIiBmaWxsPSJub25lIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPgo8cGF0aCBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGNsaXAtcnVsZT0iZXZlbm9kZCIgZD0iTTE1MC42ODIgMC4wMDEwMDMwNkMxNDkuMjU1IC0wLjAwMDg0NTgzMyAxNDcuODI4IDAuMDA2NTI4MDYgMTQ2LjQwMSAwLjAyNTAxNjlDMTM2LjE0NSAwLjE0ODg5MiAxMjUuODkyIDAuNDIwNjk0IDExNS42MzkgMC42MjIyMjJDMTExLjM5MiAwLjcwNzI3MSAxMDcuMTQyIDAuNzM4NzE3IDEwMi44OTYgMC44NDA0MDZDOTAuNTY4OSAxLjEzNjIzIDc4LjI0MTkgMS40OTMwMyA2NS45MTQ4IDEuNzUzNzNDNTcuMDU4IDEuOTM4NjIgNDguMTkzOSAxLjg1OTEzIDM5LjM0MjcgMi4xNzUyOUMyOS4yODU2IDIuNTMyMTIgMTkuMjM1NiAzLjE1MTUgOS4xODcgMy43NjUzM0M2LjczMDAyIDMuOTE1MDkgNC4yOTA5OCA0LjQ0Mzg3IDEuODU2MzggNC44NjcyNkMwLjQ0Mjk3NSA1LjExNTAyIDAuNTIyMzQgNS45OTY5NCAxLjA1ODY2IDcuMDQ3MTFDMS44NDEyMSA4LjU3OTg0IDMuMDIxMzIgOS4xNjA0IDQuNzU3MTcgOS4wMTQzNEMxMi42NDc4IDguMzUyNDMgMjAuNTM3MSA3LjU3NTkxIDI4LjQ0MzYgNy4xOTEzNEMzOC4zMzc0IDYuNzA4NzggNDguMjQ4OCA2LjUxNDYyIDU4LjE1NSA2LjMwMDE1QzcwLjEyMjkgNi4wNDEzMSA4Mi4wOTU5IDUuOTYzNjYgOTQuMDYyMiA1LjY0MzhDOTcuMjE2NyA1LjU1ODc1IDEwMC4zNDkgNC44MjQ3MyAxMDMuNTAyIDQuNDgwODRDMTA0LjIxMyA0LjQwMTM0IDEwNC45NjcgNC43MDI3MSAxMDUuNjk3IDQuODUwNjJDMTA2LjI3MSA0Ljk2NzEgMTA2LjgzNyA1LjIyNzgxIDEwNy40MSA1LjIzMzM2QzEwOS45NzcgNS4yNjEwOSAxMTIuNTUxIDUuMjg1MTMgMTE1LjExNiA1LjE4NzE0QzEyMC45NzUgNC45NjE1NyAxMjYuODMzIDQuNTc4ODMgMTMyLjY5NiA0LjQxNjEzQzEzNy4zODUgNC4yODQ4NiAxNDIuMDgxIDQuMzc5MTcgMTQ2Ljc3NCA0LjM4Mjg3QzE1MS4yMTQgNC4zODI4NyAxNTUuNjUzIDQuNDAzMTkgMTYwLjA5MyA0LjQwNjg4QzE2My44MjUgNC40MTA1OCAxNjcuNTU3IDQuNDA2ODggMTcxLjI5IDQuNDA2ODhDMTcxLjQzMSA0LjE4MzE3IDE3MS41NjcgMy45NTc2IDE3MS43MTIgMy43MzIwNEMxNzEuMTA3IDIuODgzNCAxNzAuNjYxIDEuNTI2MzEgMTY5Ljg3MSAxLjI4MjI2QzE2Ny44MzggMC42NTM2MzkgMTY1LjY2IDAuMjk2ODExIDE2My41MjcgMC4yMjY1NTNDMTU5LjI0OCAwLjA4NjAzNzUgMTU0Ljk2NSAwLjAwMjg1MTk0IDE1MC42ODIgMC4wMDEwMDMwNloiIGZpbGw9IiNGOEI3M0EiLz4KPC9zdmc+Cg==');
		position: absolute;
		left: 0;
		right: 0;
		bottom: -10px;
		height: 30px;
		opacity: 1;
		clip-path: inset(0 100% 0 0);
    	animation: reveal 5s infinite;
	}
}

@keyframes reveal {
    0% {
        clip-path: inset(0 100% 0 0);
    }
    15%,100% {
        clip-path: inset(0 0 0 0);
    }
	30%{
		opacity: 1;
	}
	35%{
		opacity: 0;
	}
	40%{
		opacity: 1;
	}
	45%{
		opacity: 0;
	}
	50%{
		opacity: 1;
	}
}

@keyframes blink-text {
	0%   { color:var(--mc-text); }
	40%   {color:var(--_blink-text-clr); }
	100% { opacity:var(--mc-text); }
}

@keyframes rotateSearchIcon {
	0%   { rotate:0deg; }
	100% { rotate:360deg; }
}

@keyframes bounce {
	0%,
	20%,
	53%,
	to {
	  -webkit-animation-timing-function:cubic-bezier(.215,.61,.355,1);
	  animation-timing-function:cubic-bezier(.215,.61,.355,1);
	  -webkit-transform:translateZ(0);
	  transform:translateZ(0)
	}
	40%,
	43% {
	  -webkit-animation-timing-function:cubic-bezier(.755,.05,.855,.06);
	  animation-timing-function:cubic-bezier(.755,.05,.855,.06);
	  -webkit-transform:translate3d(0,-20px,0) scaleY(1.1);
	  transform:translate3d(0,-20px,0) scaleY(1.1)
	}
	70% {
	  -webkit-animation-timing-function:cubic-bezier(.755,.05,.855,.06);
	  animation-timing-function:cubic-bezier(.755,.05,.855,.06);
	  -webkit-transform:translate3d(0,-10px,0) scaleY(1.05);
	  transform:translate3d(0,-10px,0) scaleY(1.05)
	}
	80% {
	  -webkit-transform:translateZ(0) scaleY(.95);
	  transform:translateZ(0) scaleY(.95);
	  -webkit-transition-timing-function:cubic-bezier(.215,.61,.355,1);
	  transition-timing-function:cubic-bezier(.215,.61,.355,1)
	}
	90% {
	  -webkit-transform:translate3d(0,-2px,0) scaleY(1.02);
	  transform:translate3d(0,-2px,0) scaleY(1.02)
	}
}

@keyframes swing {
	20% {
	  -webkit-transform:rotate(15deg);
	  transform:rotate(15deg)
	}
	40% {
	  -webkit-transform:rotate(-10deg);
	  transform:rotate(-10deg)
	}
	60% {
	  -webkit-transform:rotate(5deg);
	  transform:rotate(5deg)
	}
	80% {
	  -webkit-transform:rotate(-5deg);
	  transform:rotate(-5deg)
	}
	to {
	  -webkit-transform:rotate(0deg);
	  transform:rotate(0deg)
	}
}
@keyframes zoom {
	20% {
	  scale: 1.05;
	}
	40% {
		scale: 1.15;
		rotate: -10deg;
	}
	60% {
		scale: 1.25;
		rotate: 0;
	}
	80% {
		scale: 1.10;
	}
	to {
		scale: 1;
	}
}

/**/