/*Breakpoints : 480 640 768 1024 1280 1400*/
	
	
	
/*---------------------------------- HTML / BODY -------------------------------------*/
	*{
	min-height: 0;
	min-width: 0;
	}

	html {
	  margin:0px auto;
	} 

	body {
		margin:0px;
		list-style-type:none;
		text-size-adjust: none;
		-moz-text-size-adjust: none;
		-webkit-text-size-adjust: none;
		-ms-text-size-adjust: none;
		font-size: clamp(1rem, 2vw, 1.125rem); /* 16px → 18px */
		line-height:1.3;
		margin:0px auto;	
	}
	
	.my_page * { line-height:100% }
	
	
/*---------------------------------- Balises texte de base -------------------------------------*/


/*Textes*/

/*Désactiver variable fonts*/
.my_page :root {
  font-variant-ligatures: none;
}


.my_page .font-size-0 {font-size: 0;}
.my_page .strong { font-weight: 600}
.my_page .underline { text-decoration:underline }

.my_page h1, .my_page h2, .my_page h3, .my_page h4, .my_page h5 {
	margin-bottom:0rem;
	margin-top:0rem;
	font-weight: 100;
}

.my_page p {
	margin-bottom:0.2rem;
	margin-top:0.8rem;
	font-weight: normal;
}



/* Hiérarchie typographique responsive */
/* Taille de base (mobile first) */
html {
  font-size: 16px; /* Base pour les calculs rem */
}


.my_page h1, .my_page .h1 {
  font-size: clamp(1.75rem, 5vw, 3.2rem); /* 28px → 40px */
}

.my_page h2, .my_page .h2 {
  font-size: clamp(1.5rem, 4vw, 2.2rem); /* 24px → 32px */
}

.my_page h3, .my_page .h3 {
  font-size: clamp(clamp(1.25rem, 1vw, 2rem)); /* 20px → 28px */
}

.my_page h4, .my_page .h4 {
  font-size: clamp(1.125rem, 3vw, 1.5rem); /* 18px → 24px */
}

.my_page h5, .my_page .h5 {
  font-size: clamp(1rem, 2.5vw, 1.25rem); /* 16px → 20px */
}

.my_page h6, .my_page .h6 {
  font-size: clamp(0.875rem, 2vw, 1rem); /* 14px → 16px */
}

/* Corps de texte */
.my_page p, .my_page .p, .my_page li, .my_page .li, .my_page div, .my_page .div {
  font-size: clamp(1rem, 2vw, 1.125rem); /* 16px → 18px */
}

/* Textes secondaires */
.my_page small, .my_page .small, .my_page .text-small {
  font-size: clamp(0.8125rem, 1.5vw, 0.875rem); /* 13px → 14px */
}

/* Formulaires */
.my_page input, .my_page .input, .my_page textarea, .my_page .textarea, .my_page select, .my_page .select, .my_page button, .my_page .btn, {
  font-size: clamp(0.9375rem, 2vw, 1rem); /* 15px → 16px */
}

/* Citations */
.my_page blockquote, .my_page .blockquote {
  font-size: clamp(1.125rem, 2.5vw, 1.25rem); /* 18px → 20px */
}

/* Code */
.my_page code, .my_page .code, .my_page pre, .my_page .pre {
  font-size: clamp(0.8125rem, 1.8vw, 0.9375rem); /* 13px → 15px */
}


/* Line Height */
.my_page li, .my_page p  {
	line-height:120%;
}



/*---------------------------------- / Balises texte de base -------------------------------------*/



/*--------------------------------------------------------------------------------------*/
/*--------------------------------------------------------------------------------------*/
/*--------------------------------------------------------------------------------------*/
/*--------------------------------- CSS AVEC PREFIXE MY PAGE ---------------------------------------------------------*/
/*--------------------------------------------------------------------------------------*/
/*--------------------------------------------------------------------------------------*/
/*--------------------------------------------------------------------------------------*/






	
/*--------------------------------------------------------------------------------------*/
/*--------------------------------- Balises diverses ---------------------------------------------------------*/
/*--------------------------------------------------------------------------------------*/
	
	
	.flex-page-vertical-center  {
		  display:flex !important; flex-direction:column !important; justify-content:center !important;
		  min-height:100vh !important;
	}

	.my_page a {text-decoration:none; }
	
	.my_page br { line-height:0; }

	/*Img et picture*/
	.my_page picture { line-height:0;}
	.my_page img { border:0px none; margin:0px!important }
	.my_page a img { border:0px none; margin:0px!important }
	.my_page strong { font-weight:800 }


	/*Fonts*/
	.my_page a, .my_page span, .my_page strong { text-decoration:none; color:inherit; font-family:inherit; font-weight:inherit; font-style:inherit; }
	.my_page .font-size-0 {font-size: 0;}
	.my_page .strong { font-weight: 500}
	.my_page .underline { text-decoration:underline }
	
	
	/*Vidéo*/
	video { width:100% }
	
	/*Fix espacement image*/	
	.my_page .line-height-0 { line-height:0px !important }


	/*Tailles*/
	.my_page .w-auto { width:auto }
	.col-main .std .my_page img { width:auto; }
	.my_page .image-resizing { height:auto; max-width:100%!important; width:100%; display:block; }
	.my_page .image-resizing.max-width, .my_page .image-resizing.max-width *  { max-width:250px !important; } /*Défini une taille max par défaut*/
	.my_page .flex-full-height { align-self: stretch; }
	

	
	
	
/*--------------------------------------------------------------------------------------*/
/*--------------------------------- Conteneurs principaux ---------------------------------------------------------*/
/*--------------------------------------------------------------------------------------*/
	.my_page {
		width:100%;
		max-width:100%;
		margin:0px auto;	
	}
	
	.my_row {
		background-color:transparent;
		margin:0px;
		box-sizing:border-box;
		z-index:1;
	}	

	.my_container {
		box-sizing: border-box;
		-moz-box-sizing: border-box;
		-webkit-box-sizing: border-box;
		padding:0px;
		margin:0px auto;
		position:relative;
	}
	
	.my_container {
		max-width:1350px;
	}	



	.my_container.full-width {
		max-width:100%;
	}



/*--------------------------------- Gauche Droite ---------------------------------------------------------*/
@media screen and (min-width: 1024px) {
	.my_container.full-width .gauche { width:100%; max-width:880px; float:right }
	.my_container.full-width .droite { width:100%; max-width:450px; float:left }
}
/*--------------------------------- / Gauche Droite ---------------------------------------------------------*/



/*--------------------------------------------------------------------------------------*/
/*--------------------------------- /Conteneurs principaux -----------------------------*/
/*--------------------------------------------------------------------------------------*/	







/*--------------------------------------------------------------------------------------*/
/*--------------------------------- Flex -----------------------------------------------*/
/*--------------------------------------------------------------------------------------*/

		/*Fix de l'affichage du slick slider dans un élément flex ou float*/
		.my_page .my_row.slick-slider-fix, .my_row.slick-slider-fix * {
			min-height: 0;
			min-width: 0;
			height:auto !important; 
		}		

		.my_page .flex-element.slick-slider-fix {
			min-height: 0 !important; 
			min-width: 0 !important;
		}
		
		
		.my_page .flex-element.slick-slider-fix .conteneur-slider * {
			line-height:0!important;
		}
				
		
		
		
		/* FIn Fix de l'affichage du slick slider dans un élément flex ou float*/


/*------------- Flex conteneurs principaux ----------*/	


		/*Conteneur parent - flex-container*/		
		.my_page .flex-container {
			display: flex;
			flex-wrap: wrap;
			flex-direction: row;
			width:100%;
		}
		
		.my_page .flex-full-width {
			width:100%;
			-webkit-box-flex: 1;         
			-ms-flex: 1 0 100%;        
			flex: 1 0 100%;
		}
	
		.my_page .flex-inline-block {
			width:auto;
		}			
		
		/*Elements enfants - flex-element > généralités*/
		.my_page .flex-element {
			display:flex;
			flex-wrap: wrap;
			flex-direction: col;
			box-sizing:border-box;
			align-items:flex-start;
		}
		

/*------------- Table ----------*/	

		/*Table colonnes*/
		
		.my_page .table {
		  display: table !important;
		  
		}	
		
		.my_page .table-cell {
		  display: table-cell;
		}
		
		
/*------------- Grid conteneurs principaux ----------*/			
		
		
		/*Grid colonnes*/

		.my_page .grid-container {
			display: grid;
			grid-template-columns: repeat(1, 1fr);
			grid-template-rows: inherit;
			grid-gap: 0px;
			width: 100%;
			align-items: stretch;
			grid-auto-rows: auto 1fr auto !important;
		}
		
		.my_page .parent, .my_page.parent { display:grid }
		
		/* breakpoint at 1024px */
		@media screen and (min-width: 1024px) {

		  
			.my_page .grid-container {
				grid-template-columns: 70% 30%;
			}
			
			
		}
		
		/* breakpoint at 1280px */
		@media screen and (min-width: 1280px) {

			.my_page .grid-container {
				grid-template-columns: 62.7% 37.3% !important;
			}
		}

		
		.my_page .grid-container .grid-col-main, .my_page .grid-container .grid-col-aside  {
			height: 100%;
			display: flex;
			flex-direction: column;
			justify-content: center;
		}		


		/* breakpoint at 1024px */
		@media screen and (min-width: 1024px) {

		  
			.my_page .grid-container {
				grid-template-columns: 70% 30%;
			}
			
			.my_page #grid-col-main-1 { grid-area: 1 / 1 / 2 / 2; } 
			
			.my_page #grid-col-aside-3 { grid-area: 1 / 2 / 2 / 3; } 	
			
			.my_page #grid-col-main-2 { grid-area: 2 / 1 / 3 / 2; } 
			
			.my_page #grid-col-aside-2 { grid-area: 2 / 2 / 3 / 3; } 
			
			.my_page #grid-col-main-3 { grid-area: 3 / 1 / 4 / 2; } 

			.my_page #grid-col-aside-3 { grid-area: 3 / 2 / 4 / 3; } 	
		
			/*Grid colonnes FULL WIDTH*/
			
			.my_page .my_container.full-width .grid-container {
					grid-template-columns: 70% 30%;
				}
		
		
		}



		
		/* breakpoint at 1024px */
		@media screen and (min-width: 1024px) {


			.my_page #grid-col-main-1 { grid-area: 1 / 1 / 2 / 2; } 
			
			.my_page #grid-col-aside-3 { grid-area: 1 / 2 / 2 / 3; } 	
			
			.my_page #grid-col-main-2 { grid-area: 2 / 1 / 3 / 2; } 
			
			.my_page #grid-col-aside-2 { grid-area: 2 / 2 / 3 / 3; } 
			
			.my_page #grid-col-main-3 { grid-area: 3 / 1 / 4 / 2; } 

			.my_page #grid-col-aside-3 { grid-area: 3 / 2 / 4 / 3; } 	
		}
		
		
		
		/* breakpoint at 1024px */
		@media screen and (min-width: 1024px) {

			.my_page .grid-container.ordre-flux-different {
				grid-template-columns: 62.7% 37.3% repeat(2, 1fr) !important;
			}
			
			.my_page .ordre-flux-different #grid-col-main-1 { grid-area: 1 / 1 / 2 / 2 !important; }
			.my_page .ordre-flux-different #grid-col-main-2 { grid-area: 2 / 1 / 3 / 2 !important; }
			.my_page .ordre-flux-different #grid-form { grid-area: 1 / 2 / 3 / 3 !important; } 
		
		}
		
		
/*------------- Grid Alignements ----------*/			
		
		/*Grid Alignement table wrapper*/		
		.my_page .display-table-wrapper {
			display: table;
			height:100%
		}	
		
			/*------------- Grid Alignements horizontaux ----------*/	

			/*Grid Alignement horizontal milieu*/		
			.my_page .grid-halign-center {
				justify-content: center !important;
			}

			/*Grid Alignement horizontal gauche*/		
			.my_page .grid-halign-left {
				justify-content: left !important;
			}	

			/*Grid Alignement horizontal droite*/		
			.my_page .grid-halign-right {
				justify-content: right !important;
			}		

			/*------------- Grid Alignements verticaux ----------*/


			/*Grid Alignement table-cell vertical milieu*/			
			.my_page .grid-valign-center {
				display: table-cell;
				align-items: center !important;
				vertical-align: middle;
			}		

			.my_page .grid-valign-top {
				display: table-cell;
				align-items: start !important;
			}

			.my_page .grid-valign-bottom {
				display: table-cell;
				align-items: end !important;
			}
			
			/*------------- Flux des colonnes ----------*/	

			/*------------- 2 colonnes verticales ----------*/	
			
		@media (min-width: 480px) {
			.grid-auto-flow-column {
display: grid;
grid-template-rows: 1fr 1fr 1fr;
grid-auto-flow: column;
			}
			

			
			
			
			
		}

/*------------- / Grid Alignements ----------*/				
		
		

/*------------- Flex Alignements in Grid ----------*/	

		.my_page .grid-container .flex-direction-initial {
			flex-direction: initial !important;
		}
		
/*------------- / Flex Alignements in Grid ----------*/	
	
		
/*------------- Flex Alignements ----------*/			
		
	/*Alignement Vertical */		
		
		
		/*Alignement vertical top*/
		.my_page .flex-valign-top { 
			align-self: start;
		}
		
		.my_page .flex-valign-bottom { 
			align-self: end;
		}
		
		
		.my_page .flex-valign-baseline { 
			align-self: baseline;
		} 
		/*Alignement vertical milieu*/		
		.my_page .flex-valign-center {
			-webkit-box-align: center;
			-webkit-align-items: center;
			-ms-flex-align: center;
			align-items: center;
			-webkit-justify-content: center;
			-ms-flex-pack: center;
			justify-content: left;
		}
		
		.my_page .flex-halign-space-between { justify-content: space-between; }
		
	/*Alignement Horizontal*/	
	
		/*Alignement horizontal milieu*/		
		.my_page .flex-halign-center {
			justify-content: center;
			align-items: center;
		}
		
		/*Alignement horizontal à droite*/		
		.my_page .flex-halign-end { justify-content:flex-end }	
		.my_page .flex-halign-right { justify-content:right}	
		
		
		/*Alignement horizontal à gauche*/		
		.my_page .flex-halign-left { justify-content:left }	

		@media (max-width: 640px) {
			.my_page .flex-halign-center-on-mobile { justify-content: center; }	
			.my_page .flex-halign-left-on-mobile { justify-content: left; }	
			.my_page .flex-halign-right-on-mobile { justify-content: right; }				
		}




	/*Changement de direction*/		
	
		.my_page .flex-row-reverse { flex-direction: row-reverse; }
		
	@media (min-width: 480px) {
		.my_page .flex-row-reverse-responsive { flex-direction: row-reverse; }		
	}		
	
	
	/*Flex largeurs hauteurs*/	
		
		/*Hauteur*/		

		.flex-full-height {
			display: flex;
			flex-wrap: wrap;
		}

		.flex-full-height-content {
		  display: flex;
		  flex-direction: column;
		  padding: 1em;
			width: 100%;
		}

		.flex-full-height-item {
			display: flex; 
		}

		.flex-fill-height {
			display: flex; 
			flex: 1 0 auto;
		}

		.my_page .flex-full-height { align-self: stretch; }
		
		
		/*Largeurs*/				
		.flex-auto-width { flex:1 }
		
	@media screen and (max-width: 640px) {			
		.flex-auto-width { flex:auto !important; }			
	}






/*--------------------------------------------------------------------------------------*/
/*--------------------------------- / FIN FLEX ---------------------------------------------------------*/
/*--------------------------------------------------------------------------------------*/





/*--------------------------------------------------------------------------------------*/
/*--------------------------------- FLEX Responsive ---------------------------------------------------------*/
/*--------------------------------------------------------------------------------------*/


/* MA GRILLE CSS */

/* TOUS DEVICES */
	.my_page .flex-1 { flex: 1; }
	.my_page .flex-2 { flex: 2; }
	.my_page .flex-3 { flex: 3; }
	.my_page .flex-4 { flex: 4; }
	.my_page .flex-5 { flex: 5; }
	.my_page .flex-6 { flex: 6; }
	
	.my_page .flex_auto { width:auto }
	
	.my_page .order-1 {order:1; }
	.my_page .order-2 {order:2; }
	.my_page .order-3 {order:3; }
	.my_page .order-4 {order:4; }
	.my_page .order-5 {order:5; }
	.my_page .order-6 {order:6; }
	.my_page .order-7 {order:7; }
	
	.my_page .flex_1-1 { flex: 0 100% }
	.my_page .flex_1-2 { flex: 0 50% }
	.my_page .flex_1-3 { flex: 0 33.3% }
	.my_page .flex_1-4 { flex: 0 25% }
	.my_page .flex_1-5 { flex: 0 20% }
	.my_page .flex_1-6 { flex: 0 16.6% }
	
	.my_page .flex_2-2 { flex: 0 100% }
	.my_page .flex_2-3 { flex: 0 66.6% }
	.my_page .flex_2-4 { flex: 0 50% }
	.my_page .flex_2-5 { flex: 0 40% }
	.my_page .flex_2-6 { flex: 0 33.3% }
	
	.my_page .flex_3-3 { flex: 0 100% }
	.my_page .flex_3-4 { flex: 0 75% }
	.my_page .flex_3-5 { flex: 0 60% }
	.my_page .flex_3-6 { flex: 0 50% }
	
	.my_page .flex_4-4 { flex: 0 100% }
	.my_page .flex_4-5 { flex: 0 80% }
	.my_page .flex_4-6 { flex: 0 66.6% }
	
	.my_page .flex_5-5 { flex: 0 100% }
	.my_page .flex_5-6 { flex: 0 83.3% }
	
	.my_page .flex_6-6 { flex: 1 100% }



	.my_page .desktop_only { display:none }
	.my_page .ipad_only { display:none }
	.my_page .tablet_only { display:none }
	.my_page .phablet_only { display:none }
	.my_page .mobile_only { display:block }
	
	.my_page .hide_on_mobile { display:none; }
	.my_page .show_on_mobile { display:block; }

/* Mobile Only */

@media (max-width: 480px) {
	.my_page .flex_mobile-1 { flex: 1; }
	.my_page .flex_mobile-2 { flex: 2; }
	.my_page .flex_mobile-3 { flex: 3; }
	.my_page .flex_mobile-4 { flex: 4; }
	.my_page .flex_mobile-5 { flex: 5; }
	.my_page .flex_mobile-6 { flex: 6; }
	
	.my_page .flex_mobile_auto { width:auto }
	
	.my_page .order_mobile-1 {order:1; }
	.my_page .order_mobile-2 {order:2; }
	.my_page .order_mobile-3 {order:3; }
	.my_page .order_mobile-4 {order:4; }
	.my_page .order_mobile-5 {order:5; }
	.my_page .order_mobile-6 {order:6; }
	.my_page .order_mobile-7 {order:7; }
	
	.my_page .flex_mobile_1-1 { flex: 0 100% }
	.my_page .flex_mobile_1-2 { flex: 0 50% }
	.my_page .flex_mobile_1-3 { flex: 0 33.3% }
	.my_page .flex_mobile_1-4 { flex: 0 25% }
	.my_page .flex_mobile_1-5 { flex: 0 20% }
	.my_page .flex_mobile_1-6 { flex: 0 16.6% }
	
	.my_page .flex_mobile_2-2 { flex: 0 100% }
	.my_page .flex_mobile_2-3 { flex: 0 66.6% }
	.my_page .flex_mobile_2-4 { flex: 0 50% }
	.my_page .flex_mobile_2-5 { flex: 0 40% }
	.my_page .flex_mobile_2-6 { flex: 0 33.3% }
	
	.my_page .flex_mobile_3-3 { flex: 0 100% }
	.my_page .flex_mobile_3-4 { flex: 0 75% }
	.my_page .flex_mobile_3-5 { flex: 0 60% }
	.my_page .flex_mobile_3-6 { flex: 0 50% }
	
	.my_page .flex_mobile_4-4 { flex: 0 100% }
	.my_page .flex_mobile_4-5 { flex: 0 80% }
	.my_page .flex_mobile_4-6 { flex: 0 66.6% }
	
	.my_page .flex_mobile_5-5 { flex: 0 100% }
	.my_page .flex_mobile_5-6 { flex: 0 83.3% }
	
	.my_page .flex_mobile_6-6 { flex: 1 100% }
}

/*A partir de phablet*/
@media (min-width: 480px) {
	
	
	.flex_phablet-1 { flex: 1; }
	.flex_phablet-2 { flex: 2; }
	.flex_phablet-3 { flex: 3; }
	.flex_phablet-4 { flex: 4; }
	.flex_phablet-5 { flex: 5; }
	.flex_phablet-6 { flex: 6; }
	
	.my_page .flex_phablet_auto { width:auto }
	
	.order_phablet-1 {order:1; }
	.order_phablet-2 {order:2; }
	.order_phablet-3 {order:3; }
	.order_phablet-4 {order:4; }
	.order_phablet-5 {order:5; }
	.order_phablet-6 {order:6; }
	.order_phablet-7 {order:7; }
	
	.my_page .flex_phablet_1-1 { flex: 0 100% }
	.my_page .flex_phablet_1-2 { flex: 0 50% }
	.my_page .flex_phablet_1-3 { flex: 0 33.3% }
	.my_page .flex_phablet_1-4 { flex: 0 25% }
	.my_page .flex_phablet_1-5 { flex: 0 20% }
	.my_page .flex_phablet_1-6 { flex: 0 16.6% }
	
	.my_page .flex_phablet_2-2 { flex: 0 100% }
	.my_page .flex_phablet_2-3 { flex: 0 66.6% }
	.my_page .flex_phablet_2-4 { flex: 0 50% }
	.my_page .flex_phablet_2-5 { flex: 0 40% }
	.my_page .flex_phablet_2-6 { flex: 0 33.3% }
	
	.my_page .flex_phablet_3-3 { flex: 0 100% }
	.my_page .flex_phablet_3-4 { flex: 0 75% }
	.my_page .flex_phablet_3-5 { flex: 0 60% }
	.my_page .flex_phablet_3-6 { flex: 0 50% }
	
	.my_page .flex_phablet_4-4 { flex: 0 100% }
	.my_page .flex_phablet_4-5 { flex: 0 80% }
	.my_page .flex_phablet_4-6 { flex: 0 66.6% }
	
	.my_page .flex_phablet_5-5 { flex: 0 100% }
	.my_page .flex_phablet_5-6 { flex: 0 83.3% }
	
	.my_page .flex_phablet_6-6 { flex:100% }





	.my_page .desktop_only { display:none }
	.my_page .ipad_only { display:none }
	.my_page .tablet_only { display:none }
	.my_page .mobile_only { display:none }
	.my_page .phablet_only { display:block }
	
	.my_page .hide_on_phablet { display:none; }
	.my_page .show_on_phablet { display:block; }

}



/*A partir de tablet*/
@media (min-width: 640px) {
	
	
	.my_page .flex_tablet-1 { flex: 1; }
	.my_page .flex_tablet-2 { flex: 2; }
	.my_page .flex_tablet-3 { flex: 3; }
	.my_page .flex_tablet-4 { flex: 4; }
	.my_page .flex_tablet-5 { flex: 5; }
	.flex_tablet-6 { flex: 6; }
	
	.my_page .flex_tablet_auto { width:auto }
	
	.my_page .order_tablet-1 {order:1; }
	.my_page .order_tablet-2 {order:2; }
	.my_page .order_tablet-3 {order:3; }
	.my_page .order_tablet-4 {order:4; }
	.my_page .order_tablet-5 {order:5; }
	.my_page .order_tablet-6 {order:6; }
	.my_page .order_tablet-7 {order:7; }
	
	.my_page .flex_tablet_1-1 { flex: 0 100% }
	.my_page .flex_tablet_1-2 { flex: 0 50% }
	.my_page .flex_tablet_1-3 { flex: 0 33.3% }
	.my_page .flex_tablet_1-4 { flex: 0 25% }
	.my_page .flex_tablet_1-5 { flex: 0 20% }
	.my_page .flex_tablet_1-6 { flex: 0 16.6% }
	

	.my_page .flex_tablet_2-2 { flex: 0 100% }
	.my_page .flex_tablet_2-3 { flex: 0 66.6% }
	.my_page .flex_tablet_2-4 { flex: 0 50% }
	.my_page .flex_tablet_2-5 { flex: 0 40% }
	.my_page .flex_tablet_2-6 { flex: 0 33.3% }
	
	.my_page .flex_tablet_3-3 { flex: 0 100% }
	.my_page .flex_tablet_3-4 { flex: 0 75% }
	.my_page .flex_tablet_3-5 { flex: 0 60% }
	.my_page .flex_tablet_3-6 { flex: 0 50% }
	
	.my_page .flex_tablet_4-4 { flex: 0 100% }
	.my_page .flex_tablet_4-5 { flex: 0 80% }
	.my_page .flex_tablet_4-6 { flex: 0 66.6% }
	
	.my_page .flex_tablet_5-5 { flex: 0 100% }
	.my_page .flex_tablet_5-6 { flex: 0 83.3% }
	
	.my_page .flex_tablet_6-6 { flex: 0 100% }



	.my_page .desktop_only { display:none }
	.my_page .ipad_only { display:none }
	.my_page .phablet_only { display:none }
	.my_page .mobile_only { display:none }
	.my_page .tablet_only { display:block }
	
	.my_page .hide_on_tablet { display:none; }
	.my_page .show_on_tablet { display:block; }


}

/*A partir de Ipad*/
@media (min-width: 768px) {
	
	.my_page .flex_ipad-1 { flex: 1; }
	.my_page .flex_ipad-2 { flex: 2; }
	.my_page .flex_ipad-3 { flex: 3; }
	.my_page .flex_ipad-4 { flex: 4; }
	.my_page .flex_ipad-5 { flex: 5; }
	.my_page .flex_ipad-6 { flex: 6; }
	
	.my_page .flex_ipad_auto { width:auto }
	
	.my_page .order_ipad-1 {order:1; }
	.my_page .order_ipad-2 {order:2; }
	.my_page .order_ipad-3 {order:3; }
	.my_page .order_ipad-4 {order:4; }
	.my_page .order_ipad-5 {order:5; }
	.my_page .order_ipad-6 {order:6; }
	.my_page .order_ipad-7 {order:7; }

	.my_page .flex_ipad_1-1 { flex: 0 100% }
	.my_page .flex_ipad_1-2 { flex: 0 50% }
	.my_page .flex_ipad_1-3 { flex: 0 33.3% }
	.my_page .flex_ipad_1-4 { flex: 0 25% }
	.my_page .flex_ipad_1-5 { flex: 0 20% }
	.my_page .flex_ipad_1-6 { flex: 0 16.6% }
	

	.my_page .flex_ipad_2-2 { flex: 0 100% }
	.my_page .flex_ipad_2-3 { flex: 0 66.6% }
	.my_page .flex_ipad_2-4 { flex: 0 50% }
	.my_page .flex_ipad_2-5 { flex: 0 40% }
	.my_page .flex_ipad_2-6 { flex: 0 33.3% }
	
	.my_page .flex_ipad_3-3 { flex: 0 100% }
	.my_page .flex_ipad_3-4 { flex: 0 75% }
	.my_page .flex_ipad_3-5 { flex: 0 60% }
	.my_page .flex_ipad_3-6 { flex: 0 50% }
	
	.my_page .flex_ipad_4-4 { flex: 0 100% }
	.my_page .flex_ipad_4-5 { flex: 0 80% }
	.my_page .flex_ipad_4-6 { flex: 0 66.6% }
	
	.my_page .flex_ipad_5-5 { flex: 0 100% }
	.my_page .flex_ipad_5-6 { flex: 0 83.3% }
	
	.my_page .flex_ipad_6-6 { flex:100% }


	.my_page .desktop_only { display:none}
	.my_page .tablet_only { display:none }
	.my_page .phablet_only { display:none }
	.my_page .mobile_only { display:none }
	.my_page .ipad_only { display:block }
	
	.my_page .hide_on_ipad { display:none; }
	.my_page .show_on_ipad { display:block; }

}

/*A partir de desktop*/
@media (min-width: 1024px) {
	
	.my_page .flex_desktop-1 { flex: 1; }
	.my_page .flex_desktop-2 { flex: 2; }
	.my_page .flex_desktop-3 { flex: 3; }
	.my_page .flex_desktop-4 { flex: 4; }
	.my_page .flex_desktop-5 { flex: 5; }
	.my_page .flex_desktop-6 { flex: 6; }
	
	.my_page .flex_desktop_auto { width:auto }
	
	.my_page .order_desktop-1 {order:1; }
	.my_page .order_desktop-2 {order:2; }
	.my_page .order_desktop-3 {order:3; }
	.my_page .order_desktop-4 {order:4; }
	.my_page .order_desktop-5 {order:5; }
	.my_page .order_desktop-6 {order:6; }
	.my_page .order_desktop-7 {order:7; }

	.my_page .flex_desktop_1-1 { flex: 0 100% }
	.my_page .flex_desktop_1-2 { flex: 0 50% }
	.my_page .flex_desktop_1-3 { flex: 0 33.3% }
	.my_page .flex_desktop_1-4 { flex: 0 25% }
	.my_page .flex_desktop_1-5 { flex: 0 20% }
	.my_page .flex_desktop_1-6 { flex: 0 16.6% }
	

	.my_page .flex_desktop_2-2 { flex: 0 100% }
	.my_page .flex_desktop_2-3 { flex: 0 66.6% }
	.my_page .flex_desktop_2-4 { flex: 0 50% }
	.my_page .flex_desktop_2-5 { flex: 0 40% }
	.my_page .flex_desktop_2-6 { flex: 0 33.3% }
	
	.my_page .flex_desktop_3-3 { flex: 0 100% }
	.my_page .flex_desktop_3-4 { flex: 0 75% }
	.my_page .flex_desktop_3-5 { flex: 0 60% }
	.my_page .flex_desktop_3-6 { flex: 0 50% }
	
	.my_page .flex_desktop_4-4 { flex: 0 100% }
	.my_page .flex_desktop_4-5 { flex: 0 80% }
	.my_page .flex_desktop_4-6 { flex: 0 66.6% }
	
	.my_page .flex_desktop_5-5 { flex: 0 100% }
	.my_page .flex_desktop_5-6 { flex: 0 83.3% }
	
	.my_page .flex_desktop_6-6 { flex: 0 100% }	

	.my_page .ipad_only { display:none }
	.my_page .tablet_only { display:none }
	.my_page .phablet_only { display:none }
	.my_page .mobile_only { display:none }
	.my_page .desktop_only { display:block }
	
	.my_page .hide_on_desktop { display:none; }
	.my_page .show_on_desktop { display:block; }

}


/*Flex desktop xl*/	
@media (min-width: 1280px) {
	.my_page .flex_desktop-xl-1 {
		flex: 1;
	}
	.my_page .flex_desktop-xl-2 {
		flex: 2;
	}
	.my_page .flex_desktop-xl-3 {
		flex: 3;
	}
	.my_page .flex_desktop-xl-4 {
		flex: 4;
	}	
	.my_page .flex_desktop-xl-5 {
		flex: 5;
	}
	.my_page .flex_desktop-xl-6 {
		flex: 6;
	}
	
	.order_desktop-1 {order:1; }
	.order_desktop-2 {order:2; }
	.order_desktop-3 {order:3; }
	.order_desktop-4 {order:4; }
	.order_desktop-5 {order:5; }
	.order_desktop-6 {order:6; }
	.order_desktop-7 {order:7; }

	.my_page .flex_desktop-xl_1-1 { flex: 0 100% }
	.my_page .flex_desktop-xl_1-2 { flex: 0 50% }
	.my_page .flex_desktop-xl_1-3 { flex: 0 33.3% }
	.my_page .flex_desktop-xl_1-4 { flex: 0 25% }
	.my_page .flex_desktop-xl_1-5 { flex: 0 20% }
	.my_page .flex_desktop-xl_1-6 { flex: 0 16.6% }
	

	.my_page .flex_desktop-xl_2-2 { flex: 0 100% }
	.my_page .flex_desktop-xl_2-3 { flex: 0 66.6% }
	.my_page .flex_desktop-xl_2-4 { flex: 0 50% }
	.my_page .flex_desktop-xl_2-5 { flex: 0 40% }
	.my_page .flex_desktop-xl_2-6 { flex: 0 33.3% }
	
	.my_page .flex_desktop-xl_3-3 { flex: 0 100% }
	.my_page .flex_desktop-xl_3-4 { flex: 0 75% }
	.my_page .flex_desktop-xl_3-5 { flex: 0 60% }
	.my_page .flex_desktop-xl_3-6 { flex: 0 50% }
	
	.my_page .flex_desktop-xl_4-4 { flex: 0 100% }
	.my_page .flex_desktop-xl_4-5 { flex: 0 80% }
	.my_page .flex_desktop-xl_4-6 { flex: 0 66.6% }
	
	.my_page .flex_desktop-xl_5-5 { flex: 0 100% }
	.my_page .flex_desktop-xl_5-6 { flex: 0 83.3% }
	
	.my_page .flex_desktop-xl_6-6 { flex: 0 100% }	
		
}

/*Flex desktop xxl*/	
@media (min-width: 1400px) {
	.my_page .flex_desktop-xxl-1 {
		flex: 1;
	}
	.my_page .flex_desktop-xxl-2 {
		flex: 2;
	}
	.my_page .flex_desktop-xxl-3 {
		flex: 3;
	}
	.my_page .flex_desktop-xxl-4 {
		flex: 4;
	}	
	.my_page .flex_desktop-xxl-5 {
		flex: 5;
	}
	.my_page .flex_desktop-xxl-6 {
		flex: 6;
	}
	
	
	.my_page .flex_desktop-xxl_1-1 { flex: 0 100% }
	.my_page .flex_desktop-xxl_1-2 { flex: 0 50% }
	.my_page .flex_desktop-xxl_1-3 { flex: 0 33.3% }
	.my_page .flex_desktop-xxl_1-4 { flex: 0 25% }
	.my_page .flex_desktop-xxl_1-5 { flex: 0 20% }
	.my_page .flex_desktop-xxl_1-6 { flex: 0 16.6% }
	

	.my_page .flex_desktop-xxl_2-2 { flex: 0 100% }
	.my_page .flex_desktop-xxl_2-3 { flex: 0 66.6% }
	.my_page .flex_desktop-xxl_2-4 { flex: 0 50% }
	.my_page .flex_desktop-xxl_2-5 { flex: 0 40% }
	.my_page .flex_desktop-xxl_2-6 { flex: 0 33.3% }
	
	.my_page .flex_desktop-xxl_3-3 { flex: 0 100% }
	.my_page .flex_desktop-xxl_3-4 { flex: 0 75% }
	.my_page .flex_desktop-xxl_3-5 { flex: 0 60% }
	.my_page .flex_desktop-xxl_3-6 { flex: 0 50% }
	
	.my_page .flex_desktop-xxl_4-4 { flex: 0 100% }
	.my_page .flex_desktop-xxl_4-5 { flex: 0 80% }
	.my_page .flex_desktop-xxl_4-6 { flex: 0 66.6% }
	
	.my_page .flex_desktop-xxl_5-5 { flex: 0 100% }
	.my_page .flex_desktop-xxl_5-6 { flex: 0 83.3% }
	
	.my_page .flex_desktop-xxl_6-6 { flex: 0 100% }	
	
	
}


/*--------------------------------------------------------------------------------------*/
/*--------------------------------- /Fin FLEX Responsive ---------------------------------------------------------*/
/*--------------------------------------------------------------------------------------*/


/*--------------------------------------------------------------------------------------*/
/*--------------------------------- GRID Responsive ---------------------------------------------------------*/
/*--------------------------------------------------------------------------------------*/


/* MA GRILLE CSS */

/* TOUS DEVICES */


	.my_page .grid-1 { grid-template-columns: repeat(auto-fill,minmax(100%, 1fr))!important; }
	.my_page .grid-2 { grid-template-columns: repeat(auto-fill,minmax(50%, 1fr))!important; }
	.my_page .grid-3 { grid-template-columns: repeat(auto-fill,minmax(33%, 1fr))!important; }
	.my_page .grid-4 { grid-template-columns: repeat(auto-fill,minmax(25%, 1fr))!important; }
	.my_page .grid-5 { grid-template-columns: repeat(auto-fill,minmax(20%, 1fr))!important; }
	.my_page .grid-6 { grid-template-columns: repeat(auto-fill,minmax(16%, 1fr))!important; }
	
	.my_page .grid_auto { width:auto !important }


/*A partir de phablet*/
@media (min-width: 480px) {
	
	
	.my_page .grid_phablet-1 { grid-template-columns: repeat(auto-fill,minmax(100%, 1fr))!important; }
	.my_page .grid_phablet-2 { grid-template-columns: repeat(auto-fill,minmax(50%, 1fr))!important; }
	.my_page .grid_phablet-3 { grid-template-columns: repeat(auto-fill,minmax(33%, 1fr))!important; }
	.my_page .grid_phablet-4 { grid-template-columns: repeat(auto-fill,minmax(25%, 1fr))!important; }
	.my_page .grid_phablet-5 { grid-template-columns: repeat(auto-fill,minmax(20%, 1fr))!important; }
	.my_page .grid_phablet-6 { grid-template-columns: repeat(auto-fill,minmax(16%, 1fr))!important; }
	
	.my_page .grid_phablet_auto { width:auto }

}



/*A partir de tablet*/
@media (min-width: 640px) {
	
	.my_page .grid_tablet-1 { grid-template-columns: repeat(auto-fill,minmax(100%, 1fr))!important; }
	.my_page .grid_tablet-2 { grid-template-columns: repeat(auto-fill,minmax(50%, 1fr))!important; }
	.my_page .grid_tablet-3 { grid-template-columns: repeat(auto-fill,minmax(33%, 1fr))!important; }
	.my_page .grid_tablet-4 { grid-template-columns: repeat(auto-fill,minmax(25%, 1fr))!important; }
	.my_page .grid_tablet-5 { grid-template-columns: repeat(auto-fill,minmax(20%, 1fr))!important; }
	.my_page .grid_tablet-6 { grid-template-columns: repeat(auto-fill,minmax(16%, 1fr))!important; }
	
	.my_page .grid_tablet_auto { width:auto }


}

/*A partir de Ipad*/
@media (min-width: 768px) {
	
	.my_page .grid_ipad-1 { grid-template-columns: repeat(auto-fill,minmax(100%, 1fr))!important; }
	.my_page .grid_ipad-2 { grid-template-columns: repeat(auto-fill,minmax(50%, 1fr))!important; }
	.my_page .grid_ipad-3 { grid-template-columns: repeat(auto-fill,minmax(33%, 1fr))!important; }
	.my_page .grid_ipad-4 { grid-template-columns: repeat(auto-fill,minmax(25%, 1fr))!important; }
	.my_page .grid_ipad-5 { grid-template-columns: repeat(auto-fill,minmax(20%, 1fr))!important; }
	.my_page .grid_ipad-6 { grid-template-columns: repeat(auto-fill,minmax(16%, 1fr))!important; }
	
	.my_page .grid_ipad_auto { width:auto }

}

/*A partir de desktop*/
@media (min-width: 1024px) {
	
	.my_page .grid_desktop-1 { grid-template-columns: repeat(auto-fill,minmax(100%, 1fr))!important; }
	.my_page .grid_desktop-2 { grid-template-columns: repeat(auto-fill,minmax(50%, 1fr))!important; }
	.my_page .grid_desktop-3 { grid-template-columns: repeat(auto-fill,minmax(33%, 1fr))!important; }
	.my_page .grid_desktop-4 { grid-template-columns: repeat(auto-fill,minmax(25%, 1fr))!important; }
	.my_page .grid_desktop-5 { grid-template-columns: repeat(auto-fill,minmax(20%, 1fr))!important; }
	.my_page .grid_desktop-6 { grid-template-columns: repeat(auto-fill,minmax(16%, 1fr))!important; }
	
	.my_page .grid_desktop_auto { width:auto }

}


/*Flex desktop xl*/	
@media (min-width: 1280px) {
	.my_page .grid_desktop-xl-1 { grid-template-columns: repeat(auto-fill,minmax(100%, 1fr))!important; }
	.my_page .grid_desktop-xl-2 { grid-template-columns: repeat(auto-fill,minmax(50%, 1fr))!important; }
	.my_page .grid_desktop-xl-3 { grid-template-columns: repeat(auto-fill,minmax(33%, 1fr))!important; }
	.my_page .grid_desktop-xl-4 { grid-template-columns: repeat(auto-fill,minmax(25%, 1fr))!important; }
	.my_page .grid_desktop-xl-5 { grid-template-columns: repeat(auto-fill,minmax(20%, 1fr))!important; }
	.my_page .grid_desktop-xl-6 { grid-template-columns: repeat(auto-fill,minmax(16%, 1fr))!important; }
	
	.my_page .grid_desktop_auto { width:auto }
		
}

/*Flex desktop xxl*/	
@media (min-width: 1400px) {
	.my_page .grid_desktop-xxl-1 { grid-template-columns: repeat(auto-fill,minmax(100%, 1fr))!important; }
	.my_page .grid_desktop-xxl-2 { grid-template-columns: repeat(auto-fill,minmax(50%, 1fr))!important; }
	.my_page .grid_desktop-xxl-3 { grid-template-columns: repeat(auto-fill,minmax(33%, 1fr))!important; }
	.my_page .grid_desktop-xxl-4 { grid-template-columns: repeat(auto-fill,minmax(25%, 1fr))!important; }
	.my_page .grid_desktop-xxl-5 { grid-template-columns: repeat(auto-fill,minmax(20%, 1fr))!important; }
	.my_page .grid_desktop-xxl-6 { grid-template-columns: repeat(auto-fill,minmax(16%, 1fr))!important; }
	
	.my_page .grid_desktop_auto { width:auto }
	
	
}


/*--------------------------------------------------------------------------------------*/
/*--------------------------------- /Fin GRID Responsive ---------------------------------------------------------*/
/*--------------------------------------------------------------------------------------*/




/*--------------------------------------------------------------------------------------*/
/*--------------------------------- PUCES ET PICTOS ---------------------------------------------------------*/
/*--------------------------------------------------------------------------------------*/







/*--------------------------------------------------------------------------------------*/
/*--------------------------------- PUCES ET PICTOS ---------------------------------------------------------*/
/*--------------------------------------------------------------------------------------*/



.my_page .liste-a-puces-image-personnalisee {
    list-style: none;
    padding: 0;
    margin: 0;
}



/* Chaque élément (li, div...) est un flex container */
.my_page .liste-a-puces-image-personnalisee > li,
.my_page .liste-a-puces-image-personnalisee > div,
.puce {
    display: flex;
    align-items: flex-start; /* Assure un bon alignement */
    gap: 0px; /* Espacement entre l'icône et le texte */
    margin-bottom: 20px;
}


@media (min-width: 640px) {
.my_page .liste-a-puces-image-personnalisee > li,
.my_page .liste-a-puces-image-personnalisee > div,
.puce {
    gap: 12px; /* Espacement entre l'icône et le texte */
}

}


/* Icône pour tous les éléments */
.my_page .liste-a-puces-image-personnalisee > li::before,
.my_page .liste-a-puces-image-personnalisee > div::before,
.puce:before {
    content: "";
    display: inline-block;
    width: 24px; /* Taille de l'icône */
    height: 24px;
    background-image: url('https://dummyimage.com/24x24/aaa/fff'); /* Icône par défaut */
    background-size: contain;
    background-repeat: no-repeat;
    flex-shrink: 0;
}

.my_page .puce-a:before { background-image:url('https://dummyimage.com/24x24/000/fff'); }
.my_page .puce-b:before { background-image:url('https://dummyimage.com/24x24/555/fff'); }
.my_page .puce-c:before { background-image:url('https://dummyimage.com/24x24/aaa/fff'); }

/* Icône big */
.puce.puce-big:before {
    width: 45px; /* Taille de l'icône */
    height: 45px;
    background-image: url('https://dummyimage.com/45x45/aaa/fff'); /* Icône par défaut */
}

/* Icône spécifique pour les éléments avec .puce */
.my_page .puce-differente::before {
    background-image: url('https://dummyimage.com/24x24/00DC00/000'); /* Icône différente */
}

/* Texte en colonne même si flex est activé */
.my_page .liste-a-puces-image-personnalisee li > *,
.my_page .liste-a-puces-image-personnalisee div > * {
    display: block; /* Force le premier élément interne (h4, p, a...) à être en colonne */
    width: 100%; /* Empêche tout retour à une disposition horizontale */
}






/*Puce Bullet Point*/
.my_page ul.bullet-points {
	padding:0px 0px 0px 20px !important;
}

.my_page ul.bullet-points li:before {
	content: "•";
	color: red;
	display: inline-block;
	width: 0.5em;
	margin-left: -0.5em;
	margin-top:0.1em;
	font-size:3rem;
	line-height:0;
	position:relative;
	top:0.1em;
	left:0em;
}


/* Checklist */

.my_page .checklist > li,
.my_page .checklist > div {
	position:relative;
	padding-left:20px;
	margin-bottom:20px;
}

.my_page .checklist > li::before,
.my_page .checklist > div::before {
    content: "✓";
    display: inline-block;
    width: 12px; /* Taille de l'icône */
    height: 12px;
    background-image: none;
    flex-shrink: 0;
	color:#13AA5B;
	position:absolute;
	left:0px;
}







.my_page ul.classic li > ul {
	margin-top:20px;
}




/*--------------------------------------------------------------------------------------*/
/*--------------------------------- LANDING PAGES et BLOCS STATIQUES PERSONNALISEES ------------------------------------*/	
/*--------------------------------------------------------------------------------------*/


/*-----------------------------------------Tricks-----------------------------------------*/

/*--------- Line Height --------*/
.line-height-150 { line-height:150% !important; }
.line-height-130 { line-height:130% !important; }
.line-height-100 { line-height:100% !important; }
.line-height-50 { line-height:50% !important; }
.line-height-0 { line-height:0% !important; }

/*--------- Full width responsive --------*/
.my_page .full-width, .my_page.full-width {
    width:100%!important;
    max-width:100%!important;
}


.my_page .full-height {
  height: 100% !important;
}


@media (max-width: 1024px) {
	.my_page .full-width-on-desktop {
		width:100% !important;
		max-width:100%!important;
		display:block;
	}
	.my_page .flex-full-width-on-desktop {     
			flex: 1 0 100% !important;
		}	
}


@media (max-width: 640px) {
	.my_page .full-width-on-ipad {
		width:100% !important;
		max-width:100%!important;
		display:block;
	}
	.my_page .flex-full-width-on-ipad {     
			flex: 1 0 100% !important;
		}	
}


@media (max-width: 640px) {
	.my_page .full-width-on-mobile {
		width:100% !important;
		max-width:100%!important;
		display:block;
	}
	.my_page .my_page .flex-full-width-on-mobile {     
			flex: 1 0 100% !important;
		}	
}




	.my_page .max-width-250, .my_page .full-width.max-width-250 { max-width:250px!important  }
	.my_page .max-width-500, .my_page .full-width.max-width-500 { max-width:500px!important  }
	.my_page .max-width-800, .my_page .full-width.max-width-800 { max-width:800px!important  }
	.my_page .max-width-1000,.my_page .full-width.max-width-1000 { max-width:1000px!important  }
	.my_page .max-width-1500, .my_page .full-width.max-width-1500 { max-width:1500px!important  }
	.my_page .max-width-2000, .my_page .full-width.max-width-2000 { max-width:2000px!important  }






.my_page .centrer-sur-mobile { text-align:center; width:100%; }
@media (min-width: 640px) {
	/*Taille de landing page par défaut*/
	.centrer-sur-mobile { text-align:left; }
}



.my_page .display-block-on-mobile {
	display: block;
}
@media (min-width: 640px) {	
	.my_page .display-block-on-mobile {
		display: flex;
	}
}




.position-absolute { position:absolute !important }
.position-relative { position:relative !important }
.position-unset { position:unset !important }



@media (min-width: 640px) {	
	.my_page .absolute-on-desktop {
		position:absolute !important ;
		top: 0;
		right: 0;
		left: 0;
		z-index:3;
	}
}


/*---------------------------------- Grille -------------------------------------*/ 	
    .my_page .grid{
        display: grid;
        grid-template-columns: repeat(auto-fill,minmax(50%, 1fr));
		width: 100%;
		margin:0px auto;
    }
	
    .my_page .grid.grid_1-2 {
        grid-template-columns: repeat(auto-fill,minmax(50%, 1fr));
    }	
	
    .my_page .grid.grid_1-3 {
        grid-template-columns: repeat(auto-fill,minmax(33%, 1fr));
    }
	
    .my_page .grid.grid_1-4 {
        grid-template-columns: repeat(auto-fill,minmax(25%, 1fr));
    }
	
    .my_page .grid.grid_1-5 {
        grid-template-columns: repeat(auto-fill,minmax(20%, 1fr));
    }

    .my_page .grid.grid_1-6 {
        grid-template-columns: repeat(auto-fill,minmax(16%, 1fr));
    }
	

    .my_page .grid.grid-croix div:nth-child(2n) {
		border-color: 1px solid rgb(96, 139, 168);
		border-left: 1px solid;
    }
    .my_page .grid.grid-croix div {
		border-top: 1px solid;
    }	
    .my_page .grid.grid-croix div:nth-child(1) {
		border-top: 0px;
    }
	
@media (max-width: 480px) {
	
    .my_page .grid.full-width-on-mobile {
        grid-template-columns: repeat(auto-fill,minmax(100%, 1fr)) !important;
		width: 100% !important;
    }
	
    .my_page .grid.grid-croix-responsive {
        grid-template-columns: repeat(auto-fill,minmax(100%, 1fr)) !important;
    }
    .my_page .grid.grid-croix-responsive div:nth-child(2n) {
		border-left: 0px;
    }
}

@media (min-width: 480px) {
    .my_page .grid.grid-croix div:nth-child(1), .my_page .grid.grid-croix div:nth-child(2) {
		border-top: 0px;
    }
}

    .my_page .grid.grid-encarts > div {
		border:0px;
    }	
	
    .my_page .grid.grid-encarts.invisible > div {
		margin:0px;
		border:0px;
		background-color:transparent;
    }	

	.my_page .grid.invisible > div {
		padding:0px;
	}
	
	
	
	
/*---------------------------------- Bordure verticale au centre -------------------------------------*/ 		
@media (min-width: 640px) {
	.grid.grid-central-vertical-border div:nth-child(2n) {
	  border-left: 2px solid #000; /* Bordure verticale */
	  padding-left: 20px; /* Espacement à gauche */
	}
}
	
	
	
	

/*---------------------------------- Espacements -------------------------------------*/ 	
/*RETOUR A LA LIGNE FORCé*/
.my_page .force-br { line-height:0; }

.my_page break{
  flex-basis: 100%;
  width: 0px; 
  height: 0px; 
  overflow: hidden;
}

.my_page .flex-col-spacer { flex:0; display:none; background-color:violet;  }

@media (min-width: 1024px) {
.my_page .flex-container-center { flex:1; justify-content: center;  }
.my_page .flex-col-main { flex:2; }
.my_page .flex-col-aside { flex:1; }
}



@media (min-width: 1400px) {
.my_page .flex-col-spacer { flex:4; display:block;  }
.my_page .flex-container-center { flex:10;  }
.my_page .flex-col-main { flex:20; }
.my_page .flex-col-aside { flex:10; }
}





/*------------ PADDINGS -----------*/

	.my_page .padding {
		box-sizing:border-box !important;
	}
	
	.my_page .padding { box-sizing:border-box !important;}
	.my_page .padding-5 { padding:5px !important; }
	.my_page .padding-10 { padding:10px !important; }
	.my_page .padding-20 { padding:20px !important; }
	.my_page .padding-30 { padding:30px !important; }
	.my_page .padding-40 { padding:40px !important; }
	.my_page .padding-50 { padding:50px !important; }

.my_page .padding-top-5 { padding-top:5px !important; }
.my_page .padding-top-10 { padding-top:10px !important; }
.my_page .padding-top-20 { padding-top:20px !important; }
.my_page .padding-top-30 { padding-top:30px !important; }
.my_page .padding-top-40 { padding-top:40px !important; }
.my_page .padding-top-50 { padding-top:50px !important; }
.my_page .padding-top-100 { padding-top:100px !important; }

.my_page .padding-left-5 { padding-left:5px !important; }
.my_page .padding-left-10 { padding-left:10px !important; }
.my_page .padding-left-20 { padding-left:20px !important; }
.my_page .padding-left-30 { padding-left:30px !important; }
.my_page .padding-left-40 { padding-left:40px !important; }
.my_page .padding-left-50 { padding-left:50px !important; }
.my_page .padding-left-100 { padding-left:100px !important; }

.my_page .padding-bottom-5 { padding-bottom:5px !important; }
.my_page .padding-bottom-10 { padding-bottom:10px !important; }
.my_page .padding-bottom-20 { padding-bottom:20px !important; }
.my_page .padding-bottom-30 { padding-bottom:30px !important; }
.my_page .padding-bottom-40 { padding-bottom:40px !important; }
.my_page .padding-bottom-50 { padding-bottom:50px !important; }
.my_page .padding-bottom-100 { padding-bottom:100px !important; }

.my_page .padding-right-5 { padding-right:5px !important; }
.my_page .padding-right-10 { padding-right:10px !important; }
.my_page .padding-right-20 { padding-right:20px !important; }
.my_page .padding-right-30 { padding-right:30px !important; }
.my_page .padding-right-40 { padding-right:40px !important; }
.my_page .padding-right-50 { padding-right:50px !important; }
.my_page .padding-right-100 { padding-right:100px !important; }

	
	
.my_page .hpadding-10 { padding:0px 10px !important; }
.my_page .vpadding-10 { padding:10px 0px !important; }
.my_page .hpadding-20 { padding:0px 20px !important; }
.my_page .vpadding-20 { padding:20px 0px !important; }
.my_page .hpadding-30 { padding:0px 30px !important; }
.my_page .vpadding-40 { padding:40px 0px !important; }

.my_page .padding-responsive { padding:40px 20px !important; }
.my_page .hpadding-responsive { padding:0px 20px !important; }
.my_page .vpadding-responsive { padding:40px 0px !important; }

	



@media (min-width: 480px) {
	
	.my_page .padding-on-phablet {
		box-sizing:border-box !important;
		padding:30px !important;
	}
	
	.my_page .padding-responsive { padding:40px 30px !important; }
	.my_page .hpadding-responsive { padding:0px 30px !important; }
	.my_page .vpadding-responsive { padding:40px 0px !important; }
	
	.my_page .padding-responsive-on-phablet { padding:40px 30px !important; }
	.my_page .hpadding-responsive-on-phablet { padding:0px 30px !important; }
	.my_page .vpadding-responsive-on-phablet { padding:40px 0px !important; }
	
	.my_page .no-padding-on-phablet { padding:0px 0px 0px 0px !important;}
	.my_page .no-padding-bottom-on-phablet {padding-bottom:0px !important;}
	.my_page .no-padding-top-on-phablet {padding-top:0px !important;}
	.my_page .no-padding-left-on-phablet {padding-left:0px !important;}
	.my_page .no-padding-right-on-phablet {padding-right:0px !important;}
}


@media (min-width: 640px) {
	
	.my_page .padding-on-ipad {
		box-sizing:border-box !important;
		padding:20px !important;
	}
	
	.my_page .padding-responsive { padding:40px 40px !important; }
	.my_page .hpadding-responsive { padding:0px 40px !important; }
	.my_page .vpadding-responsive { padding:40px 0px !important; }
	
	.my_page .padding-responsive-on-phablet { padding:40px 40px !important; }
	.my_page .hpadding-responsive-on-phablet { padding:0px 40px !important; }
	.my_page .vpadding-responsive-on-phablet { padding:40px 0px !important; }
	
	.my_page .no-padding-on-ipad { padding:0px 0px 0px 0px !important;}
	.my_page .no-padding-bottom-on-ipad {padding-bottom:0px !important;}
	.my_page .no-padding-top-on-ipad {padding-top:0px !important;}
	.my_page .no-padding-left-on-ipad {padding-left:0px !important;}
	.my_page .no-padding-right-on-ipad {padding-right:0px !important;}
	
	.my_page .padding-special {	padding:4em !important; }
	.my_page .padding-special-top {	padding-top:4em !important; }
	.my_page .padding-special-bottom { padding-bottom:4em !important; }
	.my_page .padding-special-left { padding-left:4em !important; }
	.my_page .padding-special-right { padding-bottom:4em !important; }
	
	
}
	

@media (min-width: 768px) {
	
	.my_page .padding-on-tablet {
		box-sizing:border-box;
		padding:20px;
		box-sizing:border-box;
	}
	
	.my_page .padding-responsive { padding:50px 50px !important; }
	.my_page .hpadding-responsive { padding:0px 50px !important; }
	.my_page .vpadding-responsive { padding:50px 0px !important; }
	
	.my_page .padding-responsive-on-tablet { padding:50px 50px !important; }
	.my_page .hpadding-responsive-on-tablet { padding:0px 50px !important; }
	.my_page .vpadding-responsive-on-tablet { padding:50px 0px !important; }
	
	.my_page .no-padding-on-tablet { padding:0px 0px 0px 0px !important;}
	.my_page .no-padding-bottom-on-tablet {padding-bottom:0px !important;}
	.my_page .no-padding-top-on-tablet {padding-top:0px !important;}
	.my_page .no-padding-left-on-tablet {padding-left:0px !important;}
	.my_page .no-padding-right-on-tablet {padding-right:0px !important;}
	
}


@media (min-width: 1024px) {
	
	.my_page .padding-on-desktop {
		box-sizing:border-box;
		padding:20px;
		box-sizing:border-box;
	}
	
	.my_page .padding-responsive { padding:65px 65px !important; }
	.my_page .hpadding-responsive { padding:0px 65px !important; }
	.my_page .vpadding-responsive { padding:65px 0px !important; }
	
	.my_page .padding-responsive-on-desktop{ padding:65px 65px !important; }
	.my_page .hpadding-responsive-on-desktop { padding:0px 65px !important; }
	.my_page .vpadding-responsive-on-desktop { padding:65px 0px !important; }
	
	.my_page .no-padding-on-desktop { padding:0px 0px 0px 0px !important;}
	.my_page .no-padding-bottom-on-desktop {padding-bottom:0px !important;}
	.my_page .no-padding-top-on-desktop {padding-top:0px !important;}
	.my_page .no-padding-left-on-desktop {padding-left:0px !important;}
	.my_page .no-padding-right-on-desktop {padding-right:0px !important;}
	
}



@media (max-width: 480px) {
	.my_page .padding-5-on-mobile {
		padding:5px !important
	}	
	.my_page .padding-10-on-mobile {
		padding:10px !important
	}
	.my_page .padding-20-on-mobile {
		padding:20px !important
	}
	.my_page .padding-40-on-mobile {
		padding:40px !important
	}
	.my_page .no-padding-on-mobile {
		padding:0px !important
	}	
	.my_page .no-padding-left-on-mobile {
		padding-left:0px !important
	}		
	.my_page .no-padding-right-on-mobile {
		padding-right:0px !important
	}		
	.my_page .no-padding-top-on-mobile {
		padding-top:0px !important
	}		
	.my_page .no-padding-bottom-on-mobile {
		padding-bottom:0px !important
	}
}


@media only screen and (min-device-width: 481px) and (max-device-width: 1024px) {
	
	.my_page .padding-5-on-tablet {
		padding:5px !important
	}	
	.my_page .padding-10-on-tablet {
		padding:10px !important
	}
	.my_page .padding-20-on-tablet {
		padding:20px !important
	}
	.my_page .padding-40-on-tablet {
		padding:40px !important
	}
	.my_page .no-padding-on-tablet {
		padding:0px !important
	}	
	.my_page .no-padding-left-on-tablet {
		padding-left:0px !important
	}		
	.my_page .no-padding-right-on-tablet {
		padding-right:0px !important
	}		
	.my_page .no-padding-top-on-tablet {
		padding-top:0px !important
	}		
	.my_page .no-padding-bottom-on-tablet {
		padding-bottom:0px !important
	}
}







@media only screen and (min-device-width: 1025px) and (max-device-width: 1280px) {
	.my_page .padding-5-on-desktop {
		padding:5px !important
	}	
	.my_page .padding-10-on-desktop {
		padding:10px !important
	}
	.my_page .padding-20-on-desktop {
		padding:20px !important
	}
	.my_page .padding-40-on-desktop {
		padding:40px !important
	}
	.my_page .no-padding-on-desktop {
		padding:0px !important
	}	
	.my_page .no-padding-left-on-desktop {
		padding-left:0px !important
	}		
	.my_page .no-padding-right-on-desktop {
		padding-right:0px !important
	}		
	.my_page .no-padding-top-on-desktop {
		padding-top:0px !important
	}		
	.my_page .no-padding-bottom-on-desktop {
		padding-bottom:0px !important
	}
}


	.my_page .no-padding { padding:0px 0px 0px 0px !important;}
	.my_page .no-padding-bottom {padding-bottom:0px !important;}
	.my_page .no-padding-top {padding-top:0px !important;}
	.my_page .no-padding-left {padding-left:0px !important;}
	.my_page .no-padding-right {padding-right:0px !important;}


/*------------ / PADDINGS -----------*/

/*------------ MARGINS -----------*/


	.my_page .center-auto { margin:0px auto!important; display:block!important; float:none !important }

@media (min-width:480px) {
	.my_page .center-auto-on-phablet { margin:0px auto!important; display:block!important; }
}

@media (min-width:640px) {
	.my_page .center-auto-on-ipad { margin:0px auto!important; display:block!important; }
}

@media (min-width:768px) {
	.my_page .center-auto-on-tablet { margin:0px auto!important; display:block!important; }
}

@media (min-width:1024px) {
	.my_page .center-auto-on-desktop { margin:0px auto!important; display:block!important; }
}

@media (min-width:1280px) {
	.my_page .center-auto-on-desktop-xl { margin:0px auto!important; display:block!important; }
}

	.my_page .margin {
		margin:10px !important;
	}
	
.my_page .margin-top-5 { margin-top:5px !important; }
.my_page .margin-top-10 { margin-top:10px !important; }
.my_page .margin-top-20 { margin-top:20px !important; }
.my_page .margin-top-30 { margin-top:30px !important; }
.my_page .margin-top-40 { margin-top:40px !important; }
.my_page .margin-top-50 { margin-top:50px !important; }
.my_page .margin-top-100 { margin-top:100px !important; }

.my_page .margin-left-5 { margin-left:5px !important; }
.my_page .margin-left-10 { margin-left:10px !important; }
.my_page .margin-left-20 { margin-left:20px !important; }
.my_page .margin-left-30 { margin-left:30px !important; }
.my_page .margin-left-40 { margin-left:40px !important; }
.my_page .margin-left-50 { margin-left:50px !important; }
.my_page .margin-left-100 { margin-left:100px !important; }

.my_page .margin-bottom-5 { margin-bottom:5px !important; }
.my_page .margin-bottom-10 { margin-bottom:10px !important; }
.my_page .margin-bottom-20 { margin-bottom:20px !important; }
.my_page .margin-bottom-30 { margin-bottom:30px !important; }
.my_page .margin-bottom-40 { margin-bottom:40px !important; }
.my_page .margin-bottom-50 { margin-bottom:50px !important; }
.my_page .margin-bottom-100 { margin-bottom:100px !important; }

.my_page .margin-right-5 { margin-right:5px !important; }
.my_page .margin-right-10 { margin-right:10px !important; }
.my_page .margin-right-20 { margin-right:20px !important; }
.my_page .margin-right-30 { margin-right:30px !important; }
.my_page .margin-right-40 { margin-right:40px !important; }
.my_page .margin-right-50 { margin-right:50px !important; }
.my_page .margin-right-100 { margin-right:100px !important; }	


	.my_page .hmargin { margin:auto 10px !important; }
	.my_page .vmargin { margin:10px auto !important; }

	.my_page .margin-responsive { margin:20px 20px !important; }
	.my_page .hmargin-responsive { margin:auto 20px !important; }
	.my_page .vmargin-responsive { margin:20px auto !important; }
	

	
@media (min-width: 380px) {
	.my_page .margin {
		margin:20px;
	}
}


@media (min-width: 480px) {
	.my_page .margin-responsive { margin:30px 30px !important; }
	.my_page .hmargin-responsive { margin:auto 30px !important; }
	.my_page .vmargin-responsive { margin:20px auto !important; }
}
	
@media (min-width: 640px) {
	.my_page .margin-responsive { margin:40px 40px !important; }
	.my_page .hmargin-responsive { margin:auto 40px !important; }
	.my_page .vmargin-responsive { margin:25px auto !important; }
}

@media (min-width: 1024px) {
	.my_page .margin-responsive { margin:50px 50px !important; }
	.my_page .hmargin-responsive { margin:auto 50px !important; }
	.my_page .vmargin-responsive { margin:30px auto !important; }
}

@media (min-width: 1280px) {
	.my_page .margin-responsive { margin:60px 60px !important; }
	.my_page .hmargin-responsive { margin:auto 60px !important; }
	.my_page .vmargin-responsive { margin:35px auto !important; }
}

@media (min-width: 1700px) {
	.my_page .margin-responsive { margin:70px 70px !important; }
	.my_page .hmargin-responsive { margin:auto 70px !important; }
	.my_page .vmargin-responsive { margin:40px auto !important; }
}




@media (min-width: 640px) {
	.my_page .margin-special { margin:4em !important; }
	.my_page .margin-special-top { margin-top:4em !important; }
	.my_page .margin-special-bottom { margin-bottom:4em !important; }
	.my_page .margin-special-left {	margin-left:4em !important; }
	.my_page .margin-special-right { margin-bottom:4em !important;	}
}



@media (max-width: 480px) {
	.my_page .margin-5-on-mobile {
		margin:5px !important
	} 
	.my_page .margin-10-on-mobile {
		margin:10px !important
	}
	.my_page .margin-20-on-mobile {
		margin:20px !important
	}
	.my_page .margin-40-on-mobile {
		margin:40px !important
	}
	.my_page .no-margin-on-mobile {
		margin:0px !important
	} 
	.my_page .no-margin-left-on-mobile {
		margin-left:0px !important
	} 	
	.my_page .no-margin-right-on-mobile {
		margin-right:0px !important
	} 	
	.my_page .no-margin-top-on-mobile {
		margin-top:0px !important
	} 	
	.my_page .no-margin-bottom-on-mobile {
		margin-bottom:0px !important
	}
}


@media (min-width: 768px) {
	.my_page .margin-5-on-tablet {
		margin:5px !important
	} 
	.my_page .margin-10-on-tablet {
		margin:10px !important
	}
	.my_page .margin-20-on-tablet {
		margin:20px !important
	}
	.my_page .margin-40-on-tablet {
		margin:40px !important
	}
	.my_page .no-margin-on-tablet {
		margin:0px !important
	} 
	.my_page .no-margin-left-on-tablet {
		margin-left:0px !important
	} 	
	.my_page .no-margin-right-on-tablet {
		margin-right:0px !important
	} 	
	.my_page .no-margin-top-on-tablet {
		margin-top:0px !important
	} 	
	.my_page .no-margin-bottom-on-tablet {
		margin-bottom:0px !important
	}
}

@media (min-width: 1024px) {
	.my_page .margin-5-on-desktop {
		margin:5px !important
	} 
	.my_page .margin-10-on-desktop {
		margin:10px !important
	}
	.my_page .margin-20-on-desktop {
		margin:20px !important
	}
	.my_page .margin-40-on-desktop {
		margin:40px !important
	}
	.my_page .no-margin-on-desktop {
		margin:0px !important
	} 
	.my_page .no-margin-left-on-desktop {
		margin-left:0px !important
	} 	
	.my_page .no-margin-right-on-desktop {
		margin-right:0px !important
	} 	
	.my_page .no-margin-top-on-desktop {
		margin-top:0px !important
	} 	
	.my_page .no-margin-bottom-on-desktop {
		margin-bottom:0px !important
	}
}




	.my_page .no-margin { margin:0px 0px 0px 0px !important;}
	.my_page .no-margin-bottom {margin-bottom:0px !important;}
	.my_page .no-margin-top {margin-top:0px !important;}
	.my_page .no-margin-left {margin-left:0px !important;}
	.my_page .no-margin-right {margin-right:0px !important;}
	

/*------------ /MARGINS -----------*/




/*------------ Fonts size spéciales -----------*/
	.my_page .small { font-size: small; }
	.my_page .smaller {font-size:1rem}
	.my_page .bigger {font-size:1.2rem}
	.my_page .smaller {
		font-size:0.6em;
		display:block;
		margin-top:0.5em;
		line-height:1.4em;
	}
	.my_page .xx-smaller {
		font-size:0.5em;
		display:block;
		margin-top:0.5em;
		line-height:1em;
	}	

/*------------ ALIGNEMENTS -----------*/
	.my_page .text-center { text-align:center !important; }
	.my_page .text-left { text-align:left !important; }
	.my_page .text-right { text-align:right !important; }
	.my_page .margin-reset { margin:0px 0px 0px 0px !important; }
	.my_page .vertical-align-middle { vertical-align: middle; }

	
	
@media (max-width:480px) {
	.my_page .text-left-on-mobile { text-align:left !important; }

}



@media (max-width: 640px) {
.my_page .text-center-on-mobile { text-align:center !important; }
}
.my_page .bold { font-weight:bold }
.my_page .lighter { font-weight:lighter }

.my_page .pull-left { float:left; }
.my_page .pull-right { float:right; }

@media (max-width:480px) {
	.my_page .no-float-on-mobile { float:none !important; }

}


.my_page .separ {
			clear:both;
			border:0px; margin:0px;
			padding:0px;
			background-color:none;
			height:0;
}

.my_page .clear {
			clear:both;
			border:0px; margin:0px;
			padding:0px;
			background-color:none;
			height:0;
}


.my_page .texte-noir, .texte-noir h1, .texte-noir, h2.texte-noir, h3.texte-noir, h4.texte-noir, h5.texte-noir, h6.texte-noir { color:#000000;}

.my_page .reserve, h1.reserve, h2.reserve, h3.reserve, h4.reserve, h5.reserve, h6.reserve , a.reserve, p.reserve, span.reserve , .reserve *, .reserve h1, .reserve h2, .reserve h3, .reserve h4, .reserve h5, .reserve h6, .reserve a, .reserve p,.reserve a, .reserve span  { color:#ffffff!important;}


.my_page .align-left { text-align:left; }

.my_page .italic { font-style:italic; }


.my_page .block { display:block!important; vertical-align:top; line-height:100%; }
.my_page .inline { display:inline!important; vertical-align:top; }
.my_page .inline-block { display:inline-block!important; vertical-align:top; }

.my_page ul.inline-block-list li { display:inline-block!important }






.my_page .relative {
	position:relative!important;
}

.my_page .small { font-size:small }

.my_page .hide { display:none }

.my_page .strong { font-weight:900; }
.my_page .italic { font-style:italic; }
.my_page .uppercase { text-transform:uppercase }

.my_page .no-borders { border:0px!important;}
.my_page .no-borders a { border:0px!important;}



/* Esthétique */

	.border-radius {
		border-radius:30px;
	}
@media (max-width:480px) {
	.no-border-radius-on-mobile {
		border-radius:0px !important;
	}
}




/*---------------------------------- Balises texte spéciales -------------------------------------*/


.my_page sup, .my_page sub {
	font-size:0.7em !important;
}
		
.my_page ul {
	margin:0px;
	padding:0px;
}	

.my_page li {
	list-style-type:none;
	font-family:inherit;
}

		
.my_page ol.classic  {
	counter-reset: repas;/* on initialise et nomme un compteur */
	padding-left:0;
}
	
.my_page ol.classic li {
	list-style-type: none;
	counter-increment: repas; /* on incrémente le compteur à chaque nouveau li */
	margin-bottom: 15px;
	padding:0px 0 0 28px;
	position:relative;
}

.my_page ol.classic li::before {
  content: counter(repas);
  color: #000;
  font-size: 2.8rem;
  left: -7px;
  margin-right: 8px;
  padding: 2px 0px;
  position: absolute;
  top: 0px;
  vertical-align: top;
  font-family: 'Outfit ExtraLight';
}




/*---------------------------------- / Balises texte spéciales -------------------------------------*/



/*---------------------------------- Effet graphiques -------------------------------------*/

/*----- Titre avec filets latéraux -----*/
.my_page .titre-filet .titre {
	display: flex;
	width: 100%;
	justify-content: center;
	align-items: center;
	text-align: center;
	margin-bottom: 40px;
	text-transform:uppercase;
}

.my_page .titre-filet .titre:before,
.my_page .titre-filet .titre:after {
    content: '';
    border-top: 2px solid #00815d;
    margin: 5px 20px 0 0;
    flex: 1 0 20px;
	width:100%;
}

.my_page .titre-filet .titre:after {
  margin: 5px 0 0 20px;
}
/*----- /Titre avec filets latéraux -----*/




/*----- Titre avec filet dessus ou dessous -----*/
	.my_page .filet {
		display:block;
		position:relative;		
	}

	.my_page .filet-left {
		text-align:left;	
	}
	
	.my_page .filet-right {
		text-align:right;	
	}	
	.my_page .filet-top:before , .filet-bottom:after {
		content:" ";
		display: block;
		height: 1px;
		width: 30%;
	}
	
	.my_page .filet-top:before {
		vertical-align:top;
		background: #00815D;
		margin:auto auto 5% 0px;
	}
	
	.my_page .filet-bottom:after {
		vertical-align:bottom;
		background: #00815D;
		margin:5% auto auto 0px;
	}
	
	.my_page .filet-center:before, .my_page .filet-center:after  {
		margin:20px auto;
	}
	
/*----- /Titre avec filet dessus ou dessous -----*/	

/*----- Titre avec bordure côté -----*/
	.my_page .bordure-cote {
		display:block;
		position:relative;		
	}
	.my_page .bordure-cote-droit {
		padding-left:20px;
	}
	.my_page .bordure-cote-droit:before {
		content: '';
		background: #00D639;
		color: white;
		width: 7px;
		height: 100%;
		display: inline-block;
		position:absolute;
		left:0px;
		border-radius:30px;
	}
/*----- /Titre avec bordure côté -----*/	


/*----- Séparation -----*/	
	.filet-separ:after {
		content:'';
		width:30%;
		height:3px;
		background-color:#1E1D30;
		border-radius:60px;
		display:block;
		margin:20px auto;
	}

/*----- Rotation 90 degrés -----*/	
	.container-rotation-90 {
	  display: flex;
	  position:relative;
	}
 
	.rotation-90 {
		writing-mode: sideways-lr;
		text-align: right;
		max-width: 20px;
	}
	
	.rotation-90 h3 {
		margin-left:0px;
		min-height:200px;
	}	
	
/*----- /Rotation 90 degrés -----*/	



	.titre-indicatif { color:red; text-transform:uppercase; margin:20px auto !important; text-align:center; display:block; width:100%; }





/*-------------------------------------- FORMULAIRE-------------------------------*/


/*Généralités*/

	/*Fond des champs iput après auto remplissage : astuce pour garder un background transparent au lieu du fond blanc généré par le navigateur */
	input:-internal-autofill,
	input:-internal-autofill-selected,
	input:-internal-autofill-focus,
	input:-internal-autofill-hover,
	input:-internal-autofill-active,
	input:-webkit-autofill,
	input:-webkit-autofill:selected,
	input:-webkit-autofill:focus,
	input:-webkit-autofill:hover,
	input:-webkit-autofill:active {
		transition: background-color 0s 600000s, color 0s 600000s !important;
		background:transparent !important;
	}


	/*Inline-block*/
		.my_page .inline-block label, .my_page .inline-block input {
			display:inline-block;
		}



	/*Labels*/

		/*Couleur par défaut*/
		.my_page label {
			display:inline-block;
			text-align:left;
			color:#1d1d1b;
			vertical-align:top;
		}
		/*Couleur reserve*/
		.my_page label.reserve {
			color:#ffffff;
		}	
		
		.my_page label.inline-block { display:inline-block; margin-bottom:10px }
		
		/*label survolé*/
		.my_page label:hover {
			color:#573fd9!important;
		}

		/*label cliqué*/
		.my_page label:focus {
			color:#573fd9!important;
		}

		/*label actif*/
		.my_page label:active {
			color:#573fd9!important;
		}

		/*Labels fond réserve*/
		.my_page .reserve label, .my_page label.reserve {
			color:#ffffff;
		}		
		.my_page .reserve label:hover, .my_page label.reserve:hover {
			color:#ffffff!important;
		}
		.my_page .reserve label:focus, .my_page label.reserve:focus {
			color:#ffffff!important;
		}
		.my_page .reserve label:active, .my_page label.reserve:active {
			color:#ffffff!important;
		}
		
		.my_page li * { font-size:inherit }

	/*Questions supplémentaires*/	

		.my_page .q_sup {
			margin:0px;
			background-color:#eeeeee;
			border-radius : 5px;
			-moz-border-radius: 5px;
			-webkit-border-radius : 5px;
			position:relative;
		}
		
		.my_page .q_sup.padding { padding:10px}
		
		.my_page .q_sup input {
			margin: 4px 5px 0px 0px;
			position:absolute;
			left:6px;
		}
		.my_page .q_sup label {
			margin-right:10px;
			position:relative;
			display:inline-block;
		}/*Couleur par défaut*/
		.my_page .star {
			display:block;
			position:absolute;
			right:10px;
			top:10px;
			color:#000000
		}



	
	
	/*Champs liste déroulante input text et textarea */
		.form-row { padding:0px 15px; }

		/*Couleur générale des champs*/
		.my_page input[type="text"], .my_page textarea, .my_page option, .my_page select {
			margin:0px 0px 0px -1px;
			padding-left:5px;
			border:none;
			border-bottom:1px solid #1d1d1b;
			color:#1d1d1b !important;
			outline: 0;
			width: 100%;
			background-color:transparent !important;
			position:relative;
			height:35px;
			-moz-box-sizing: border-box;
			-webkit-box-sizing: border-box;
			box-sizing: border-box;
			font-family:inherit;
			font-size:0.8rem;
		}
		
		/*Couleur du titre de la liste déroulante*/
		.my_page select {
			color:#1d1d1b !important;
			padding:0px 10px !important;
		}
		
		
		/*Couleur des options de la liste déroulante */
		.my_page option {
			color:#000000 !important;
		}

		.my_page select {
			border-left: 0px;
			border-right: 0px;	
			border-top: 0px;
			padding-left:0px;
		}		
		
		
		/*Couleur reserve*/
		.my_page .reserve input[type="text"], .my_page .reserve option, .my_page .reserve select {
			border-bottom:1px solid #ffffff;
		}
		
		.my_page .reserve textarea {
			border:1px solid #ffffff !important;
		}
		
		.my_page #conteneur-form input[type="text"], .my_page #conteneur-form select {
			height:35px !important;
		}	
		

		
		.my_page .reserve input[type="text"], .my_page .reserve textarea, .my_page .reserve option, .my_page .reserve select{
			color:#ffffff !important;
		}
	
	/*Commentaires*/		
		.my_page textarea {
			min-height:150px;
			padding:10px 
		}
			
		.my_page label[for="id_commentaires"] {
			margin:10px 0px 10px 5px;
			font-style:italic;
		}

	/*Select customisé*/
	
	

		.my_page .select-custom {
		  position: relative;
		  display: inline-block;
		  width: 100%;
		  padding:0px 15px;
		}
		.my_page .select-custom select {
		  display: inline-block;
		  width: 100%;
		  cursor: pointer;
		  outline: 0;
		  color: #1d1d1b;
		  -webkit-appearance: none;
			 -moz-appearance: none;
				  appearance: none;
		}
		
		/*Couleur reserve*/
		.my_page .login-box.reserve .select-custom select {
		  color: #ffffff;
		}

		.my_page .select-custom select::-ms-expand {
		  display: none;
		}
		.my_page .select-custom select:hover, .my_page .select-custom select:focus {
		  background: transparent;
		}
		.my_page .select-custom select:disabled {
		  opacity: 0.5;
		  pointer-events: none;
		}
		
		
		/*Fleche de liste déroulante*/
		.my_page .select-custom:after {
		  content: "\25BC";
		  position: absolute;
		  top: 0;
		  right: 10px;
		  font-size: 70%;
		  width: 30px;
		  text-align: center;
		  padding-top: 12px;
		  padding-bottom: 10px;
		  pointer-events: none;
		  color: #1d1d1b;
		}
		
		
		/*Couleur reserve*/
		.my_page .login-box.reserve .select-custom:after {
		  color: #ffffff !important;
		}
		
		.my_page .select-custom option { color:#1d1d1b}
		
		.my_page .select-custom option:first-child { display:none;}
		
		.my_page .select-custom select .titre { padding-bottom:-10px;}
				


	 /*Bouton valider TXT */
		.my_page .btn {
			font-variant-ligatures: none !important;
			display:inline-block !important;
			width: 100% !important;
			margin:0px auto !important;
			background-repeat: no-repeat !important;
			overflow: hidden !important;
			cursor: pointer !important;
			position: relative !important;
			box-sizing: border-box !important;
			font-weight: bold !important;
			padding: 20px 20px !important;
			text-align: center !important;
			margin: 0px auto !important;
			border:0px !important;
			max-width:320px !important;
			margin-top: 20px !important;
			margin-bottom:0px !important;
			border-radius: 15px !important;
			background-color: #ffffff !important;
			color:#0F172A !important;
			font-size: clamp(1rem, 2vw, 1.125rem);
		}

		.my_page .btn .submit-btn {
			border: 0px;
			width: 100%;
			position: absolute;
			left: 0px;
			top: 0px;
			bottom: 0px;
			padding: 0px;
			z-index: 2;
			cursor: pointer;
			background-color: #ffffff !important;
			color: #1E1E2F;
		}

		.my_page .btn:hover {
			cursor: pointer;
			background-color: #0F172A !important;
			color:#ffffff!important;
		}
		





		.my_page .select-custom::after
		{
			content: "\25BC";
			position: absolute;
			top: 0;
			right: 10px;
			font-size: 70%;
			width: 30px;
			text-align: center;
			padding-top: 12px;
			padding-bottom: 10px;
			pointer-events: none;
			color: #1d1d1b;
		}	


		
		/*Formulaire input animé*/
		.my_page .login-box .user-box {
			position: relative;
			box-sizing:border-box;
		}
		/*Formulaire input entrain d'etre rempli et personnalisé*/
		.my_page .login-box .user-box input {
			width: 100%;
			padding:0px 10px;
			margin-bottom: 15px;
			border: none;
			border-bottom: 1px solid #1d1d1b;
			outline: none;
			background: transparent;
		}


		/*Formulaire input non rempli, label au sein du champs*/	
		.my_page .login-box .user-box label {
			position: absolute;
			top:-12px;
			left: 20px;
			padding: 20px 0;
			color: #1d1d1b;
			pointer-events: none;
			transition: .5s;
			margin-left:0px;
		}
		
		/*Couleur Reserve*/
		.my_page .login-box .user-box label.reserve {
			color: #ffffff;
		}	
		
		
		
		/*Formulaire input rempli, label au dessus du champs*/	
		.my_page .login-box .user-box input:focus ~ label,
		.my_page .login-box .user-box input:valid ~ label {
			top: -30px;
			left: 20px;
			color: #1d1d1d;
			font-size:0.7em;
		}
		
		
		
		
		
		/*Checkbox et radio*/

		.my_page :root {
		 --primary-color:#00e14b;
		 --secondary-color:hsl(217, 15%, 83%);
		 --success-color:hsl(165, 58%, 55%);
		 --info-color:hsl(214, 79%, 65%);
		 --warning-color:hsl(43, 100%, 66%);
		 --danger-color:hsl(354, 81%, 63%);
		 --primary-color-darker:hsl(196, 68%, 54%);
		 --secondary-color-darker:hsl(215, 13%, 70%);
		 --success-color-darker:hsl(165, 55%, 48%);
		 --info-color-darker:hsl(214, 68%, 58%);
		 --warning-color-darker:hsl(39, 97%, 62%);
		 --danger-color-darker:hsl(354, 67%, 56%);
		 --primary-color-lighter:hsl(196, 78%, 81%);
		 --secondary-color-lighter:hsl(214, 16%, 92%);
		 --success-color-lighter:hsl(165, 58%, 75%);
		 --info-color-lighter:hsl(214, 79%, 85%);
		 --warning-color-lighter:hsl(43, 100%, 86%);
		 --danger-color-lighter:hsl(354, 81%, 83%);
		 --secondary-color-darkest:hsl(215, 11%, 30%);
		 --secondary-color-lightest:hsl(220, 1%, 98%);
		 --ease-in-quad:cubic-bezier(0.55, 0.085, 0.68, 0.53);
		 --ease-in-cubic:cubic-bezier(0.55, 0.055, 0.675, 0.19);
		 --ease-in-quart:cubic-bezier(0.895, 0.03, 0.685, 0.22);
		 --ease-in-quint:cubic-bezier(0.755, 0.05, 0.855, 0.06);
		 --ease-in-expo:cubic-bezier(0.95, 0.05, 0.795, 0.035);
		 --ease-in-circ:cubic-bezier(0.6, 0.04, 0.98, 0.335);
		 --ease-out-quad:cubic-bezier(0.25, 0.46, 0.45, 0.94);
		 --ease-out-cubic:cubic-bezier(0.215, 0.61, 0.355, 1);
		 --ease-out-quart:cubic-bezier(0.165, 0.84, 0.44, 1);
		 --ease-out-quint:cubic-bezier(0.23, 1, 0.32, 1);
		 --ease-out-expo:cubic-bezier(0.19, 1, 0.22, 1);
		 --ease-out-circ:cubic-bezier(0.075, 0.82, 0.165, 1);
		 --ease-in-out-quad:cubic-bezier(0.455, 0.03, 0.515, 0.955);
		 --ease-in-out-cubic:cubic-bezier(0.645, 0.045, 0.355, 1);
		 --ease-in-out-quart:cubic-bezier(0.77, 0, 0.175, 1);
		 --ease-in-out-quint:cubic-bezier(0.86, 0, 0.07, 1);
		 --ease-in-out-expo:cubic-bezier(1, 0, 0, 1);
		 --ease-in-out-circ:cubic-bezier(0.785, 0.135, 0.15, 0.86)
		}

		.my_page input[type=checkbox],
		.my_page input[type=radio] {
		 margin:0;
		 cursor:pointer
		}

		.my_page input,
		.my_page select,
		.my_page textarea {
		 outline:0;
		 -webkit-appearance:none;
		 -moz-appearance:none;
		 appearance:none
		}

		@-webkit-keyframes scale-in {
		 from {
		  transform:scale(0)
		 }
		 to {
		  transform:scale(1)
		 }
		}

		.my_page .form-check { position:relative; padding-left:15px; margin-left:15px; }

		.my_page .form-check-input[type=checkbox] {
		 --checkbox-width:1.8rem;
		 --checkbox-bg:white;
		 --checkbox-radius:4px;
		 --checkbox-border-color:var(--secondary-color);
		 --checkbox-hover-border-color:var(--secondary-color-darker);
		 --checkbox-checked-bg:var(--primary-color);
		 --checkbox-disabled-bg:var(--secondary-color-lighter);
		 --checkbox-disabled-checked-bg:var(--secondary-color-darker);
		 width:var(--checkbox-width);
		 height:var(--checkbox-width);
		 position:relative;
		 background:var(--checkbox-checked-bg);
		 border:none;
		 border-radius:var(--checkbox-radius);
		 transition:.3s;
		 position:absolute;
		 left:0px;
		}
		.my_page .form-check-input[type=checkbox]~.form-check-label {
		 margin-left:1.5rem;
		 cursor:pointer;
		 transition:.3s
		}
		.my_page .form-check-input[type=checkbox]::before {
		 position:absolute;
		 content:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18px' height='18px' fill='none' stroke-width='2px' stroke='white' stroke-linecap='round' viewBox='0 0 21 21'%3E%3Cpolyline points='5 10.75 8.5 14.25 16 6'%3E%3C/polyline%3E%3C/svg%3E");
		 transform:scale(0)
		}
		.my_page .form-check-input[type=checkbox]::after {
		 position:absolute;
		 top:0;
		 left:0;
		 width:100%;
		 height:100%;
		 content:"";
		 background:var(--checkbox-bg);
		 border-radius:inherit;
		 box-shadow:inset 0 0 0 1px var(--checkbox-border-color);
		 transition:.2s
		}
		.my_page .form-check-input[type=checkbox]:hover {
		 --checkbox-border-color:var(--checkbox-hover-border-color)
		}
		.my_page .form-check-input[type=checkbox]:checked::before {
		 -webkit-animation:scale-in .1s .2s linear forwards;
		 animation:scale-in .1s .2s linear forwards
		}
		.my_page .form-check-input[type=checkbox]:checked::after {
		 transform:scale(0)
		}
		.my_page .form-check-input[type=checkbox]:disabled {
		 --checkbox-bg:var(--checkbox-disabled-bg);
		 --checkbox-checked-bg:var(--checkbox-disabled-checked-bg);
		 cursor:not-allowed
		}
		.my_page .form-check-input[type=checkbox]:disabled~.form-check-label {
		 cursor:not-allowed
		}
		.my_page .form-check-input[type=checkbox]:indeterminate::after {
		 transform:scale(.5)
		}
		.my_page .form-check-input[type=radio] {
		 --radio-width:1.125rem;
		 --radio-bg:white;
		 --radio-radius:50%;
		 --radio-border-color:var(--secondary-color);
		 --radio-hover-border-color:var(--secondary-color-darker);
		 --radio-checked-bg:var(--primary-color);
		 --radio-disabled-bg:var(--secondary-color-lighter);
		 --radio-disabled-checked-bg:var(--secondary-color-darker);
		 width:var(--radio-width);
		 height:var(--radio-width);
		 position:relative;
		 background:var(--radio-checked-bg);
		 border:none;
		 border-radius:var(--radio-radius);
		 transition:.3s
		}
		.my_page .form-check-input[type=radio]~.form-check-label {
		 margin-left:.625rem;
		 cursor:pointer;
		 transition:.3s
		}
		.my_page .form-check-input[type=radio]::after,
		.my_page .form-check-input[type=radio]::before {
		 position:absolute;
		 top:0;
		 left:0;
		 width:100%;
		 height:100%;
		 content:"";
		 background:var(--radio-bg);
		 border-radius:inherit
		}
		.my_page .form-check-input[type=radio]::before {
		 transform:scale(0)
		}
		.my_page .form-check-input[type=radio]::after {
		 box-shadow:inset 0 0 0 1px var(--radio-border-color);
		 transition:.2s
		}
		.my_page .form-check-input[type=radio]:hover {
		 --radio-border-color:var(--radio-hover-border-color)
		}
		.my_page .form-check-input[type=radio]:checked::before {
		 -webkit-animation:scale-in-smaller .1s .2s linear forwards;
		 animation:scale-in-smaller .1s .2s linear forwards
		}
		.my_page .form-check-input[type=radio]:checked::after {
		 transform:scale(0)
		}
		.my_page .form-check-input[type=radio]:disabled {
		 --radio-bg:var(--radio-disabled-bg);
		 --radio-checked-bg:var(--radio-disabled-checked-bg);
		 cursor:not-allowed
		}
		.my_page .form-check-input[type=radio]:disabled~.form-check-label {
		 cursor:not-allowed
		}
		/*Fin Checkbox et Radio*/
		
		
		
		
		/*Input type radio*/
		.my_page input[type="radio"] {
			-webkit-appearance: none;
			-moz-appearance: none;
			appearance: none;

			border-radius: 50%;
			width: 16px;
			height: 16px;

			border: 8px solid #ffffff;
			transition: 0.2s all linear;
			margin-right: 5px;

			position: relative;
			margin-top:2px;
		}

		.my_page input[type="radio"]:checked {
			border: 5px solid #00DC00;
			background: #ffffff;
		}		
		/* / Input type radio */		
		
		
		
			
		
		.my_page #conteneur-form input[type="text"], .my_page #conteneur-form select {
			height:35px !important;
		}	
		

		.my_page select {
			border-left: 0px;
			border-right: 0px;	
			border-top: 0px;
			padding-left:0px;
		}		
			
			
			
			
		
		
/*----------------------------------- COULEURS DES CHAMPS & LABELS ----------------------------------------*/		
		

		
		/*COULEURS SPECIALES*/

		/*.my_page input[type="text"], .my_page textarea, .my_page option, .my_page select {
			border-bottom:1px solid green;
			color:green !important;
		}
		
		/*Couleur du titre de la liste déroulante*/
		/*.my_page select {
			color:green !important;
		}
		
		.my_page .select-custom::after
		{
			color: green !important;
		}			
		
		/*Couleur des options de la liste déroulante */
		/*.my_page option {
			color:#1d1d1b !important;
		}
		
		/*Formulaire input non rempli*/		
		/*.my_page .login-box .user-box label {
		  color: green !important;
		}		
		/*Formulaire input rempli animé*/
		/*.my_page .login-box .user-box input {
		  color: red !important;
		  border-bottom: 1px solid green !important;
		}
		
		
	

		
		/*COULEURS RESERVE*/
		
		.my_page .login-box.reserve input[type="text"], .my_page textarea.reserve, .my_page .login-box.reserve select {
			border-bottom:1px solid #ffffff;
			color: #ffffff !important;
		}

				
		
		.my_page .login-box.reserve .user-box input, .my_page .login-box .user-box input.reserve {
			border-bottom: 1px solid #ffffff !important;
		}
				
				
		.my_page .login-box.reserve .user-box label , .my_page .login-box .user-box label.reserve {
			color: #ffffff !important;
		}


		.my_page .login-box .user-box input.reserve {
			color: #ffffff !important;
		}		
		
		
	
/*----------------------------------- / COULEURS DES CHAMPS & LABELS ----------------------------------------*/
			
			
			
			
			
			
			
			
			
			
			
			
			
			
			
/*-------------------------------------- / FORMULAIRE-------------------------------*/


/*-------------------------------------- FORMULAIRE CONTENEURS SPECIFIQUES -------------------------------*/
		
/*-- FORMULAIRE : CONTENEURS --*/	
	@media (min-width:1024px) {
		.my_page .sticky {
			position:sticky;
			top:0;
			align-self: flex-start;
			max-height: 100vh;
			overflow-y: visible;
		}
	}
			
		.my_page #top_form {
			position: relative;
			margin-bottom:20px;
		}
		
		
		/*
		#top_form:after {
			content: url("https://dummyimage.com/35x35/aaa/fff");
			position: relative;
			z-index: 3;
			margin: 0px auto;
			bottom:-45px;
			animation: bounce 2s ease infinite;		
		}
		
		
		
		@keyframes bounce{
			 from {bottom: -45px;}
			 50%  {bottom: -35px;}
			 to   {bottom: -45px;}
		}
		*/	


		.my_page #top_form h2 {
			color:#1d1d1b;
			font-weight:bold;
		}

		.my_page #top_form img { margin-top: 15px; margin-bottom:0px }

		.my_page #mentions-form { margin:10px 0px }
			

/*-------------------------------------- /FORMULAIRE CONTENEURS SPECIFIQUES -------------------------------*/


/*-------------------------------------- MENTIONS DIFFUSEUR -------------------------------*/

		#mentions-diffuseur { padding-top:100px; padding-bottom:100px; }

/*-------------------------------------- / MENTIONS DIFFUSEUR -------------------------------*/


/*-------------------------------------- SPECIAL -------------------------------*/

		/* Titre div incliné */
		.incline {
		  position: relative;
		  padding: 20px 10px 20px 20px;
		  background: #00815D;
		  overflow: visible;
		  z-index: 1;
		}

		/* where the magic happens */
		.incline:after {
		  content: '';
		  width: 100%;
		  height: 100%;
		  position: absolute;
		  background: inherit;
		  z-index: -1;
		  bottom: 0;
		  transform-origin: left bottom;
		  transform: skewX(-10deg);
		}


	/* Chiffres clés */
		.chiffre .h1 {
			font-size:4.5rem;
		}
	@media (min-width: 1024px) {
		.chiffre .h1 {
			font-size:5rem;
		}	
	}
		.h1 sup { font-size:60%; color:inherit;}
		
		
		
	/*Encadre*/
		
		.encadre {
			border:5px solid #a2b1ac;
		}

	/*Header absolute*/
		
		.header-absolute {
			width:100%;
			padding:20px;
		}
		

	@media screen and (min-width: 640px) {
		.header-absolute {
			position:absolute;
			top:0px;
			left:0px;
		}	
	}
/*-------------------------------------- /SPECIAL -------------------------------*/


/*-------------------------------------- ID'S -------------------------------*/

	#merci .my_container { max-width:350px }

	@media screen and (min-width: 640px) {
		#merci .my_container { max-width:1000px }	
	}

/*-------------------------------------- /ID'S -------------------------------*/

/*--------------------------------------------------------------------------------------*/
/*----------------------------------- / FIN BLOCS STATIQUES ET LANDING PAGE PERSONNALISEES ------------------------*/
/*--------------------------------------------------------------------------------------*/