@charset "UTF-8";

/*--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/
/*--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/

/* MISE EN PAGE CONSOLE ADMINISTRATEUR */

/*--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/
/*--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/

/* OSSATURE DU BANDEAU MENU */
div.container_admin_menu{
	display: block; 
	position: relative; 
	float: left; 
	width: 100%; 
	text-align: left; 
	margin-left: auto; 
	margin-right: auto; 
}
div.capsule_container_admin__menu, div.capsule_container_admin__menu{
	display: flex; 
	width: 1225px; 
	margin: 0px auto; 
	padding: 0px;
	text-align: center; 
}

div.capsule_menu_ln_01{
	border-color: black; 
	border-style: solid; 
	border-width: 4px 4px 4px 4px;
	border-radius: 20px 20px 0px 0px;
	height: 60px;
}
div.capsule_menu_ln_02{
	border-color: black; 
	border-style: solid; 
	border-width: 0px 4px 2px 4px;
	height: 60px;
}
div.capsule_menu_ln_03{
	border-color: black; 
	border-style: solid; 
	border-width: 2px 4px 4px 4px;
	border-radius: 0px 0px 0px 0px;
	height: 60px;
}

div.capsule_display_admin_ligne_1_sous_groupe_1{
	display: block; 
	position: relative; 
	float: left; 
	width: 610px; 
	padding: 0px 0px; 
	border-color: black; 
	border-style: solid; 
	border-width: 0px 4px 0px 0px;
}
div.capsule_display_admin_ligne_1_sous_groupe_2{
	display: block; 
	position: relative; 
	float: left; 
	width: 559px; 
	padding: 0px 0px; 
	border-color: black; 
	border-style: solid; 
	border-width: 0px 0px 0px 0px; 
	text-align: center; 
}
div.capsule_display_admin_ligne_1_sous_groupe_3{
	display: block; 
	position: relative; 
	float: left; 
	width: 52px; 
	padding: 0px 0px; 
	border-color: black; 
	border-style: solid; 
	border-width: 0px 0px 0px 0px; 
	text-align: center; 
}

div.capsule_display_admin_ligne_2_sous_groupe_1{
	display: block; 
	position: relative; 
	float: left; 
	width: 610px; 
	padding: 0px 0px;
	border-color: black; 
	border-style: solid; 
	border-width: 0px 4px 0px 0px; 
	text-align: center; 
}
div.capsule_display_admin_ligne_2_sous_groupe_2{
	display: block; 
	position: relative; 
	float: left; 
	width: 232px; 
	padding: 0px 0px; 
	border-color: black; 
	border-style: solid; 
	border-width: 0px 4px 0px 0px;
}
div.capsule_display_admin_ligne_2_sous_groupe_3{
	display: block; 
	position: relative; 
	float: left; 
	width: 232px; 
	padding: 0px 0px; 
	border-color: black; 
	border-style: solid; 
	border-width: 0px 4px 0px 0px;
}
div.capsule_display_admin_ligne_2_sous_groupe_4{
	display: block; 
	position: relative; 
	float: left; 
	width: 139px; 
	padding: 0px 0px; 
	border-color: black; 
	border-style: solid; 
	border-width: 0px 0px 0px 0px; 
	text-align: center; 
}

div.capsule_display_admin_ligne_3_sous_groupe_1{
	display: block; 
	position: relative; 
	float: left; 
	width: 610px; 
	padding: 0px 0px;
	border-color: black; 
	border-style: solid; 
	border-width: 0px 4px 0px 0px; 
	text-align: center; 
}
div.capsule_display_admin_ligne_3_sous_groupe_2{
	display: block; 
	position: relative; 
	float: left; 
	width: 611px; 
	padding: 0px 0px; 
	border-color: black; 
	border-style: solid; 
	border-width: 0px 0px 0px 0px;
}

div.capsule_display_admin_ligne_1_sous_groupe_1_ligne_1{
	display: block; 
	position: relative; 
	float: left; 
	width: 220px; 
	padding: 20px 0px;
	font-size: 17px;
	text-align: right;
	border-color: black; 
	border-style: solid; 
	border-width: 0px 0px 0px 0px;
}
div.capsule_display_admin_ligne_1_sous_groupe_1_ligne_2{
	display: block; 
	position: relative; 
	float: left; 
	width: 380px; 
	padding: 18px 0px 18px 10px;
	font-size: 21px;
	text-align: left;
	border-color: black; 
	border-style: solid; 
	border-width: 0px 0px 0px 0px;
}

div.capsule_display_admin_ligne_1_sous_groupe_2_ligne_1{
	display: block; 
	position: relative; 
	float: left; 
	width: 100%; 
	padding: 14px 0px;
	font-size: 28px;
	border-color: black; 
	border-style: solid; 
	border-width: 0px 0px 0px 0px;
}

div.capsule_display_admin_ligne_3_sous_groupe_2_block_1{
	display: block; 
	position: relative; 
	float: left; 
	width: 236px; 
}
div.capsule_display_admin_ligne_3_sous_groupe_2_block_2{
	display: block; 
	position: relative; 
	float: left; 
	width: 139px; 
}

div.infos_maintenance{
	display: block; 
	width: 212px; 
	margin: 5px auto; 
	padding: 10px 0px; 
	font-size: 24px; 
	font-weight: bold; 
	border: 1px black solid;
	border-radius: 5px;
	text-align: center;
	background: red; 
	color: #000;
}
div.infos_maintenance:hover{
	color: #FFF;
}

/*--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/

/* MISE EN FORME DU BOUTON D'OUVERTURE/FERMETURE DU MENU */
font.affichage_menu_button{
	display: flex;
	flex-wrap: wrap;
	position: relative;
	width: 30px;
	height: 30px;
	padding: 15px 11px;
}
i.affichage_menu_button_open{
	position: relative; 
	width: 100%;
	height: 100%;
	font-size: 30px;
	color: green;
}
i.affichage_menu_button_close{
	position: relative; 
	width: 100%;
	height: 100%;
	font-size: 30px;
	color: red;
}

/* MISE EN FORME DES BOUTONS D'INFORMATIONS BLOCAGE */
font.affichage_bouton_info_blocage{
	display: flex; 
	flex-wrap: wrap; 
	position: relative; 
	width: 117px; 
	height: 40px; 
	padding: 10px 11px;
	color: red;
}
font.affichage_bouton_info_blocage:hover{
	color: white;
	background: red;
}
i.affichage_bouton_info_blocage{
	display: block; 
	position: relative; 
	width: 50%; 
	height: 100%; 
	font-size: 38px; 
}
i.image-clignote  {
   animation-duration: 4s;
   animation-name: clignoter;
   animation-iteration-count: infinite;
   transition: none;
}
@keyframes clignoter {
  0%   { opacity:1; }
  25%  { opacity:0; }
  50%  { opacity:1; }
  75%  { opacity:0; }
  100% { opacity:1; }
}

/*--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/

/* MISE EN FORME DU BOUTON MAINTENANCE */
div.infos_en_service{
	display: block; 
	width: 212px; 
	margin: 5px auto; 
	padding: 10px 0px; 
	font-size: 24px; 
	font-weight: bold; 
	border: 1px black solid;
	border-radius: 5px;
	text-align: center;
	background: green; 
	color: #FFF;
}
div.infos_en_service:hover{
	color: #000;
}

/*--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/

/* MISE EN FORME DU BOUTON "Menu" */
a.bouton_menu_admin{
	display: block; 
	width: 212px; 
	margin: 5px 9px; 
	padding: 10px 0px; 
	font-size: 24px; 
	font-weight: bold; 
	border: 1px black solid;
	border-radius: 5px;
	text-align: center;
	background: #DCDCDC;
	color: #000;
	cursor: pointer;
}
a.bouton_menu_admin:hover{
	background: #6C6C6C;
	color: #FFF;
}

/*--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/

/* MISE EN FORME DES BOUTONS DU MENU */
a.bouton_sous_menu_admin{
	display: block; 
	float: left; 
	width: 225px; 
	border: 1px black solid;
	margin: 5px; 
	padding: 3px;
	border-radius: 8px;
	background: #DCDCDC;
	font: bold 20px Arial;
	text-align: center;
	color: #000;
	cursor: pointer;
}
a.bouton_sous_menu_admin:hover{
	background: #6C6C6C;
	color: #FFF;
}

/*--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/

/* MISE EN FORME DU BOUTON "Affichage des onglets" */
div.affichage_carousel_button{
	display: flex;
	position: relative;
	width: 598px;
	height: 50px;
	margin: 5px auto;
	background: #6C6C6C;
	align-items: center;
	justify-content: center;
	border: 1px solid black;
	border-radius: 8px;
	overflow: hidden;
	cursor: pointer;
	transition: .3s linear;
	z-index: 1;
}

div.affichage_carousel_button span{
	position: absolute;
	width: 100%;
	height: 100%;
	font-size: 19px;
	font-weight: bold;
	text-align: center;
	line-height: 50px;
	background: #DCDCDC;
	color: #000;
	z-index: 999;
	transition: .6s linear;
	border: 1px solid black;
	border-radius: 8px;
}
div.affichage_carousel_button:hover span{
	transform: translateY(-100%);
	transition-delay: 0.3s;
}

div.affichage_carousel_button a{
	flex: 1;
	text-align: center;
	transform: translateY(100%);
	opacity: 0;
	transition: .6s linear;
}
div.affichage_carousel_button:hover a{
	opacity: 1;
	transform: translateY(0);
	transition-delay: 0.3s;
}

div.affichage_carousel_button img{
	width: 65%;
	vertical-align: middle;
}

font.affichage_carousel_button{
	display: flex; 
	flex-wrap: wrap; 
	position: absolute; 
	left: -5px; 
	bottom: -10px; 
	width: 45px; 
	height: 25px; 
	background-color: revert;
}
i.affichage_carousel_button_1{
	position: absolute; 
	left: 0px;
	font-size: 25px;
	width: 100%;
	height: 100%;
}
i.affichage_carousel_button_2{
	position: absolute; 
	left: 20px;
	font-size: 25px;
	width: 100%;
	height: 100%;
}
i.affichage_carousel_button_open:before{
	color: green;
	background-color: white;
}
i.affichage_carousel_button_clos:before{
	color: red;
	background-color: white;
}


/*--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/

/* MISE EN FORME DU MODULE "Rechercher un licencié" */
form.formulaire_recherche_1{
	display: block;
	position : relative;
	float: left;
	width: 100%;
	height: 54px;
	padding: 3px 0px;
	text-align: center;
}
form.formulaire_recherche_2{
	display: block;
	position : relative;
	float: left;
	width: 100%;
	height: 24px;
	padding: 18px 0px;
	text-align: center;
}

select.recherche_dossier_licencie{
	display: block;
	position: relative;
	float: left; 
	width: 96%; 
	height: 26px;
	margin: 0px 2%;
	padding-left: 10px;
	color:#000; 
	text-align: left; 
	font-size: 12px;
	border:1px solid #000000;
	border-radius:10px;
	background-color: #DCDCDC;
}
select.recherche_dossier_licencie:hover {
  background: #6C6C6C;
  color: #FFF;
}

button.recherche_dossier_licencie{
	position: relative;
	width: 65px;
	margin-top: 5px;
	padding: 3px;
	font: bold 13px Arial;
	color: #000;
	background: #DCDCDC;
	border: 1px black solid;
	border-radius: 8px;
	cursor: pointer;
}
button.recherche_dossier_licencie:hover{
	color: #FFF;
	background: #6C6C6C;
}

button.abandon_recherche_licencie{
	position: relative;
	width: 65px;
	padding: 3px;
	font: bold 13px Arial;
	color: #000;
	background: #DCDCDC;
	border: 1px black solid;
	border-radius: 8px;
	cursor: pointer;
}
button.abandon_recherche_licencie:hover{
	color: #FFF;
	background: #6C6C6C;
}

/*--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/

/* CAPSULE DE NOTIFICATION VISUELLE */
div#container_notifications{
	/* background: #ffffff; */
	width: 125px;
	height: 70px;
	display: grid;
	place-items: center;
}
:root{
	--hue: 223;
	--bg: #000000;
	--fg: hsl(var(--hue),10%,10%);
}
div#notifications{
	box-sizing: border-box;
	color: var(--fg);
	font: 100px "DM Sans", sans-serif;	
}
.notifications{
	background: transparent;
	box-shadow: 0 0 0 10px transparent;
	filter: brightness(1) grayscale(1);
	position: relative;
	width: 100px;
	height: 70px;
	transition: filter 0.15s 0.3s linear;
	-webkit-appearance: none;
	appearance: none;
	-webkit-tap-highlight-color: transparent;
}
.notifications:focus{
	outline: none;
}
.notifications:after, .notifications__badge, .notifications__waves, .notifications__sr {
	position: absolute;
}
.notifications:after{
	content: "";
	display: block;
}
.notifications:after{
	background:
		radial-gradient(15px 10px at 35% 30px,hsl(45,90%,55%) 46%,hsla(45,90%,55%,0) 50%),
		linear-gradient(hsl(45,90%,55%),hsl(45,90%,55%)) 35px 25px / 30px 10px no-repeat,
		radial-gradient(15px 10px at 65% 30px,hsl(45,90%,55%) 46%,hsla(45,90%,55%,0) 50%),
		/* marteau */
		radial-gradient(5px 5px at 50% 35px,hsl(38,90%,55%) 47%,hsla(38,90%,55%,0) 50%),
		/* corps */
		radial-gradient(30px 30px at 50% 20px,hsl(38,90%,55%) 49%,hsla(38,90%,55%,0) 50%) 0 0 / 100% 75% no-repeat,
		linear-gradient(hsl(38,90%,55%),hsl(38,90%,55%)) 35px 20px / 30px 10px no-repeat,
		/* crochet */
		radial-gradient(5px 5px at 50% 5px,hsl(45,90%,55%) 48%,hsla(45,90%,55%,0) 50%);
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	transform-origin: 50% 15px;
}
.notifications__badge{
	background: hsl(3,90%,55%);
	border-radius: 37px;
	color: hsl(0,0%,100%);
	font-size: 22px;
	font-weight: bold;
	padding: 0px 10px;
	bottom: 5px;
	right: 27px;
	min-width: 25px;
	height: 25px;
	text-align: center;
	transition: transform 0.3s 0.15s ease-out;
	z-index: 1;
}
.notifications__badge:empty{
	transform: scale(0);
	transition-delay: 0s;
}

.notifications__waves, .notifications--active:before, .notifications--active:after{
	animation-duration: 2s;
	animation-timing-function: linear;
	animation-iteration-count: infinite;
}
.notifications__waves{
	animation-delay: 0.6s;
	border-top: 10px solid transparent;
	border-right: 10px solid hsla(var(--hue),10%,50%);
	border-bottom: 10px solid transparent;
	border-left: 10px solid hsla(var(--hue),10%,50%);
	border-radius: 50%;
	top: -14%;
	left: -23%;
	opacity: 0;
	pointer-events: none;
	width: 125px;
	height: 50px;
	transform: scale(0.3);
}
.notifications__waves:nth-child(2){ animation-delay: 0.75s; }
.notifications__waves:nth-child(3){ animation-delay: 0.90s; }
.notifications__waves:nth-child(4){ animation-delay: 1.05s; }

.notifications__active{
	filter: brightness(1) grayscale(0);
	transition-delay: 0s;
}

.notifications__active:before{animation-name: ringBefore; }
.notifications__active:after{animation-name: ringAfter; }
.notifications__active .notifications__waves{animation-name: waves; }

@keyframes ringBefore{
	from { transform: rotate(0); }
	15% { transform: rotate(-03deg); }
	20% { transform: rotate( 06deg); }
	25% { transform: rotate(-06deg); }
	30% { transform: rotate( 18deg); }
	35% { transform: rotate(-18deg); }
	40% { transform: rotate( 22deg); }
	45% { transform: rotate(-20deg); }
	50% { transform: rotate( 18deg); }
	55% { transform: rotate(-16deg); }
	60% { transform: rotate( 14deg); }
	65% { transform: rotate(-12deg); }
	70% { transform: rotate( 10deg); }
	75% { transform: rotate(-08deg); }
	80% { transform: rotate( 06deg); }
	85% { transform: rotate(-04deg); }
	90% { transform: rotate( 02deg); }
	95% { transform: rotate(-01deg); }
}
@keyframes ringAfter{
	from,
	40%,
	to {transform: rotate(0);}
	5%,
	35% {transform: rotate(10deg);}
	10%,
	30% {transform: rotate(-10deg);}
	15%,
	25% {transform: rotate(20deg);}
	20% {transform: rotate(-20deg);}
}
@keyframes waves{
	from {
		opacity: 1;
		transform: scale(0.3);
	}
	20%,
	to {
		opacity: 0;
		transform: scale(1);
	}
}

/*--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/
/*--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/

/* OSSATURE DES POPINS */
div.container_admin_popin{
	display: block; 
	position: relative; 
	float: left; 
	width: 100%; 
	text-align: left; 
	margin-left: auto; 
	margin-right: auto; 
}

div#formulaire_dossier_licence_4{
	display: block;
	position : relative;
	background: #ffffff;
	border-top : 1px solid #aaa;
	border-left : 1px solid #aaa;
	border-right : 1px solid #aaa;
	width : 100%;
	margin-right : auto;
	margin-left: auto;
	margin-bottom: 20px;
	border-radius : 5px;
	padding: 15px;
	text-align: center;
}

/*--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/
/*--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/

/* OSSATURE DES TABLEAUX DE SUIVI */
div.container_admin_tableau{
	display: block; 
	position: relative; 
	float: left; 
	width: 100%; 
	text-align: left; 
	margin-left: auto; 
	margin-right: auto; 
	margin-top: 20px;
}
div.capsule_admin_tableau{
	display: flex;
	position: relative;
	width: 1350px;
	margin: 0px auto 10px;
}

.slider_container {
	position: relative;
	overflow: hidden;
	width: 1350px;
	min-height: 520px;
}

.main_slide {
	position: relative;
	width: 1350px;
	min-height: 520px;
	top: 0px;
	left: 0px;
	transition: transform .5s ease-in-out;
}
div.secondary_slide{
	display: block;
	float: left;
	width: 1342px;
	height: 512px;
	border: 4px solid black;
	border-radius: 15px 15px 0px 0px;
	overflow: auto;
}
.secondary_slide h4 {
	width: 1095px;
	font-size: 28px;
	margin-top: 5px;
	margin-bottom: 10px;
	padding: 4px 105px 4px 125px;
	text-align: center;
}
img.secondary_slide{
	position: absolute;
	width: 40px;
	left: 8px;
	bottom: 8px;
}
span.secondary_slide{
	display: block; 
	width: 975px; 
	font-size:30px; 
	color:red; 
	font-weight:bold; 
	text-align:center;
}

button.next_button, button.prev_button {
	position: absolute;
	top: 10px;
	z-index: 1;
	width: 40px;
	height: 40px;
	font-size: 16px;
	font-weight: bold;
	background: #DCDCDC;
	color: #000;
	border: 1px solid black;
	cursor: pointer;
}
button.next_button:hover, button.prev_button:hover {
	background: #6C6C6C;
	color: #FFF;
}
button.next_button {
	right: 25px;
	border-top-right-radius: 5px;
	border-bottom-right-radius: 5px;
}
button.prev_button {
	left: 8px;
	border-top-left-radius: 5px;
	border-bottom-left-radius: 5px;
}

i.next_button, i.prev_button{
	font-size: 30px;
	color: blue;
}

/*--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/
/*--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/

/*--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/
/* MISE EN FORME DES TABLEAUX DE SUIVI */
/*--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/

div.block_primaire__capsule_dossier_inscription{
	display: flex;
	position: relative;
	width: 1220px;
	flex-wrap: wrap;
	margin: 0px auto;
}
div.block_secondaire__capsule_dossier_inscription{
	display: block; 
	position: relative; 
	width: 1220px; 
	margin: 0px auto;
}
details.capsule_dossier_inscription{
	display: block; 
	position: relative; 
	float: left; 
	width: 287px; 
	margin: 5px; 
	border-color: black; 
	border-style: solid; 
	border-width: 4px 4px 3px 4px;
	font-size: 13px;
}

summary.capsule_dossier_inscription__ligne_1{
	display: block; 
	position: relative; 
	float: left; 
	width: 100%; 
	border-color: black; 
	border-style: solid; 
	border-width: 0px 0px 1px 0px;
}
div.capsule_dossier_inscription__ligne_2{
	display: block; 
	position: relative; 
	float: left; 
	width: 100%; 
	border-color: black; 
	border-style: solid; 
	border-width: 3px 0px 1px 0px;
}
div.capsule_dossier_inscription__ligne_3{
	display: block; 
	position: relative; 
	float: left; 
	width: 100%; 
	border-color: black; 
	border-style: solid; 
	border-width: 0px 0px 1px 0px;
}
div.capsule_dossier_inscription__ligne_4{
	display: block; 
	position: relative; 
	float: left; 
	width: 100%; 
	border-color: black; 
	border-style: solid; 
	border-width: 0px 0px 1px 0px;
}

div.capsule_dossier_inscription__sous_ligne_1{
	display: block; 
	position: relative; 
	float: left; 
	width: 287px; 
	height: 33px; 
	padding: 0px; 
	border-color: black; 
	border-style: solid; 
	border-width: 0px 0px 0px 0px;
}

div.capsule_dossier_inscription__sous_ligne_2{
	display: block; 
	position: relative; 
	float: left; 
	width: 287px; 
	height: 30px; 
	padding: 0px; 
	border-color: black; 
	border-style: solid; 
	border-width: 0px 0px 0px 0px;
}

div.capsule_dossier_inscription__sous_ligne_3{
	display: block; 
	position: relative; 
	float: left; 
	width: 287px; 
	height: 30px; 
	padding: 0px; 
	border-color: black; 
	border-style: solid; 
	border-width: 0px 0px 0px 0px;
}

div.capsule_dossier_inscription__sous_ligne_4{
	display: block; 
	position: relative; 
	float: left; 
	width: 287px; 
	height: 30px; 
	padding: 0px; 
	border-color: black; 
	border-style: solid; 
	border-width: 0px 0px 0px 0px;
}

div.capsule_dossier_inscription__sous_ligne_1__numero_dossier{
	display: block; 
	position: relative; 
	float: left; 
	width:  31px; 
	height: 29px; 
	padding: 2px 5px; 
	border-color: black; 
	border-style: solid; 
	border-width: 0px 1px 0px 0px;
	text-align: right;
}

div.capsule_dossier_inscription__sous_ligne_1__identite{
	display: block; 
	position: relative; 
	float: left; 
	width: 235px; 
	height: 29px; 
	padding: 2px 5px; 
	text-align:  left; 
	border-color: black; 
	border-style: solid; 
	border-width: 0px 0px 0px 0px;
}

div.capsule_dossier_inscription__sous_ligne_2__block_bouton{
	display: block; 
	position: relative; 
	float: left; 
	width: 40px; 
	height: 30px; 
	padding: 0px; 
	text-align: center;
	border-color: black; 
	border-style: solid; 
	border-width: 0px 0px 0px 1px;
}

/*--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/

div.block_capsule_dossier_inscription__action_groupees{
	display: block; 
	position: relative; 
	width: 500px; 
	margin: 6px auto;
}
div.capsule_dossier_inscription__action_groupees{
	display: block;
	position: relative;
	width: 500px;
	border-color: black;
	border-style: solid;
	border-width: 0px 0px 0px 0px;
}
div.capsule_dossier_inscription__action_groupees__titre{
	display: block;
	position: relative;
	width: 500px;
	border-color: black;
	border-style: solid;
	border-width: 0px 0px 0px 0px;
	text-align: center;
}
div.capsule_dossier_inscription__action_groupees__boutons{
	display: flex;
	position: relative;
	width: 500px;
	border-color: black;
	border-style: solid;
	border-width: 0px 0px 0px 0px;
	text-align: center;
}
span.capsule_dossier_inscription__action_groupees__boutons__titre{
	display: block;
	position: relative;
	width: 400px;
	line-height: 30px;
}
span.capsule_dossier_inscription__action_groupees__boutons__bouton{
	display: block;
	position: relative;
	width: 100px;
}
span.capsule_dossier_inscription__action_groupees{
	display: block;
	width: 100%;
	text-align: center;
}

/*--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/

font.bouton_traitements_admin{
	position: relative;
	width: 100%;
	height: 100%;
}
a.bouton_traitements_admin{
	display: block;
	position: relative;
	width: 100%;
	height: 100%;
	color: #000000;
}
i.bouton_traitements_admin{
	display: inline-block;
	line-height: 15px;
	font-size: 26px;
	margin: 2px 0px;
}
i.bouton_traitements_admin:hover{
	color: #ffffff;
}

font.numero_page_admin{
	display: flex; 
	flex-wrap: wrap; 
	position: absolute; 
	left: 10px; 
	bottom: 10px; 
	width: 45px; 
	height: 25px; 
	background-color: revert;
}
i.numero_page_admin_1{
	position: absolute; 
	left: 0px;
	font-size: 25px;
	width: 100%;
	height: 100%;
	color: blue;
}
i.numero_page_admin_2{
	position: absolute; 
	left: 20px;
	font-size: 25px;
	width: 100%;
	height: 100%;
	color: blue;
}

/*--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/
form.assurance_admin{
	position: relative;
	float: left;
	width: 96%;
	margin: 2%;
}
label.assurance_admin{
	display: block;
	position: relative;
	float: left;
	width: 85px;
	margin: 2px 5px 0px 0px;
	text-align: right;
}
select.assurance_admin{
	display: block;
	position: relative;
	float: left;
	width: 152px;
	height: 19px;
	margin: 0px 0px 0px 0px;
	padding: 0px 0px 0px 10px;
	text-align: left;
	font: bold 12px Arial;
	color: #000;
	border: 1px black solid;
	border-radius: 8px;
	background: #DCDCDC;
}
select.assurance_admin:hover {
  background: #6C6C6C;
  color: #FFF;
}
button.assurance_admin{
	display: block;
	position: relative;
	float: left;
	width: 28px;
	border: 1px black solid;
	padding: 1px;
	margin: 0px 0px 0px 4px;
	border-radius: 8px;
	background: #DCDCDC;
	font: bold 12px Arial;
	color: #000;
	cursor: pointer;
	text-align: center;
}
button.assurance_admin:hover{
	background: #6C6C6C;
	color: #FFF;
}

form.licence_admin{
	position: relative;
	float: left;
	width: 96%;
	margin: 2%;
}
label.licence_admin{
	display: block;
	position: relative;
	float: left;
	width: 85px;
	margin: 2px 5px 0px 0px;
	text-align: right;
}
select.licence_admin{
	display: block;
	position: relative;
	float: left;
	width: 152px;
	height: 19px;
	margin: 0px 0px 0px 0px;
	padding: 0px 0px 0px 10px;
	text-align: left;
	font: bold 12px Arial;
	color: #000;
	border: 1px black solid;
	border-radius: 8px;
	background: #DCDCDC;
}
select.licence_admin:hover {
  background: #6C6C6C;
  color: #FFF;
}
button.licence_admin{
	display: block;
	position: relative;
	float: left;
	width: 28px;
	border: 1px black solid;
	padding: 1px;
	margin: 0px 0px 0px 4px;
	border-radius: 8px;
	background: #DCDCDC;
	font: bold 12px Arial;
	color: #000;
	cursor: pointer;
	text-align: center;
}
button.licence_admin:hover{
	background: #6C6C6C;
	color: #FFF;
}

/*--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/
div#formulaire_dossier_licence_2{
	display: block;
	position : relative;
	float: left;
	background: #ffffff;
	border-top : 1px solid #aaa;
	border-left : 1px solid #aaa;
	border-right : 1px solid #aaa;
	/* width : 100%; */
	margin-right : auto;
	margin-left: auto;
	margin-bottom: 20px;
	border-radius : 5px;
	padding: 15px;
	text-align: center;
}
div.package_dossier_licence{
	display: inline-block;
	position: relative;
	width: 100%;
	margin: auto;
	text-align: justify;
	padding: 0px 0px 10px 0px;
}

a.bouton_admin_01{
	display: block;
	width: 228px;
	margin: auto;
	padding: 10px;
	font-size: 20px;
	font-weight: bold;
	border: 1px black solid;
	border-radius: 8px;
	background: #DCDCDC;
	text-align: center;
	color: #000;
	cursor: pointer;
}
button.bouton_admin_01{
	display: block;
	width: 250px;
	margin: auto;
	padding: 10px;
	font-size: 20px;
	font-weight: bold;
	border: 1px black solid;
	border-radius: 8px;
	background: #DCDCDC;
	text-align: center;
	color: #000;
	cursor: pointer;
}
span.bouton_admin_01{
	display: block;
	width: 228px;
	margin: auto;
	padding: 10px;
	font-size: 20px;
	font-weight: bold;
	border: 1px black solid;
	border-radius: 8px;
	background: #ff0000;
	text-align: center;
	color: #ffffff;
}
button.bouton_admin_01:hover{
	background: #6C6C6C;
	color: #FFF;
}
a.bouton_admin_01:hover{
	background: #6C6C6C;
	color: #FFF;
}

/*--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/
button.acces_formulaire_inscription{
	width: 185px;
	border: 1px black solid;
	padding: 10px;
	border-radius: 8px;
	background: #DCDCDC;
	font: bold 13px Arial;
	color: #000;
	cursor: pointer;
}
button.acces_formulaire_inscription:hover{
	background: #6C6C6C;
	color: #FFF;
}
/*--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/
div.capsule_avancement{
	display: block; 
	position: relative; 
	float: left; 
	height: 16px; 
	border-color: black; 
	border-style: solid; 
	border-width: 0px 0px 0px 0px; 
	text-align: center; 
	padding: 7px 0px; 
	background: green;
}

div.capsule_avancement span.capsule_avancement{
  position: absolute;
  margin-top: 0px;
  margin-left: 0px;
  width: 300px;
  color: #09c;
  text-align: left;
  background: rgba(0,0,0,.9);
  padding: 15px;
  border-radius: 3px;
  box-shadow: 0 0 2px rgba(0,0,0,.5);
  transform: scale(0) rotate(-12deg);
  transition: all .25s;
  opacity: 0;
  z-index: 1000;
}
div.capsule_avancement:hover span.capsule_avancement, div.capsule_avancement:focus span.capsule_avancement{
  transform: scale(1) rotate(0);        
  opacity: 1;
}

/*--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/
#tableau_montant{
	border-collapse: collapse;
	border: 2px solid black;
	margin-top: 0px;
	margin-right: auto;
	margin-left: auto;
	margin-bottom: 5px;
}
#th0_montant{
	border: 1px solid black; 
	text-align: center;
	font-weight: bold;
}
#td0_montant{
	border: 1px solid black; 
	text-align: left; 
	padding: 5px 5px 5px 20px;
	width: 272px;
}
#td1_montant{
	border: 1px solid black; 
	text-align: right; 
	padding: 0px 20px 0px 0px;
	width: 100px;
}
#td2_montant{
	border: 1px solid black; 
	text-align: justify; 
	padding: 0px 10px;
	font-size: 11px;
}

a.bouton_admin_03{
	display: block;
	width: 228px;
	margin: auto;
	padding: 8px;
	font-size: 20px;
	font-weight: bold;
	border: 1px black solid;
	border-radius: 8px;
	background: #DCDCDC;
	text-align: center;
	color: #000;
	cursor: pointer;
}
a.bouton_admin_03:hover{
	background: #6C6C6C;
	color: #FFF;
}

/*--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/
div.tableau_stat{
	display: flow-root;
	position: relative; 
	width: 660px;
	margin-top: 20px;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 20px;
	border: 1px solid black;
	font-size: 13px;
	font-weight: bold;
	
}
div.tableau_stat_ligne_licencie{
	display: block;
	position: relative;
	float: left;
	width: 100%;
	border: 1px solid black; 
}
div.tableau_stat_case_equipe{
	display: block; 
	position: relative; 
	float: left; 
	width: 104px; 
	height: 25px;
	padding-top: 5px;
	border-right: 1px solid black; 
	text-align: center;
}
div.tableau_stat_case_stat{
	display: block; 
	position: relative; 
	float: left; 
	width: 59px; 
	height: 25px;
	padding-top: 5px;
	border-right: 1px solid black; 
	text-align: center;
}

div.tableau_stat_paiement{
	display: flow-root;
	position: relative; 
	width: 1008px;
	margin-top: 20px;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 20px;
	border: 1px solid black;
	font-size: 13px;
	font-weight: bold;
	
}
div.tableau_stat_paiement_ligne_licencie{
	display: block;
	position: relative;
	float: left;
	width: 100%;
	border: 1px solid black; 
}
div.tableau_stat_paiement_case_equipe{
	display: block; 
	position: relative; 
	float: left; 
	width: 174px; 
	height: 20px;
	padding: 2px 0px 2px 10px;
	border-right: 1px solid black; 
	border-bottom: 1px solid black; 
	text-align: left;
}
div.tableau_stat_paiement_case_stat_pourcent{
	display: block; 
	position: relative; 
	float: left; 
	width: 55px; 
	height: 20px;
	padding: 2px 5px 2px 0px;
	border-right: 0px solid black; 
	border-bottom: 1px solid black; 
	text-align: right;
}
div.tableau_stat_paiement_case_stat_euros{
	display: block; 
	position: relative; 
	float: left; 
	width: 85px; 
	height: 20px;
	padding: 2px 5px 2px 0px;
	border-right: 1px solid black; 
	border-bottom: 1px solid black; 
	text-align: right;
}

div.tableau_statut_dossier{
	display: block; 
	position: relative; 
	float: left; 
	width: 131px; 
	height: 40px;
	padding-top: 5px;
	border-right: 1px solid black; 
	text-align: center;
}

/*--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/
div.tableau_stat_dossier{
	display: flow-root;
	position: relative; 
	width: 370px;
	margin-top: 20px;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 20px;
	border: 1px solid black;
	font-size: 13px;
	font-weight: bold;
	
}
div.tableau_stat_dossier_ligne_dossier{
	display: block;
	position: relative;
	float: left;
	width: 100%;
	border: 1px solid black; 
}
div.tableau_stat_dossier_case_nom{
	display: block; 
	position: relative; 
	float: left; 
	width: 299px; 
	height: 20px;
	padding: 2px 0px 2px 10px;
	border-right: 1px solid black; 
	border-bottom: 1px solid black; 
	text-align: left;
}
div.tableau_stat_dossier_case_stat{
	display: block; 
	position: relative; 
	float: left; 
	width: 49px; 
	height: 20px;
	padding: 2px 10px 2px 0px;
	border-right: 1px solid black; 
	border-bottom: 1px solid black; 
	text-align: right;
}


/*--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/

span.gestion_de_affichage_paiement{
	display: block;
	position: relative;
	float: left;
	width: 100%;
	margin-bottom: 5px;
}
input[type=checkbox].gestion_de_affichage_paiement {
	display:none;
}
input[type=checkbox].gestion_de_affichage_paiement + label.gestion_de_affichage_paiement {
	display:inline-block;
	width: 138px;
	height: 38px;
	margin: 0px 10px 10px 0px;
	padding: 5px 9px;
	font: bold 13px Arial;
	line-height: 20px;
	color: #333;
	text-align: center;
	text-shadow: 0 1px 1px #fffc;
	vertical-align: middle;
	cursor: pointer;
	background-color: #f5f5f5;
	background-image: -moz-linear-gradient(top,#fff,#e6e6e6);
	background-image: -webkit-gradient(linear,0 0,0 100%,from(#fff),to(#e6e6e6));
	background-image: -webkit-linear-gradient(top,#fff,#e6e6e6);
	background-image: -o-linear-gradient(top,#fff,#e6e6e6);
	background-image: linear-gradient(to bottom,#fff,#e6e6e6);
	background-repeat: repeat-x;
	border: 1px solid #ccc;
	border-radius: 8px;
	border-color: #e6e6e6 #e6e6e6 #bfbfbf;
	border-color: #0000001a #0000001a #0000004d;
	border-bottom-color: #b3b3b3;
	-webkit-box-shadow: inset 0 1px 0 #fff3,0 1px 2px #0000001a;
	-moz-box-shadow: inset 0 1px 0 #fff3,0 1px 2px #0000001a;
	box-shadow: inset 0 1px 0 #fff3,0 1px 2px #0000001a;*/
}
input[type=checkbox]:checked.gestion_de_affichage_paiement + label.gestion_de_affichage_paiement{
	background-image: none;
	outline: 0;
	-webkit-box-shadow: inset 0 2px 4px #0003,0 1px 2px #0000001a;
	-moz-box-shadow: inset 0 2px 4px #0003,0 1px 2px #0000001a;
	box-shadow: inset 0 2px 4px #0003,0 1px 2px #0000001a;
	background-color:#00ff0b80;
}

/*--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/

.form_update_on{
	display: block;
}
.form_update_off{
	display: none;
}

.statut__archive_on{
	display: block;
}
.statut__archive_off{
	display: none;
}

.statut_traitement_archive_on{
	display: block;
	background-color: red;
}
.statut_traitement_archive_on > i{
	color: #FFFFFF;
}
.statut_traitement_archive_off{
	display: none;
}

.statut_traitement_wait_on{
	display: block;
	background-color: orange;
}
.statut_traitement_wait_on > i{
	color: #FFFFFF;
}
.statut_traitement_wait_off{
	display: none;
}

.statut_traitement_finish_on{
	display: block;
	background-color: green;
}
.statut_traitement_finish_on > i{
	color: #FFFFFF;
}
.statut_traitement_finish_off{
	display: none;
}

.validation_ffbb_on{
	display: block;
}
.validation_ffbb_off{
	display: none;
}

.encaissement_on{
	display: block;
}
.encaissement_off{
	display: none;
}

.info_data_on{
	display: block;
}
.info_data_off{
	display: none;
}

.rollback_on{
	display: block;
}
.rollback_off{
	display: none;
}

.mail_convoc_on{
	display: block;
}
.mail_convoc_off{
	display: none;
}

.mail_paiement_on{
	display: block;
}
.mail_paiement_off{
	display: none;
}

.mail_acces_on{
	display: block;
}
.mail_acces_off{
	display: none;
}

.warning_on_orange{
	display: block;
	background-color: orange;
}
.warning_on_orange > i{
	color: #FFFFFF;
}
.warning_off_orange{
	display: none;
}

.warning_on_red{
	display: block;
	background-color: red;
	animation-duration: 4s;
	animation-name: warning;
	animation-iteration-count: infinite;
	transition: none;
}
.warning_on_red > i{
	color: #FFFFFF;
}
.warning_off_red{
	display: none;
}
@keyframes warning {
    0% { opacity:1; }
   25% { opacity:0; }
   50% { opacity:1; }
   75% { opacity:0; }
  100% { opacity:1; }
}

.attestation_on{
	display: block;
}
.attestation_off{
	display: none;
}
.attestation_ok{
	display: block;
	background-color: green;
}

.suppression_dossier_on{
	display: block;
}
.suppression_dossier_off{
	display: none;
}

/*--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/
/*--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/

/* POPIN D'AVERTISSEMENT */
div#container_notifications span.notifications__badge__infos{
	position: absolute;
	margin-top: 130px;
	margin-left: 00px;
	width: 300px;
	color: #09c;
	font-size: 14px;
	text-align: center;
	background: rgba(0,0,0,.9);
	padding: 15px;
	border-radius: 3px;
	box-shadow: 0 0 2px rgba(0,0,0,.5);
	transform: scale(0) rotate(-12deg);
	transition: all .25s;
	opacity: 0;
	z-index: 10000;
}
div#container_notifications:hover span.notifications__badge__infos, div#container_notifications:focus span.notifications__badge__infos{
	transform: scale(1) rotate(0);        
	opacity: 1;
}

div.capsule_avancement span.capsule_avancement{
  position: absolute;
  top: 0px;
  left: 0px;
  margin-top: 0px;
  margin-left: 0px;
  width: 221px;
  color: #09c;
  text-align: center;
  background: rgba(0,0,0,.9);
  padding: 8px 15px;
  border-radius: 3px;
  box-shadow: 0 0 2px rgba(0,0,0,.5);
  transform: scale(0) rotate(-12deg);
  transition: all .25s;
  opacity: 0;
  z-index: 1000;
}
div.capsule_avancement:hover span.capsule_avancement, div.capsule_avancement:focus span.capsule_avancement{
  transform: scale(1) rotate(0);        
  opacity: 1;
}

div.capsule_sous_titre_gauche span.capsule_sous_titre_gauche{
  position: absolute;
  margin-top: -4px;
  margin-left: 30px;
  width: 300px;
  color: #09c;
  text-align: left;
  background: rgba(0,0,0,.9);
  padding: 15px;
  border-radius: 3px;
  box-shadow: 0 0 2px rgba(0,0,0,.5);
  transform: scale(0) rotate(-12deg);
  transition: all .25s;
  opacity: 0;
  z-index: 1000;
}
div.capsule_sous_titre_gauche:hover span.capsule_sous_titre_gauche, div.capsule_sous_titre_gauche:focus span.capsule_sous_titre_gauche{
  transform: scale(1) rotate(0);        
  opacity: 1;
}

/*--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/
/*--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/
