/*
Theme Name: NOM A DEFINIR
Theme URI: http://www.wpbeaverbuilder.com
Version: 1.0
Description: THEME NOM A DEFINIR
Author: Agence 71
Author URI: https://agence71.fr
template: bb-theme
*/

/* Add your custom styles here... */ 


/*========================
*
* 				VARIABLES
* 
* ======================*/

:root {
	/* COULEURS */
	--blanc: #fff;
	--noir: #000;
	--vert: #00833F;
	--vert-inter : #41A020; 
	--vert-clair: #81BC00; 
	--jaune: #F4AE18; 
	--gris: #383838;


	/* FONT_WEIGHT */
	--thin: 100;
	--extra-light: 200;
	--light: 300;
	--regular: 400;
	--medium: 500;
	--semi-bold: 600;
	--bold: 700;
	--extra-bold: 800;
	--black: 900;

	/* FONT FAMILY */

	--open-sans: "Open Sans", sans-serif;
	--semi-condensed: "open sans semi-condensed", sans-serif;
	--condensed: "Open sans condensed", sans-serif;
	--crush: "girl-crush", sans-serif;

/* FONT SIZE */
--250px: 250px;
	--108px: 108px;
	--80px: 80px;
	--70px: 70px;
	--60px: 60px;
	--50px: 50px;
	--44px: 44px;
	--32px: 32px;
	--30px: 30px;
	--28px: 28px;
	--25px: 25px;
	--20px: 20px;
	--18px: 18px;
	--16px: 16px;
	--14px: 14px;
	--12px: 12px;
}

@media all and (max-width: 1024px) {
	:root {
		--250px: 225px;
		--108px: 97px;
		--80px: 72px;
		--70px: 63px;
		--60px: 54px;
		--50px: 45px;
		--44px: 39px;
		--32px: 29px;
		--30px: 27px;
		--28px: 25px;
		--25px: 23px;
		--20px: 18px;
		--18px: 16px;
		--16px: 14px;
		--14px: 13px;
		--12px: 11px;
	}
}

@media all and (max-width: 768px) {
	:root {
		--250px: 203px;
		--108px: 82px;
		--80px: 50px;
		--70px: 44px;
		--60px: 38px;
		--50px: 41px;
		--44px: 35px;
		--32px: 26px;
		--30px: 24px;
		--28px: 22px;
		--25px: 20px;
		--20px: 16px;
		--18px: 15px;
		--16px: 15px;
		--14px: 12px;
		--12px: 10px;
	}
}

/*========================
 * 
 * 				TARTEAUCITRON
 * 
 * ======================*/

button#tarteaucitronManager img {
  content: url(https://agence71.fr/rgpd.png);
  width: 25px !important;
  height: 25px !important;
  transition: 200ms linear !important;
}

div#tarteaucitronIcon button#tarteaucitronManager {
  background: #212121;
  margin-left: 8px;
  font-size: 1.3px !important;
  padding: 10px !important;
  border-radius: 10em 10em 20em 20em;
  transition: 150ms linear !important;
  margin: 0 0 12px 20px !important;
}

button#tarteaucitronManager:hover img {
  transform: scale(1.1) !important;
}

.tarteaucitron-magic-block-recaptcha {
  position: fixed !important;
  z-index: 99999;
  bottom: 0;
}

.grecaptcha-badge {
  display: none;
}

body div#tarteaucitronRoot div#tarteaucitronAlertBig {
  max-width: 450px !important;
}

#tarteaucitronDisclaimerAlert {
  display: flex !important;
  flex-direction: column;
  align-items: center;
  gap: 20px;
}

#tarteaucitronDisclaimerAlert:before {
  content: 'Cookies ?' !important;
  display: inline-block;
  font-size: 20px;
  font-weight: bold;
}

#tarteaucitronAlertBig:before {
  content: '' !important;
  display: inline-block;
  width: 80px;
  height: 80px;
  background-image: url('https://lapin.fr/fr/wp-content/uploads/2021/04/clipp-logo.png');
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center center;
}

.tarteaucitronH1 {
  display: flex !important;
  flex-direction: column;
  align-items: center;
  gap: 20px;
}

.tarteaucitronH1::before {
  content: '';
  display: block;
  width: 80px;
  height: 80px;
  background-image: url('https://lapin.fr/fr/wp-content/uploads/2021/04/clipp-logo.png');
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center center;
}

.tarteaucitronH1 {
  font-size: 30px !important;
  font-weight: bold !important;
}

html body div#tarteaucitronRoot button#tarteaucitronPersonalize2 {
  font-size: 18px !important;
  font-weight: bold;
  animation: fade 1s infinite;
}

@keyframes fade {
  0%,
  100% {
    opacity: 1;
  }
  50% {
    opacity: 0.85;
  }
}










/*========================
* 
* 				GENERAL
* 
* ======================*/

/*========== TOOLSET LIGTHBOX ==========*/

.toolset-dialog {
	width: 70% !important;
	left: 50px !important;
	background: #23282deb !important;
	padding: 50px !important;
	border-radius: 10px !important;
	overflow-y: scroll;
}

.toolset-dialog button {
	cursor: pointer !important;
	margin: 4px;
	padding: 15px;
	background: #135e96;
	transition: all 0.2s linear;
}

.ui-dialog-titlebar-close {
	background: red !important;
}

.ui-dialog-titlebar-close:hover {
	color: red;
}

.js-toolset-collapsible__toggle {
	background: #595959 !important;
}

.toolset-dialog button:hover {
	background: white !important;
	color: #135e96;
	transition: all 0.2s linear;
}

/*========== Si Internet Explorer ==========*/

html.internet-explorer body.ie {
	margin-top: 40px;
}

html.internet-explorer body.ie:after {
	content: "Vous utilisez actuellement Internet Explorer, certains éléments peuvent ne pas s'afficher correctement. Nous vous recommandons d'utiliser un autre navigateur.";
	position: absolute;
	padding: 10px;
	top: 0px;
	color: var(--blanc);
	background-color: #dd0000;
	width: 100%;
	vertical-align: middle;
	text-align: center;
}

/* ========== */

body {
	width: 100vw;
	overflow-x: hidden;
	background-color: #fff !important;
}

.nowrap {
	white-space: nowrap;
}

.devant {
	z-index: 99;
	position: relative;
}

.nowrap {
	white-space: nowrap;
}

.maxwidth50 .fl-col-content {
	max-width: 50%;
}

@media all and (max-width: 768px) {
	.maxwidth50 .fl-col-content {
		width: 100%;
		max-width: inherit;
	}
}

.maxwidth1600px .fl-col-content {
	max-width: 1600px;
}

.maxwidth1200px .fl-col-content {
	max-width: 1200px;
}

.maxwidth1000px .fl-col-content {
	max-width: 1000px;
}

.maxwidth900px .fl-col-content {
	max-width: 900px;
}

.maxwidth800px .fl-col-content {
	max-width: 800px;
}

.maxwidth600px .fl-col-content {
	max-width: 600px;
}

.maxwidth400px .fl-col-content {
	max-width: 400px;
}

.droite .fl-col-content {
	margin-left: auto;
}

.centrer .fl-col-content {
	margin-left: auto;
	margin-right: auto;
}

.ultra-light {
	font-weight: 200;
}

.light {
	font-weight: 300;
}

.regular {
	font-weight: 400;
}

.medium {
	font-weight: 500;
}

.bold {
	font-weight: 700;
}

.black {
	font-weight: 900;
}

.italic {
	font-style: italic;
}

.underline {
	text-decoration: underline;
}

.normal {
	font-style: normal;
}

.lowercase {
	text-transform: lowercase !important;
}

.capitalize {
	text-transform: capitalize !important;
}

/*========================
* 
* 				TYPO
* 
* ======================*/
.titre-1-crush .fl-heading,
.titre-1-crush.fl-heading  {
	font-family: var(--crush) !important; 
	font-weight: var(--regular);
	font-size: var(--108px);
	line-height: var(--108px);
	color: var(--blanc);
 position: relative; 
}


.titre-2-crush .fl-heading,
.titre-2-crush.fl-heading {
	font-family: var(--crush) !important; 
	font-weight: var(--regular);
	font-size: var(--50px);
	line-height: var(--50px);
	color: var(--noir);
 position: relative; 
}

.titre-2-crush.blanc .fl-heading,
.titre-2-crush.blanc.fl-heading {
	font-family: var(--crush) !important; 
	font-weight: var(--regular);
	font-size: var(--50px);
	line-height: var(--50px);
	color: var(--blanc);
 position: relative; 
}

.col-noir .titre-1-crush {
		color: var(--noir);
		font-size: var(--50px);
	line-height: var(--50px);
 position: relative; 
	z-index:1; 
}

.titre-1 .fl-heading,
.titre-1.fl-heading {
	font-family: var(--condensed) !important; 
	font-weight: var(--regular);
	font-size: var(--50px);
	line-height: var(--50px);
	color: var(--blanc);
	text-transform: uppercase; 
}


.col-noir .titre-1 {
		color: var(--noir);
		font-size: var(--28px);
	line-height: var(--28px);
}


.titre-1.noir .fl-heading, 
.titre-1.noir.fl-heading {
	font-family: var(--condensed) !important; 
	font-weight: var(--regular);
	font-size: var(--50px);
	line-height: var(--50px);
	color: var(--noir);
	text-transform: uppercase; 
}


.titre-2 .fl-heading,
.titre-2.fl-heading {
	font-family: var(--semi-condensed) !important; 
	font-weight: var(--extra-bold) !important;
	font-size: var(--44px);
	line-height: var(--44px);
	color: var(--noir);
}


.titre-3 .fl-heading,
.titre-3.fl-heading {
	font-family: var(--semi-condensed) !important; 
	font-weight: var(--bold);
	font-size: var(--28px);
	line-height: var(--28px);
	color: var(--noir);
	text-wrap: balance; 
}
.contenu-1,
.contenu-1 li,
.contenu-1 p {
	font-family: var(--semi-condensed) !important; 
	font-weight: var(--regular);
	font-size: var(--16px);
	line-height: var(--25px);
	color: var(--noir);
}

.contenu-1 a {
	color: var(--vert);
}

.contenu-1 a:hover{
	color: var(--vert);
	 text-underline-offset: 2px;
	text-decoration: underline !important; 
}

.contenu-1 .titre-etape-recette {
	font-weight: var(--bold);
}

.contenu-2 p {
	font-family: var(--semi-condensed) !important; 
	font-weight: var(--regular);
	font-size: var(--28px);
	line-height: var(--32px);
	color: var(--noir);
}

.contenu-3 p {
	font-family: var(--semi-condensed) !important; 
	font-weight: var(--medium);
	font-size: var(--44px);
	line-height: var(--50px);
	color: var(--noir);
}

.blanc li,
.blanc p,
.blanc {
		color: var(--blanc) !important;
}
/*===== EXEMPLE =====*/

/* --- Exemple */





/*========================
* 
* 				CTA
* 
* ======================*/


.cta-blanc .uabb-module-content a {
	background: var(--blanc) !important;
	border: solid 1px var(--blanc) !important;
	text-transform: uppercase;
	transition: all linear 300ms; 
	border-radius: 0px !important;
}

.cta-blanc .uabb-module-content a span {
	font-family: var(--condensed) !important; 
	font-weight: var(--extra-bold);
	font-size: var(--18px);
	line-height: var(--18px);
	text-align: left;
	color: var(--vert) !important;
	transition: all linear 300ms;

}

.cta-blanc .uabb-module-content a:hover {
	background: var(--vert) !important;
	border: solid 1px var(--vert)!important;
	text-transform: uppercase; 
	transition: all linear 300ms;
	border-radius: 0px !important;
}

.cta-blanc .uabb-module-content a:hover span {
	font-family: var(--condensed) !important; 
	font-weight: var(--extra-bold);
	font-size: var(--18px);
	line-height: var(--18px);
	text-align: left;
	color: var(--blanc) !important;
	transition: all linear 300ms;
}


.cta-bord-noir .uabb-module-content a {
	background: var(--blanc) !important;
	border: solid 1px var(--noir) !important;
	text-transform: uppercase;
	transition: all linear 300ms; 
	border-radius: 0px !important;
}


.cta-bord-noir .uabb-module-content a span {
	font-family: var(--condensed) !important; 
	font-weight: var(--extra-bold);
	font-size: var(--18px);
	line-height: var(--18px);
	text-align: left;
	color: var(--vert) !important;
	transition: all linear 300ms;

}

.cta-bord-noir .uabb-module-content a:hover {
	background: var(--blanc) !important;
	border: solid 1px var(--noir)!important;
	text-transform: uppercase; 
	transition: all linear 300ms;
	border-radius: 0px !important;
}

.cta-bord-noir .uabb-module-content a:hover span {
	font-family: var(--condensed) !important; 
	font-weight: var(--extra-bold);
	font-size: var(--18px);
	line-height: var(--18px);
	text-align: left;
	color: var(--vert-clair) !important;
	transition: all linear 300ms;
}



.cta-rond .uabb-module-content a {
	background: var(--blanc) !important;
	border: solid 1px var(--jaune) !important;
	text-transform: uppercase;
	transition: all linear 300ms; 
	border-radius: 50px !important;
}


.cta-rond .uabb-module-content a i {
	color: var(--noir) !important;
margin-right: 0px !important; 
} 

.cta-rond .uabb-module-content a:hover i {
	color: var(--blanc) !important;
margin-right: 0px; 
} 



.cta-rond .uabb-module-content a span {
	font-family: var(--condensed) !important; 
	font-weight: var(--extra-bold);
	font-size: var(--16px);
	line-height:var(--16px);
	text-align: left;
	color: var(--noir) !important;
	padding: 5px 15px;
}

.cta-rond .uabb-module-content a:hover {
	background: var(--jaune) !important;
	border: solid 1px var(--jaune)!important;
	text-transform: uppercase; 
	transition: all linear 300ms;
	border-radius: 50px !important;
}


.cta-rond .uabb-module-content a:hover span {
	font-family: var(--condensed) !important; 
	font-weight: var(--extra-bold);
	font-size: var(--16px);
	line-height: var(--16px);
	text-align: left;
	color: var(--blanc) !important;
		padding: 5px 15px;
}



.cta-rond-bb .uabb-module-content a {
	background: var(--blanc) !important;
	border: solid 1px var(--blanc) !important;
	text-transform: uppercase;
	transition: all linear 300ms; 
	border-radius: 50px !important;
	
}


.cta-rond-bb .uabb-module-content a span {
	font-family: var(--condensed) !important; 
	font-weight: var(--extra-bold);
	font-size: var(--16px);
	line-height: var(--16px);
	text-align: left;
	color: var(--noir) !important;
	transition: all linear 300ms;
	padding: 5px 15px;

}

.cta-rond-bb .uabb-module-content a:hover {
	background: var(--jaune) !important;
	border: solid 1px var(--blanc)!important;
	text-transform: uppercase; 
	transition: all linear 300ms;
	border-radius: 50px !important;
}

.cta-rond-bb .uabb-module-content a:hover span {
	font-family: var(--condensed) !important; 
	font-weight: var(--extra-bold);
	font-size: var(--16px);
	line-height: var(--16px);
	text-align: left;
	color: var(--blanc) !important;
	transition: all linear 300ms;
		padding: 5px 15px;
}

/*cta-jaune*/

.cta-rond-jaune .uabb-module-content a {
	background: var(--jaune) !important;
	border: solid 1px var(--jaune) !important;
	text-transform: uppercase;
	transition: all linear 300ms; 
	border-radius: 50px !important;
	
}


.cta-rond-jaune .uabb-module-content a span {
	font-family: var(--condensed) !important; 
	font-weight: var(--extra-bold);
	font-size: var(--16px);
	line-height: var(--16px);
	text-align: left;
	color: var(--blanc) !important;
	transition: all linear 300ms;
	padding: 5px 15px;

}

.cta-rond-jaune .uabb-module-content a:hover {
	background: var(--blanc) !important;
	border: solid 1px var(--jaune)!important;
	text-transform: uppercase; 
	transition: all linear 300ms;
	border-radius: 50px !important;
}

.cta-rond-jaune .uabb-module-content a:hover span {
	font-family: var(--condensed) !important; 
	font-weight: var(--extra-bold);
	font-size: var(--16px);
	line-height: var(--16px);
	text-align: left;
	color: var(--noir) !important;
	transition: all linear 300ms;
		padding: 5px 15px;
}

/*===== EXEMPLE =====*/

/* --- Exemple */

/*========================
* 
* 				HEADER
* 
* ======================*/

/* --- home */
.img-cross-burger,
.rangee-menu {
	display: none; 
}

.rangee-header {
	background-color: transparent;
	transition: background-color 0.5s ease;
}

.rangee-header.menu-ouvert {
	background-color: white;
	transition: background-color 0s ease;
}

.rangee-header .text-logo p {
	font-family: var(--condensed) !important; 
	font-weight: var(--regular);
	font-size: var(--16px);
	line-height: var(--18px);
	text-align: left;
	color: var(--vert);
	text-transform: uppercase; 
}


.rangee-header.menu-ouvert .text-logo p {
	font-family: var(--condensed) !important; 
	font-weight: var(--regular);
	font-size: var(--16px);
	line-height: var(--18px);
	text-align: left;
	color: var(--noir);
	text-transform: uppercase; 
	text-shadow: none !important; 	
}

.menu-pro a {
	font-family: var(--semi-condensed) !important; 
	font-weight: var(--extra-bold);
	font-size: var(--16px);
	line-height: var(--18px);
	text-align: left;
	color: var(--blanc);
	text-transform: uppercase; 
		transition: all linear 300ms; 
}


.menu-pro:hover,
.menu-consommateur a:hover,
.menu-pro a:hover {
	text-decoration: none;
	opacity: 0.7; 
	transition: all linear 300ms; 
}



.menu-pro  {
	background: var(--vert);
	clip-path: polygon(0% 10%, 100% 0%, 100% 90%, 0% 100%);
	padding: 10px 20px;
	display: inline-block;
}

.menu-consommateur {
	display: flex;
	align-content: center;
	flex-direction: row;
	flex-wrap: wrap;
}

.menu-consommateur a {
	font-family: var(--semi-condensed) !important; 
	font-weight: var(--medium);
	font-size: var(--16px);
	line-height: var(--18px);
	text-align: left;
	color: var(--vert);
	text-transform: uppercase; 
		transition: all linear 300ms; 
}


.rangee-header.menu-ouvert .menu-consommateur a {

	color: var(--noir);

}

.col-pro-conso .fl-col-content {
	flex-direction: row; 
	justify-content: center; 
}

.col-logo .fl-col-content {
	flex-direction: row; 
	justify-content: flex-start; 
}

.col-sous-menu p strong {
	font-family: var(--semi-condensed) !important; 
	font-weight: var(--bold);
	font-size: var(--18px);
	line-height: var(--18px);
	text-align: left;
	color: var(--noir);
}


.col-sous-menu a {
	font-family: var(--semi-condensed) !important; 
	font-weight: var(--regular);
	font-size: var(--18px);
	line-height: var(--18px);
	text-align: left;
	color: var(--noir);
	transition: all linear 300ms; 
}

.col-sous-menu a:hover {
	opacity: 0.7; 
	cursor: pointer; 
	text-decoration:none; 
}



.rangee-menu .fl-row-content-wrap{
	background: var(--blanc);
	/*clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 80%);*/
}


@media all and (max-width: 1000px) {
	.menu-consommateur p {
		font-family: var(--semi-condensed) !important; 
		font-weight: var(--medium);
		font-size: var(--16px);
		line-height: var(--18px);
		text-align: left;
		color: var(--noir);
		text-transform: uppercase; 
	}
}

.rangee-header .col-menu img {
	cursor: pointer; 
}

/* --- consommateurs */

.titre-1-crush::before {
content: ""; 
	background: url('https://clipp-lapin.hend3.fr/dev/wp-content/uploads/2025/05/bg-titre.png') no-repeat left/contain; 
	width: 100%;
	height: 100%;
	position: absolute;
	top: -5px;
	left: -35px;
	z-index: -1; 
}

.rangee-header .text-logo p {
	font-family: var(--condensed) !important; 
	font-weight: var(--regular);
	font-size: var(--16px);
	line-height: var(--18px);
	text-align: left;
	color: var(--blanc);
	text-transform: uppercase; 
}

.rangee-header .text-logo.noir p {
	font-family: var(--condensed) !important; 
	font-weight: var(--regular);
	font-size: var(--16px);
	line-height: var(--18px);
	text-align: left;
	color: var(--noir);
	text-transform: uppercase; 
}

.menu-consommateur-conso:hover,
.menu-consommateur-conso a:hover,
.menu-pro-conso a:hover{
	opacity: 0.7; 
	text-decoration: none; 
		transition: all linear 300ms; 
}

.menu-consommateur-conso a {
	font-family: var(--semi-condensed) !important; 
	font-weight: var(--extra-bold);
	font-size: var(--16px);
	line-height: var(--18px);
	text-align: left;
	color: var(--blanc);
	text-transform: uppercase; 
	transition: all linear 300ms; 
}


.menu-consommateur-conso  {
	background: var(--jaune);
	clip-path: polygon(0% 10%, 100% 0%, 100% 90%, 0% 100%);
	padding: 10px 20px;
	display: inline-block;
}
.menu-pro-conso{
	display: flex;
	align-content: center;
	flex-direction: row;
	flex-wrap: wrap;
}

.menu-pro-conso a {
	font-family: var(--semi-condensed) !important; 
	font-weight: var(--medium);
	font-size: var(--16px);
	line-height: var(--18px);
	text-align: left;
	color: var(--blanc);
	text-transform: uppercase; 
		transition: all linear 300ms; 
}

.menu-pro-conso.noir a,
.rangee-header.menu-ouvert .menu-pro-conso a {
		color: var(--noir);
}


.rangee-header.menu-ouvert .logo-conso-MF,
.rangee-header .logo-conso-MO {
	display: none;
}

.rangee-header.menu-ouvert .logo-conso-MO,
.rangee-header .logo-conso-MF {
	display: block
}

/*===== EXEMPLE =====*/

/* --- Exemple */

/*========================
* 
* 				FOOTER
* 
* ======================*/
.text-bottom-footer p {
	font-family: var(--condensed) !important; 
	font-weight: var(--regular);
	font-size: var(--16px);
	line-height: var(--18px);
	text-align: left;
	color: var(--blanc);
}

.text-bottom-footer a {
	font-family: var(--condensed) !important; 
	font-weight: var(--regular);
	font-size: var(--16px);
	line-height: var(--18px);
	text-align: left;
	color: var(--blanc);
}

.text-bottom-footer a:hover {
opacity : 0.7; 
}

.a71 a:hover {
	opacity: 0.7; 
}

.text-footer p,
.col-menu-footer p, 
.col-menu-footer a {
	font-family: var(--semi-condensed) !important; 
	font-weight: var(--regular);
	font-size: var(--16px);
	line-height: var(--18px);
	text-align: left;
	color: var(--blanc);
}

.col-menu-footer a:hover {
	opacity: 0.7;
	text-decoration: none; 
}

.col-menu-footer p strong {
	font-family: var(--semi-condensed) !important; 
	font-weight: var(--bold) !important;
	font-size: var(--16px);
	line-height: var(--18px);
	text-align: left;
	color: var(--blanc);
}

.text-responsive p {
	font-family: var(--semi-condensed) !important; 
	font-weight: var(--semi-bold);
	font-size: var(--16px);
	line-height: var(--25px);
	text-align: left;
	color: var(--blanc);
}

.col-contact p {
	line-height: var(--25px);
}

@media screen and (max-width: 1000px) {
	.background-incline .fl-builder-layer-align-top-center {
	height: 50px !important; 
	}
}

@media screen and (max-width: 768px) {
	.background-incline .fl-builder-layer-align-top-center {
	height: 25px !important; 
	}
}
/* --- Sticky Home --- */

.sticky-lien-lateral {
	position: fixed;
	top: 35%;
	right: 0;
	background-color: var(--vert-clair);
	z-index: 9999;
	writing-mode: vertical-rl;
	text-orientation: mixed;
	clip-path: polygon(0% 0%, 90% 0%, 100% 100%, 0% 100%);
	transform: translateY(-50%) rotate(180deg);
	transition: all linear 300ms; 
	display: flex;
	align-items: center;
	justify-content: center;
}

.sticky-lien-lateral a {
	font-family: var(--condensed) !important; 
	color: var(--blanc);
	text-decoration: none;
	font-weight: var(--extra-bold);
	letter-spacing: 2px;
	text-transform: uppercase; 
	width: 100%; 
	height:100%; 
	display: block;
	line-height: 30px; 
}

.sticky-lien-lateral:hover {
	position: fixed;
	top: 35%;
	right: 0;
	transform: translateY(-50%);
	background-color: var(--vert);
	z-index: 9999;
	writing-mode: vertical-rl;
	text-orientation: mixed;
	clip-path: polygon(0% 0%, 90% 0%, 100% 100%, 0% 100%);
	transform: translateY(-50%) rotate(180deg);
	transition: all linear 300ms; 
}


/* --- Sticky Conso --- */

.sticky-lien-lateral-conso {
	position: fixed;
	top: 35%;
	right: 0;
	transform: translateY(-50%);
	background-color: var(--jaune);
	z-index: 9999;
	writing-mode: vertical-rl;
	text-orientation: mixed;
	clip-path: polygon(0% 0%, 90% 0%, 100% 100%, 0% 100%);
	transform: translateY(-50%) rotate(180deg);
	transition: all linear 300ms; 
	display: flex;
	align-items: center;
	justify-content: center;
}

.sticky-lien-lateral-conso a {
	font-family: var(--condensed) !important; 
	color: var(--blanc);
	text-decoration: none;
	font-weight: var(--extra-bold);
	font-family: sans-serif;
	letter-spacing: 1px;
	text-transform: uppercase; 
	width: 100%; 
	height:100%; 
	display: block;

}

.sticky-lien-lateral-conso:hover {
	position: fixed;
	top: 35%;
	right: 0;
	transform: translateY(-50%);
	background-color: #F4AE1880;
	z-index: 9999;
	writing-mode: vertical-rl;
	text-orientation: mixed;
	clip-path: polygon(0% 0%, 90% 0%, 100% 100%, 0% 100%);
	transform: translateY(-50%) rotate(180deg);
	transition: all linear 300ms; 
}


@media screen and (max-width: 768px) {
	.sticky-lien-lateral-conso,
	.sticky-lien-lateral {
		z-index: 99;
	}
}



/*========================
* 
* 				HOME PAGE
* 
* ======================*/

/* --- Fond de titre incliné -- */

.titre-fond {
	margin: auto;
	background: var(--vert);
	clip-path: polygon(0% 15%, 100% 0%, 100% 85%, 0% 100%);
	padding: 55px 30px;
}

@media screen and (max-width: 768px) {
	.titre-fond {
	margin: auto;
	background: var(--vert);
	clip-path: polygon(0% 10%, 100% 0%, 100% 90%, 0% 100%);
	padding: 55px 30px;
}
}


/* --- Chiffre CLIPP */

.chiffre-blanc {
	font-family: var(--condensed) !important; 
	font-weight: var(--extra-bold);
	font-size: var(--70px);
	line-height: var(--70px);
	text-align: left;
	color: var(--blanc);
}

.chiffre-blanc span {
	font-weight: var(--regular);
}



.chiffre-jaune {
	font-family: var(--condensed) !important; 
	font-weight: var(--extra-bold);
	font-size: var(--70px);
	line-height: var(--70px);
	text-align: left;
	color: var(--jaune);
}

.chiffre-jaune span {
	font-weight: var(--regular);
}

.chiffre-vert {
	font-family: var(--condensed) !important; 
	font-weight: var(--extra-bold);
	font-size: var(--70px);
	line-height: var(--70px);
	text-align: left;
	color: var(--vert);
}

.chiffre-vert span {
	font-weight: var(--regular);
}

.text-chiffre p {
	font-family: var(--semi-condensed) !important; 
	font-weight: var(--regular);
	font-size: var(--28px);
	line-height: var(--28px);
	text-align: left;
	color: var(--noir);
}

.text-elevage-home p strong, 
.text-chiffre p strong {
	font-style: italic;
}

.text-commercial-home p {
	font-family: var(--semi-condensed) !important; 
	font-weight: var(--medium);
	font-size: var(--28px);
	line-height: var(--28px);
	text-align: left;
	color: var(--noir);
}
.text-elevage-home p {
	font-family: var(--semi-condensed) !important; 
	font-weight: var(--medium);
	font-size: var(--44px);
	line-height: var(--44px);
	text-align: left;
	color: var(--noir);
}

/* --- Case home */

.col-absolute {
	position: relative; 
	transition: all linear 300ms;
}

 
.text-absolute p  {
	font-family: var(--semi-condensed) !important; 
	font-weight: var(--extra-bold);
	font-size: var(--28px);
	line-height: var(--28px);
}

.text-absolute  {
	font-family: var(--semi-condensed) !important; 
	font-weight: var(--extra-bold);
	font-size: var(--28px);
	line-height: var(--28px);
	text-align: left;
	color: var(--blanc);
	position: absolute !important; 
	bottom: 20px; 
	left: 20px; 
	z-index: 2 !important;
}

.text-absolute a {
	color: var(--blanc);
}


.text-absolute a:hover {
	text-decoration: none; 
}

.col-absolute .fl-photo-content {
	overflow: hidden; 
	border-radius: 12px; 
	height: 100%; 
}

.icon-absolute  {
	color: var(--blanc);
	position: absolute !important; 
	bottom: 20px; 
	right: 20px; 
	transform: rotate(-45deg); 
	transition: all linear 300ms;
	z-index: 2 !important; 
}

.icon-absolute a  {
	color: var(--blanc);
}


.col-absolute:hover img {
	transform: scale(1.05);
	transition: all linear 300ms; 
}


.col-absolute img {
	transition: all linear 300ms; 
}

.col-absolute:hover .icon-absolute {
	transform: rotate(0deg); 
	transition: all linear 300ms; 
}

.image-section.blur .fl-photo-content a {

} 

.image-section.blur .fl-photo-content a::after {
	content: "";
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 60%; 
	background: linear-gradient(to top, var(--noir), transparent);
	z-index: 1; 
}
.image-section{
	height: 100%; 
}
.image-section .fl-photo-content img {
	object-fit: cover; 
	height: 100%; 
}

.text-bold-case p {
	font-family: var(--semi-condensed) !important; 
	font-weight: var(--extra-bold);
	font-size: var(--28px);
	line-height: var(--28px);
	text-align: left;
	color: var(--noir);
	font-style: italic;
}


.sous-text-case p { 
	font-family: var(--semi-condensed) !important; 
	font-weight: var(--medium);
	font-size: var(--18px);
	line-height: var(--18px);
	text-align: left;
	color: var(--noir);
}

.col-text-case .fl-col-content {
	justify-content: center !important; 
	border:1px solid rgba(56, 56, 56, 0.15); 
}


/* --- Advanced Post ACTUS */


.advanced-post-home .uabb-post-wrapper .uabb-blog-posts-shadow {
	box-shadow: none; 
	background: transparent; 
}

.advanced-post-home .uabb-post-wrapper .uabb-blog-post-content .uabb-post-thumbnail img {
	object-fit: cover; 

	transition: transform 0.3s ease;
}

.advanced-post-home .uabb-post-wrapper .uabb-blog-post-content .uabb-post-thumbnail  {
	max-height: 300px; 
	overflow: hidden;
	transition: transform 0.3s ease;
		border: 1px solid rgba(56, 56, 56, 0.15); 
	border-radius: 12px; 
		margin-bottom: 20px;
}



.advanced-post-home .uabb-post-wrapper .uabb-blog-post-content .taxonomy a { 
	font-family: var(--semi-condensed) !important; 
	font-weight: var(--regular);
	font-size: var(--16px);
	line-height: var(--16px);
	text-align: left;
	color: var(--blanc);
	text-transform: uppercase;
	display: inline-block;
  padding: 5px 10px;
  border-radius: 4px;
  margin: 0px 0px 5px 0px;
  float: left;
  clear: both;
	pointer-events: none; 
	background-color: var(--gris);
}

.advanced-post-home .uabb-post-wrapper .uabb-blog-post-content a.filiere-et-engagements {
	background-color: var(--vert);
}

.advanced-post-home .uabb-post-wrapper .uabb-blog-post-content a.vie-des-elevages {
	background-color: var(--vert-inter);
}


.advanced-post-home .uabb-post-wrapper .uabb-blog-post-content a.viande-remarquable {
	background-color: var(--vert-clair);
}



.advanced-post-home .uabb-post-wrapper .uabb-blog-post-content .uabb-post-heading {
	margin-top: 5px;
}
.advanced-post-home .uabb-post-wrapper .uabb-blog-post-content .uabb-post-heading a { 
font-family: var(--semi-condensed) !important; 
	font-weight: var(--bold);
	font-size: var(--18px);
	line-height: var(--18px);
	text-align: left;
	color: var(--noir);
}


.advanced-post-home .uabb-post-wrapper .uabb-blog-post-content .uabb-blog-posts-description p { 
font-family: var(--semi-condensed) !important; 
	font-weight: var(--medium);
	font-size: var(--16px);
	line-height: var(--16px);
	text-align: left;
	color: var(--noir);
}


.advanced-post-home .uabb-post-wrapper .uabb-blog-post-content .uabb-read-more-text{
	padding-top: 0px; 
}


.advanced-post-home .uabb-post-wrapper .uabb-blog-post-content .uabb-read-more-text a { 
font-family: var(--semi-condensed) !important; 
	font-weight: var(--medium);
	font-size: var(--16px);
	line-height: var(--16px);
	text-align: left;
	color: var(--vert);
	transition: all linear 300ms; 
}

.advanced-post-home .uabb-post-wrapper .uabb-blog-post-content .uabb-read-more-text a:hover { 
	text-decoration: none; 
	opacity: 0.7; 
}

.advanced-post-home .uabb-post-wrapper .uabb-blog-post-content div,
.advanced-post-home .uabb-post-wrapper .uabb-blog-post-content  p,
.advanced-post-home .uabb-post-wrapper .uabb-blog-post-content h3 { 
	text-align:left;
	text-wrap: balance; 
}

.advanced-post-home .uabb-post-wrapper .uabb-blog-post-content h3 {
	line-height: 0.8; 
}



@media all and (max-width: 1000px) {
	.col-absolute .fl-photo-content {
		width: 100%; 
	}
	.image-section .fl-photo-content img {
		height: auto; 
		width: 100%
	}
}


@media all and (max-width: 768px) {
	.col-logo-95 .fl-col-content {
		display:flex; 
		flex-direction: row; 
		justify-content: center;
		align-items: center;
	}
}


/*===== EXEMPLE =====*/

/* --- Exemple */
/*========================
* 
* 		CONSOMMATEURS PAGE
* 
* ======================*/


.titre-viande {
	font-family: var(--crush) !important; 
	font-weight: var(--regular);
	font-size: var(--50px);
	line-height: var(--50px);
	text-align: left;
	color: var(--jaune);
}

.text-viande p {
		font-family: var(--semi-condensed) !important; 
	font-weight: var(--medium);
	font-size: var(--18px);
	line-height: var(--18px);
	text-align: left;
	color: var(--noir);
	    text-wrap: balance;

}

.col-noir .titre-1-crush::before {
	content: "";
    background: url(https://clipp-lapin.hend3.fr/dev/wp-content/uploads/2025/05/bg-titre.png) no-repeat center / contain;
    width: 100%;
    height: 100%;
    position: absolute;
    top: -2px;
    left: 0px;
    z-index: -1;
}

.recette-pdf::before {
    content: "";
    background: url(https://clipp-lapin.hend3.fr/dev/wp-content/uploads/2025/05/loga-pdf.png) no-repeat left / contain;
    width: 30px;
    height: 30px;
    position: absolute;
    top: -35px;
	left: 0px;
	z-index: 0;

}

.text-case-conso p {
	font-family: var(--semi-condensed) !important; 
	font-weight: var(--regular);
	font-size: var(--28px);
	line-height: var(--28px);
	text-align: left;
	color: var(--noir);
	text-wrap: balance; 
}

.sous-text-case-conso p a:hover,
.text-case-conso p a:hover {
	text-decoration: none; 
}

.sous-text-case-conso p {
	font-family: var(--semi-condensed) !important; 
	font-weight: var(--regular) !important;
	font-size: var(--16px);
	line-height: var(--18px);
	color: var(--noir);
	text-wrap: balance; 
}

.col-flex .fl-col-content {
	display: flex; 
	flex-direction: row;
	justify-content: flex-end;
	    align-items: center;
}

@media all and (max-width: 768px) {
	.rangee-carousel .fl-row-content-wrap > .fl-row-content {
		overflow: hidden; 
	}
}

.recettes-carousel {
  margin: 0 auto;
  padding: 20px 0;
	
}

.recettes-carousel a:hover,
.recettes-carousel a {
	text-decoration: none; 
	transition: all linear 300ms; 
}

.recettes-carousel a:hover{
	 opacity: 0.8;	
}

.recettes-carousel .slick-list {
	overflow: visible; 	
}


.recettes-carousel .recette-slide {
  padding: 10px;
  box-sizing: border-box;
}

.recettes-carousel .recette-slide img {
  width: 100%;
  display: block;
  border-radius: 12px;
	border: solid 5px var(--blanc); 
}

.recettes-carousel .recette-titre h3 {
    font-family: var(--semi-condensed) !important;
    font-weight: var(--bold);
    font-size: var(--16px);
    line-height: var(--16px);
    color: var(--blanc);
    text-wrap: balance;
    text-align: left;
    background-color: transparent;
    padding-left: 5px;
	padding-top: 5px;
}



@media screen and (max-width: 769px) {
	.col-flex .fl-col-content{
		justify-content:center; 
	}	
}




/*========================
* 
* 		catalogue recette PAGE
* 
* ======================*/

.card-recette .fl-col-content {
	   background: var(--blanc);
	border: solid 5px var(--gris);
  backdrop-filter: blur(50px);
	border-radius: 12px;
	transition: all linear 300ms; 
}

.card-recette .fl-col-content .uabb-button-text {
	text-wrap: balance; 
}

.advanced-post-recette .uabb-post-wrapper .uabb-blog-posts-shadow .uabb-blog-post-content a img{
	border-radius: 12px; 
	border: solid 5px var(--jaune);
}

.advanced-post-recette .uabb-post-wrapper .uabb-blog-posts-shadow .uabb-blog-post-content h3,
.advanced-post-recette .uabb-post-wrapper .uabb-blog-posts-shadow .uabb-blog-post-content h3 a {
    font-family: var(--semi-condensed) !important;
    font-weight: var(--bold);
    font-size: var(--16px);
    line-height: var(--20px);
    color: var(--noir);
    text-wrap: balance;
    text-align: left;
    background-color: transparent;
   padding: 15px 0px 30px;

}

.advanced-post-recette .uabb-post-wrapper .uabb-blog-posts-shadow .uabb-blog-post-content  {
	transition: all linear 300ms; 
	text-decoration: none; 
}

.advanced-post-recette .uabb-post-wrapper .uabb-blog-posts-shadow .uabb-blog-post-content:hover a {
	opacity: 0.7;
	transition: all linear 300ms; 
	text-decoration: none; 
}



/* Assure que la colonne est le conteneur relatif */
.col-manger-mieux {
    position: relative;
    overflow: hidden; /* pour que l'image ne dépasse pas */
}

/* Image en fond */
.col-manger-mieux .fl-module-photo {
    position: absolute;
    top: 0;
    left: 0;
	width: 100%;
    height: 100%;
    z-index: 1; /* sous le texte */

}

@media all and (max-width: 1000px) {
	.col-manger-mieux .fl-module-photo {
padding-left: 20px;
padding-right: 20px;
		padding-bottom: 10px;
 }

}


.col-manger-mieux .fl-module-photo img {
    width: 100%;
    height: 100%;
    object-fit: cover; /* couvre toute la colonne sans déformer */
    display: block;

}

/* Texte et icônes au-dessus */
.col-manger-mieux .fl-module-rich-text,
.col-manger-mieux .fl-module-icon {
    position: relative;
    z-index: 3; /* au-dessus de l'image */
}

/* Superposition par-dessus l'image */
.col-manger-mieux .fl-col-content .fl-module-photo .fl-photo-content::before {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.4); /* couleur et opacité du voile */
  z-index: 2;
  pointer-events: none; /* pour ne pas bloquer les liens du texte */
}



/*========================
* 
* 		Single recette 
* 
* ======================*/

.titre-categorie-recette.fl-rich-text p  {
	font-family: var(--semi-condensed) !important; 
	font-weight: var(--semi-bold);
	font-size: var(--18px);
	line-height: var(--25px);
	color: var(--noir);
	text-transform: uppercase; 

}

.titre-categorie-recette.fl-rich-text p img {
	margin-right: 10px
}


.sous-titre-recette.fl-rich-text p {
	font-family: var(--semi-condensed) !important; 
	font-weight: var(--semi-bold);
	font-size: var(--20px);
	line-height: var(--32px);
	color: var(--noir);
	
}

.col-bg-jaune .fl-col-content  {
	background-color: var(--jaune);
	border-radius: 12px;
}


.fl-html.contenu-1 img {
	margin-right: 5px; 
}



/*========================
* 
* 		actualité PAGE
* 
* ======================*/

.text-single-actu {
	    font-family: var(--semi-condensed) !important;
    font-weight: var(--medium);
    font-size: var(--18px);
    line-height: var(--18px);
    text-align: left;
    color: var(--noir);
    text-wrap: balance;
}





/*========================
* 
* 		Filière  PAGE
* 
* ======================*/




.arrow {
  display: inline-flex;
  transform: rotate(0deg);
  cursor: pointer;
  gap: 5px; /* espace entre les flèches */
}

.arrow .fl-icon i {
  color: var(--vert);
  font-size:60px;
  opacity: 0;
  animation: arrowMove 2s infinite;
  display: inline-block;
}

.arrow .fl-icon:nth-child(1) i {
  animation-delay: 0s;
}

.arrow .fl-icon:nth-child(2) i {
  animation-delay: 0.2s;
}

.arrow .fl-icon:nth-child(3) i {
  animation-delay: 0.4s;
}

@keyframes arrowMove {
  0% {
    opacity: 0;
    transform: translate(0, 0);
  }
  50% {
    opacity: 1;
    transform: translate(10px, 0);
  }
  100% {
    opacity: 0;
    transform: translate(20px, 0);
	}
}



@media screen and (max-width: 1000px) {
	.arrow .fl-icon i {
		color: var(--vert);
		font-size:40px;
		opacity: 0;
		animation: arrowMove 2s infinite;
		display: inline-block;
	}
}



@media screen and (max-width: 800px) {
	.arrow .fl-icon i {
		color: var(--vert);
		font-size:35px;
		opacity: 0;
		animation: arrowMove 2s infinite;
		display: inline-block;
	}

.arrow .fl-icon:nth-child(3) i {
  display :none; 
}
}





/*========================
* 
* 		Page Contact
* 
* ======================*/


.form-contact .uabb-gf-style .gform_heading {
	display: none; 
}


.form-contact .uabb-gf-style .gform_fields .gfield--type-textarea label, 
.form-contact .uabb-gf-style .gform_fields .gfield--type-email label, 
.form-contact .uabb-gf-style .gform_fields .gfield--type-text label, 
.form-contact .uabb-gf-style .gform_fields fieldset legend {
	font-family: var(--semi-condensed) !important; 
	font-weight: var(--bold);
	font-size: var(--28px);
	line-height: var(--28px);
	color: var(--noir);
	text-wrap: balance; 
}


.form-contact .uabb-gf-style .gform_fields fieldset .ginput_container--name label {
		font-family: var(--semi-condensed) !important; 
	font-weight: var(--bold);
	font-size: var(--20px);
	line-height: var(--20px);
	color: var(--noir);
	text-wrap: balance; 
}

.form-contact .uabb-gf-style .gform_fields fieldset .ginput_container .gchoice input::before {
	background-color: var(--vert); 
}

.form-contact .uabb-gf-style .gform_fields fieldset .ginput_container .gchoice label {
	font-family: var(--semi-condensed) !important; 
	font-weight: var(--semi-bold);
	font-size: var(--16px);
	line-height: var(--16px);
	color: var(--vert);
	text-wrap: balance; 
}

.form-contact .uabb-gf-style .gform_fields .ginput_container textarea,
.form-contact .uabb-gf-style .gform_fields .ginput_container input {
	border-color: var(--noir);
	font-family: var(--semi-condensed) !important; 
	font-weight: var(--semi-bold);
	color: var(--vert); 
}


.form-contact .uabb-gf-style .gform_fields .ginput_container_consent input::before {
	color: var(--vert);
}

.form-contact .uabb-gf-style .gform_fields .gfield_required span {
	font-size: 25px; 
	 color: var(--vert); 
}

.form-contact .uabb-gf-style .gform-footer input {
	font-family: var(--condensed) !important; 
	font-weight: var(--extra-bold) !important;
	font-size: var(--18px) !important;
	line-height: var(--18px) !important;
	color: var(--vert) !important;
		background: var(--blanc) !important;
	border: solid 1px var(--noir) !important;
	text-transform: uppercase !important;
	transition: all linear 300ms !important; 
	border-radius: 0px !important;
padding: 15px 30px !important; 
}

.form-contact .uabb-gf-style .gform-footer input:hover {
	font-family: var(--condensed) !important; 
	font-weight: var(--extra-bold) !important;
	font-size: var(--18px) !important;
	line-height: var(--18px) !important;
	color: var(--vert-clair) !important;
		background: var(--blanc) !important;
	border: solid 1px var(--noir) !important;
	text-transform: uppercase !important;
	transition: all linear 300ms !important; 
	border-radius: 0px !important;
padding: 15px 30px !important; 
}