@charset "UTF-8";
/*------------------------------------------------------------------------------------------*/
/*generation de la police*/
/*! Generated by Font Squirrel (https://www.fontsquirrel.com) on December 29, 2020 */

@font-face {
	 font-family: 'poppinsbold';
	 src: url('Font style/poppins-bold-webfont.woff2') format('woff2'),
				url('Font style/poppins-bold-webfont.woff') format('woff');
	 font-weight: normal;
	 font-style: normal;

}

@font-face {
	 font-family: 'poppinsregular';
	 src: url('Font style/poppins-regular-webfont.woff2') format('woff2'),
				url('Font style/poppins-regular-webfont.woff') format('woff');
	 font-weight: normal;
	 font-style: normal;

}

@font-face {
	 font-family: 'poppinssemibold';
	 src: url('Font style/poppins-semibold-webfont.woff2') format('woff2'),
				url('Font style/poppins-semibold-webfont.woff') format('woff');
	 font-weight: normal;
	 font-style: normal;

}

@font-face {
	 font-family: 'poppinslight';
	 src: url('Font style/poppins-light-webfont.woff2') format('woff2'),
				url('Font style/poppins-light-webfont.woff') format('woff');
	 font-weight: normal;
	 font-style: normal;

}

@font-face {
	 font-family: 'poppinsmedium';
	 src: url('Font style/poppins-medium-webfont.woff2') format('woff2'),
				url('Font style/poppins-medium-webfont.woff') format('woff');
	 font-weight: normal;
	 font-style: normal;

}


/*----------------------------------------------------------------------------*/

/*Grille Magique copie Boutstrap*/
/*_______________________________________________________________________________________________________________*/
*,
*::before,
*::after {
  box-sizing: border-box;
}

@media (prefers-reduced-motion: no-preference) {
	:root {
		scroll-behavior: smooth;
	}
}

body,
html {
  height: 100%;
}

body
{
	padding:0;
	margin:0;

	font-family:'poppinsregular',system-ui,Arial;
	/*font-size: 	1rem; for BS*/
	/* font-weight: 400; for BS*/
	font-size:calc(0.79rem + 0.1vw);
	line-height: 1.8;
	/*color: #212529;*/
	color:rgb(17, 17, 17);
	text-align: left;
	letter-spacing:1.3px;
	word-spacing:2px;
	word-wrap: break-word;
	min-height: 100vh!important;

	font-weight:none!important;
	position: relative;

	/*Ajout mise a jour*/
	text-overflow: ellipsis;
}
@media all and (min-width: 992px)
{
	body
		{
			font-size: .9rem;
		}
}
/*---------------------------------------------------*/
.contenu_back_color
{
	/*margin-top: 70px;*/
	min-height: 70vh;
}
/*---------------------------------------------------*/
.Contenu
{
	width: 100%;
	padding-right: 36px! important;
	padding-left: 36px! important;
	margin-right: auto;
	margin-left: auto;
	word-wrap: break-word;

	/*border: 1px solid red;*/
}

@media all and (min-width: 1px)  /* depuis Bootstrap by jack*/
{
	.Contenu
		{
		/*	max-width:220px;*/
			max-width:100%;
		}
}
@media all and (min-width: 317px)  /* depuis Bootstrap by jack*/
{
	.Contenu
		{
		/*	max-width:280px;*/
			max-width:100%;
		}
}

@media all and (min-width: 378px)  /* depuis Bootstrap by jack*/
{
	.Contenu
		{
			/*max-width:340px;*/
			max-width:100%;
		}
}
@media all and (min-width: 576px)  /* depuis Bootstrap*/
{
	.Contenu
		{
			max-width: 540px;
		}
}

@media all and (min-width: 768px)  /* depuis Bootstrap*/
{
	.Contenu
		{
			max-width: 720px;
		}
}

@media all and (min-width: 992px) /* depuis Bootstrap*/
{
	.Contenu
		{
			max-width: 960px;
		}
}

@media all and (min-width: 1200px)  /* depuis Bootstrap*/
{
	.Contenu
		{
			max-width: 1140px;
		}
}
@media all and (min-width: 1400px)  /* depuis Bootstrap*/
{
	.Contenu
		{
			max-width: 1320px;
		}
}

/*-----------------------------------------------------------------------------*/
.ligne
{
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;

	margin-top: calc(0 * -1);/*newBs*/
	margin-right: calc((1.5rem) * -.5);/*newBs*/
  margin-left: calc((1.5rem) * -.5);/*newBs*/

	/*word-wrap: break-word;
	justify-content:space-between;*/

 	/*border: 1px solid gold;*/
}

.ligne > * {
  flex-shrink: 0; /*newBs*/
  width: 100%; /*newBs*/
  max-width: 100%; /*newBs*/
  padding-right: calc((1.5rem) * .5); /*newBs*/
  padding-left: calc((1.5rem) * .5); /*newBs*/
  margin-top: 0; /*newBs*/
}

/*------------------------------------------------------------------------------*/

.colonne
{
	position: relative;
	width: 100%;
	min-height: 1px;
	padding-right: 0px;
	padding-left: 0px;
	word-wrap: break-word;
}
.colonne
{
	-ms-flex-preferred-size: 0;
	flex-basis: 0;
	-webkit-box-flex: 1;
	-ms-flex-positive: 1;
	flex-grow: 1;
	max-width: 100%;

	flex: 1 0 0%; /*newBs*/

	/*border: 1px solid green;*/
}

.colonne1-12, .colonne2-12, .colonne3-12, .colonne4-12, .colonne5-12, .colonne6-12
, .colonne7-12, .colonne8-12, .colonne9-12, .colonne10-12, .colonne11-12, .colonne12-12
{
	position: relative;
	width: 100%;
	min-height: 1px;
	padding-right: 0px;
	padding-left: 0px;
	word-wrap: break-word;

	flex: 0 0 auto; /*newBs*/
}

@media all and (min-width: 1px)
{
	.colonne
		{
			-webkit-box-flex: 0;
			-ms-flex: 0 0 100%;
			flex: 0 0 100%;
			max-width: 100%;

		}
}

@media all and (min-width: 992px)
{
	.colonne
		{
			-ms-flex-preferred-size: 0;
			flex-basis: 0;
			-webkit-box-flex: 1;
			-ms-flex-positive: 1;
			flex-grow: 1;
			max-width: 100%;
		}
	.colonne2-12
		{
			-webkit-box-flex: 0;
		 -ms-flex: 0 0 8.33333333%;
		  flex: 0 0 8.33333333%;
		  max-width: 8.33333333%;
		}
	.colonne2-12
		{
			-webkit-box-flex: 0;
		 -ms-flex: 0 0 16.66666667%;
		  flex: 0 0 16.66666667%;
		  max-width: 16.66666667%;
		}
	.colonne3-12
		{
			-webkit-box-flex: 0;
		  -ms-flex: 0 0 25%;
		  flex: 0 0 25%;
		  max-width: 25%;
		}
 	.colonne4-12
		{
 		 -webkit-box-flex: 0;
 		 -ms-flex: 0 0 33.333333%;
 		 flex: 0 0 33.333333%;
 		 max-width: 33.333333%;
 		}
	.colonne5-12
		{
			-webkit-box-flex: 0;
		  -ms-flex: 0 0 41.666667%;
		  flex: 0 0 41.666667%;
		  max-width: 41.666667%;
		}
		.colonne6-12
			{
				-webkit-box-flex: 0;
			  -ms-flex: 0 0 50%;
			  flex: 0 0 50%;
			  max-width: 50%;
			}
	.colonne7-12
		{
	 		 -webkit-box-flex: 0;
	 		 -ms-flex: 0 0 58.33333333%;
	 		 flex: 0 0 58.33333333%;
	 		 max-width: 58.33333333%;
	 	}
 	.colonne8-12
		{
 		 -webkit-box-flex: 0;
 		 -ms-flex: 0 0 66.666667%;
 		 flex: 0 0 66.666667%;
 		 max-width: 66.666667%;
 		}
	.colonne9-12
		{
			-webkit-box-flex: 0;
		  -ms-flex: 0 0 75%;
		  flex: 0 0 75%;
		  max-width: 75%;
	  }
	.colonne10-12
		{
			-webkit-box-flex: 0;
			-ms-flex: 0 0 83.33333333%;
			flex: 0 0 83.33333333%;
		  max-width: 83.33333333%;
		}
	.colonne11-12
		{
			-webkit-box-flex: 0;
			-ms-flex: 0 0 91.66666667%;
			flex: 0 0 91.66666667%;
			max-width: 91.66666667%;
		}
	.colonne12-12
		{
			-webkit-box-flex: 0;
			-ms-flex: 0 0 100%;
			flex: 0 0 100%;
			max-width: 100%;
		}
  }

/*-------------------------------------------*/

	.colonneCenter
	{
	   max-width: 320px; /* On a indiqué une largeur (obligatoire) */
	   margin: auto; /* On peut donc demander à ce que le bloc soit centré avec auto */
		/*font-size: 1rem;*/
		line-height: 1.5;
		word-wrap: break-word;

	/*	border: 1px solid black;*/
	}
	/*
	@media all and (max-width: 378px)
	{
		.colonneCenter
			{
				max-width: 290px;
			}
	}
	@media all and (max-width: 317px)
	{
		.colonneCenter
			{
				max-width: 236px;
			}
	}*/

.paddingColonne
{
padding:10px;
}
@media all and (max-width: 768px)
{
	.paddingColonne
	{
	padding:0px;
	padding-top: 12px;
	padding-bottom: 12px;
	}

}


/*Dimension Standard Bootstrap ameliorer par Jackbutshe*/
/*______________________________________*/
article, aside, dialog, figcaption, figure, footer, header, hgroup, main, nav, section
{
	display: block;
}

hr {
  margin: 1rem 0;
  color: inherit;
  background-color: currentColor;
  border: 0;
  opacity: 0.25;
}

hr:not([size]) {
  height: 1px;
}
h1
{
	margin-top: 0;
	margin-bottom: 0.5rem;
	line-height: 1.2;
	font-size: calc(1.325rem + 0.9vw);
	font-weight: 500;
}
.H1
{
	color: yellow;
	font-family:system-ui,'poppinsmedium',Arial;
	font-style: italic;
	font-weight: normal;
	text-decoration: none;
	text-align: left;
}

@media all and (min-width: 1200px)
{
	h1
		{
			font-size: 2rem;
		}
}


h2
{
	margin-top: 0;
	margin-bottom: 0.5rem;
	font-weight: 500;
	line-height: 1.2;
	/*font-size: 1.5rem;*/
	font-size: calc(1.325rem + 0.9vw);
}
.H2
{
	/*font-family: inherit;*/
	font-family:system-ui,'poppinsmedium',Arial;
}
@media (min-width: 1200px) {
  h2{
    font-size: 2rem;
  }
}

h3
{
	margin-top: 0;
	margin-bottom: 0.5rem;
	font-weight: 500;
	line-height: 1.2;
	/*font-size: 1.3rem;*/
	/*font-size: calc(1.375rem + 1.5vw);*/
	  	font-size: calc(1.3rem + 0.6vw);
}
.H3
{
	/*font-family: inherit;*/
	font-family:system-ui,'poppinsmedium',Arial;
}
@media (min-width: 1200px) {
  h3{
  	font-size: calc(1.3rem + 0.6vw);
  }
}

h4
{
	margin-top: 0;
	margin-bottom: 0.5rem;
	/*font-weight: 400; font-weight: 500;for BS*/
	line-height: 1.2;
	/*font-size: 1.1rem;*/
	font-size: calc(1.275rem + 0.3vw);
}
.H4
{
	/*color: #000080;*/
	font-family:system-ui,'poppinssemibold','poppinslight','poppinsmedium','poppinsregular','poppinsbold',Arial;
	text-align: center;
}
@media (min-width: 1200px) {
  h4 {
    font-size: 1.5rem;
  }
}

h5
{
	margin-top: 0;
	margin-bottom: 0.5rem;
	font-weight: 500;
	line-height: 1.2;
	/*font-size: 1rem;*/
	/*font-size: 1.25rem;/*from BS*/
	font-size:calc(1.15rem + 0.1vw);
}
.H5
{

	/*font-family: inherit;*/
	font-family:system-ui,'poppinssemibold','poppinslight','poppinsmedium','poppinsregular','poppinsbold',Arial;
	/*color: #000080;*/
	color:#2196f3 !important;
	/*font-style: italic;*/
	/*font-family:'poppinsbold';	/*font-weight: bold;*/*/
	text-align: center;
}
@media (min-width: 1200px) {
  h5{
    font-size: 1.25rem;
  }
}


h6
{
	margin-top: 0;
	margin-bottom: 0.5rem;
	/*font-weight: 500;*/
	font-weight: normal;
	/*font-weight: 500; for BS*/
	line-height: 1.2;
	/*font-size: 1rem;for BS*/
	font-size:calc(0.75rem + 0.1vw);
}
.H6
{
	/*font-family: inherit;*/
	font-family:system-ui,'poppinssemibold','poppinslight','poppinsmedium','poppinsregular','poppinsbold',Arial;
	font-style: normal;
	text-decoration: none;
}
@media (min-width: 1200px) {
  h6 {
    font-size: 0.9rem;
  }
}
p
{/*
	margin-top: 0.5rem;
	margin-bottom: 0.5rem;*/
}
/*
.P
{
	font-size:0.845rem;
	text-align: justify;
}
@media all and (max-width: 378px)
{
.P
	{
		font-size:0.75rem;
	}
}
*/
a
{
		color: #000080;
		text-decoration: none;
}

table
{
	border-collapse: collapse;
	border: inherit;
}

caption
{
	padding-top: 0.75rem;
	padding-bottom: 0.75rem;
	text-align: left;
	caption-side: top;

	/*font-size:0.88rem;*/
}
@media all and (max-width: 378px)  /* depuis Bootstrap*/
{
	caption
		{
			/*font-size:0.75rem;*/
		}
}

th
{
		color: #000080;
	/*	font-size:0.88rem;*/

		font-style: normal;
		font-weight: normal;
		text-decoration: none;
		text-align: left;
}

@media all and (max-width: 378px)  /* depuis Bootstrap*/
{
	th
		{
		/*	font-size:0.75rem;*/
		}
}

td
{
/*	font-size:0.78rem;*/
	text-align: left;
}
.TD:before {
content: '';
display: block;
min-width: 8em;
}
.TD2:before {
content: '';
display: block;
min-width: 8.1em;
}
.TD3:before {
content: '';
display: block;
min-width: 11.2em;
}
.TD4:before {
content: '';
display: block;
min-width: 12.4em;
}

@media all and (max-width: 378px)  /* depuis Bootstrap*/
{
	td
		{
			/*font-size:0.75rem;*/
		}
}

label
{
	display: inline-block;
}
.LABEL
{
	margin-bottom: 0.05rem;
	margin-top: 0.5rem;
	/*font-size: calc(0.75rem + 0.1vw);*/
	/*font-size: .8rem;*/
	line-height: 1.5;
	text-align: left;

  font-style: italic;
	font-family:'poppinssemibold';	/*font-weight: bold;*/
	text-decoration: none;
}

input
{
	display: inline-block;
	margin-bottom: 0.5rem;
	margin-top: 0.05rem;
	/*font-size: 0.9rem;*/
	line-height: 1.5;
	text-align: left;
}
input:disabled , input[readonly]
{
	background-color: none;
	background-color:rgba(180,180,180,0.05);
}

select /*By Jack*/
{
	margin-bottom: 0.5rem;
}

.color_titre
{
	color:#2196f3 !important;
}
.background_fade_color
{
	background-color: rgba(247, 249, 253,0.9);
	border-left: 1px dashed rgba(0, 0, 0, 0.1);
	border-right: 1px dashed rgba(0, 0, 0, 0.1);
}
.background_border_color
{
	border-left: 1px dashed rgba(0, 0, 0, 0.1)!important;
	border-right: 1px dashed rgba(0, 0, 0, 0.1)!important;
}
.border_color_blue
{
	border-color: blue!important;
}
.border_color_green
{
	border-color: green!important;
}
.border_color_red
{
	border-color: red!important;
}
.border_color_yellow
{
	border-color: yellow!important;
}

.Bouton
{
	display: inline-block;
	/*background-color:rgba(0, 0, 0, 0.03);*/
	background: -webkit-linear-gradient(bottom, rgba(247, 249, 253,0.9), white);
	border: 1px solid rgba(0, 0, 0, 0.1);
	border-radius: 4px;
  cursor: pointer;
	padding:0.15rem 0.5rem!important;
	margin:1px!important;
	transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;

	decoration:none;
	color: inherit;
}
.Bouton:hover
{
  background:#ffcc66;
}

.BoutonExpend
{
	display: inline-block;
	min-width: 60%;
	/*background-color:rgba(0, 0, 0, 0.03);*/
	background: -webkit-linear-gradient(bottom, rgba(247, 249, 253,0.9), white);
	border: 1px solid rgba(0, 0, 0, 0.08);
	border-radius: 4px;
  cursor: pointer;
  padding:0.15rem 0.5rem!important;
	margin:1px!important;
	transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;

	decoration:none;
	color: inherit;
}
.BoutonExpendSmall
{
	display: inline-block;
	min-width: 100px;
	/*background-color:rgba(0, 0, 0, 0.03);*/
	background: -webkit-linear-gradient(bottom, rgba(247, 249, 253,0.9), white);
	border: 1px solid rgba(0, 0, 0, 0.08);
	border-radius: 4px;
  cursor: pointer;
  padding:0.15rem 0.5rem!important;
	margin:1px!important;
	transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;

	decoration:none;
	color: inherit;
}
.BoutonExpend:hover
{
  background:#ffcc66;
}

.Disabled
{
	pointer-events: none;
	background-color: none;
	background-color:rgba(180,180,180,0.05);
	background:rgba(180,180,180,0.05);
	opacity: 0.35;
}

.BoutonRetour
{
float:right!important;
color:black;
right: 0;
top:0;
margin: 0!important;
padding:0.5rem!important;
border: 1px solid #ced4da!important;
border-radius: 0.25rem!important;
}
.BoutonRetour:hover
{
  background-color:#2196f3;
}


.boutonLien
{
	display: inline-block;
	font-weight: 400;
	text-align: center;
	white-space: nowrap;
	vertical-align: middle;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	border: 1px solid transparent;
	border-radius: 0.50rem;
	padding:  0.15rem 1rem;

	/* font-size: 1.25rem; */
	/* line-height: 1.5; */

	color: white;
	background-color: none;
	background-color: rgba(100,100,255,0.5);
	border-color: white;
	font-style: italic;
	letter-spacing:1px;
	transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}

.boutonLienPetit
{
	display: inline-block;
	font-weight: 400;
	text-align: center;
	white-space: nowrap;
	vertical-align: middle;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	border: 1px solid transparent;
	border-radius: 0.50rem;
	padding:  0.1rem 0.5rem;
	color: white;
	background-color: none;
	background-color: rgba(100,100,255,0.5);
	border-color: white;
	font-style: italic;
	letter-spacing:1px;
	transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}

.boutonBande
{
	display: block;
	font-weight: 400;
	text-align: center;
	align-items: center!important;
	white-space: nowrap;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	border-top: 2px solid rgba(0,0,0,0.2);
	min-height: 35px!important;

	padding:  0.5rem 0.5rem;
	color:#fff !important;

	background-color: none;
	background-color:#4daaf6 !important;
	border-color: white;
	letter-spacing:1px;

  cursor: pointer;
	transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}
.boutonBande:hover
{
	text-decoration: none;
	background-color: none;
	/*color:#000 !important;*/
	color:white!important;
	background-color:#2196f3 !important
}
.boutonBandeHoverBorder
{
	border:1px solid rgba(0,0,0,0.1);
}
.boutonBandeHover:hover
{
	text-decoration: none!important;
	background-color: none;
	/*color:#000!important;*/
	color:white!important;
	background-color:#2196f3!important;
	cursor: pointer;
	transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
/*  border-left:1px solid white;*/
}

.boutonPhoto, .boutonPhoto a
{
	font-weight: 400;
	text-align: center;
	align-items: center!important;
	white-space: nowrap;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	height: 25px;

	padding:  0.1rem 0.5rem;
	/*color: white;*/
	color:white!important;
	letter-spacing:1px;
  cursor: pointer;
	transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}

.boutonPhoto:hover
{
	text-decoration: none;
	background-color: none;
	background-color:#2196f3 !important
}

.boutonReset
{
	display: inline-block;
	font-weight: 400;
	text-align: center;
	white-space: nowrap;
	vertical-align: middle;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	border: 1px solid transparent;
	border-radius: 0.50rem;
	padding:  0.15rem 0.5rem;
	/*font-size: 1.25rem;*/
	/* line-height: 1.5; */
	color: white;
	background-color: none;
	background-color: rgba(255,100,100,0.7);
	border-color: white;
	font-style: italic;
	letter-spacing:1px;
	cursor: pointer;
	transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}
.boutonConfirm
{
	display: inline-block;
	font-weight: normal;
	text-align: center;
	white-space: nowrap;
	vertical-align: middle;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	border: 1px solid #ffdf80;
	border-radius:4px;
	padding: 0.15rem 0.5rem;
	/*font-size: 1.25rem;*/
	/* line-height: 1.5; */
	color:black;
	background-color: none;
	background-color: #ffdf80 ;/*#ffc266*/
	/*border-color: white;*/
	/*font-style: italic;*/
	letter-spacing:2px;
	width: 100%;
	cursor: pointer;

	line-height: 1.5;
	transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
	height: 34px!important;
}
.boutonConfirm_accueil
{
	display: inline-block;
	font-weight: normal;
	text-align: center;
	white-space: nowrap;
	vertical-align: middle;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	border-radius:4px;
	padding: 0.15rem 0.5rem;
	/*font-size: 1.25rem;*/
	/* line-height: 1.5; */
	color:black;
	background-color: none;
	/*border-color: white;*/
	/*font-style: italic;*/
	letter-spacing:2px;
	width: 100%;
	cursor: pointer;

	line-height: 1.5;
	transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}
.boutonLienSize14px
{
	/*font-size:14px;*/
}
.boutonLienSize10px
{
	/*font-size:10px;*/
}

.Error_msg_style
{
	font-size:12px;
	color:rgb(230,0,0);
	text-align:left;
}
/*____________________________________________________________________________*/




/*MON STYLE*/
/*____________________________________________________________________________________*/

.H5 a
{
	color:white;
	/*font-size:0.85rem;*/
	font-family:'poppinsregular',system-ui,Arial;

	font-style: normal;
	font-weight: normal;
	text-decoration: none;

	display: inline-block;
	padding:0px 5px 0px 5px;
	margin:0px 0px 0px 0px;
}
.H5 a:hover
{
	color: red;
	border-bottom: none;
	background-color: none;
	background-color: rgba(254,240,200,0.5);
	border-radius: 0.50rem;
}
@media all and (max-width: 378px)  /* depuis Bootstrap*/
{
	.H5 a
		{
			/*font-size:0.76rem;*/
		}
}
@media all and (max-width: 768px) /* Adaptation petit ecran*/
{
    .H5 a
		{
			padding:0px 0px 0px 0px;
			margin:0px 5px 0px 0px;
		}
}

#titre_principal
{
	display: inline-block;
}
@media all and (max-width: 576px) /* Format Telephone Mise en page Mobile first*/
{
	#titre_principal
		{
			text-align: left;
		}
}
#titre_principal .H5
{
	color:white;
	text-align: left;
	margin-bottom: 0px;
	padding-bottom:0px;

	font-style: normal;
	font-weight: normal;
	text-decoration: none;
	font-family:'poppinsmedium',system-ui,Arial;
}
@media all and (max-width: 576px) /* Format Telephone Mise en page Mobile first*/
{
	#titre_principal .H5
		{
			text-align: left;
		}
}

mark a
{
	color: #000080;
	/*font-size:0.88rem;*/
	font-family:'poppinssemibold','poppinslight','poppinsmedium','poppinsregular','poppinsbold',system-ui,Arial;

	font-style: italic;
	font-weight: normal;
	text-decoration: none;
}
mark a:hover
{
	color: red;
	border-bottom:1px solid blue;
}

@media all and (max-width: 378px)  /* depuis Bootstrap*/
{
	mark a
		{
			/*font-size:0.75rem;*/
		}
}

.tuto .H5
{
	font-family:'poppinssemibold','poppinslight','poppinsmedium','poppinsregular','poppinsbold',system-ui,Arial;

}

.actRecSoustitre
{
	font-style: italic;
	font-family:'poppinsbold';	/*font-weight: bold;*/
}

.sousTitre
{
	font-style: italic;
	font-family:'poppinsbold';	/*font-weight: bold;*/

	text-align: center;

	background-color: none;
	background-color: rgba(180,180,180,0.25); /* Pour les navigateurs plus récents */
	/*border-radius:6px;*/
	/*box-shadow: 0px 0px 1px 1px rgba(119, 119, 119, 0.5);*/
	color: blue;

	padding: 2px 0px 2px 0px;
	margin-left: -20px;
	margin-right: -20px;
}

.SignatureCC, .ActivRecent th
{
	text-align: center;
}

.titreSection
{
	text-align: left;

	background-color: none;
	background-color: rgba(180,180,180,0.25); /* Pour les navigateurs plus récents */
	border-radius:6px;
	box-shadow: 0px 0px 1px 1px rgba(119, 119, 119, 0.5);

	padding: 5px 5px 5px 5px;
	margin-left: -5px;
	margin-right: -5px;
}

.titreFormulaire
{
	text-align: left;
}
@media all and (max-width: 768px) /* Format Telephone Mise en page Mobile first*/
{
	/*------------------------------------------------*/
	.titreFormulaire
		{
			/*text-align: center;*/
		}
}

.titreFormulaire span
{
	text-align: right;
}

nav .H5
{
	text-align: right;
}
@media all and (max-width: 576px) /* Format Telephone Mise en page Mobile first*/
{
		nav .H5
		{
			padding-top:12px;
			text-align: left;
			border-top: 1px solid yellow;
		}
}
@media all and (max-width: 768px) /* Adaptation petit ecran*/
{
    nav .H5
		{
			text-align: left;
			padding-top:12px;
			border-top: 1px solid yellow;
		}
}
@media all and (max-width: 992px) /* Adaptation petit ecran*/
{
		nav .H5
		{
			padding-top:12px;
		}
}
/*
.achat .H5, .vente .H5, .menu .H5
{
	background-color: none;
	background-color: rgba(180,180,180,0.25); /* Pour les navigateurs plus récents */
 	/*border-radius:6px;*/
	/*box-shadow: 0px 0px 1px 1px rgba(119, 119, 119, 0.5);*/
/*
	padding: 2px 0px 2px 0px;
	margin-left: -20px;
	margin-right: -20px;
}*/

.backgroundBlack
{
/*	background-color: none;
	background-color: #f3f3f3;*/
  /*border-bottom: 1px solid #e7e7e7;*/
	/*border: 1px solid #e7e7e7;*/
 	/*border-radius:6px;*/
	/*box-shadow: 0px 0px 1px 1px rgba(119, 119, 119, 0.5);*/

}

.heightLineAccueil
{
	min-height: 65px;
	align-items: center;
	padding-top: 7px;
}
.heightLine
{
	min-height: 30px;
	align-items: center;
	padding-top: 7px;
}
.heightLineSmall
{
	min-height: 20px;
	align-items: center;
	padding-top: 5px;
}

.soulignement_titre
{
	border-bottom: 1px solid #e7e7e7;
}
.border_right_tab
{
	border-right: 1px solid #e7e7e7;
}
.border_bottom_tab
{
	border-bottom: 1px solid #e7e7e7;
}
/*Parametre standard table*/
/*------------------------------*/

.maTable
{
	width: 100%;
	max-width: 100%;
	background-color: none;
	background-color: transparent;
}

.maTable th
{
	padding: 0.75rem;
	font-style: none;
	font-family:'poppinssemibold';
	vertical-align: bottom;
	color:green;
}
.maTable td
{
	padding: 0.75rem;
	vertical-align: top;
}

.maTable thead
{
	/*
	border-top: 1px solid rgba(0,0,0,0.2);*/
}

.maTable tbody
{
	/*border-top: 1px solid rgba(0,0,0,0.2);*/
}

.maTable .maTable
{
	/*background-color: none;
	background-color: #fff;*/
}
.maTableColor tbody tr:nth-of-type(odd)
{
	background-color: none;
	background-color: rgba(247, 249, 253,0.9);
}

.maTableModif1
{
	border-left: 1px solid rgba(0,0,0,0.2);
	border-right: 1px solid rgba(0,0,0,0.2);

}
.maTableModif1 td
{
	/*font-size: 0.9rem;*/
	padding: 0.5rem;
}
@media all and (max-width: 576px) /* Format Telephone Mise en page Mobile first*/
{
	.maTableModif1 td
		{
			/*font-size: 0.7rem;*/
		}
}


.maTableProfil
{
	width: 100%;
	max-width: 100%;
	margin: 0;
	background-color: transparent;
	border:none;

}

.maTableProfil th
{
	padding: 0.3rem;
	padding-top: 0rem;
/*	color:black;*/
	color:rgb(17, 17, 17);
	font-style: italic;
	font-family:'poppinsbold';	/*font-weight: bold;*/
	vertical-align: bottom;
	text-align: left;
}
.maTableProfil td
{
	padding: 0.3rem;
	padding-top: 0rem;
	vertical-align: top;

	border-bottom: 1px solid rgba(0,0,0,0.1);

	text-align: left;

	background-color: rgba(0, 0, 0, 0.01);
	/*font-size:0.95rem;*/

}

@media all and (max-width: 378px)  /* depuis Bootstrap*/
{
	.maTableProfil td
		{
			/*font-size:0.82rem;*/
		}
}

.maTableProfil thead
{
	/*border-top: 1px solid rgba(0,0,0,0.2);*/
}

.maTableProfil tbody
{
	/*border-top: 1px solid rgba(0,0,0,0.2);*/
}

.maTableProfil .maTableProfil
{
	/*background-color: none;
	background-color: #fff;*/
}



/*Apparences dynamiques*/
/*-------------------------------*/

p a:hover ,h5 a:hover
{
	text-decoration: none;
	color: red;
	border-bottom: none;
}
.boutonLien:hover, .boutonLienPetit:hover
{
	text-decoration: none;
	border: 1px solid transparent;
	color: white;
	background-color: none;
	background-color: rgba(20,30,255,0.5);
}

.boutonReset:hover
{
	text-decoration: none;
	border: 1px solid transparent;
	color: white;
	background-color: none;
	background-color: rgba(255,30,20,0.7);
}
.boutonConfirm:hover
{
	text-decoration: none;
	/*border: 1px solid #ced4da;*/
	color: #000066;
	background-color: none;
	background-color: #ffcc66; /*#ffad33*/
}
.boutonConfirm_accueil
{
	text-decoration: none;
	color: #000066;
	background-color: none;
}
.Reseausociaux img:hover
{
	/*border: 0px solid blue;*/
	text-decoration: none;
	border-radius: 15px;
}
.Reseausociaux a:hover
{
	text-decoration: none;
	border-bottom: none;
}






/*MES CLASS MISE EN PAGE*/
/*_________________________________________________________________________*/
.imageRectangle
{
	min-width:200px;
	width:100%;
	max-width:320px;
	min-height:30px;
	height:100%;
	max-height:95px;
}

.photoProfil
{
  text-align: center!important;
	max-width:200px;
	max-height:200px;
	margin: auto!important;
}
.photoProfil-carre
{
	min-width:100px;
	width:100%;
	max-width:200px;
	min-height:100px;
	height:100%;
	max-height:200px;
}

.photoProfil-ronde
{
	min-width:100px;
	width:100%;
	max-width:106px;
	min-height:100px;
	height:100%;
	max-height:106px;

	-moz-border-radius:65px;
	-webkit-border-radius:65px;
	border-radius:65px;
}
.photoProfil-carte
{
  text-align: center!important;
	max-width:1004px;
	max-height:200px;
	height:650px;
	margin: auto!important;
}
.photoProfil-selfie-vertical
{
  text-align: center!important;
	max-width:1080px;
	max-height:200px;
	height:1350px;
	margin: auto!important;
}
.photoProfil-selfie-horizontal
{
  text-align: center!important;
	max-width:1080px;
	max-height:200px;
	height:566px;
	margin: auto!important;
}
.photoProfil .fichierPhoto {
    position: relative;
    overflow: hidden;
    margin-top: -17%;
    width: 100%;
    border: none;
    border-radius: 0;
    font-size: 15px;
    background: #212529b8;
		min-height: 34px;
}
/*
.photoProfil .fichierPhoto input {
    position: absolute;
    opacity: 0;
    right: 0;
    top: 0;
}
*/


.textCenter, .boutonPositionCenter
{
	text-align: center;
}
.textLeft, .boutonPositionLeft
{
	text-align: left;
}
.textRight
{
	text-align: right;
}
.textSouligner
{
	border-bottom: #000080 solid 0.3px;
	/*width: 50%;*/
}
.boutonPositionRight
{
	float:right;
}


.paddingBottom
{
	padding-bottom:0px;
}

.symboleDevise
{
	padding:0px;
	margin:0px;
}
/*------------------*/

.grasStyle, .grasStyle td
{
	font-family:'poppinssemibold';	/*font-weight: bold;*/
}
.italicStyle
{
	font-style: italic;

}
.redColor
{
	color:#cc0000;
}
.goldColor
{
	color:gold;
}

.greenColor
{
	color:rgb(0,200,0);
}
.blackColor
{
	/*color:#404040;*/
	color:rgb(17, 17, 17);
}
.blueColor
{
	color:blue;
}
.greyColor
{
 	color:rgb(153, 153, 102);
}

.textBordure
{
	display: inline-block;
	margin:1%;
	text-align: center;
	white-space: nowrap;
	vertical-align: middle;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	border: 1px solid green;
	border-radius: 0.50rem;
	padding:  0.15rem 1rem;
	color: green;
	background-color: none;
	background-color: white;
	font-style: italic;
}
.Bordure1
{
	/*border: 1px solid;
	border-color:rgba(0,0,0,0.2);*/
	padding: 8px;
	width:100%;
	margin-bottom:20px;
}

.Bordure1Colonne
{
	/*border: 0.5px solid;*/ a/*a cause de w3*/
	border-color:rgba(0,0,0,0.2);
	padding: 8px;
/*
	box-shadow: 0px 1px 0px 0.5px #f2f2f2;
	-moz-box-shadow: 0px 1px 0px 0.5px #f2f2f2;
	-webkit-box-shadow: 0px 1px 0px 0.5px #f2f2f2;*/
	box-shadow:0 2px 5px 0 rgba(0,0,0,0.16),0 2px 10px 0 rgba(0,0,0,0.12) /* by w3*/
}

.BordureInForm
{
	border: 1px solid;
	border-color:rgba(0,0,0,0.2);
	padding: 8px;
	width:auto;
	margin-bottom:20px;
}

.styleBordure
{
	border-radius:0.3rem;
	margin:1.8px;
}

.styleBordure1
{
	border-radius:0.5rem;
	margin:0px;
}

.BordureGold
{
	border: 0.2px solid;
	border-color:gold;
	border-radius:0.2rem;
	margin:0px;
	margin-top:0.5px;
	margin-bottom:7px;
	padding:5px;
	padding-bottom: 0px;
}

/*-------------------------*/
.iconFormNav
{
	display: block;
	padding: 0px;
	margin: auto;
	padding-top: 5px;

		min-width:19.5px;
		width:100%;
		max-width:19.5px;
		min-height:19.5px;
		height:100%;
		max-height:19.5px;
}
@media all and (max-width: 768px) /* Adaptation petit ecran*/
{
.iconFormNav
	{
		min-width:17px;
		width:100%;
		max-width:17px;
		min-height:17px;
		height:100%;
		max-height:17px;
	}
}


.iconForm
{
	padding: 0px;
	margin: 0px;

		min-width:14px;
		width:100%;
		max-width:16px;
		min-height:14px;
		height:100%;
		max-height:16px;

		margin-bottom: -2px;
}
@media all and (max-width: 768px) /* Adaptation petit ecran*/
{
.iconForm
	{
		min-width:13px;
		width:100%;
		max-width:16px;
		min-height:13px;
		height:100%;
		max-height:16px;

	}
}
.iconFormFooter
{
		min-width:30px;
		width:100%;
		max-width:30px;
		min-height:30px;
		height:100%;
		max-height:30px;
		border-radius:3.8px;
}

@media all and (max-width: 768px) /* Adaptation petit ecran*/
{
.iconFormFooter
	{
		min-width:23px;
		width:100%;
		max-width:23px;
		min-height:23px;
		height:100%;
		max-height:23px;
		border-radius:3px;

	}

}
.iconFormLogo
{
		min-width:50px;
		width:100%;
		max-width:50px;
		min-height:50px;
		height:100%;
		max-height:50px;
}
@media all and (max-width: 768px) /* Adaptation petit ecran*/
{
.iconFormLogo
	{
		min-width:40px;
		width:100%;
		max-width:40px;
		min-height:40px;
		height:100%;
		max-height:40px;

	}
}

.img_style
{
		min-width:30px;
		/*width:100%;*/
		max-width:100%;
		min-height:30px;
		height:100%;
		max-height:240px;
		border-radius:3.8px;
}
.img_styleAccueil
{
		min-width:30px;
		max-width:100%;
		min-height:30px;
		max-height:100%;
}

/*-------------------------*/
.achat_back_ground
{
	background-color: none;
	background: url('../images/Achat2.png') no-repeat center!important;
}
.vente_back_ground
{
	background-color: none;
	background: url('../images/vente2.png') no-repeat center!important;
}
.filigramCC
{
	background-color: none;
	background: url('../images/logosite2.png') no-repeat center!important;
}
/*------------------------------------------------------------*/



/*STRUCTURATION DE LA PAGE*/
/*___________________________________________________________________________________________*/

.ActivRecent article
{
	overflow: auto;
}

.tuto
{
	padding-top: 15px;
}

.Reseausociaux img
{
	padding: 1px;
	margin-right: 3px;
}




/*ControleTableFormulaire*/
/*---------------------------*/

.formStyle
{
	display: block;
	width: 100%;
	padding: 0.25rem 0.75rem;

	/*font-size: 0.9rem;*/
	line-height: 1.8;
	color:rgb(17, 17, 17);
	background-color: none;
	background-color: white;
	background-clip: padding-box;
	border: 1px solid #ced4da;
	border-radius: 0.2rem;
	transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
	letter-spacing:1.5px;
	max-height: 33px!important;
}
@media all and (max-width:378px)
{
	.formStyle
		{
			padding: 0.25rem 1rem;
		}
}
@media all and (max-width:317px)
{
	.formStyle
		{
			padding: 0.25rem 1rem;
		}
}

/*---------------------------------------------------------------------------*/

.formStyleField
		{
			margin-left:0px;
			width: 315px;
			border: none;/*1px solid;*/
			border-color:rgba(0,0,0,0.2);
			padding: 0.25rem 0.1rem 0.5rem 0.1rem ;
			display: inline-block;
		}
@media all and (max-width:378px) /* depuis Bootstrap*/
{
	.formStyleField
		{
			padding:  0rem  0.1rem;
			width: 285px;
		}
}

/*----------------------------------------------------------------------------*/

.formStyleInField
{
	display: block;
	width: 100%;
	padding: 0.25rem 0.75rem;
	/*font-size: 0.9rem;*/
	line-height: 1.8;
	/*color: rgb(0,0,255);*/
	background-color: none;
	background-color: white;
	background-clip: padding-box;
	border: 1px solid #ced4da;
	border-radius: 0.25rem;
	transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
	letter-spacing:1.3px;
	text-align:left;

		min-height: 33px!important;
		max-height: 33px!important;
}
.formStyleInField option,.formStyleInField optgroup
{
	margin: 3rem 4rem!important;
	padding: 3rem 4rem!important;
	line-height: 2;
	font-size: 14px;
	width: 100%;
	border: 1px solid blue!important;
}


/*----------------------------------------------------------------------------*/


.formStyleInFieldWidth
{
	display: inline-block;
	width: 180px;
	padding: 0.25rem 0.75rem;
	/*font-size: 0.9rem;*/
	line-height: 1.8;
	color: rgb(0,0,255);
	font-family:'poppinsbold';	/*font-weight: bold;*/
	background-color: none;
	background-color: white;
	background-clip: padding-box;
	border: 1px solid #ced4da;
	border-radius: 0.25rem;
	transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
	letter-spacing:1.3px;
	text-align:right;
}
@media all and (max-width:378px) /* depuis Bootstrap*/
{
	.formStyleInFieldWidth
		{
			width: 150px;
		}
}
/*----------------------------------------------------------------------------*/

.formStyle:focus, .formStyleInField:focus ,.formStyleInFieldWidth:focus
{
	color:rgb(17, 17, 17);
	background-color: none;
	background-color:white;
	border-color: #999eff;
	outline: 0;
	box-shadow: 0 0 0 0.1rem rgba(0, 123, 255, 0.25);
}
/*----------------------------------------------------------------------------*/

#devise
{
	font-family:'poppinsmedium';	/*font-weight: bold;*/
	border: none;
	padding-right:5px;
	padding-bottom:8.5px;
	padding-top:4.5px;
	background-color: none;
	background-color:rgba(180,180,180,0.15);
	border-radius: 0.25rem;
}

#deviseBlock2
{
	font-family:'poppinsmedium';	/*font-weight: bold;*/
	border:0.1px solid #cccccc;
	padding:5px;
	background-color: none;
	border-radius: 1rem;
	padding-right: 0px;

}
#deviseBlock
{
	font-family:'poppinsmedium';	/*font-weight: bold;*/
	border:none;
	padding:5px;
	background-color: none;
	background-color:#fff7cc;
	border-top-right-radius: 1rem;
	border-bottom-right-radius: 1rem;
}

.displayBloc
{
display: inline-block;
margin-top: 3px;
margin-bottom: 4px;
}
.displayBlocOnly
{
display: inline-block;

}

#deviseBoutton
{
	font-family:'poppinsmedium';	/*font-weight: bold;*/
	border:1px gold solid;
	padding:5px;
	background-color: none;
	background-color:rgba(180,180,180,0.15);
	border-radius: 0.25rem;
	cursor: pointer;
}
#deviseBoutton:hover
{
	border:1px green solid;
	background-color: none;
	background-color:rgba(0,130,0,0.5);
}
#iconBoutton
{
	border:1px gold solid;
	padding:1px;
	background-color: none;
	background-color:rgba(180,180,180,0.15);
	border-radius: 0.25rem;
}

.iconFormMonnais
{
	display: inline-block;
	vertical-align: bottom;
	padding: 1rem 0.5rem 1rem 0.5rem ;
}
.HoverLien:hover
{
	text-decoration: none;
	color: red!important;
	border-bottom: none;
}
/*----------------------------------------------------------------------------*/



/*ADAPTATION MISE EN FORME TELEPHONE*/
/*-----------------------------------*/
/*________________________________________________________________________________________________________*/


@media all and (max-width: 576px) /* Format Telephone Mise en page Mobile first*/
{
	/*-------------------------------------*/
	.textJustifyMobile
		{
			text-align: justify;
			padding:auto;
		}
}


/*ALL ANIMATION SUR LE SITE*/
/*-----------------------------------*/
/*________________________________________________________________________________________________________*/

.rotationAnim
{
		-webkit-animation-name: rotation360; /* Safari 4.0 - 8.0 */
		-webkit-animation-duration: 30s; /* Safari 4.0 - 8.0 */
		animation-name: rotation360;
		animation-duration: 30s;
}

@-webkit-keyframes rotation360
{
    from
		{
			-ms-transform: rotate(0deg); /* IE 9 */
	   	-webkit-transform: rotate(0deg); /* Safari */
	    transform: rotate(0deg); /* Standard syntax */
		}
    to
		{
			-ms-transform: rotate(360deg); /* IE 9 */
	    -webkit-transform: rotate(360deg); /* Safari */
			transform: rotate(360deg); /* Standard syntax */
		}
}
@keyframes rotation360
{
	from {
					-ms-transform: rotate(0deg); /* IE 9 */
					-webkit-transform: rotate(0deg); /* Safari */
					transform: rotate(0deg); /* Standard syntax */
			}
	to 	{
					-ms-transform: rotate(360deg); /* IE 9 */
					-webkit-transform: rotate(360deg); /* Safari */
					transform: rotate(360deg); /* Standard syntax */
			}
}
