/*
Violet clair : #c4aecf;
Violet logo : #895c9e;
Violet foncé : #442e4f;
Cyan : #4ec2eb;
Cyan clair: #d8eff9;
*/

/*
@font-face {
    font-family: 'Titillium-Web';
    src:url('fonts/Titillium-Web.ttf.woff') format('woff'),
        url('fonts/Titillium-Web.ttf.svg#Titillium-Web') format('svg'),
        url('fonts/Titillium-Web.ttf.eot'),
        url('fonts/Titillium-Web.ttf.eot?#iefix') format('embedded-opentype'); 
    font-weight: normal;
    font-style: normal;
    font-display: block;
}

body {
	color: #442e4f;
	font-family: 'Titillium-Web';
	font-size: 1em;
	margin: 0;
	height: 100%;
}
html { height: 100%; }

a, .lien {
	transition: 0.3s ease;
	color: #442e4f;
	text-decoration: none;
}
a:hover, .lien:hover{
	border-bottom-style: dotted;
	border-bottom-width: 1px;
}
a.no_deco:hover {
	border-bottom-width: 0;
}
*/
.rouge{ color: #ae0000; font-weight: bold; }
.bold{ font-weight: bold; }
.gris{ color: #cccccc; }

#content a, #content .lien {
/*	border-bottom-style: dotted;
	border-bottom-width: 1px;*/
}
#content a:hover, #content .lien:hover {
/*	color: #4ec2eb;*/
	color: var(--color-medium-blue);
	cursor: pointer;
}
p{ display: inline-block; }
h2 + p, #confidentialite p {margin: -10px 0 0 0;}

.clear{ clear: both;}
.right{ float: right;}
.left{ float: left;}
.centre{ text-align: center; }

.txt_left{ text-align:left;}
.txt_center{ text-align:center;}
.txt_right{ text-align:right;}

.mar_0 { margin: 0; }
.mar_0_auto { margin: 0 auto; }
.pad_20{ padding: 20px; }
.pad-right_20{ padding-right: 20px; }
.pad-left_20{ padding-left: 20px; }
.pad-left_30{ padding-left: 30px; }
.pad-left_40{ padding-left: 40px; }
.pad-bot_10{ padding-bottom: 10px; }
.pad-bot_20{ padding-bottom: 20px; }
.pad-bot_50{ padding-bottom: 50px; }
.pourcent_20{ width: 20%; }
.pourcent_25{ width: 25%; }
.pourcent_33{width: 33.3%;}
.pourcent_33 ul{ padding-left: 1em; }
.pourcent_50{ width: 49%; }
.pourcent_66{ width: 66%; }
.pourcent_100{ width: 100%; }
.puce{
	padding-right: 5px;
}

.mt_50{ margin-top: 50px; }
.mt2_50{ margin-top: 50px; margin-bottom: 50px; }
.mt2_100{ margin-top: 100px; margin-bottom: 100px; }

#wrapper {
	width: 100%;
	height: 100%;
	margin: 0 auto;
}
.col_vert, .col_or { font-size: 1.5em; }
.col_vert { color: green; }
.col_or { color: #ae0000; }
.col_rouge { color: red; }


/*
//////////////////////////
////////// DEFAUT ////////
//////////////////////////
*/

/* Structure */
#col_gauche, #col_centre, #col_droite {
	float: left;
	height: 100%;
}
#col_centre {
	width: 768px;
}
#col_gauche, #col_droite {
	width: calc((100% - 768px)/2);
}

.rang_1, .rang_2, .rang_3 {
	position: relative; 
}
.rang_1{ height: 160px; }
.rang_2{ height: 595px; }
.rang_3 { height: calc(100% - 595px - 160px); }
.rang_21{ height: 360px; width: 468px;}
.rang_22 { 
	/*height: 235px;*/
	 min-height: 235px;
}
body:not(#recepisse) #col_centre .rang_1 { background-color: #d8eff9; }

.sous_col_1, .sous_col_2 {
	float: left;
	height: auto;
}
.sous_col_1{ width: 300px; }
.sous_col_2{ width: 468px; background-color: #d8eff9; }

#logo-valparisis {
	width: 300px;
	height: 100%;
	background-color: #ffffff;
	float: left
}
#logo-valparisis img{
	margin-top: 32px;
}
body:not(#recepisse) #velo_1{
	background: url("../../images/velo-1-2020.jpg") no-repeat;
	background-position: bottom right -300px;
	background-color: #cd5344;
	width: 100%;
	height: 100%;
}
body:not(#recepisse) #velo_2{
	background: #4ec2eb url("../../images/velo-2.jpg") no-repeat;
	background-position: bottom left;
	width: 100%;
}
body:not(#recepisse) #gare_cormeilles{
	background: url("../../images/gare-cormeilles-0.jpg") no-repeat;
	background-position: center left;
	background-color: #cd5344;
	width: 100%;
	background-size: cover;
}
body:not(#recepisse) #gare_bessancourt{
	background: url("../../images/gare-bessancourt-0.jpg") no-repeat;
	background-position: center left;
	background-color: #cd5344;
	width: 100%;
	background-size: cover;
}
body:not(#recepisse) #gare_herblay{
	background: url("../../images/gare-herblay-0.jpg") no-repeat;
	background-position: center left;
	background-color: #cd5344;
	width: 100%;
	background-size: cover;
}

.rang_2 .sous_col_1 {
	background: url("../../images/velo-1-2020.jpg");
	background-position: bottom right;
}
.rang_2 .sous_col_1 #titre, .rang_2 .sous_col_1 #argu{
	width: 100%;
	float: left;
}
.rang_3 .sous_col_1 {
	background-color: #ffffff;
	text-align: right;
}

.sous_col_1 #titre { text-align: center; }
.sous_col_1 #titre  p { font-size: 1.3em; margin-bottom: 0; }
.sous_col_1 #titre  h1 { margin: 0; color: #895c9e; line-height: 1.3em; }
.sous_col_1 #argu {
	background: url("../../images/velo-1-bleu.jpg");
	background-position: bottom right;
}
.sous_col_1 #argu ul {
	font-size: 1.4em;
	margin: 20px 0 0 0;
	list-style: square;
	line-height: 0.8em;
}
.sous_col_1 #argu li {
	margin: 0 0 20px 0;
}
.sous_col_2 #local_cormeilles {
	background: url("../../images/local-velo-cormeilles.jpg");
	background-position: center center;
}
.sous_col_2 #local_bessancourt {
	background: url("../../images/local-velo-bessancourt.jpg");
	background-position: center center;
}
.sous_col_2 #local_herblay {
	background: url("../../images/local-velo-herblay.jpg");
	background-position: center center;
}
.sous_col_2 #local_argu {
	background-color: #4ec2eb;
	padding: 20px;
	font-style: italic;
	text-align: justify;
	/*height: 215px;*/
	min-height: 195px;
}
#carte{
	float: right;
	width: 120px;
	height: 120px;
	overflow: hidden;
	margin: -20px -20px 0 20px;
}
#sign { 
	float: right;
	margin: 20px 20px 0 0;
	text-align: right;
	font-size: 0.8em;
}
#sign img { margin: 5px 0 0 0; }
.rang_3 .sous_col_2 { min-height: 90px; }
.rang_3 .sous_col_2 .img1 { float: left; margin: 20px 0 0 20px; }
.rang_3 .sous_col_2 .img2 { float: right; margin: 20px 20px 0 0; }

/* Modifs home 2020 */
#home .sous_col_2 #local_argu {
	font-style: normal;
	text-align: left;
}
#home #argu {
	background-color: #4ec2eb;
	padding: 0 0 0 20px;
	width: 280px;
	font-style: normal;
	text-align: left;
}
#home .titre2020 {
	font-size: 1.3em;
	font-weight: 600;
}
#home #argu .titre2020 {
	padding-top: 20px;
}
#home #local_argu .titre2020 {
	color: white;
}
#home #argu span,
#home #local_argu span {
	display: block;
	line-height: 1.3em;
	position: relative;
}

/* MODIF : Flyer consignes */

.rang_22.flyer {
	line-height: 1.3em;
}
.rang_22.flyer h3 {
	margin: 0.8em 0 0 0 ;
}
#txt_flyer{
	margin-top: 0.8em;
}
#txt_flyer img{
	float: right;
	margin: -10px -20px 0 20px ;
}

@media only screen and (max-width: 767px) {
#txt_flyer img{ width: 150px; margin-top: 0; }
.rang_22.flyer h3 { margin-top: 2em; }
}
@media only screen and (max-width: 320px) {
#txt_flyer img{ width: 100px; margin-top: 0; }
.rang_22.flyer h3 { margin-top: 1em; }
}




#home .plus {
	margin-top: 10px;
}
#home .plus .plus_titre,
.admin .actu_titre input,
.admin .legende input {
	font-weight: 600;
	color: #674577;
}
.admin .actu_chapo textarea {
	font-weight: 600;
}
.admin .actu_resume textarea,
.admin .intro textarea {
	height: 60px;
}
.admin .actu_chapo textarea {
	height: 120px;
}
.admin .actu_texte textarea {
	height: 350px;
}
.admin .actu_lien input:not([type="radio"]):not([type="checkbox"]) {
	height: 0px;
	border: 0px solid #895c9e;
	padding: 0em;
	webkit-transition: all 0.3s ease-out;
	transition: all 0.3s ease-out;	
}
.admin div.actu_chapo,
.admin div.actu_texte {
	overflow: hidden;
	webkit-transition: all 0.3s ease-out;
	transition: all 0.3s ease-out;	
}
#home .plus .plus_texte::after {
	content: "";
	display: block;
	width: 0;
	height: 0;
	position: absolute;
	border-bottom: 12px solid #442e4f;
	border-left: 12px solid transparent;
	bottom: 3px;
	right: 0;
	transform: rotate(-45deg);
}
#home .plus .plus_texte.no_fleche::after {
	display: none;
}
#home #argu .plus .plus_texte::after {
	right: 20px;
}
.mobile_oui{
	display: none;
}










/* menu */
#menuToggle input { display: none; }
#menuToggle, #une_station {
	position: absolute;
	display: block;
	width: 468px;
	background-color: #895c9e;
	right: -15px;
	padding: 15px;
	bottom: -25px;
	z-index: 1000;
}
#menuToggle::before, #menuToggle::after, #une_station::after {
	content: "";
	display: block;
	width: 0;
	height: 0;
	position: absolute;
}
#menuToggle::before {
	border-bottom: 15px solid #442e4f;
	border-left: 15px solid transparent;
	top: -15px;
	left: 0;
}
#menuToggle::after, #une_station::after {
	border-bottom: 15px solid #442e4f;
	border-right: 15px solid transparent;
	top: -15px;
	right: 0;
}
#menuToggle ul, #une_station p {
	padding: 0;
	margin: 0;
	text-align: justify;
	font-size: 1.2em;
}
#menuToggle li {
	display: inline-block;
	position: relative;
}
#menuToggle li:not(:last-child) {
	border-right: 1px solid #ffffff;
    padding-right: 15px;
}
#menuToggle ul::after {
  content:'';
  padding-right:150px;
  display:inline-block;
  vertical-align:bottom;
}
#menuToggle a{
	color: #442e4f;
}
#menuToggle a.active, #menuToggle a:hover {
	color: #ffffff;
}

#une_station {
	position: relative;
	width: calc(100% - 15px);
	right: 0;
	text-align: left;
	color: white;
	font-size: 1.1em;
}
/* Sous-menus */
.admin #menuToggle ul ul{
	display: block;
	width: auto;
	position: absolute;
	height: 0;
	overflow: hidden;
	left: -20px;
	top: 30px;
	webkit-transition: all 0.3s ease-out;
	transition: all 0.3s ease-out;
}
.admin #menuToggle ul ul li {
	display: block;
	width: auto;
	font-size: 0.8em;
	background-color: #c4aecf;
	border-right: 0;
	height: 30px;
}
.admin #menuToggle ul li:hover ul{
	height: 150px;
}
.admin #menuToggle a.active > a {
	color: #442e4f;
}


/* choix des villes */
/* par défaut... */
#une_station p::before {
	content: '';
	display: block;
	float: left;
	width: 0px;
	border: 14px solid transparent;
    border-left-color: transparent;
    border-left-style: solid;
    border-left-width: 8px;
	border-left: 14px solid #442e4f;
	margin: 5px 5px 0 0;
	transform: rotate(90deg) translateX(7px) translateY(0px);
	webkit-transition: all 0.1s ease-out;
	transition: all 0.1s ease-out;
}
#une_station p {
	color: #442e4f;
}
.hide_station {
	height: 0;
	overflow: hidden;
	webkit-transition: all 0.3s ease-out;
	transition: all 0.3s ease-out;
}
.hidable {
	overflow: hidden;
	webkit-transition: all 0.3s ease-out;
	transition: all 0.3s ease-out;
}

/* hover ou actif => blanc */
.hide_station a:hover,
.show_station a:hover,
#une_station p.actif,
#une_station p.actif a {
	color: white;
}
#une_station p.hide_station:hover::before,
#une_station p.show_station:hover::before,
#une_station p.actif::before {
	border-left: 14px solid white;
	transform: rotate(0deg) translateX(0px) translateY(0px);
}

/* Slider accueil */
#slider{
	position: relative;
}
.slide {
	position: absolute;
	webkit-transition: all 0.3s ease-out;
	transition: all 0.3s ease-out;
}
.slide a {
	width: 100%;
	height: 100%;
	display: inline-block;
}





/* Sous-menu (User) */
#menu_user{
	position: absolute;
	right: 20px;
	top: 45px;
}
#menu_user li {
	display: inline-block;
	float: left;
	padding: 0 10px;
}
#menu_user a.active{ color: #4ec2eb; }


/* Places dispos */
.dispo {
	font-size: 0.6em;
}





/*
//////////////////////////
// Autre page que l'accueil
//////////////////////////
*/

body:not(#recepisse) .rang_2.rang_bleu {
	background-color: #d8eff9;
	min-height: 595px!important;
}
#faq .rang_2.rang_bleu,
#confidentialite .rang_2.rang_bleu,
#compte.edit .rang_2.rang_bleu,
#abonnement:not(.file) .rang_2.rang_bleu,
#actualite .rang_2.rang_bleu,
#formulaire .rang_2.rang_bleu  {
	height: auto;
}
#content {
	display: inline-block;
	margin: 0 5px;
	background-color: white;
	width: calc(100% - 50px);
	min-height: 300px;
/*	height: calc(100% - 10px); */
	padding: 0 20px;
}
#actualite #content,
#abonnement #content,
#formulaire #content {
	min-height: 300px;
}
div .g-recaptcha {
	margin-bottom: 40px;
}

/*
#content h1 {
	color: #895c9e;
	line-height: 1.3em;
}
#content h4 {
	color: #895c9e;
	font-style: italic;
}
*/

#content{
	grid-gap:calc(var(--space)*2);
	display:grid;
	grid-template-columns:1fr;
	margin:calc(var(--space)*6) auto 0 auto;
	max-width:1000px;
	width:100%
}
@media (min-width:1024px){
	#content {
		grid-template-columns:repeat(1, 1fr)
	}
}




/*
//////////////////////////
////////    FAQ     //////
//////////////////////////
*/
.less.faq_active {
	color: var(--color-medium-blue);
}
.less.faq_active .button-read-more, .button-read-less  {display: none; }
.less.faq_active .button-read-less {display: block;}
h5 {
	font-size: 1em;
    margin: 20px 0;
/*    background-color: #d8eff9;*/
    padding-left: 10px;
}
#content h5 a, #content h2 {
/*	color: #895c9e; border-bottom-style: none; border-bottom-width: 0;*/
	font-size: var(--font-size-26);
	font-weight: var(--font-weight-light);
}
/* #content h5.faq_active a, #content h5 a:hover { border-bottom: 0; color: #442e4f; }*/
h5 a:before {
	content: '>';
	display: block;
	float: left;
/*	width:0px;
	border: 8px solid transparent;
	border-left: 8px solid #895c9e;
	margin: 5px 0 0 0;*/
	margin: 0 20px 0 0;
	webkit-transition: all 0.1s ease-out;
	transition: all 0.1s ease-out;
}
h5 a:hover:before, h5.faq_active a:before {
	transform: rotate(90deg);
	border-left-color: #442e4f;
	/*margin: 10px 5px 0 -5px;*/
}
p.more {
	margin: 0 2em 2em;
}
.li {
    display: block;
}
.li:before {
	content: '';
    display: block;
    width: 10px;
    height: 10px;
    background-color: #895c9e;
    float: left;
    margin: 8px 8px 0 8px;
}

#form_abonnement h5 a:before {
/*	border: 12px solid transparent;
	border-left: 12px solid #895c9e;
	margin: 8px 0 0 5px;*/
	content: ">";
}
#form_abonnement h5 a:hover:before, #form_abonnement h5.faq_active a:before {
/*	margin: 16px 8px 0 -3px;
	border-left-color: #442e4f;*/
	content: ">";
}
#form_faq table {
	max-width: 500px;
	line-height: 1.2em;
	background-color: #d8eff9;
	margin: 20px auto;
	text-align: center;
	border-spacing: 0;
}
#form_faq table th, #form_faq table td {
	border: 1px solid white;
	padding: 7px 0;
}
#form_faq table th {
	background-color: #64b6e5;
}
input[type=radio]:after, input[type=radio]:checked:after{
	display: none;
}




/*
//////////////////////////
////////   FORMS    //////
//////////////////////////
*/
.admin2024 .admin2024_villes label{
	width: 25%;
	margin-left: 0;
}

input:not([type="radio"], [type="submit"], [type="checkbox"]):not(#annuler, #reprendre, #annuler_relance),
select, textarea,
.admin2024 input[type="submit"] {
/*
    border: 1px solid #895c9e;
*/
    font-size: 1.2em;
    padding: 0.5em;
    margin: 0 0.5em 1em 0;
	border: 1px solid var(--color-medium-blue);
	border-radius: var(--border-radius-25);
}

.admin2024 #form_users .btn_relance_box {
	display: block;
	width: 190px;
	font-size: 13px;
	position: relative;
	float: right;
	bottom: 110px;
}
  
.admin2024 #form_users .btn_relance_box::before {
	border: 16px solid transparent;
	border-right: 23px solid orange;
	left: -39px;
	top: 37px;
}
.admin2024 input#btn_relance {
    font-size: 1.2em;
    padding: 0.5em;
    margin: 0 0.5em 1em 0;
	border: 0;
	border-radius: 0;
}

.admin2024 .actu_resume textarea{
	width: 100%;
	border: 1px solid var(--color-medium-blue);
}

.admin2024 .donnee.input-icon,
.admin2024 input[name="actu_lien"] {
	min-height: 42px;
}
.admin2024 .actu_resume textarea.donnee {
  min-height: 100px;
  width: 100%;
}

#abonnement input[type='file'] {
    font-size: 1em;
}
#abonnement input:focus-within {
	border: 1px solid var(--color-white) !important;
	box-shadow: hsla(var(--color-medium-blue-h),var(--color-medium-blue-s),var(--color-medium-blue-l), .65) 0 0 10px 0;
	transition: box-shadow .5s var(--ease-standard-curve),border-color .5s var(--ease-standard-curve);
}
.date_abo_jour select:last-child {
	margin-right: 0;
}
.date_abo_jour {
	height: 75px;
	overflow: hidden;
	webkit-transition: all 0.3s ease-out;
	transition: all 0.3s ease-out;
}
input:not([type="radio"]):not([type="checkbox"]) {
	width: calc(100% - 2px - 1em);
    margin: 0 0 1em 0;
}
input[type="radio"], input[type="checkbox"] {
    width: 2em;
    height: 2em;
    margin-top: 0.1em;
    position: absolute;
    left: 0;
	top: 5px;
}
.admin_villes input[type="checkbox"] {
    width: 1.5em;
    height: 1.5em;
    margin-top: 0.1em;
    position: absolute;
    left: 0;
	top: 5px;
}
input[type="file"], input[name="forfait_navigo"] {
    width: auto;
    font-size: 1em;
    opacity: 1;
/*    height: 40px; */
    overflow: hidden;
	webkit-transition: all 0.1s ease-out;
	transition: all 0.1s ease-out;
}
input[type="submit"], input[type="button"] {
/*	width: 100%;
	color: #442e4f;
    background-color: #895c9e;
    text-align: center;
    margin-top: 2em;
	webkit-transition: all 0.1s ease-out;
	transition: all 0.1s ease-out;*/
}
input[type="submit"]:not(#envoyer_relance, #envoyer):hover, input[type="button"]:not(#reprendre, #annuler_relance, #envoyer_relance, #annuler, #envoyer):hover {
/*	color: #fff;
    background-color: #442e4f;
*/
}
input[type="submit"]:hover, input[type="button"]:hover {
    cursor: pointer;
}
input#btn_delete:hover {
    background-color: #ae0000;
    border-color: #ae0000;
}
label{
	display: inline-block;
	float: left;
	position: relative;
}
label.pad-left_40, label.pad-left_30{
	line-height: 3em;
}
label.txt_long {
	line-height: 1.6em;
}
.mentions{
/*	font-size: 0.85em;*/
	font-size: var(--font-size-10);
	font-style: italic;
}
textarea{
	width: 97%;
	display: inline-block;
}
.hidden { height: 0; }
.none { display: none; }
.inline_block { display: inline-block !important; }
.affiche {
	height: 100px;
	border: 1px solid #895c9e;
}
textarea.hidden {
	padding: 0;
	border: 1px solid #ffffff;
	margin: 0;
}
#content a.delete_forfait {
	display: inline-block;
	width: 15px;
	height: 15px;
	float: right;
	background: url("../../images/delete_0.gif") no-repeat;
	background-size: contain;
	border-bottom-style: none;
}
#content a.delete_forfait:hover {
	background: url("../../images/delete_1.gif") no-repeat;
	background-size: contain;
	cursor: pointer;
}
.cadre_rouge {
	border-right: 2px solid red;
	border-bottom: 2px solid red;
}


/* POPUP */
#popup_reabo, #popup_relance, #popup_wait {
	position: fixed;
	z-index: 0;
	width: 100%;
	height: 100%;
	background: rgba(68, 46, 79, 0.7);
	webkit-transition: all 0.3s ease-out;
	transition: all 0.3s ease-out;
	-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
	filter:alpha(opacity=0);
	-moz-opacity:0;
	opacity:0;
	display: none; 
}
#popup_reabo img, #popup_relance img {
	width: 30%;
	float: right;
}
#popup_reabo #retrouve_num, #popup_relance #relance_num{
	width: 425px;
	min-height: 200px;
	background: #fff;
	margin: 10% auto;
	border: 5px solid #d8eff9;
	padding: 20px;
}
#popup_wait {
	text-align: center;
}
#popup_wait div {
	margin-top: 15%;
}
#popup_wait .message {
	font-size: 25px;
	color: #fff;
}

.zi1000{ z-index: 1000 !important; }
.zi0 { z-index: 0 !important; }
.opc0 {
 	-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)" !important;
	filter:alpha(opacity=0) !important;
	-moz-opacity:0 !important;
	opacity:0 !important;
}
.opc1 {
 	-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)" !important;
	filter:alpha(opacity=100) !important;
	-moz-opacity:1 !important;
	opacity:1 !important;
}

#abonnement form label {
	font-size: inherit;
	font-weight: inherit;
}
#abonnement select{
	width: auto;
	
}
/*
#895c9e;
#442e4f;
*/





/*
//////////////////////////
//////// CONTACT  ////////
//////////////////////////
*/

.numVert{
	display: inline-block;
	font-size: 0.8em;
	color: green;
	text-align: center;
}
.numVert img { margin-top: 0.5em; }
.img_consigne { width : 100%; }





/*
//////////////////////////
/////// RECEPISSE  ///////
//////////////////////////
*/

body#recepisse { height: auto; }
#recepisse #wrapper { margin: 0 20px; }
#recepisse .rang_1, #recepisse .rang_2{ height: auto; }
#recepisse .rang_1 { text-align: center; }
#recepisse .rang_1 img { margin: 0; width: 200px; }
#recepisse #content { margin: 30px 0; padding: 0; }
#recepisse .rang_3 { position: absolute; bottom: 20px; width: 720px; height: auto; }
#recepisse h3 { margin: 0; }
#recepisse  p, #recepisse ul { margin: 0; padding: 0; }
#recepisse ul { margin-left: 20px; }
#recepisse .donnee { border: 1px solid #895c9e; width: calc(100% - 20px - 15px); display: inline-block; padding: 10px; min-height: 27px; }
#recepisse .donnee_modif .donnee { border-color: red; }
#recepisse .donnee code { font-size: 1.5em;}
#recepisse .sign .donnee { border: 0; border-bottom: 1px dotted #895c9e; height: 27px; }
.small { font-size: 8pt; font-style: italic; }

#recepisse .pourcent_33.footer:nth-child(1) img { width: 130px; margin-top: 91px; }
#recepisse .pourcent_33.footer:nth-child(2) img { width: 130px; margin: 80px 17px 0 0; }
#recepisse .pourcent_33.footer:nth-child(3) img { width: 180px; margin: 96px 35px 0 0; }





/*
//////////////////////////
///////  COMPTE    ///////
//////////////////////////
*/

#compte .donnee, .admin .donnee { border: 1px solid #e1d7e8; }
#compte .donnee:not(input), .admin .donnee:not(input) { width: calc(100% - 20px - 15px); display: inline-block; padding: 10px; min-height: 27px; }





/*
///////////////////////////////////////
///////  FORMULAIRES PUBLICS    ///////
///////////////////////////////////////
*/

#formulaire .pourcent_100 {
	width: 97%;
	position: relative;
	float: right;
	margin: 20px 0;
}

#formulaire .imghelp {
	position: absolute;
	left: -35px;
	top: 6px;
}
#formulaire .pourcent_25 {
/*	width: 24%; */
}
#formulaire .pourcent_100.left {
	float: left;
	margin: 10px 0 0 0;
}
#formulaire .stat {
	height: 30px;
	background-color: #d8eff9;
	border-left: 2px solid #56c3f1;
	line-height: 1.8em;
}
#formulaire .stat::after {
	display: inline-block;
	position: absolute;
	right: 0;
	content: '';
	height: 1.8em;
	border-right: 2px solid #d8eff9;
}
#formulaire .radio_line {
	border-bottom: 2px solid #56c3f1;
}






/*
//////////////////////////
///////  ADMIN     ///////
//////////////////////////
*/

.admin .rang_2.rang_bleu, #alert .rang_2.rang_bleu, #alert_incident .rang_2.rang_bleu{
	height: auto;
}
.admin #content, #alert #content, #alert_incident #content {
	min-height: 545px;
}
.admin table.user {
	width: 100%;
	border-spacing: 0;
    border-collapse: separate;
}
.admin table.user tr:not(.libelle):hover {
	cursor: pointer;
}
.admin table.user tr.libelle {
	font-weight: 600;
}
.admin table.user td {
	border-bottom: 1px solid gray;
}
.admin table.user tr.inactif {
	color: #c4aecf;
}
.admin table.user tr.inactif_relance {
	color: #facc8c;
}
.admin #content table.user a {
	border-bottom-width: 0;
}
.admin #content table.user a.actif {
	color: #4ec2eb;
}
.admin #content table.user a.actif:before {
	content: '';
	display: block;
	float: left;
	width:0px;
	border: 4px solid transparent;
	border-bottom: 8px solid #4ec2eb;
	margin: 5px 5px 0 -15px ;
	webkit-transition: all 0.3s ease-out;
	transition: all 0.3s ease-out;
}
.admin #content table.user a.actif.desc:before,
.admin #content table.user a.actif.asc:hover:before {
	border: 4px solid transparent;
	border-top: 8px solid #4ec2eb;
	margin-top: 9px;
}
.admin #content table.user a.actif.asc:before,
.admin #content table.user a.actif.desc:hover:before {
	border: 4px solid transparent;
	border-bottom: 8px solid #4ec2eb;
	margin-top: 5px;
}

.admin .plus{
	content: '';
	display: block;
	position: relative;
	width: 1em;
	height: 1em;
	float: left;
	webkit-transition: all 0.1s ease-out;
	transition: all 0.1s ease-out;
	margin: 5px 5px 40px 0;
}
.admin .plus:before, .admin .plus:after{
	content: '';
	display: block;
	background-color: #442e4f;
	position: absolute;
}
.admin .plus:before{
	width: 30%;
	height: 100%;
	left: 35%
}
.admin .plus:after{
	width: 100%;
	height: 30%;
	top: 35%
}
.admin a:hover .plus{
	transform: rotate(90deg);
}
.admin a:hover .plus:before, .admin a:hover .plus:after {
	background-color: #4ec2eb;
}

.admin h2 { margin: 0; }

label[for="actif"] input[type="checkbox"] {
  display: none;
}
label span.input {
  height: 15px;
  width: 15px;
  border: 1px solid #895c9e;
  display: inline-block;
  position: relative;
  margin-left: 10px;
}
[type=checkbox]:checked + span.input:before {
  content: '\2714';
  position: absolute;
  top: -15px;
  left: 0;
  color: green;
  font-size: 1.5em;
}
label, label span.input, input[type="radio"], input[type="checkbox"] {
	cursor: pointer;
}

.admin select#date_validite_AAAA, .admin select#date_naissance_AAAA,
.admin select#date_debut_AAAA, .admin select#date_fin_AAAA {
	margin-right: 0;
}
textarea{
	font-family: 'Titillium-Web';
	font-size: 1em;
	webkit-transition: all 0.3s ease-out;
	transition: all 0.3s ease-out;
}
.admin textarea{
	height: 300px;
}

.admin .count{
	display: block;
	float: right;
	padding-right: 10px;
	font-size: 8pt;
	line-height: 25px;
}

.admin #btn_relance {
	margin: -5px 0 0 0;
	background-color: orange;
	border-color: orange;
}
.admin .btn_relance_box::before {
	content: '';
	display: block;
	position: relative;
	width: 0px;
	border: 23px solid transparent;
    border-right-color: transparent;
    border-right-style: solid;
    border-right-width: 8px;
	border-right: 23px solid orange;
	margin: 5px 0 5px 0;
	left: -35px;
	top: 46px;
}