@charset "utf-8";
/* CSS Document */


html{line-height:1.5;-webkit-text-size-adjust:100%}body{margin:0}main{display:block}h1{font-size:2em;margin:.67em 0}hr{box-sizing:content-box;height:0;overflow:visible}pre{font-family:monospace,monospace;font-size:1em}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace,monospace;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.2;margin:0}button,input{overflow:visible}button,select{text-transform:none}[type=button],[type=resetimg.fluid {
	width: 100%;
	height: auto;
}],[type=submit],button{-webkit-appearance:button}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring,button:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:.35em .75em .625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}

*
{
	box-sizing: border-box;
}

html, body {
	height: 100%;
	width: 100%;
}

body {
	font-family: Verdana;
	/* 15(320) to 16(1920) */
	font-size: clamp(0.9375rem, 0.925rem + 0.0625vw, 1rem);
	overflow-x: hidden;
}

img.fluid {
	width: 100%;
	height: auto;
}

.ws-nowarp {
  white-space: nowrap;
}

.ta-cntr {
	text-align: center;
}

.ff-georgia {
	font-family: Georgia;
}

/* ------------------------------------------------------------------------------ */
/* -------------------------- MESSAGE FLASH ----------------------- */

.supflash 
{
	display: none;
}

#supflash-0:checked ~ .alert-0
{
	display: none;
}

#supflash-1:checked ~ .alert-1
{
	display: none;
}

#supflash-2:checked ~ .alert-2
{
	display: none;
}

.lblsupflash
{
	display: block;
	cursor: pointer;
}

.sg1
{
	width: 100%;
}

.sg2
{
	font-size: 20px;
	width: 24px;
	border-radius: 50px;
}

.popup {
	display: flex;
	flex-direction: column;
	/*row-gap: 0.75rem;*/

	background-color: var(--main-color-orange);
}

.alert-message {

	text-align:center;
	word-wrap: break-word;

	display: flex;
	justify-content: space-around;
	align-items: center;
	column-gap: 20px;

 	min-height: 58px;

  box-shadow: 0px 0px 5px 1px rgba(0, 0, 0, 0.5);

  padding: 1rem;
  margin: 1rem;
  border: 1px solid transparent;
  border-radius: 0.25rem;

}

.alert-message:last-of-type {
	/*margin-bottom: 1rem;*/
}



.alert-success
{
	color: #155724;
  background-color: #d4edda;
  border-color: #c3e6cb;
}

.alert-info
{
	color: #0c5460;
  background-color: #d1ecf1;
  border-color: #bee5eb;
}

.alert-warning
{
	color: #856404;
  background-color: #fff3cd;
  border-color: #ffeeba;
}


.alert-danger
{
	color: #721c24;
  background-color: #f8d7da;
  border-color: #f5c6cb;
}

.alert-link
{
	font-weight: 600;
}

.alert-success .alert-link 
{
  color: #155724;
}

.alert-info .alert-link 
{
  color: #0c5460;
}

.alert-warning .alert-link 
{
  color: #856404;
}

.alert-danger .alert-link 
{
  color: #721c24;
}




/* ------------------------------------------------------------------------------ */
/* -----------------------------MESSAGE JAVASCRIPT PAS ACTIVé --------------------*/

.no_javascript
{
	min-height:35px;
	line-height:35px;
	margin-bottom:10px;
	text-align:center;
	background-color:#FFFCBF;
	word-wrap: break-word;
}



/* -------------------------------------------------------------- */
/* -----------------------------  ------------------------- */


:root {

	/*--main-c1-r: 32;
	--main-c1-g: 42;
	--main-c1-b: 131;
	--main-color-blue: rgba(var(--main-c1-r), var(--main-c1-g), var(--main-c1-b), 1);
	--main-color-blue-50: rgba(var(--main-c1-r), var(--main-c1-g), var(--main-c1-b), 0.8);*/
	/*#202a83*/

	--main-c1-r: 23;
	--main-c1-g: 41;
	--main-c1-b: 131;
	--main-color-blue: rgba(var(--main-c1-r), var(--main-c1-g), var(--main-c1-b), 1);
	--main-color-blue-50: rgba(var(--main-c1-r), var(--main-c1-g), var(--main-c1-b), 0.5);
	/*#172983*/

	--main-c2-r: 131;
	--main-c2-g: 113;
	--main-c2-b: 23;
	--main-color-gold: rgba(var(--main-c2-r), var(--main-c2-g), var(--main-c2-b), 1);
	/*#837117*/



	/* 18(320) to 20(1920) */
	--main-fs:  clamp(1rem, 0.975rem + 0.125vw, 1.125rem);
	--min-fs:  16px;

	/* 32(320) to 64(1920) */
	/*--main-32_320--64_1920: clamp(2rem, 1.6rem + 2vw, 4rem);*/

}

/* 24(320) to 40(1920) */ /* 1.2em to 2em*/
h1 {
	font-size: clamp(1.5rem, 1.3rem + 1vw, 2.5rem);
}

/* 22(320) to 30(1920) */ /* 1.2em to 2em*/
h2 {
	font-size: clamp(1.375rem, 1.275rem + 0.5vw, 1.875rem);
}

.bold {
	font-weight: 600;
}



.cm1 {
	color: var(--main-color-blue);
}

.cm2 {
	color: var(--main-color-gold);
}



.lazy {
	display: none;
}



.fldstnb {
	border: none;
}














.main-page {
	min-height: 100%;
	width: 100%;
}

@media (max-width: 779px) {

	.header {
		
		height: 20vh;
		width: 100%;
		position: relative;
		z-index: 10;
	}
}

@media (min-width: 780px) {

	.header {
	
		width: 100%;
		position: relative;
		height: 37vh;
		z-index: 10;

		/*box-shadow: 0px 0px 33px 0px rgba(0, 0, 0, 0.4);*/

		/*clip-path: polygon(100% 0, 100% calc(100% - 2.8vw), calc(100% - 2.8vw) 100%, 0 100%, 0 0);*/

		clip-path: polygon(0 0, 100% 0, 100% calc(100% - 2.8vw), calc(100% - 2.8vw) 100%, calc(0% + 2.8vw) 100%, 0 calc(100% - 2.8vw));
	}









}


.header .contents {
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	z-index: 35;

	display: flex;
	justify-content: center;
	align-items: center;
}

.header .contents-slider {
	height: 100%;
}



.header-top {
	position: -webkit-sticky;
	position: sticky;
	top: 0;
	left: 0;
	right: 0;
	z-index: 30;
	/*box-shadow: 0px 0px 33px 0px rgba(0, 0, 0, 0.4);*/



}

/*.header-top:after {
	content: "";
	position: absolute;
	top: calc(clamp(2.625rem, 0.38rem + 2.8125vw, 3.75rem) * 2);
	right: 0;
	width: 2.8vw;
	height: 2.8vw;
	background: linear-gradient(45deg, rgba(0,0,0,0) 0%, rgba(0,0,0,0) 49%, rgba(255,255,255,1) 50%, rgba(255,255,255,1) 100%);

}*/

.header-top::before {
  content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 500 200'%3E%3Cpath d='M 0 8 C 37 54 271 -24 500 24 L 500 0 L 0 0' stroke='white' fill='rgb(23, 41, 131)'%3E%3C/path%3E%3C/svg%3E");
  position: absolute;
	/*top: calc(clamp(2.625rem, 0.38rem + 2.8125vw, 3.75rem) * 2);*/
	top: 86px;
	left: 0;
  width: 100%;
  height: 10px;
  z-index: 28;
  pointer-events: none;
}

.header-top::after {
  content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 500 200'%3E%3Cpath d='M 0 7 C 37 53 271 -24 500 23 L 500 0 L 0 0' fill='white'%3E%3C/path%3E%3C/svg%3E");
  position: absolute;
	/*top: calc(clamp(2.625rem, 0.38rem + 2.8125vw, 3.75rem) * 2);*/
	top: 83px;
	left: 0;
  width: 100%;
  height: 10px;
  z-index: 28;
  pointer-events: none;
}







iframe {
	border: none;
}







	.header-top .logo {

		position: absolute;
		/* 12(320) / 28(1920) */
		top: clamp(0.75rem, 0.575rem + 0.875vw, 1.625rem);
		/* 16(320) / 150(1920) */
		left: clamp(1rem, -0.675rem + 8.375vw, 9.375rem);


		/* 12 /16 */

		/* 28 / 150 */

		

		height: clamp(4.375rem, 3.75rem + 3.125vw, 7.5rem);
		max-height: clamp(4.375rem, 3.75rem + 3.125vw, 7.5rem);

		/*width: calc(5.5 * clamp(2.625rem, 0.38rem + 2.8125vw, 3.75rem));*/

		width: auto;



		/*max-width: 44%;*/
		text-align: center;

		/*padding: 0 6%;*/

		/*filter: drop-shadow(3px 3px 8px rgb(0 0 0 / 0.5));*/

		/*clip-path: polygon(calc(100% - clamp(2.625rem, 0.38rem + 2.8125vw, 3.75rem)) 0%, 100% 50%, 100% 100%, 0 100%, 0 0);*/
		/*background: white;*/
		z-index: 32;

	}








.header-top .logo  img {
	height: 100%;
	/*margin-left: calc(0px - calc(clamp(2.625rem, 0.38rem + 2.8125vw, 3.75rem) / 2));*/

	/*filter: drop-shadow(3px 3px 8px rgb(0 0 0 / 0.5));*/

}


/*.header-top .logo:after {
	content: '';
	display: block;
	height: 100%;
		aspect-ratio: 1/1;
	clip-path: polygon(0 0, 50% 50%, 50% 100%, 0 100%);
	background: lightgreen;
	position: absolute;
	top: 0;
	right: 0;
}*/





/* ********************************************** */
/*                    Top Barre                   */
/*                                                */
/* ********************************************** */

.firstbar {
	/*background: rgb(0,0,0);
	background: linear-gradient(45deg, rgba(255,255,255,1) 0%, rgba(255,255,255,1) 17%, var(--main-color-black) 17%, var(--main-color-black) 100%); 
	color: white;*/





	background: white;
	
	/* 42(1280) to 60(1920) */
	/*min-height: 60px;
	min-height: clamp(2.625rem, 0.38rem + 2.8125vw, 3.75rem);*/
	min-height: 42px;

	/* 42(1280) to 60(1920) */
	line-height: 60px;
	line-height: clamp(2.625rem, 0.38rem + 2.8125vw, 3.75rem);
	
	/* 16(1280) to 18(1920) */
	font-size: 16px;
	/*font-size: clamp(1rem, 0.75rem + 0.3125vw, 1.125rem);*/

	/* 13(320) to 60(1920) */
	padding-left: clamp(0.8125rem, 0.23rem + 2.9375vw, 3.75rem);
	padding-right: clamp(0.8125rem, 0.23rem + 2.9375vw, 3.75rem);

	display: flex;
	flex-direction: row;
	justify-content: space-between;
}









.firstbar a {
	color: white;
	text-decoration: none;
}

.lang {
		/*display: none;*/
		opacity: 0;
}

.lang div {
	width: 60px;
	/* 40(1280) to 60(1920) */
	width: clamp(2.5rem, 3.125vw, 3.75rem);
	display: inline-block;
	text-align: center;
}

.member-link {
	display: flex;
	column-gap: 12px;
	color: black;
}

.member-link a {
	color: white;
}


.ml-btn {
	display: block;
	height: 100%;
	padding: 0 12px;
	cursor: pointer;
}

.ml-btn:hover {
	background: var(--main-color-red);
	background: rgba(255, 255, 255, .1);
}



@media (max-width: 619px) {

	.ml-btn-2 {
		cursor: pointer;
	}


	.ml-btn-2:before {
		content: '\1F464';
		height: 100%;
		width: 20px;
		padding-right: 8px;
		filter: brightness(0) saturate(100%) invert(100%);
	}

	.ml-btn {
		display: none;
	}

}

@media (min-width: 620px) {

	.ml-btn-2 {
		display: none;
	}

}




.member-link-2 {
	display: flex;
	flex-direction: column;
	row-gap: 12px;
	color: white;
	background: rgba(255, 255, 255, 0.6);
	padding: 2%;
}

.member-link-2 a {
	color: white;
}


.ml-btn1 {
	display: block;
	height: 60px;
	line-height: 60px;
	padding: 0 12px;
	cursor: pointer;

	background: red;
	border-radius: 5px;
	text-align: center;

	background: linear-gradient(5deg, rgba(15,15,15,1) 0%, rgba(237,28,36,1) 30%, rgba(237,28,36,1) 43%, rgba(140,24,24,1) 77%, rgba(15,15,15,1) 100%);
}

.ml-btn:hover {
	background: var(--main-color-red);
	background: rgba(255, 255, 255, .1);
}










/* ********************************************** */
/*                    Main menu                   */
/*                                                */
/* ********************************************** */

.menubar {
		/* 42(1280) to 60(1920) */
		/*height: 60px;
		height: clamp(2.625rem, 0.38rem + 2.8125vw, 3.75rem);*/
		height: 42px;

		/* 0(320) / 42(1280) */
		line-height: clamp(0rem, -0.875rem + 4.375vw, 2.625rem);

		max-width: 100%;
		padding: 0 60px;
		/* 15(320) to 60(1920) */
		padding: 0 clamp(0.9375rem, 0.38rem + 2.8125vw, 3.75rem);

		background: white;


		display: flex;
		flex-direction: row;
		justify-content: flex-end;
		align-items: flex-end;
		flex-wrap: nowrap;
}







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



input.jm-menu-btn {
	/* Hide the checkbox */
	opacity: 0;
	position: absolute;
	left: 0;
}



input[type='checkbox'].jm-menu-btn ~ .jm-collapse {
	display: none; /* Hide menu on load */
}


label.jm-menu-btn {
	color: var(--main-color-blue);
	cursor: pointer;
	display: block;
	height: 24px;
	transform: translateY(-50%);
}

.jm-icon-menu::before {
	content: '\2630';
	font-size: 24px;
}

.jmenu a {
	height: 100%;
	display: block;
	/*color: black;*/
	color: var(--main-color-blue);
	

}


.jmenu ul,
.jmenu li {
	list-style: none;
	margin: 0;
	padding: 0;
}


.jmenu li a {
	padding: 0 20px;
}



.jmenu .onglet {
	width: 100%;
	height: 100%;
	text-decoration: none;
	font-size: clamp(0.875rem, 0.75rem + 0.1563vw, 0.9375rem);
	font-family: Verdana;
	font-variant-caps: small-caps;
	font-weight: 600;
	border: 2px solid white;
}

.jm-collapse > li:first-child {
	border-top: 2px solid rgb(220, 220, 220);
}

.jmenu .onglet:hover {
	
	color: var(--main-color-blue);
	background: white;
	/*border-radius: 4px 80px 4px 80px;*/
	border: 2px solid var(--main-color-blue);
}

.jmenu .menu-onglet-actif {
	color: white;
	background: var(--main-color-blue);
	/*border-radius: 4px 80px 4px 80px;*/
	border: 2px solid white;
}

/* Submenu Items */
.jmenu ul ul {
	display: none; /* Hidden by default */
}

/* Dropdowns */

.jm-dropdown .tre {
	cursor: pointer;
	display: flex;
	flex-direction: row;
	align-items: center;
	column-gap: 8px;
}



input.jm-sub-menu-btn {
	/* Hide the checkbox */
	opacity: 0;
	position: absolute;
	left: 0;
}

input[type='checkbox']:checked.jm-sub-menu-btn ~ ul {
	display: block;
}


.chvrn.hover {
	transform: scaleY(-1);
}

.jm-icon-dropdown {

	width: 60px;
	text-align: center;
	align-self: stretch;
	display: flex;
}




input[type='checkbox']:focus.jm-menu-btn ~ .jm-icon-menu::before {
	color: var(--main-color-dark-red);
}


input[type='checkbox']:checked.jm-menu-btn ~ .jm-icon-menu::before {
	content: '\2715';
}





@media (max-width: 1279px) {

	.jmenu .onglet {
		height: 60px;
		line-height: 60px;
		/*padding-left: 16px;*/
		/*height: clamp(2.625rem, 0.38rem + 2.8125vw, 3.75rem);
		line-height: clamp(2.625rem, 0.38rem + 2.8125vw, 3.75rem);*/
	}

	.jmenu .onglet.inside {
		padding-left: 48px;
	}


	input[type='checkbox']:checked.jm-menu-btn ~ .jm-collapse {
		display: block; /* Open when menu button is clicked */
		position: absolute;
		left: 0;
		right: 0;
		background: white;
	}

	.jm-collapse {
		box-shadow: 0px 12px 25px -8px rgba(0, 0, 0, 1);
		z-index: 400;
	}

	input[type='checkbox']:checked.jm-sub-menu-btn ~ .tre {
		color: white;
		/*background-color: var(--main-color-red);*/

	}

	input[type='checkbox']:checked.jm-sub-menu-btn ~ ul {
		display: block;
		color: white;
		background: rgba(0, 0, 0, .9);

	}

	input[type='checkbox']:checked.jm-sub-menu-btn ~ ul > li > a {
		color: white;
	}


	input[type='checkbox']:checked.jm-sub-menu-btn ~ .tre > .menu-onglet-actif {
		color: white;
	}

	input[type='checkbox']:checked.jm-sub-menu-btn ~ .tre:hover .onglet {
		color: white;
	}

	.tre:hover .onglet {
		/*color: var(--main-color-red);*/
	}

	input[type='checkbox']:checked.jm-sub-menu-btn ~ .tre .jm-icon-dropdown .chvrn {

		/*margin: -1px 0;*/ /* corrige bug décalage scale*/
		transform: scaleY(-1);
	}


	.tre {
		display: flex;
		justify-content: space-between;
	}

	.tre .onglet.jm-icon-dropdown {
		width: 60px;
	}
	

}



@media (min-width: 1280px) {

	.jmenu .onglet:hover {
		/*box-shadow: inset 0px -4px 0px 0px var(--main-color-red);*/
	}

		.jmenu .onglet {

				width: auto;
		}

		.jmenu .onglet:focus:not(.inside),
		.jmenu .onglet:hover {

		}

		.jmenu .menu-onglet-actif {
				/*box-shadow: inset 0px -4px 0px 0px var(--main-color-red);*/
		}

		.jm-collapse > li:first-child {
				border-top: none;
		}

		.jm-collapse > li:last-child {
				border-bottom: none;
		}

		.jm-dropdown:hover .tre .onglet {
				color: var(--main-color-red);
				/*box-shadow: inset 0px -4px 0px 0px var(--main-color-red);*/
		}

		input[type='checkbox']:focus.jm-sub-menu-btn ~ .tre .onglet:not(.jm-icon-dropdown) {

		}

		li:hover .jm-icon-dropdown .chvrn {
				transform: scaleY(-1);
				/*margin: -1px 0;*/
		}


		.jmenu {
				align-self: flex-end;
		}

		/* Menu items */
		.jmenu li {
				display: inline-block;
				height: 100%;
		}


		.jmenu .inside {
				margin-left: 0;
				width: 100%;

				border-bottom: none;
				margin-right: 0;


		}

		.jmenu .inside:hover {
				color: var(--main-color-red);
				border-bottom: none;
		}


		input[type='checkbox']:checked.jm-sub-menu-btn ~ ul li .inside:focus {
			color: var(--main-color-red);
		}


		.jmenu .onglet:hover {
	

			border-radius: 4px 80px 4px 80px;

		}

		.jmenu .menu-onglet-actif {

			border-radius: 4px 80px 4px 80px;

		}





		/* Dropdowns */
		.jm-dropdown {
				position: relative;
		}

		.jm-dropdown li {
				width: 100%;
		}

		.jm-dropdown li a {
				display: block;
				padding: 4px 16px;
				white-space: nowrap;
				width: 100%;
		}

		.jm-dropdown ul {
				margin-left: 0px;
				padding: 8px 0;
				position: absolute;
				min-width: 100%;
		}

		/* Menu Button */
		input.jm-menu-btn,
		label.jm-menu-btn {
				display: none; /* Hide menu button */
		}

		input[type='checkbox'].jm-menu-btn ~ .jm-collapse,
		.jm-collapse {
				display: flex; /* Show menu */
				column-gap: 30px;
				column-gap: clamp(20px, 1.5625vw, 30px);
				column-gap: 8px;
		}

		.jm-dropdown:hover ul {
				display: block;
		} 
		/*pour bureau*/

		.jm-dropdown ul {
				background: #fff;
				padding: 0;
		}

		.jm-dropdown .tre .jm-icon-dropdown.onglet,
		.jm-dropdown .tre .jm-icon-dropdown.onglet:hover {
				border-top: none;
				box-shadow: none;
				border-bottom: none;
				height: 100%;

				display: flex;
				justify-content: center;
				align-items: center;

				font-size: 13px;

		}



}




/*input[type='checkbox'].jm-menu-btn:focus ~ .jm-icon-menu {
	color: red;
}

input[type='checkbox'].jm-sub-menu-btn:focus ~ .tre .jm-icon-dropdown {
	color: red;
}

input[type='checkbox'].jm-sub-menu-btn:checked:focus ~ .tre .jm-icon-dropdown {
	color: black;
}*/



/* calc(0% + 2.8vw) */





.master-main-content {
	display: flex;
	flex-direction: column;

	min-height: calc(100vh - 42px - 42px - 60px);
	height: 100%;
}

.main-right-side {
	width: 100vw;
	background: var(--main-color-black);
	
	background: 

	linear-gradient(90deg,  rgba(237,28,36,1) 4%, rgba(237,28,36,1) 21%, rgba(140,24,24,1) 77%, rgba(15,15,15,1) 99%);



	color: white;
	position: relative;

	display: flex;
	flex-direction: column;

	
}

@media (min-width: 620px) {

	.main-right-side {
		flex-direction: row;

	}



}


@media (min-width: 1024px) {

	.master-main-content {
		flex-direction: row;

		/*height: 100%;*/
	}

	.main-right-side {
		width: 20vw;
		background: var(--main-color-black);
		
		background: 

		linear-gradient(90deg,  rgba(237,28,36,1) 4%, rgba(237,28,36,1) 21%, rgba(140,24,24,1) 77%, rgba(15,15,15,1) 99%);



		color: white;
		position: relative;

		display: block;

		
	}

	.main-right-side:before {
		content: '';
		width: 100%;
		height: 2.8vw;
		background: linear-gradient(90deg,  rgba(237,28,36,1) 4%, rgba(237,28,36,1) 21%, rgba(140,24,24,1) 77%, rgba(15,15,15,1) 99%);
		top: -2.8vw;
		right: 0;
		display: block;
		position: absolute;
		

	}


	.main-right-side:after {
		content: '';
		width: calc(20vw + 2.8vw);
		height: calc(20vw + 2.8vw);

		background: rgba(15,15,15,1);

		bottom: -1px;
		right: 0;
		display: block;
		position: absolute;
		z-index: 100;

		clip-path: polygon(100% 0, 0 100%, 100% 100%);


	}

}




.main-right-side .contents {
	padding: 32px 32px 32px 32px;
	position: relative;
	width: 100%;
}

@media (min-width: 620px) {

	.main-right-side .contents {
		padding: 32px 32px 60px 32px;
		width: 60%;
	}

}


@media (min-width: 780px) {

	.main-right-side .contents {
		width: 40%;
	}

}

@media (min-width: 1024px) {

	.main-right-side .contents {
		padding: 32px 12px 60px 12px;
		position: relative;
		width: 100%;
	}

}


@media (min-width: 1280px) {

	.main-right-side .contents {
		padding: 32px 32px 60px 32px;
	}

}






.rsx {
	display: flex;
	/*justify-content: space-around;*/
	column-gap: 32px;
	margin-left: 12px;
}

.rsx img {
	width: 32px;
	filter: brightness(0) saturate(100%) invert(100%);

}

.rsx img:hover {
	/*filter: invert(19%) sepia(81%) saturate(4722%) hue-rotate(348deg) brightness(93%) contrast(100%);*/
	filter: invert(0%) sepia(13%) saturate(3636%) hue-rotate(10deg) brightness(71%) contrast(88%);

}

.cntct {
	display: flex;
	align-items: center;
}

.cntct img {
	width: 32px;
	filter: brightness(0) saturate(100%) invert(100%);
	margin-right: 12px;
	margin-left: 12px;
}




.cntct a {
	text-decoration: none;
	color: white;
	display: flex;
	align-items: center;
}

.cntct a:hover {
	text-decoration: none;
	color: var(--main-color-black);
	text-decoration: underline;
}

.cntct a:hover img {
	/*filter: invert(19%) sepia(81%) saturate(4722%) hue-rotate(348deg) brightness(93%) contrast(100%);*/
	filter: invert(0%) sepia(13%) saturate(3636%) hue-rotate(10deg) brightness(71%) contrast(88%);
}


.adr,
.down {
	margin-left: 12px;
}


.down a {
	color: white;

}

.down a:hover {
	color: var(--main-color-red);
	
}

.logo-hck {
	opacity: 0;
}

.logo-hck img {
	width: 80%;
}






.logo-side {
	width: 100%;
}

.logo-side img {
	width: 80%;
}



@media (min-width: 620px) {

	.logo-side {
		width: 40%;
	}

	.logo-side img {
		width: 100%;
	}

}


@media (min-width: 780px) {

	.logo-side {
		width: 60%;
	}

	.logo-side img {
		width: 80%;
	}

}


@media (min-width: 1024px) {

	.logo-side {

		position: sticky;
		top: calc(100vh - 20vw - 2.8vw - 60px);

		width: 100%;
		height: 20vw;

		z-index: 120;


	}


	.logo-side img {
		width: 80%;
	}


}









.main-content {

	/*font-size: var(--main-fs);
	font-weight: 500;
	font-family: Helvetica, sans-serif;*/
	width: 100vw;

	/*background: white;

	position: relative;*/

}




@media (min-width: 1024px) {

	/*.main-content {

		font-size: var(--main-fs);
		font-weight: 500;
		font-family: Helvetica, sans-serif;
		width: 100vw;

		position: relative;*/

	}

}



.bs1 {
	box-shadow: 2px 2px 5px 0px rgba(0, 0, 0, 1.0);
}


.fltr-w {
	filter: brightness(0) saturate(100%) invert(100%);
}

.no-mgtop {
	margin-top: 0;
}

.no-mgbot {
	margin-bottom: 0;
}


.no-mgver {
	margin-top: 0;
	margin-bottom: 0;
}







.cw {
	color: white;
}

.i {
	font-style: italic;
}

.fw-600 {
	font-weight: 600;
}

a.ctb {
	color: black;
}

.bg-mp {
	background: var(--main-color-pink);
	color: white;
}

.bg-mp a,
.bg-mp a:visited {
	color: white;
}





a.nop[target="_blank"] {
	position: static;
	padding-right: 0;
}
a.nop[target="_blank"]::after {
	content: none;
}









.modal {
	visibility: hidden;
	opacity: 0;
	position: absolute;
	position: fixed;
	top: 0; left: 0;
	height: 100%;
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	background: rgba(120, 120, 120, .9);
	transition: all .4s;
	z-index: 50;
}

.modal:target {
	visibility: visible;
	opacity: 1;
}




.modal_content {
	border-radius: 4px;
	max-height: calc(100vh - 2%);
	width: calc(100vw - 20%);

	background: white;
	padding: 3rem;
	padding-top: 0;

	overflow: auto;

}

.modal_content .swiper-slide img {
	display: block;

	height: 700px;
}

.red {
	height: 100%;
	width: 100%;
}



.modal_close {

	color: black;
	text-decoration: none;
	z-index: 55;
	font-size: 3rem;
	float: right;
}





.mhalf {
	height: 100%;

}



.center {
	text-align: center;
}





.step {
	width: 100%;
	/* 40(320) to 60(1920) */
	padding: clamp(2.5rem, 2.25rem + 1.25vw, 3.75rem) 6%;
}



.step3 {
	width: 100%;
	/* 40(320) to 60(1920) */
	padding: 0 6%;
	padding-bottom: clamp(2.5rem, 2.25rem + 1.25vw, 3.75rem);

}






.step2 {
	width: 100%;
	/* 40(320) to 120(1920) */
	padding-top: clamp(2.5rem, 1.5rem + 5vw, 7.5rem);
	padding-right: 6%;
	/* 40(320) to 60(1920) */
	padding-bottom: clamp(2.5rem, 2.25rem + 1.25vw, 3.75rem);
	padding-left: 6%;
}


.step a {
	color: black;
}

.no-pdtop {
	padding-top: 0;
}

.no-pdbot {
	padding-bottom: 0;
}




.top-index {
	display: flex;
	flex-direction: column;
	
}

.top-index .ti1 {

	height: calc(100vh - 84px);
	width: 100%;
	background-image: linear-gradient(90deg, var(--main-color-blue-50), var(--main-color-blue-50)), url("/images/SAM_kiosque_1280w.jpg");

	background-size: cover;
	background-position: center;

	text-align: center;
	color: white;

	position: relative;

}

.top-index .ti1 .qtr {

	position: absolute;
	bottom: 8px; right: 8px;
	font-size: 10px;

}

.top-index .ti1 .qtr a {

	color: white;
	text-decoration: none;

}


@media (min-width: 1024px) {

	.top-index {
		display: flex;
		flex-direction: row;
		height: calc(100vh - 84px);
		max-width: 100%;
	}

	.top-index .ti1 {
		height: 100%;
		width: 60%;
		background-image: linear-gradient(90deg, var(--main-color-blue-50), var(--main-color-blue-50)), url("/images/SAM_kiosque_1280w.jpg");

		background-size: cover;

		text-align: center;
		color: white;

		position: relative;

	}


}



.top-index .ti1 .ef {
	position: absolute;
	top: 0;
	left: 0;

}


.top-index .ti1 h1,
.top-index .ti1 h2 {
	text-shadow: 2px 2px 5px black;
	cursor: default;
}





.top-index .ti1 .ti1b {
	width: 100%;
	height: 100%;

	display: flex;
	justify-content: center;
	align-items: center;

	backdrop-filter: blur(3px);

}

.top-index .ti1 .ti1b h1 {
	
	/* 30(320 / 60(1920) */
	font-size: clamp(1.875rem, 1.5rem + 1.875vw, 3.75rem);
}



.top-index .ti1 .ti1b > div {
	
	display: flex;
	justify-content: center;
	flex-direction: column;
	align-items: center;

}

.top-index .ti1 .ti1b .space {
	
	width: 100%;
	height: 64px;

}


.sb-form-index {
	width: 100%;
	display: flex;
	justify-content: center;
}




.top-index .search-bar {
	display: flex;
	justify-content: center;
	align-items: stretch;
	height: 48px;
	max-width: 420px;
	width: 100%;
	border: 2px solid white;
	border-radius: 8px;
}

.top-index .search-bar > input {
	border-radius: 8px 0 0 8px;
	text-align: center;
	max-width: 356px;
	width: 85%;
	/*padding: 0px 6px;*/
	font-size: 14px;
}



.search-icon {
	/*font-size: 36px;
	line-height: 36px;*/


	background: var(--main-color-gold);
	background: var(--main-color-blue);

	

	display: flex;
	justify-content: center;
	align-items: center;

	border-radius: 0 8px 8px 0;
	cursor: pointer;

	max-width: 64px;
	width: 15%;

}

.search-icon:hover {

}

.search-icon > input {
	height: 60%;
	filter: brightness(0) saturate(100%) invert(100%);
	
}

.search-icon > button {
	height: 100%;
	width: 100%;
	background: var(--main-color-blue);
	border: none;
	border-radius: 0 8px 8px 0;
	
}

.search-icon > button > img {
	height: 63%;
	filter: brightness(0) saturate(100%) invert(100%);
	
}



.top-index .ti2 {
	width: 100%;
	padding: clamp(2.5rem, 2.25rem + 1.25vw, 3.75rem) 6%;
}

.top-index .ti2 .newsletter form {

	display: flex;

}

.top-index .ti2 .newsletter form input[type="submit"] {

	height: 100%;
	padding: 0 20px;

	background-color: var(--main-color-blue);
	color: white;
	border: 3px solid var(--main-color-blue);
	font-weight: 600;

}

.top-index .ti2 .newsletter form input[type="submit"]:hover {

	background-color: white;
	color: var(--main-color-blue);

}


@media (min-width: 1024px) {

	.top-index .ti2 {
		width: 40%;
		padding: clamp(2.5rem, 2.25rem + 1.25vw, 3.75rem) 4% ;

		position: relative;

	}

	.top-index .ti2 .actus {

		height: 88%;
		overflow-y: scroll;
		scrollbar-width: thin;

	}

	.top-index .ti2 .ff {
		text-align: right;
		position: absolute;
		bottom: 2rem;
		right: 6%;
	}

	.top-index .ti2 .newsletter {

		height: 12%;


	}

}


.top-index .ti2 h3 {
	color: var(--main-color-blue);
}


.top-index .ti2 .actu {
	padding-right: 8px;
}

.top-index .ti2 .actu .diapo {
	width: 100%;
}


.top-index .ti2 .actu .img {
	text-align: center;
}

.top-index .ti2 .actu img {
	max-width: 100%;
	max-height: 50vh;
}


.top-index .ti2 .actu .date {
	font-size: smaller;
	color: #333;
}

.top-index .ti2 .ff {
	text-align: right;
	/* 12(320) / 15(1920) */
	font-size: clamp(0.75rem, 0.7125rem + 0.1875vw, 0.9375rem);
}



.pub {
	background: var(--main-color-blue);
	height: 260px;
	width: 99vw;
	border-top: 2px solid white;
	border-bottom: 2px solid white;
	padding: 0 16px	;
}

.pub .act-sliide {
	height: 67%;
	width: 100%;
}

.pub h3 {
	padding-left: 3%;
}




a.disabled {
	pointer-events: none;
	cursor: default;
}


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


.qsn {
	display: flex;
	flex-direction: column;
}

.qsn1 {
	width: 100%;
}

.qsn2 {
	width: 100%;
	padding: 8px;
	display: flex;
	justify-content: center;
	align-items: center;
	flex-direction: column;
	gap: 8px;
	

}

.qsn2 img {
	max-width: 100%;
	display: block;
}


.qsn2 .qte {
	font-size: 12px;
}

.ordra {
	order: 2;
}

.ordrb {
	order: 1;
}


@media (min-width: 1024px) {

	.qsn {
		flex-direction: row;
		column-gap: 50px;
	}

	.qsn1 {
		width: 60%;
	}

	.qsn2 {
		width: 40%;
	}

	.ordra {
		order: 1;
	}

	.ordrb {
		order: 2;
	}

}





.abcd {
	box-shadow: 2px 2px 5px 0px rgba(0, 0, 0, 1.0);
}








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


:root {
    --flex-gap-partenaire: 16px; /* Variable for gap */
}

.partenaire {
	background: white;
	/*height: 260px;*/
	width: 99vw;
	border-top: 2px solid var(--main-color-blue);
	border-bottom: 2px solid var(--main-color-blue);
}

.partenaire h3 {
  padding-left: 3%;
}


.partenaire .list {

	min-height: 200px;
	width: 99vw;
	display: flex;
	justify-content: space-around;
	align-items: center;
	flex-wrap: wrap;
	gap: var(--flex-gap-partenaire);

	padding-bottom: 32px;

}

.partenaire .list a {

	--flex-items: 4;

	max-width: 16%;
	max-width: calc((100% / var(--flex-items)) - (((var(--flex-items) - 1) / var(--flex-items)) * var(--flex-gap)));
	max-height: 70%;
	width: 100%;
	height: 140px;

	min-width: 200px;



	display: flex;
	justify-content: center;
	align-items: center;
	

}



@media (min-width: 1650px) {


	.partenaire .list a {

		--flex-items: 4;

		max-width: 16%;
		max-width: calc((100% / var(--flex-items)) - (((var(--flex-items) - 1) / var(--flex-items)) * var(--flex-gap)));
		max-height: 70%;

		width: 100%;
		height: 140px;

		min-width: 200px;



		display: flex;
		justify-content: center;
		align-items: center;
		

	}

}





.partenaire .list a img {

	max-width: 100%;
	max-height: 100%;
	width: auto;

}

.partenaire .list .f {

	/*aspect-ratio: 194/83;*//*2.3373*/

}


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


.footer {
	width: 100%;
}

.footer a {
	color: white;
}

.footer .bottom {
	text-align: center;
	padding: 20px;
	background: var(--main-color-black);
	color: white;
}




/* **************************************** */
/*                  Contacts                */
/* **************************************** */


.anchor {
  scroll-margin-top: 120px;
}


.discover
{
	display: none;
}



.contacts {
	display: flex;
	flex-direction: column;
}

.contacts .formulaire {
	width: 100%;
	background: var(--main-color-blue);
	color: white;

	padding: clamp(2.5rem, 2.25rem + 1.25vw, 3.75rem) 6%;
	display: flex;
	justify-content: center;
	
}

.contacts .formulaire .form_contact {
	/*width: 100%;*/
	
}


.contacts .informations {
	width: 100%;

	display: flex;
	flex-flow: column;
	justify-content: space-between;

	

}

.contacts .informations .general {
	padding: clamp(2.5rem, 2.25rem + 1.25vw, 3.75rem) 6%;
	
}



@media (min-width: 1024px) {

	.contacts {
		flex-direction: row;
	}

	.contacts .formulaire {
		width: 50%;
	}

	.contacts .formulaire .form_contact {
		/*width: 100%;*/
	}

	.contacts .informations {
		width: 50%;
	}

}







.contacts .informations .map {
	width: 100%;
	
}

.contacts .informations .map img {
	width: 100%;
	
}

.redf, 
.redf2, 
.redf3 {
	display: flex;
	align-items: center;
	column-gap: 8px;
}


.redf .t,
.redf2 .t, 
.redf3 .t {
	display: inline-block;
	padding: 4px 8px;
	border-radius: 25px;
	border: 1px solid var(--main-color-blue);
	margin-top: 12px;
	margin-left: 12px;
	cursor: pointer;
	color: var(--main-color-blue);
	font-size: 14px;
	line-height: 16px;
}

.redf img,
.redf2 img, 
.redf3 img {
	height: 16px;
	width: auto;
	cursor: pointer;
}

.redf a,
.redf2 a, 
.redf3 a {
	color: black;
}


.redf3 .n {
	display: none;
}









.steponecontact {
	display: flex;
	column-gap: 120px;
	column-gap: 10%;
	flex-direction: column;

}

.steponecontact > div {
	width: 100%;
}


@media (min-width: 780px) {

	.steponecontact {
		flex-direction: column;
		align-items: center;

	}

	.steponecontact > div {
		width: 66%;

	}

}






.field {
	width: 100%;
	height: 3rem;
}

.field-2 {
	width: 100%;
	height: 16rem;
}




.form_contact .btn-submit {
	width: 100%;
	text-align: center;
	display: block;
}

.form_contact .btn-submit input {
	padding: 20px 40px;
	background-color: white;
	color: var(--main-color-blue);
	border: 3px solid white;
	font-weight: 600;
}


.form_contact .btn-submit input:hover {
	background-color: var(--main-color-blue);
	color: white;
	border: 3px solid white;
}










/* **************************************** */
/*                 Modal                    */
/* **************************************** */



body.modal-open {
   overflow: hidden !important;
}



.modal-info {

    width: 100vw;
    height: 100vh;
    background: rgba(0, 0, 0, .9);

    background: radial-gradient(
			circle, 
			rgba(0,0,0,0) 0%, 
			rgba(0,0,0,.9) 0.4%, 
 			rgba(0,0,0,.9) 100%
		); 


    position: fixed;
    top: 0; left: 0;
    z-index: 50;
    display: flex;
    justify-content: center;
    align-items: center;

    flex-direction: column;
    row-gap: 32px;

    text-align: center;
    font-family: "Open sans";
    backdrop-filter: blur(2px);

    overscroll-behavior : contain;
    overflow-y: scroll;
}

@media (min-width: 760px) {



}


.modal-info.flash {
    transform: scale(1000);
		transition-duration: 1s;
		pointer-events: none;
}

.modal-content.reduce {
	transform: scale(0.01) rotate(360deg);
	transition-duration: .6s;
}

.modal-content.flash {
	background: transparent;
}



.modal-content {
		width: 90vw;

	  height: auto;

		background: white;

    z-index: 52;
    display: flex;

    justify-content: center;
    align-items: center;
    flex-direction: column;
    row-gap: 10px;

    position: relative;

    padding: 20px 10px;

    /*border-radius: 28%;*/

    box-shadow:
				0 0.5952vw 1.1905vw 1.1905vw rgba(255, 255, 255, 1),
				0 0.7952vw 2.1905vw 1.1905vw rgba(255, 255, 255, 0.3);

}

@media (max-width: 759px) {


	.modal-content{
			
			animation: 7s scale4 linear infinite;
			will-change: transform;
		}


		@keyframes scale4 {
			0% {
				box-shadow:
					0 0.5952vw 1.1905vw 1.1905vw rgba(255, 255, 255, 1),
					0 0.7952vw 3.1905vw 2.1905vw rgba(255, 255, 255, 0);
			}
			50% {
				box-shadow:
					0 0.5952vw 1.1905vw 1.1905vw rgba(255, 255, 255, 1),
					0 0.7952vw 3.1905vw 2.1905vw rgba(255, 255, 255, .8);
			}
			100% {
				box-shadow:
					0 0.5952vw 1.1905vw 1.1905vw rgba(255, 255, 255, 1),
					0 0.7952vw 3.1905vw 2.1905vw rgba(255, 255, 255, 0);
			}
		}

}




.modal-content .b {
  position: absolute;
  /*border-radius:50%;*/
}



@media (min-width: 760px) {

	.modal-content {
		width: 80vw;
		max-width: 580px;
	  aspect-ratio: 1/1;


    z-index: 52;
    display: flex;

    justify-content: center;
    align-items: center;
    flex-direction: column;
    row-gap: 20px;

    position: relative;

    padding: 0;

    /*border-radius: 50%;*/

    box-shadow: none;

    /*border: 1px solid red;*/


    



	}


	.modal-conytent:before {

			content: '';
			position: absolute;
			width: 200%;
			height: 200%;

			background-image: url("../images/popup/cadre.png");
		  background-position: center;
		  background-repeat: no-repeat;
		  background-size: 100%;
	}

	.modal-content .b {

			/*inset: -15px;*/
		  /*filter: blur(6px);*/
	}

	.modal-content .b:nth-child(1) {


	}


	
	

}



.no-js .modal-close,
.no-js .modal-arrow-left,
.no-js .modal-arrow-right {
	display: none;
}

.modal-close {
	position: absolute;
	top: 10%;
	right: 10%;
	width: 48px;
	aspect-ratio: 1/1;
	background: white;
	


	border-radius: 32px;
	transform: translate(50%, -50%);
	font-weight: 700;
	color: black;
	font-size: 24px;
	display: flex;
	justify-content: center;
  align-items: center;
  cursor: pointer;
  z-index: 52;
}


.modal-close:before,
.modal-close:after,
.modal-arrow-left:before,
.modal-arrow-left:after,
.modal-arrow-right:before,
.modal-arrow-right:after {
	content: '';
	box-shadow: 
			0 0.1190vw 0 #ffffff,
			0 0.1190vw 0.1786vw #ffffff,
			0 0.2976vw 0.2976vw #ffffff90,
			0 0.5952vw 0.8929vw #ffffff60,
			0 -0.1190vw 0 #ffffff,
			0 -0.1190vw 0.1786vw #ffffff,
			0 -0.2976vw 0.2976vw #ffffff90,
			0 -0.5952vw 0.8929vw #ffffff60;

		/*backdrop-filter: blur(10px);*/
		position: absolute;
  

}


.modal-close:before,
.modal-close:after {
	width: 44px;
	aspect-ratio: 1/1;
	border-radius: 50%;
}

.modal-arrow-left:before,
.modal-arrow-left:after,
.modal-arrow-right:before,
.modal-arrow-right:after {
	width: 88px;
	aspect-ratio: 2/1;
	border-radius: 50%;
}



.modal-cllose:before {
	animation: 5s scale2 steps(40,end) infinite;
	/*will-change: transform;*/
}

.modal-cllose:after {
	animation: 3s scale3 steps(40,end) infinite;
	animation-direction: reverse;
	/*will-change: transform;*/
}



.modal-arrow-left,
.modal-arrow-right {
	position: absolute;
	
	width: 96px;
	aspect-ratio: 2/1;

	background: white;
	
	padding-bottom: 10px;

	border-radius: 50%;

	font-weight: 700;
	color: black;
	font-size: 36px;
	display: flex;
	justify-content: center;
  align-items: center;
  cursor: pointer;
  z-index: 52;
}


.modal-arrow-left {
	top: 90%;
	left: 10%;
}

.modal-arrow-right {
	top: 90%;
	right: 10%;
}



.rd-modal-js {
	display: none;
}


.l_rd-modal-js {
	background: white;
	border-radius: 50px;

	font-weight: 600;
	color: black;
	font-size: 18px;

	padding: 10px 20px;

	box-shadow:
		0 0 .5vw .5vw rgba(255, 255, 255, 1),
		0 0 1vw 1vw inset rgba(255, 255, 255, 1);

}

.rd-modal-js:checked + .l_rd-modal-js {
	box-shadow:
		0 0 1vw 1vw rgba(255, 255, 255, 1),
		0 0 1vw 1vw inset rgba(255, 255, 255, 1);
}



.modal-pagination:empty {
	display: none;
}


.modal-pagination {
	display: flex;
	column-gap: 32px;

}


.cks {
	color: white;
}




/*.modal-info img {
	max-width: 72%;
	height: auto;
}*/

.modal-titre,
.modal-middle,
.modal-middle2,
.modal-bottom {
		width: 90%;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    row-gap: 20px;
}



.modal-middle {
	/*backdrop-filter: blur(11px);*/

	width: 100%;
	aspect-ratio: 1/1;
	/*border-radius: 100%;*/

	line-height: 24px;

}





/* 24 to 36 */
.modal-titre .titre {
	font-weight: 600;
	font-size: clamp(1.5rem, 1.35rem + 0.75vw, 2.25rem);
	color: var(--main-color-orange);
}

.modal-bottom {
		cursor: pointer;
}


.modal-bottom .titre {
		cursor: pointer;
}
.modal-bottom .info {
	color: #111111;
	font-size: smaller;
}



@media (min-width: 760px) {

	.modal-middle {


	}

	.warp {
		/*padding: 40px;
		background: white;
		width: 100%;
		height: 100%;
		border-radius: 50%;
		z-index: 56;*/
	}



	

	.moda8l-content:before,
	.moda8l-middle:before,
	.moda8l-middle:after {
		position: absolute;
		content: '';
		width: 94%;
		aspect-ratio: 1/1;
		border-radius: 100%;
	  border: 40px solid rgba(255, 255 ,255 , 1);
	  filter: blur(12px);
	  z-index: 54;
	  transform: rotateZ(360deg);
	}



}




/* [classe^='rd-modal-nojs'] */

.js [class*="modal-nojs"]{
	display: none;
}




.no-js .ckx-modal-nojs,
.no-js [class*="rd-modal-nojs"],
.no-js .l_ckx-modal-nojs {
	position: fixed;
	z-index: 52;
	color: white;
}

.no-js .ckx-modal-nojs {
	top: 0; left: 0;
}

.no-js .l_ckx-modal-nojs {
	top: 0; left: 20px;
}

.no-js .rd-modal-nojs-1 {
	top: 20px; left: 0;
}

.no-js .l_rd-modal-nojs-1 {
	top: 20px; left: 20px;
}

.no-js .rd-modal-nojs-2 {
	top: 40px; left: 0;
}

.no-js .l_rd-modal-nojs-2 {
	top: 40px; left: 20px;
}

.no-js .rd-modal-nojs-3 {
	top: 60px; left: 0;
}

.no-js .l_rd-modal-nojs-3 {
	top: 60px; left: 20px;
}




.no-js .ckx-modal-nojs:checked ~ .modal-info,
.no-js .ckx-modal-nojs:checked ~ .l_ckx-modal-nojs,
.no-js .ckx-modal-nojs:checked,
.no-js .ckx-modal-nojs:checked ~ .rd-modal-nojs-1,
.no-js .ckx-modal-nojs:checked ~ .l_rd-modal-nojs-1,
.no-js .ckx-modal-nojs:checked ~ .rd-modal-nojs-2,
.no-js .ckx-modal-nojs:checked ~ .l_rd-modal-nojs-2,
.no-js .ckx-modal-nojs:checked ~ .rd-modal-nojs-3,
.no-js .ckx-modal-nojs:checked ~ .l_rd-modal-nojs-3 {
    display: none;
}

.no-js .rd-modal-nojs-1:checked ~ .modal-info .mdl-1 {
	display: flex;
}

.no-js .rd-modal-nojs-1:checked ~ .modal-info .mdl-2 {
	display: none;
}

.no-js .rd-modal-nojs-1:checked ~ .modal-info .mdl-3 {
	display: none;
}

.no-js .rd-modal-nojs-2:checked ~ .modal-info .mdl-1 {
	display: none;
}

.no-js .rd-modal-nojs-2:checked ~ .modal-info .mdl-2 {
	display: flex;
}

.no-js .rd-modal-nojs-2:checked ~ .modal-info .mdl-3 {
	display: none;
}

.no-js .rd-modal-nojs-3:checked ~ .modal-info .mdl-1 {
	display: none;
}

.no-js .rd-modal-nojs-3:checked ~ .modal-info .mdl-2 {
	display: none;
}

.no-js .rd-modal-nojs-3:checked ~ .modal-info .mdl-3 {
	display: flex;
}
















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











.cadre {
	
	padding: 20px;
	color: var(--main-color-pink);
	border: 3px solid var(--main-color-pink);
	border-radius: 4px;
	text-align: center;
	margin: 0px 6% clamp(2.5rem, 2.25rem + 1.25vw, 3.75rem) 6%;
}













a.black {
	color: black;
}

a.txt-deco-none {
	text-decoration: none;
}

a.txt-deco-none:focus,
a.txt-deco-none:hover {

	text-decoration: underline;

}




/* media sociaux */


.fcbk-btn-side,
#fcbkbtnside,
.insta-btn-side,
#instabtnside {
		display: none;
}

@media (min-width: 1024px) {

	.fcbk-btn-side {

		position: fixed;
		top: 84%;

		/*width: 32px;*/
		height: 64px;
		background: #1877f2;
		color: white;
		font-weight: 600;

		display: flex;
		justify-content: flex-end;
		align-items: center;

		border-radius: 0% 16px 16px 0%;

		padding-right: 4px;

		box-shadow: 0px 2px 8px 2px rgba(0, 0, 0, 0.6);
		z-index: 50;

	}

	.insta-btn-side {

		position: fixed;
		top: 75%;

		/*width: 32px;*/
		height: 64px;
		background: radial-gradient(circle at 30% 107%, #fdf497 0%, #fdf497 5%, #fd5949 45%,#d6249f 60%,#285AEB 90%);
		color: white;
		font-weight: 600;

		display: flex;
		justify-content: flex-end;
		align-items: center;

		border-radius: 0% 16px 16px 0%;

		padding-right: 4px;

		box-shadow: 0px 2px 8px 2px rgba(0, 0, 0, 0.6);
		z-index: 50;

	}

	.fcbk-btn-side:hover,
	.insta-btn-side:hover {
		animation: 0.4s tilt linear;
	}


	@keyframes tilt {
		0% {
			transform: scale(1);
		}
		50% {
			transform: scale(1.06);
		}
		100% {
			transform: scaleY(1);
		}
	}





	.fcbk-btn-side img,
	.insta-btn-side img {
		width: auto;
		height: 50%;
		filter: brightness(0) saturate(100%) invert(100%);
	}

	.fcbk-btn-side a,
	.insta-btn-side a {
		color: white;
		text-decoration: none;
	}




	.gyt {
		display: none;
		/*height: 64px;*/
		padding: 0 20px;
	}


	#fcbkbtnside:checked ~ .fcbk-btn-side:hover,
	#instabtnside:checked ~ .insta-btn-side:hover {
		animation: none;
	}

	#fcbkbtnside:checked ~ .fcbk-btn-side .gyt,
	#instabtnside:checked ~ .insta-btn-side .gyt {
		display: block;
	}

}



/* **************************************** */
/*                  vitrine                 */
/* **************************************** */


h1, h2, h3 {
	font-family: Georgia;
}

.vitrines {
	
}

.vitrines h1 {
	/*margin-left: 60%;*/

	text-align: center;
	/*color: var(--main-color-blue);*/

}

.vitrines .titre {
	background: var(--main-color-blue);
	background: linear-gradient(180deg, 
		var(--main-color-blue), 
		90%, 



		white);
	color: white;
}

.vitrines .titre .st {
	/* 16(320) / 17(1920) */
	font-size: clamp(1rem, 0.9875rem + 0.0625vw, 1.0625rem);
	font-weight: 600;
	/*color: #00edf1;*/
	text-align: center;
}


.vitrines .titre .sb {
	display: flex;
	justify-content: center;
	align-items: center;

	flex-direction: column;

	margin: auto 0;
	
}

.vitrines .titre .search-bar {
	display: flex;
	justify-content: center;
	align-items: stretch;
	height: 48px;
	max-width: 420px;
	width: 100%;
	border: 2px solid white;
	
}

.vitrines .titre .search-bar.one {
	border-radius: 8px 8px 0 0;
}

.vitrines .titre .search-bar.two {
	border-radius: 0 0 8px 8px;
}

.vitrines .titre .search-bar > input {
	border-radius: 0 0 8px 8px;
	text-align: center;
	max-width: 356px;
	width: 85%;
	font-size: 14px;
}

.vitrines .titre .search-bar > select {
	border-radius: 8px 8px 0 0;
	text-align: center;
	width: 100%;
	font-size: 14px;
}

@media (min-width: 1024px) {
   
  .vitrines .titre .sb {
		flex-direction: row;
		height: 48px;
	}

	.vitrines .titre .search-bar.one {
		border-radius: 8px 0 0 8px;
	}

	.vitrines .titre .search-bar.two {
		border-radius: 0 8px 8px 0;
	}

	.vitrines .titre .search-bar > input {
		border-radius: 0;

	}

	.vitrines .titre .search-bar > select {
		border-radius: 8px 0 0 8px;

	}

}







:root {
    --flex-gap: 16px; /* Variable for gap */
}

.liste {
	display: flex;
	flex-wrap: wrap;
	row-gap: 16px;
	column-gap: 16px;

}

.liste .vitrine {
	width: calc(25% - 12px);
	--flex-items: 1;
	width: calc((100% / var(--flex-items)) - (((var(--flex-items) - 1) / var(--flex-items)) * var(--flex-gap)));
	aspect-ratio: 6/3;
	background: var(--main-color-blue);
	position: relative;
	box-shadow: 2px 2px 5px 3px rgba(0, 0, 0, .4);
	border-radius: 4px;
	font-family: verdana;

}

@media (min-width: 480px) {
    .liste .vitrine {
        aspect-ratio: 6/3;
    }
}

@media (min-width: 600px) {
    .liste .vitrine {
        --flex-items: 2;
        aspect-ratio: 4/3;
    }
}

@media (min-width: 1280px) {
    .liste .vitrine {
        --flex-items: 3; 
    }
}

@media (min-width: 1600px) {
    .liste .vitrine {
        --flex-items: 4; 
    }
}


.vitrine a {
	width: 100%;
	height: 100%;
	text-decoration: none;
}

.vitrine .fond {
	position: absolute;
	top: 0; left: 0;
	width: 100%; height: 100%;
	z-index: 0;

	border-radius: 4px;
	overflow: hidden;
}

.vitrine .fond img {
	object-fit: cover;
	width:100%; 
	height:100%;
}

.vitrine .contents {
	position: relative;
	z-index: 2;
	height: 100%;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	align-items: center;
	backdrop-filter: blur(1px);
	padding: 8px;
	text-align: center;


	background: rgba(255, 255, 255, 0.5);

	background: linear-gradient(180deg, 
		transparent 30%, 
		rgba(255, 255, 255, .9) 60%,
		white);

	color: var(--main-color-blue);


	text-shadow: rgb(255, 255, 255) 1px 0px 0px, rgb(255, 255, 255) 0.540302px 0.841471px 0px, rgb(255, 255, 255) -0.416147px 0.909297px 0px, rgb(255, 255, 255) -0.989992px 0.14112px 0px, rgb(255, 255, 255) -0.653644px -0.756802px 0px, rgb(255, 255, 255) 0.283662px -0.958924px 0px, rgb(255, 255, 255) 0.96017px -0.279415px 0px;
}

.vitrine .contents:hover {
	justify-content: space-between;
	backdrop-filter: blur(0px);
	background: rgba(255, 255, 255, 0);
	background: linear-gradient(180deg, 
		white 6%,
		rgba(255, 255, 255, .9) 15%,

		transparent 50%,


		rgba(255, 255, 255, .9) 85%,
		white 94%);
}

.vitrine .contents:hover .vbtn {
	display: block;
}


.vitrine .contents .vtitre {
	/* 320/18		600/22 */
	font-size: clamp(1.125rem, 0.8393rem + 1.4286vw, 1.375rem);
}

@media (min-width: 600px) {
    .liste .vitrine {
        aspect-ratio: 5/3;
    }
}

@media (min-width: 1024px) {
    .liste .vitrine {
        aspect-ratio: 6/3;
    }
}

@media (min-width: 1280px) {
    .liste .vitrine {
        aspect-ratio: 5/3;
    }
}

@media (min-width: 1600px) {
    .liste .vitrine {
        aspect-ratio: 4/3;
    }
}

.vitrine .contents .vtype {
	/* 320/14		600/16 */
	font-size: clamp(0.875rem, 0.7321rem + 0.7143vw, 1rem);
}

.vitrine .contents .vbtn {
	display: none;
	padding: 12px 20px;
	border-radius: 2px;
	background: var(--main-color-blue);
	color: white;
	font-size: 18px;
	text-shadow: none;
}


.vitrine .contents .vbtn:hover {

	padding: 14px 24px;


}




/*---------------------------------*/
/*          vitrine vu             */
/*---------------------------------*/
.vvitrine {
	width: 100%;

}

.vvitrine .p1 {
	background: var(--main-color-blue);
	/*padding: 100px 6% 40px 6%;*/
	color: white;
}

.vvitrine .f1 {
	display: flex;
	column-gap: 64px;
	flex-direction: column;

}

.vvitrine .f11,
.vvitrine .f12 {
	width: 100%;
}


@media (min-width: 1024px) {

	.vvitrine .f1 {
		display: flex;
		flex-direction: row;
		column-gap: 64px;

	}

	.vvitrine .f11,
	.vvitrine .f12 {
		width: 50%;
	}

}



.vvitrine .f12 {
	display: flex;
	justify-content: center;
	align-items: center;
}

.vvitrine .f12 img {
	max-width: 100%;
	max-height: 50vh;
}


.vvitrine .f11 .titre .categ {
	color: darkgray;
}


.vvitrine .vlink {
	height: 32px;
	display: flex;
	justify-content: left;
	align-items: center;
	column-gap: 16px;
}

.vvitrine .vlink a {
	height: 80%;
	aspect-ratio: 1/1;
}

.vvitrine .vlink a img {
	height: 100%;
	filter: brightness(0) saturate(100%) invert(100%);
}





.vvitrine .p2 {
	display: flex;
	justify-content: space-between;
	flex-direction: column;
	column-gap: 64px;

}

.vvitrine .p2 h3 {
	color: var(--main-color-blue);

}

.vvitrine .p2 hr {
	color: var(--main-color-blue);

}

.vvitrine .p2 .p21,
.vvitrine .p2 .p22{
	width: 100%;
}



.vvitrine .p2 .p21 .hor  {
	display: flex;
	flex-direction: column;
	row-gap: 18px;
	/*width: 400px;*/

}

.vvitrine .p2 .p21 .hor div {
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	width: 100%;

}

.vvitrine .p2 .p21 .hor div span:first-child {
	font-weight: 600;

}

.vvitrine .p2 .p21 .hor div span {
	width: 100%;
}

@media (min-width: 720px) {

	.vvitrine .p2 {
		display: flex;
		flex-direction: row;

	}

	.vvitrine .p2 .p21,
	.vvitrine .p2 .p22{
		width: 50%;
	}

	.hr-mob {
		display: none;
	}

	/*.vvitrine .p2 .p21 .hor div {
		
		width: 400px;

	}

	.vvitrine .p2 .p21 .hor div span {
		width: auto;
	}*/

}


@media (min-width: 1024px) {

	/*.vvitrine .p2 {
		display: flex;
		flex-direction: row;

	}

	.vvitrine .p2 .p21,
	.vvitrine .p2 .p22{
		width: 50%;
	}

	.hr-mob {
		display: none;
	}*/

	.vvitrine .p2 .p21 .hor div {
		
		width: 400px;

	}

	.vvitrine .p2 .p21 .hor div span {
		width: auto;
	}

}









.vvitrine .p2 .p22 .btn-submit {
	width: 100%;
	text-align: center;
	display: block;
}

.vvitrine .p2 .p22 .btn-submit input {
	padding: 20px 40px;
	background-color: var(--main-color-blue);
	color: white;
	border: 3px solid var(--main-color-blue);
	font-weight: 600;
}


.vvitrine .p2 .p22 .btn-submit input:hover {
	background-color: white;
	color: var(--main-color-blue);
	border: 3px solid var(--main-color-blue);
}


/* **************************************** */
/*               association                */
/* **************************************** */

.assoc {
	display: flex;
	flex-direction: column;

	gap: 64px;
}

.assoc-1,
.assoc-2 {
	width: 100%;
}

@media (min-width: 1024px) {

	.assoc {
		display: flex;
		flex-direction: row;
		gap: 64px;
	}

	.assoc-1,
	.assoc-2 {
		width: 50%;
	}

}

.assoc a {
	color: black;
}

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



.massoc {
	display: flex;
	flex-direction: column;
	gap: 64px;
	background: var(--main-color-blue);
	color: white;
}

.massoc-1,
.massoc-2 {
	width: 100%;
}

@media (min-width: 1024px) {

	.massoc {
		display: flex;
		flex-direction: row;
		gap: 64px;
	}

	.massoc-1,
	.massoc-2 {
		width: 50%;
	}

}

.massoc-1 .im {
	display: flex;
	justify-content: center;
	align-items: center;
	flex-direction: column;
	gap: 64px;
}

.massoc-1 .im img {
	max-width: 100%;
	max-height: 70vh;
}

.massoc-2 fieldset legend {
	padding: 8px 16px;
	border: 1px solid white;
	border-radius: 3px;
}

.massoc-2 fieldset table {
	width: 100%;
	padding: 16px 0;
}

.massoc-2 fieldset table thead,
.massoc-2 fieldset table tbody {
	height: 32px;
}

.nbin {
	width: 64px;
}

@media (min-width: 600px) {

	.nbin {
		width: 128px;
	}

}






.massoc p.fo {
	display: flex;
	flex-direction: column;
	gap: 16px;
	width: 100%;
}

.massoc p.fo label {
	width: 100%;
}

.massoc p.fo span {
	width: 100%;
}

.massoc p.fo input {
	width: 100%;
	height: 42px;
}

.massoc p.fo textarea {
	width: 100%;
	height: 132px;
}



@media (min-width: 680px) {

	.massoc p.fo {
		display: flex;
		flex-direction: row;
		gap: 32px;
		width: 100%;
	}

	.massoc p.fo label {
		width: 50%;
	}

	.massoc p.fo span {
		width: 50%;
	}

	.massoc p.fo input {
		width: 100%;
		height: 42px;
	}

	.massoc p.fo textarea {
		width: 100%;
		height: 132px;
	}


}

@media (min-width: 1024px) {

	.massoc p.fo {
		display: flex;
		flex-direction: column;
		gap: 16px;
		width: 100%;
	}

	.massoc p.fo label {
		width: 100%;
	}

	.massoc p.fo span {
		width: 100%;
	}

	.massoc p.fo input {
		width: 100%;
		height: 42px;
	}

	.massoc p.fo textarea {
		width: 100%;
		height: 132px;
	}


}

@media (min-width: 1368px) {

	.massoc p.fo {
		display: flex;
		flex-direction: row;
		gap: 32px;
		width: 100%;
	}

	.massoc p.fo label {
		width: 50%;
	}

	.massoc p.fo span {
		width: 50%;
	}

	.massoc p.fo input {
		width: 100%;
		height: 42px;
	}

	.massoc p.fo textarea {
		width: 100%;
		height: 132px;
	}


}








.massoc p.fo2 label {
	width: 50%;
}

.massoc p.fo2 input {
	width: 100%;
	height: 42px;
}

.massoc p.fo2 label {
	width: 50%;
}


.btn-submit2 {
	text-align: center;
}

.btn-submit2 input {
	padding: 20px 40px;
	background-color: white;
	color: var(--main-color-blue);
	border: 3px solid white;
	font-weight: 600;
}

.btn-submit2 input:hover {
	background-color: var(--main-color-blue);
	color: white;
	border: 3px solid white;
}

.ssa {
	font-weight: 200;
	font-size: 18px;
}



input[type="text"]:not(:placeholder-shown):invalid {
	/*background-color: #f5c6cb;*/
}

input[type="text"]:user-invalid,
input[type="tel"]:user-invalid,
input[type="number"]:user-invalid,
input[type="email"]:user-invalid {
	background-color: #f5c6cb;
}

textarea:user-invalid {
	background-color: #f5c6cb;
}

.sl {
	font-size: smaller;
}

.sl .lk {
	text-decoration: none;
	color: white;
}







/* **************************************** */
/*            type connexion page           */
/* **************************************** */

/*53 54 58 noir chrome*/


.k {
	width: 100%;
	min-height: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
	flex-direction: column;
  background: rgba(231, 233, 242, 1);
  padding: 16px;
}


.c {
    width:100%;
    height:100%;

    display:flex;
    justify-content:center;
    align-items:center;
    flex-direction:column;
    text-align:center;
    row-gap: 16px;

}

.c form {
    display:flex;
    flex-direction:column;
    row-gap: 16px;
    justify-content:center;
    align-items:center;
    width: 100%;
}

.ff {
	display: flex;
	flex-direction: column;
	gap: 24px;
	align-items: center;
	width: 100%;
}


progress[value].pgs {

	--w: 280px; /* the width*/
  --color:  /* the progress color */
    
    
    /* if < 90% "red" */
    linear-gradient(#721c24 0 0) 0 /calc(var(--w) * .89 - 100%) 1px,
    /* if < 100% "orange" */
    linear-gradient(#856404 0 0) 0 /calc(var(--w) * 1 - 100%) 1px,
    /* else "green" */
    #155724;
	--background: white; /* the background color */

  -webkit-appearance:none;
  -moz-appearance:none;        
  appearance: none;

  border: none;
  width: var(--w);
  height: 6px;
  margin: 12px 0 4px 0;
  border-radius:4px;
  background: white;
}

progress[value].pgs::-moz-progress-bar {
  background: var(--color);
}

progress[value].pgs::-webkit-progress-bar {
  background: var(--background);
}
progress[value].pgs::-webkit-progress-value {
  background: var(--color);
}

.f {
    width: 100%;
    height: 100%;
    text-align: center;

    border: 1px solid #aaaaaa;

    transition: all 0.2s linear;
}



.b {

    /*width:20rem;
    height: 3rem;*/
    padding: 0 20px;
    /*border-radius:4px;*/
    background-color: var(--main-color-blue);
    color: white;
    border: 3px solid var(--main-color-blue);
}

.b:active,.b:focus,.b:hover {

    background-color: white;
    color: var(--main-color-blue);
}

.o a {
    text-decoration:none;
    color: gray;
}

.o a:focus,.o a:hover {
    text-decoration:underline
}

input::-moz-focus-inner {
    border:0
}


.chckbx_vw_pwd {
	font-size: 14px;
}

.pwd_msg_error {
	color: #721c24;
	font-size: 14px;
	margin-top: -14px;
	margin-bottom: -8px;
}

.pwd_msg_info {
	color: #155724;
}




.lf {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
}
  
.lf span {
  padding: 4px 20px;
  pointer-events: none;
  position: absolute;
  transition: 0.4s;
  opacity: 0.5;
}


.wf {
	text-align:center;
  width:100%;
  height:3rem;
  border-radius:4px;
}

@media (min-width: 352px) {

	.wf {
    width:20rem;
	}

}


/* When input is focused, or the placeholder is not being displayed, change the border to blue */
.f:focus, .f:not(:placeholder-shown) {
  outline: none;
  /*border-color: var(--main-color-blue);*/
}

.f:focus {
  border: 2px solid var(--main-color-blue);
  transition: all 0.2s linear;
}

/* When input is focused, or the placeholder is not being displayed, change the placeholder size, position and color */
 .f:focus + span, .f:not(:placeholder-shown) + span {
  opacity: 1;
  background-color: lightgreen;
  background-color: white;
  /*color: var(--main-color-blue);*/
  transform: scale(0.75) translateY(-100%);

  border-radius: 20px;
  border-top: 2px solid #bbbbbb;
  border-left: 2px solid #bbbbbb;
  border-right: 2px solid #bbbbbb;

}

 .f:focus + span {
  color: var(--main-color-blue);
  border-top: 2px solid var(--main-color-blue);

  border-left: 2px solid var(--main-color-blue);
  border-right: 2px solid var(--main-color-blue);

}


.pwd_rules {
	font-size: 12px;
}

.cg {
	color: #155724;
}

.cr {
	color: #721c24;
}

.co {
	color: #856404;
}



/* **************************************** */
/*          checkbox personnalisé           */
/* **************************************** */




.chckbx {
	display: flex;
	align-items: center;
	font-size: 15px;
	color: gray;
	user-select: none;
}

.chckbx::before {
	content: '\2714';
	color: transparent;
	text-align: center;
	font-size: 24px;
	line-height: 12px;

	display: block;

	height: 14px;
	width: 14px;

	border: 2px solid rgba(143, 143, 157, 1.0);

	margin-right: 12px;
	margin-left: 5px;
	/*margin-top: 3px;*/
}

.chckbx::after {
	content: '\2714';
	color: transparent;
	text-align: center;
	font-size: 24px;
	line-height: 12px;

	display: block;

	height: 14px;
	width: 14px;

	/*border: 2px solid rgba(103, 103, 116, 1.0);*/
	border: 2px solid transparent;


	margin-left: 2px;

	position: absolute;
}

input[type="checkbox"]:checked + .chckbx {
	
	color: black;
}

input[type="checkbox"]:focus + .chckbx::before {
	
	background-color: rgba(255, 255, 255, .5);
}

input[type="checkbox"]:checked + .chckbx::before {
	
	/*background-color: white;*/
	border: 2px solid transparent;
}


input[type="checkbox"]:checked + .chckbx::after {
	color: var(--main-color-blue);
}

.dhj {
	position: relative;
}

.dhj input[type="checkbox"] {
	opacity: 0;
	width: 0; height: 0;
	position: absolute;
	top: 0;
	left: 0;
}





/* **************************************** */
/*            Effacement loader             */
/* **************************************** */



.no-js .loader {
	opacity: 0;
	pointer-events: none;
	transition: opacity 0.1s linear;
}

.no-js.vrflwhddn {
	overflow: auto;
	overflow-y: scroll;

}

.hide {
	display: none;
}