html, body {
	width: 100%;
	margin: auto;
	height: 100%;
	padding: 0;
}

body {
	position: relative;
	font-family: 'Open Sans', Arial, sans-serif;
	font-size: 1em;
	margin: 0;
	padding: 0;
	color: #111;
/*
	background-image: url(/images/fond.jpg);
	background-repeat: no-repeat;
	background-size: cover;
	background-attachment: fixed;
*/
	/* -webkit-font-smoothing: antialiased; */
}

* {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-o-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
	outline: none;
}

main { display: block; } /* IE9+ hack */

nav, ul, li, a { margin: 0; padding: 0; }
ul {
	list-style-type: none;
	list-style: none; /* Pour enlever les puces sur IE7 */
}
ul li.tooltipdata { cursor: pointer; }

.clearfix:before, .clearfix:after { content: " "; display: table; }
.clearfix:after { clear: both; }
.clearfix { *zoom: 1; } /* IE 6 et 7 */

article, aside, figcaption, figure, footer, header, hgroup, nav, section { display: block; } /* Pour navigateurs ne supportant pas par défaut ces éléments HTML5 : Androïd browser, ...) */


h1, h2, h3 { font-family: Raleway, sans-serif; font-size: 2em; color: #32B1D2; font-weight: bold; text-align: center; margin-top: 0; }
h2 { font-size: 1.8em; }
h3 { font-size: 1.6em; }
h1.underscore, h2.underscore, h3.underscore { padding: 8px; border-top: 1px solid #32B1D2; border-bottom: 1px solid #32B1D2; margin-bottom: 25px; }
h1.underscore.vert, h2.underscore.vert, h3.underscore.vert { color: green; border-color: green; }

header, footer {
	position: relative;
	width: 100%;
	margin: 0;
	padding: 0;
	background: #FF8421;
}
header {
	background: -webkit-linear-gradient(#EB7919, #FF8421); 
	background: -moz-linear-gradient(#EB7919, #FF8421); 
	background: -ms-linear-gradient(#EB7919, #FF8421); 
	background: -o-linear-gradient(#EB7919, #FF8421); 
	background: linear-gradient(#F4B17A, #FF8421);
}
footer { background: #000; padding-bottom: 40px; }
/* footer { box-shadow: 1px -2px 5px rgba(0, 0, 0, 0.8); } */
header { box-shadow: 1px 2px 5px rgba(0, 0, 0, 0.3); }

header .content, footer .content, main .content, #informations .content { position: relative; width: 100%; max-width: 1200px; padding: 15px 0; margin: auto; z-index: 0; }

header .content { padding: 12px 0; }

header #logo {
	display: inline-block;
	width: 174px;
	height: 87px;
	background: url(/images/logo.png) no-repeat;
	text-align: center;
}

header table { display: none; visibility: hidden; position: fixed; top: 0; width: 100%; box-shadow: 1px 2px 5px rgba(0, 0, 0, 0.8); z-index: 500; }
header table td:nth-child(2), header table td:nth-child(3) { width: 50px; }

body main div.bandeau { background: #F7F7F7; /* background: url(/images/TEMPORAIRE/fond-starnow.com.gif); */ }

p.important {
	padding: 15px;
	color: #44A5AC;
	background: #CCEAEC;
	border: 1px solid #44A5AC;
}
p.important span.exergue {
	display: block;
	padding: 10px;
	color: #FFF;
	background: #44A5AC;
	margin-top: 15px;
}

/************************************/
/**** CLASSES SPECIALES : RADIUS ****/
/************************************/

.radius5 {
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	-o-border-radius: 5px;
	border-radius: 5px;
}

.radius5top {
	-moz-border-radius: 5px 5px 0 0;
	-webkit-border-radius: 5px 5px 0 0;
	-o-border-radius: 5px 5px 0 0;
	border-radius: 5px 5px 0 0;
}
.radius5b {
	-moz-border-radius: 0 0 5px 5px;
	-webkit-border-radius: 0 0 5px 5px;
	-o-border-radius: 0 0 5px 5px;
	border-radius: 0 0 5px 5px;
}
.radius5g {
	-moz-border-radius: 5px 0 0 5px;
	-webkit-border-radius: 5px 0 0 5px;
	-o-border-radius: 5px 0 0 5px;
	border-radius: 5px 0 0 5px;
}
.radius5d {
	-moz-border-radius: 0 5px 5px 0;
	-webkit-border-radius: 0 5px 5px 0;
	-o-border-radius: 0 5px 5px 0;
	border-radius: 0 5px 5px 0;
}

.radius10 {
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	-o-border-radius: 10px;
	border-radius: 10px;
}

.radius10b {
	-moz-border-radius: 0 0 10px 10px;
	-webkit-border-radius: 0 0 10px 10px;
	-o-border-radius: 0 0 10px 10px;
	border-radius: 0 0 10px 10px;
}

.radius50pc {
	-moz-border-radius: 50%;
	-webkit-border-radius: 50%;
	-o-border-radius: 50%;
	border-radius: 50%;
}


/******************************/
/******************************/
/******************************/



/****************************/
/**** CLASSES GENERIQUES ****/
/****************************/

#website { display: none; } /* Anti bots ! */

.center { text-align: center; }
.right { text-align: right; }
.lh28 { line-height: 28px; }
.lh35 { line-height: 35px; }

p.erreur {
	color: #C6000E;
	border-left: 4px solid #C6000E;
	padding: 10px 10px 10px 15px;
	margin: 25px 0 10px 0;
	background: #F9EDEE;
}
p.succes {
	color: #009600;
	border-left: 4px solid #009600;
	padding: 10px 10px 10px 15px;
	margin: 25px 0 10px 0;
	background: #D9F9D9;
}

a.btn, span.btn, div.btn {
	display: inline-block;
	text-align: center;
	padding: 10px 30px;
	font-size: 1.3em;
	color: #FFF;
	background: rgba(255, 119, 9, 0.8);
	text-decoration: none;
	transition: background 0.3s;
}
a.btn:hover, span.btn:hover, div.btn:hover { background: rgba(255, 119, 9, 1); }

a.btn.vert, span.btn.vert, div.btn.vert { background: rgba(50, 160, 50, 0.8); }
a.btn.vert:hover, span.btn.vert:hover, div.btn.vert:hover { background: rgba(50, 160, 50, 1); }

a.btn.bleu, span.btn.bleu, div.btn.bleu { background: rgba(0, 126, 198, 0.8); }
a.btn.bleu:hover, span.btn.bleu:hover, div.btn.bleu:hover { background: rgba(0, 126, 198, 1); }

a.btn.rouge, span.btn.rouge, div.btn.rouge { background: rgba(222, 0, 16, 0.8); color: red; }
a.btn.rouge:hover, span.btn.rouge:hover, div.btn.rouge:hover { background: rgba(222, 0, 16, 1); }

a.btn.rose, span.btn.rose, div.btn.rose { /* Avant 05/2026 : background: rgba(255, 149, 149, 0.8); */ background: rgba(0, 0, 0, 0.7); color: #FFF; }
a.btn.rose:hover, span.btn.rose:hover, div.btn.rose:hover { background: rgba(212, 0, 0, 1); }

.colgauche { float: left; width: 48%; margin-right: 4%; }
.coldroite { width: 48%; overflow: hidden; }
@media screen and (max-width: 990px) {
	.colgauche, .coldroite { float: none; width: 100%; margin-right: 0; }
}


/******************************/
/******************************/
/******************************/

/**********************/
/**** FIL D'ARIANE ****/
/**********************/

#ariane { position: relative; z-index: 10; margin-top: 0; padding: 0; color: #666; font-size: 0.85em; margin-bottom: 15px; }
#ariane div[itemtype="http://data-vocabulary.org/Breadcrumb"] { display: inline; margin: 0; padding: 0; font-size: 0.9em; color: #666; }
#ariane div[itemtype="http://data-vocabulary.org/Breadcrumb"] a, #ariane div[itemtype="http://data-vocabulary.org/Breadcrumb"] a:visited { color: #666; margin-right: 5px; text-decoration: none; transition-duration: 0.3s; }
#ariane div[itemtype="http://data-vocabulary.org/Breadcrumb"] a:hover { border: none; text-decoration: none; color: #EFA349; }
#ariane div[itemprop="child"] { margin-left: 5px; }

/*************************/
/**** + OMBRAGES CSS3 ****/
/*************************/

.drop-shadow {
	position:relative;
/*
	-webkit-box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
	-moz-box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
	box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
*/
}
.drop-shadow:before, .drop-shadow:after {
	content:"";
	position:absolute;
	z-index:-2;
}

/**** Décollements extérieurs sur le bas ****/

.lifted {
	-moz-border-radius:4px;
	border-radius:4px;
}
.lifted:before, .lifted:after {
	bottom:18px;
	left:10px;
	width:50%;
	height:20%;
	max-width:300px;
	max-height:100px;
	-webkit-box-shadow:0 15px 10px rgba(0, 0, 0, 0.9);
	-moz-box-shadow:0 15px 10px rgba(0, 0, 0, 0.9);
	box-shadow:0 15px 10px rgba(0, 0, 0, 0.9);
	-webkit-transform:rotate(-3deg);
	-moz-transform:rotate(-3deg);
	-ms-transform:rotate(-3deg);
	-o-transform:rotate(-3deg);
	transform:rotate(-3deg);
}
.lifted:after {
	right:10px;
	left:auto;
	-webkit-transform:rotate(3deg);
	-moz-transform:rotate(3deg);
	-ms-transform:rotate(3deg);
	-o-transform:rotate(3deg);
	transform:rotate(3deg);
}

/******************************/
/******************************/
/******************************/

/*********************/
/**** FORMULAIRES ****/
/*********************/

/* form.dot { border: 1px solid #80A9D9; padding: 15px; background: rgba(128, 169, 217, 0.1); font-size: 0.95em; } */

form p label:first-child {
	float: left;
	width: 30%;
	text-align: right;
	margin-right: 3%;
	padding-top: 5px;
}

form p input, form p textarea {
	font-family: 'Open Sans', Arial, sans-serif;
	padding: 5px 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	-o-border-radius: 5px;
	border-radius: 5px;
	border: 1px solid #CCC;
}
form p select { padding: 5px; border: 1px solid #CCC; font-size: 0.9em; }
/*
form p select optgroup:before {
    content: attr(label);
    display: block;
    margin: 5px 3px;
    color: #CFA665;
    font-size: 1.15em;
    font-style: normal;
    font-weight: bold;
    padding-left: 5px;
}
*/
form p textarea { width: 60%; height: 120px; font-size: 0.85em; }

form input[type="submit"], a.action {
	display: inline-block;
	padding: 15px 45px;
	/* width: 100%; */
	color: #FFF;
	font-size: 1.1em;
	text-shadow: 0px 1px 1px rgba(0, 0, 0, 0.3);
	border: none;
	/* box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.4); */
	cursor: pointer;
	/*
	background-color: #F59812;
	background-image: linear-gradient(rgba(255,255,255,0.4), rgba(255,255,255,0));
	*/
	background: rgba(255, 119, 9, 0.8);
	transition: background-color 0.3s;
}

form input[type="submit"]:hover, a.action:hover {
	/*
	background-color: #3386AF;
	background-image: linear-gradient(rgba(255,255,255,0.4), rgba(255,255,255,0));
	*/
	background: #499549;
}
form input[type="submit"]:active { box-shadow: 1px 1px 10px #1E516B inset, 0 1px 0 rgba(255, 255, 255, 0.4); }

/**** Supression des LABELS en basse résolution ****/

form p input[type="text"], form p input[type="email"], form p input[type="password"], form p input[type="tel"], form p select, form p textarea { min-width: 30%; }

@media screen and (max-width: 650px), (min-width: 871px) and (max-width: 980px) {
	form p label:first-child { display: block; width: 100%; text-align: left; margin-bottom: 10px; background: #EEE; padding: 4px 0 4px 10px; }
	form p label:first-child { display: none; }
	form p input[type="text"], form p input[type="email"], form p input[type="password"], form p input[type="tel"], form p select, form p textarea, #mr_nom, #mr_nom_resultats { width: 100%; margin-left: 0; }
}


/****/
/**** FORMULAIRES : checkboxes stylées ****/
/****/

[type="checkbox"]:not(:checked), [type="checkbox"]:checked { /* on cache la case à cocher */
  position: absolute;
  left: -9999px;
}
[type="checkbox"]:not(:checked) + label, [type="checkbox"]:checked + label { /* on prépare le label */
  position: relative; /* permet de positionner les pseudo-éléments */
  padding-left: 30px; /* fait un peu d'espace pour notre case à venir */
  cursor: pointer;    /* affiche un curseur adapté */
}
[type="checkbox"]:not(:checked) + label:before, [type="checkbox"]:checked + label:before { /* Aspect des checkboxes - :before sert à créer la case à cocher */
  content: '';
  position: absolute;
  left:0; top: 2px;
  width: 17px; height: 17px; /* dim. de la case */
  border: 1px solid #aaa;
  background: #f8f8f8;
  border-radius: 5px; /* angles arrondis */
  box-shadow: inset 0 1px 3px rgba(0,0,0,.3); /* légère ombre interne */
}
[type="checkbox"]:not(:checked) + label:after, [type="checkbox"]:checked + label:after { /* aspect général de la coche */
  /* background: red;
  content: 'X'; */
  font: 12pt FontAwesome;
  content: "\00f00c";
  position: absolute;
  top: 3px; left: 1px;
  /* color: #09ad7e; */
  color: rgba(72, 168, 72, 1);
  transition: all .1s; /* on prévoit une animation */
}
[type="checkbox"]:not(:checked) + label:after { /* aspect si "pas coché" */
  opacity: 0; /* coche invisible */
  transform: scale(0); /* mise à l'échelle à 0 */
}
[type="checkbox"]:checked + label:after { /* aspect si "coché" */
  opacity: 1; /* coche opaque */
  transform: scale(1); /* mise à l'échelle 1:1 */
}
[type="checkbox"]:disabled:not(:checked) + label:before, [type="checkbox"]:disabled:checked + label:before { /* aspect si désactivé */
  box-shadow: none;
  border-color: #bbb;
  background-color: #ddd;
}
[type="checkbox"]:disabled:checked + label:after { /* styles de la coche (si coché/désactivé) */
  color: #999;
}
[type="checkbox"]:disabled + label { /* on style aussi le label quand désactivé */
  color: #aaa;
}
 
/* aspect au focus de l'élément */
/*
[type="checkbox"]:checked:focus + label:before,
[type="checkbox"]:not(:checked):focus + label:before {
  border: 1px dotted blue;
}
*/

/****/
/**** FORMULAIRES : spécifique AFS (placeholders mouvants au focus) ****/
/****/

	form.afs { padding: 20px 0; }
	form.afs.pad20 { padding: 20px; }
	/* form.afs.sansfond { background: none; box-shadow: none; } */

	form.afs div.inp { position: relative; }
	form.afs div.inp.enligne { display: inline-block; width: auto; } /* Pour aligner plusieurs champs côte à côte ! */
	form.afs div.inp.cache { display: none; } /* Champs cachés par défaut (par exemple pour un affichage conditionnel) */
	form.afs div.inp span.lab { position: absolute; left: 10px; top: 9px; color: #000; font-family: sans-serif; font-size: 0.85em; z-index: 40; }
	form.afs input[type="text"], form.afs input[type="email"], form.afs input[type="number"], form.afs input[type="password"], form.afs select, form.afs textarea {
		position: relative;
		padding: 10px;
		border: 1px solid #444;
		font-size: 1em;
		font-family: Arial;
		transition: all 0.3s;
		-webkit-border-radius: 5px;
		-moz-border-radius: 5px;
		-o-border-radius: 5px;
		border-radius: 5px;
		/* background: #F9F9F9; */
		background: rgba(240, 240, 240, 0.5); /* IMPORTANT !!! La couleur de fond DOIT ETRE TRANSPARENTE, sans quoi on ne voit plus le label ET/OU (selon les z-index) cliquer sur le label ne donne plus le focus à l'input !!!! */
		z-index: 50;
		color: #444;
		width: 100%;
		margin-bottom: 15px;
	}
	form.afs input[type="text"]:focus, form.afs input[type="email"]:focus, form.afs input[type="number"]:focus, form.afs input[type="password"]:focus, form.afs input[type="text"].focusse, form.afs input[type="email"].focusse, form.afs input[type="number"].focusse, form.afs input[type="password"].focusse, form.afs textarea:focus, form.afs textarea.focusse, form.afs select:focus, form.afs select.focusse {
		padding: 30px 10px 10px 10px;
		border-color: #FF8421;
		-webkit-box-shadow: 0 0 6px rgba(255, 132, 33, 0.4);
		-moz-box-shadow: 0 0 6px rgba(255, 132, 33, 0.4);
		box-shadow: 0 0 6px rgba(255, 132, 33, 0.4);
	}
	form.afs input[type="text"]:focus + span.lab, form.afs input[type="email"]:focus + span.lab, form.afs input[type="number"]:focus + span.lab, form.afs input[type="password"]:focus + span.lab, form.afs input[type="text"].focusse + span.lab, form.afs input[type="email"].focusse + span.lab, form.afs input[type="number"].focusse + span.lab, form.afs input[type="password"].focusse + span.lab, form.afs textarea:focus + span.lab, form.afs textarea.focusse + span.lab, form.afs select:focus + span.lab, form.afs select.focusse + span.lab { font-size: 0.8em; color: #555; }

	form.afs textarea {
		box-sizing: border-box;
		resize: none;
		height: 120px;
	}

	form.afs select {
		display: inline-block;
		outline:none;
		-webkit-appearance:none;
		-moz-appearance:none;
		appearance:none;
		cursor:pointer;
		color: #444;
	}
	form.afs select option { /* background: #EEDED2; */ background: #F9F9F9; }
	/* Targetting Webkit browsers only. FF will show the dropdown arrow with so much padding. */
	@media screen and (-webkit-min-device-pixel-ratio:0) {
		form.afs select {padding-right:18px}
	}

	/* ATTENTION !! Certains champs DOIVENT ABSOLUMENET conserver le style de base, même renseignés ou sur focus ! */
	form.afs select[name="ville_resultat"] {
		-webkit-appearance: menuarrow;
		-moz-appearance: menuarrow;
		appearance: menuarrow;
		width: auto;
		min-width: 250px;
		border: 1px solid #444;
		background: #EEE;
	}
	form.afs input[name="ville_lettres"]:focus, form.afs select[name="ville_resultat"]:focus { padding: 10px; }

	form.afs input[name="nom"], form.afs input[name="prenom"], form.afs input[name="telephone"], form.afs input[name="tel_fixe"], form.afs input[name="tel_mobile"] { max-width: 300px; }
	form.afs input[name="email"] { max-width: 450px; }
	form.afs input[type="password"] { max-width: 350px; }
	form.afs input[name="pseudo"], form.afs input[name="password"], form.afs input[name="reference"] { max-width: 250px; }
	form.afs input[name="libelle"] { max-width: 500px; }
	form.afs input[name="cheque_montant"] { max-width: 180px; }
	form.afs input[name="cheque_ordre"] { max-width: 400px; }

	form.afs select[name="sexe"] { max-width: 120px; }
	form.afs select[name="departement"], form.afs select[name="type"], form.afs select[name="pays"] { max-width: 350px; }

	form.afs input[type="number"] { max-width: 280px; }	

	form.afs textarea[name="rendez_vous"], form.afs textarea[name="contact"], form.afs textarea[name="depenses_detail"], form.afs textarea[name="cheque_envoi"], form.afs textarea[name="cheque_explications"] { height: 80px; }

	form.afs input[type="submit"] { width: 100%; -moz-border-radius: 5px; -webkit-border-radius: 5px; -o-border-radius: 5px; border-radius: 5px; }
	form.afs input[type="submit"].std { display: block; width: auto; margin: 20px auto; }

	form.afs input[type="radio"] {
		width: auto;
		margin-bottom: 0;
	}

/****/
/**** FORMULAIRES : choix par bouton radio du type d'activité (AVEC LIGNES D'AIDE !) ****/
/****/

ul.choix_type_activite {
	margin: 15px 0;
}
ul.choix_type_activite li {
	float: left;
	display: inline-block;
	width: 48%;
	margin: 2px 1%;
	padding: 7px 10px;
	font-size: 0.95em;
	min-height: 85px;
	transition: background 0.3s;
}
ul.choix_type_activite li:hover, ul.choix_type_activite li.surlignage { background: #FFDFC5; }
ul.choix_type_activite li label { font-weight: bold; font-size: 0.9em; }

@media screen and (max-width: 750px) {
	ul.choix_type_activite li {
		float: none;
		margin: 2px 0;
		width: 100%;
		min-height: 0;
	}
}

/****/
/**** FORMULAIRES : choix par bouton radio du mode de pré-adhésion (essai ou juste info) ****/
/****/

ul.inscription li {
	/* border: 2px solid #32B1D4; */
	border: 2px solid #67D05C;
	padding: 15px;
	margin-bottom: 15px;
	/* background: #EEF9FC; */
	background: #E2F6E0;
	font-size: 0.9em;
	transition: background 0.3s;
	cursor: pointer;
}
ul.inscription li input[type="radio"] { margin-right: 10px; width: 30px; }
ul.inscription li label { font-size: 1.15em; font-weight: bold; cursor: pointer; }
ul.inscription li p.cache { display: none; }
ul.inscription li:hover, ul.inscription li.surlignage { background: #CCEDC9; }

#essai_champs, #info_champs { display: none; cursor: default; }


/****/
/**** FORMULAIRES APPELES SOUS MAGNIFIC POPUPS ****/
/****/

#password-oublie-form { padding: 20px; background: #FFF; font-size: 0.9em; }
#password-oublie-form h3 { padding: 7px 0 7px 15px; margin: 0 0 20px 0; font-size: 1.5em; background: #D6F0F6; }

/******************************/
/******************************/
/******************************/

/***************************************************************************************/
/**** CAS PARTICULIER : ESPACE D'IDENTIFICATION + FORMULAIRE ou PAVE DE BIENVENUE ! ****/
/***************************************************************************************/

header #identification { position: relative; float: right; width: 100%; max-width: 560px; text-align: center; padding: 10px 0 15px 0; }
header #identification input {
	font-family: 'Open Sans', Arial, sans-serif;
	padding: 7px;
	border: none;
	box-shadow: inset 2px 1px 2px rgba(0,0,0,0.4);
	display: block;
	width: 100%;
	margin-bottom: 7px;
}

header #identification input[type="submit"] {
	width: 100%;
	text-align: center;
	color: #FFF;
	font-size: 0.95em;
	text-shadow: 0px 1px 1px rgba(0, 0, 0, 0.3);
	border: none;
	box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.6);
	cursor: pointer;
	background: #3C98CF;
	background: -webkit-linear-gradient(#3C98CF, #2D74A0); 
	background: -moz-linear-gradient(#3C98CF, #2D74A0); 
	background: -ms-linear-gradient(#3C98CF, #2D74A0); 
	background: -o-linear-gradient(#3C98CF, #2D74A0); 
	background: linear-gradient(#3C98CF, #2D74A0);
}
header #identification input[type="submit"]:hover {
	background: #3CA1D3;
	background: -webkit-linear-gradient(#3CA1D3, #3386AF);
	background: -moz-linear-gradient(#3CA1D3, #3386AF);
	background: -ms-linear-gradient(#3CA1D3, #3386AF);
	background: -o-linear-gradient(#3CA1D3, #3386AF);
	background: linear-gradient(#3CA1D3, #3386AF);
}
header #identification input[type="submit"]:active { box-shadow: 1px 1px 10px #1E516B inset, 0 1px 0 rgba(255, 255, 255, 0.4); }
header #identification input[type="email"]:focus, header #identification input[type="password"]:focus { border-color: #3F99E5; }

header #identification div {
	float: left;
	width: 165px;
	margin-right: 10px;
	text-align: center;
}
header #identification div:last-child { margin-right: 0; }
header #identification div i.fa { margin-right: 5px; }
header #identification div span { font-size: 0.8em; }
/*
header #identification input[type="checkbox"] { position: relative; vertical-align: bottom; top: 1px; }
*/
header #identification form[name="identification"], header #identification #identifie { position: absolute; right: 0; } /* On positionne les éléments (formulaire comme pavé de bienvenue !) à droite de #identification */
header #identification #identifie {
/*
	position: absolute;
	right: 0;
	z-index: 9900;
	padding: 20px;
	background: #FDDDBD;
	border: 5px solid #F78703;
	border-top: none;
	text-align: center;
	width: 300px;
	height: 110px;
	margin-top: -20px;
	border-radius: 0 0 10px 10px;
*/
	margin-top: -10px;
	padding: 13px;
	background: #FDDDBD;
	text-align: center;
	width: 350px;
}
header #identification #identifie.readherer { width: 400px; }
/*
header #identification #identifie .btn {
	position: absolute;
	padding: 7px 0;
	width: 20%;
	bottom: 12px; 
	text-align: center;
	border: 1px solid #F78703;
	color: #F78703;
	margin: 0;
	cursor: pointer;
	transition: all 0.3s;
}
*/
header #identification #identifie div.acces { margin-top: 10px; width: 100%; }
header #identification #identifie a.btn {
	position: relative;
	display: inline-block;
	padding: 6px 12px;
	font-size: 1em;
	text-align: center;
	background: rgba(247, 135, 3, 0.65);
	color: #FFF;
	margin: 0 2px;
	cursor: pointer;
	transition: all 0.3s;
}
header #identification #identifie a.btn i.fa { margin: 0; }

header #identification #identifie a.btn.readherer { background: #5BB35B; }

header #identification #identifie .btn.actif {
	background: #F9B66F;
	background: -webkit-linear-gradient(#F9B66F, #F78703); 
	background: -moz-linear-gradient(#F9B66F, #F78703); 
	background: -ms-linear-gradient(#F9B66F, #F78703); 
	background: -o-linear-gradient(#F9B66F, #F78703); 
	background: linear-gradient(#F9B66F, #F78703);
	color: #FFF;
	transition: all 0.3s;
}
header #identification #identifie .btn:hover, header #identification #identifie .btn.actif:hover {
	background: #F78703;
	color: #FFF;
}

header #identification #identifie a.btn span { position: absolute; bottom: -5px; right: -5px; padding: 3px 8px; border-radius: 50%; background: #50BE87; color: #FFF; }
#menu_ident_show { background: #04B200; }
#menu_ident_show:hover { background: #FFF; }
#menu_ident_show span { border: 2px solid #FFF; padding: 2px 7px; font-size: 0.5em; }

#identification a { text-decoration: none; color: #FFF; }
#identification a.cta_inscription { display: block; padding: 5px; color: #FFF; border: 1px solid #FFF; transition: background 0.3s; }
#identification a.cta_inscription:hover { color: #FF8421; background: #FFF; }

/******************************/
/******************************/
/******************************/




div.bandeau div.content { padding-top: 30px; padding-bottom: 30px; }


/*
div.elt_activite {
	float: left;
	width: 22%;
	margin-right: 3%;
}
div.elt_activite p {
	margin-top: 0;
	padding: 20px 10px;
	font-size: 0.9em;
	border: 2px solid #F5EDE7;
	border-top: none;
}
div.elt_activite p a {
	display: block;
	height: 45px;
	overflow: hidden;
	margin-bottom: 7px;
	color: #FF8421;
	text-decoration: none;
}
*/


ul.activites_mosaique, ul.inscrits_mosaique, ul.antennes_mosaique, ul.liste_echanges, ul.album_mosaique, ul.dossiers_mosaique { width: 100%; padding: 0; }
ul.activites_mosaique li, ul.inscrits_mosaique li, li.lazy_activites, ul.antennes_mosaique li, ul.liste_echanges li, ul.album_mosaique li, ul.dossiers_mosaique li {
	position: relative;
	display: inline-block;
	width: 22.5%;
	margin: 0 1% 25px 1%;
	padding: 0;
	/* border: 1px solid #FFCAA3; */
	border: 1px solid rgba(240, 222, 208, 0.8);
	overflow: hidden;
	-moz-border-radius: 5px 5px 5px 5px;
	-webkit-border-radius: 5px 5px 5px 5px;
	-o-border-radius: 5px 5px 5px 5px;
	border-radius: 5px 5px 5px 5px;
}
ul.inscrits_mosaique li, ul.liste_echanges li, ul.liste_contacts li { height: 85px; overflow: hidden; border: none; }
ul.inscrits_mosaique.coo-reg li { height: 110px; position: relative; border: 1px dashed #E9C8A7; padding: 10px; }
ul.inscrits_mosaique.coo-reg li a.supprimer { position: absolute; bottom: 7px; right: 7px; display: inline-block; font-size: 0.85em; padding: 3px 8px; background: #FBF5EF; color: red; border: 1px solid red; border-radius: 5px; transition: all 0.3s; }
ul.inscrits_mosaique.coo-reg li a.supprimer:hover { background: red; color: #FFF; }
ul.liste_echanges.detail li, ul.liste_contacts li { height: auto; }
ul.album_mosaique li {
	position: relative;
	height: 170px; overflow: hidden; text-align: center; /* background-repeat: no-repeat; background-size: cover; background-position: 50% 50%; */
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
	cursor: pointer;
}
ul.album_mosaique li a {
	display: none;
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	padding: 20px 0;
	text-align: center;
	background: rgba(0, 0, 0, 0.8);
	color: #FF923A;
	font-size: 0.9em;
	text-decoration: none;
}
ul.album_mosaique li:hover a { display: block; }
ul.liste_contacts li, ul.album_mosaique li { margin-bottom: 15px; }
ul.liste_echanges.detail li.moi { background: #FDDDBD; border-color: #F9A544; } /* Le lecteur est l'expéditeur du message ! */
ul.liste_echanges.detail li p.date { background: #DFC4B1; padding: 6px 15px; font-size: 0.9em; overflow: hidden; }
ul.liste_echanges.detail li p.date i.fa { margin-left: 15px; color: #FF0009; cursor: help; }

ul.liste_echanges li { position: relative; display: block; width: 100%; height: 105px; padding: 10px; background: #F5EDE7; border: 1px solid #DFC4B1; margin-bottom: 10px; overflow: hidden; margin-left: 0; }
ul.liste_echanges li a.msg { position: absolute; right: 10px; top: 10px; height: 85px; text-align: center; padding-top: 10px; min-width: 150px; background: rgba(255, 153, 0, 0.75); color: #FFF; text-decoration: none; line-height: 25px; transition: background 0.3s; }
ul.liste_echanges li a.msg:hover { background: rgba(255, 153, 0, 1); }
ul.liste_echanges li a.msg span { display: block; font-size: 0.9em; line-height: 20px; }
/* ul.liste_echanges li.nouveau { background: #E5CFBF; } */
ul.liste_echanges li.nouveau { background: #FFE4B9; border-color: #FF7709; }
ul.liste_echanges li a.msg.nouveau { background: #FF7709; }
ul.liste_echanges li p { margin-top: 7px; }
ul.liste_echanges li p a { display: inline-block; padding: 5px 12px; color:#FFF; background: rgba(255, 153, 0, 0.75); text-decoration: none; font-size: 0.9em; margin-right: 5px; transition: background 0.3s; }
ul.liste_echanges li p a:hover { background: rgba(255, 153, 0, 1); }
ul.liste_echanges li p a.ban { background: #787878; }
ul.liste_echanges li p a.ban:hover { background: #E60000; }
ul.liste_contacts li a { display: inline-block; margin-top: 15px; padding: 7px 20px; text-align: center; text-decoration: none; font-weight: bold; color: #FCAE3A; border: 1px solid #FCAE3A; transition: background 0.3s; }
ul.liste_contacts li a:hover { color: #FFF; background: #FCAE3A; }
ul.liste_contacts li a.lien { padding: 0; border: 0; } /* Pour les magnific popups de la messagerie */
ul.liste_contacts li a.lien:hover { background: none; color: #FCAE3A; } /* Pour les magnific popups de la messagerie */

@media screen and (max-width: 550px) {
	ul.liste_echanges li { height: auto; }
	ul.liste_echanges li a.msg { float: none; position: relative; display: block; min-width: 100%; height: auto; padding: 5px; right: 0; margin: 0 0 10px 0; }
	ul.liste_echanges li a.msg span { display: none; }
}

ul.dossiers_mosaique li { padding: 20px; text-align: center; border: 2px solid #DCB28C; color: #DCB28C; font-weight: bold; transition: all 0.3s; cursor: pointer; }
ul.dossiers_mosaique li b { color: #444; transition: all 0.3s; }
ul.dossiers_mosaique li i.fa { display: block; margin-bottom: 10px; }
ul.dossiers_mosaique li:hover { background: #DCB28C; color: #FFF; }
ul.dossiers_mosaique li:hover b { color: #FFF; }

ul.dossiers_mosaique.index li { height: 171px; } /* pour supporter les nouveaux libellés à rallonge */

ul.dossiers_mosaique li.fichiers { display: block; width: 95%; border: 1px solid #DCB28C; margin-bottom: 10px; text-align: left; padding-bottom: 7px; cursor: default; font-weight: normal; color: #D58F57; }
ul.dossiers_mosaique li.fichiers i.fa { float: left; margin-right: 20px; }
ul.dossiers_mosaique li.fichiers a { text-decoration: none; font-weight: bold; color: #FF8421; }
ul.dossiers_mosaique li.fichiers:hover { background: #F9EFE7; }
ul.dossiers_mosaique li.fichiers span { display: block; margin-top: 12px; font-size: 0.85em; color: #777; }

/* ul.inscrits_mosaique li i.fa.fa-list-alt { color: red; margin-left: 8px; } */
ul.inscrits_mosaique li p b.attente { padding: 1px 7px; /* background: rgba(255, 132, 33, 0.5); */ background: rgba(255, 132, 33, 0.5); }
span.legende_attente { /* background: rgba(255, 132, 33, 0.5); */ background: rgba(255, 132, 33, 0.5); margin-right: 5px; display: inline-block; padding: 6px 10px; }
ul.inscrits_mosaique li p b.preinscrit { padding: 1px 7px; /* background: rgba(255, 33, 33, 0.5); */ background: rgba(140, 208, 240, 1); }
span.legende_preinscrit { /* background: rgba(255, 33, 33, 0.5); */ background: rgba(140, 208, 240, 1); margin-right: 5px; display: inline-block; padding: 6px 10px; }
p.legendes { text-align: center; font-size: 0.85em; color: #888; }

a.cheque_valider { font-size: 0.8em; color: #00A40F; }
a.cheque_invalider { font-size: 0.8em; color: #FF2121; }

/* ul.activites_mosaique li:nth-child(odd) { margin-right: 4%; } */
ul.activites_mosaique li img, li.lazy_activites img, ul.antennes_mosaique img {
	width: 100%;
	-moz-transition: all 0.4s;
	-webkit-transition: all 0.4s;
	-o-transition: all 0.4s;
	transition: all 0.4s;
}
ul.antennes_mosaique img { height: 100%; width: auto; position: absolute; left: 0; }
/*
ul.inscrits_mosaique li img { float: left; margin-right: 20px; width: 85px; }
*/
ul.inscrits_mosaique li div.img, #resultat div div.img, #resultat_groupe div div.img, #resultat_groupe_existant div div.img, #resultat_recherche div div.img, #resultat_organisateurs div div.img, ul.liste_echanges li div.img, ul.liste_contacts li div.img, ul.liste-reponsables-antenne li div.img {
	float: left;
	width: 85px;
	height: 85px;
	margin-right: 20px;
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center center;
}
#resultat div div.img, #resultat_groupe div div.img, #resultat_groupe_existant div div.img, #resultat_recherche div div.img, #resultat_organisateurs div div.img { width: 50px; height: 50px; margin-right: 15px; margin-top: 5px; }
ul.activites_mosaique li a, li.lazy_activites a, ul.antennes_mosaique li a { position: relative; }

ul.activites_mosaique li p, ul.inscrits_mosaique li p, li.lazy_activites p, ul.antennes_mosaique li p {
	position: relative;
	margin: 0;
	padding: 15px;
	/* white-space: nowrap; overflow: hidden; */
	font-size: 0.9em;
/* FINALEMENT, JE LE MET AUTOUR DU LI COMPLET !
	border: 1px solid #F5EDE7;
*/
	border-top: none;
	/* background: rgba(245, 237, 231, 0.4); */
	background: rgba(245, 237, 231, 1);
}
ul.activites_mosaique li p, li.lazy_activites p, ul.antennes_mosaique li p { position: relative; line-height: 30px; transition: background 0.3s; }
ul.inscrits_mosaique li p { position: relative; padding: 5px 0 0 0; background: none; border: none; font-size: 0.82em; }
ul.inscrits_mosaique li p b { font-size: 1.1em; }
ul.inscrits_mosaique li p span.pseudo_complement { display: block; margin: 1px 0; color: #898167; font-size: 0.9em; }
ul.inscrits_mosaique li p i.fa-map-marker { margin-right: 3px; color: #555; }

ul.activites_mosaique li a.participants, li.lazy_activites a.participants, ul.activites_mosaique li a.messages, li.lazy_activites a.messages {
	position: absolute;
	z-index: 100;
	display: block;
	top: -28px;
	left: 0;
	width: 50%;
	padding: 3px 8px;
	font-size: 1em;
	text-align: center;
	background: #F9AD6F;
	color: #FFF;
	/* border: 1px solid #FF8421; */
	transition: background 0.3s;
}
ul.activites_mosaique li a.messages, li.lazy_activites a.messages { left: 50%; border-left: 1px solid #FFF; }
ul.activites_mosaique li a.participants:hover, li.lazy_activites a.participants:hover, ul.activites_mosaique li a.messages:hover, li.lazy_activites a.messages:hover { color: #FFF; background: #FF8421; }
ul.activites_mosaique li a.participants i.fa, li.lazy_activites a.participants i.fa, ul.activites_mosaique li a.messages i.fa, li.lazy_activites a.messages i.fa { margin-left: 5px; }
ul.activites_mosaique li a.participants.warning { background: #FF4343; }

ul.activites_mosaique li p a, li.lazy_activites p a, ul.antennes_mosaique li p a {
	display: block;
	/* height: 45px; */
	overflow: hidden;
	color: #FF8421;
	text-decoration: none;
	font-weight: bold;
	font-size: 1.1em;
	white-space: nowrap;
}

ul.activites_mosaique li:hover, li.lazy_activites:hover, ul.antennes_mosaique li:hover {
/*
	-moz-box-shadow: 1px 2px 5px rgba(245, 237, 231, 1);
	-webkit-box-shadow: 1px 2px 5px rgba(245, 237, 231, 1);
	-o-box-shadow: 1px 2px 5px rgba(245, 237, 231, 1);
	box-shadow: 1px 2px 5px rgba(245, 237, 231, 1);
	filter:progid:DXImageTransform.Microsoft.Shadow(color=#F5EDE7, Direction=180, Strength=3);
*/
	-moz-box-shadow: 1px 2px 5px rgba(0, 0, 0, 0.2);
	-webkit-box-shadow: 1px 2px 5px rgba(0, 0, 0, 0.2);
	-o-box-shadow: 1px 2px 5px rgba(0, 0, 0, 0.2);
	box-shadow: 1px 2px 5px rgba(0, 0, 0, 0.2);
	filter:progid:DXImageTransform.Microsoft.Shadow(color=#333, Direction=180, Strength=0.5);
}
ul.activites_mosaique li:hover p, li.lazy_activites:hover p, ul.antennes_mosaique li:hover p { /* background: rgba(245, 237, 231, 0.6); */ /* background: rgba(255, 132, 33, 0.3); */ background: rgba(240, 222, 208, 0.8); }
/* ul.activites_mosaique li:hover p a, li.lazy_activites:hover p a { color: #FFF; } */

/**** Effet de zoom au survol des photos ****/

ul.activites_mosaique li:hover > a.zoom img, li.lazy_activites:hover a.zoom img, ul.antennes_mosaique li:hover > a.zoom img {
	-moz-transform: scale(1.05);
	-webkit-transform: scale(1.05);
	-o-transform: scale(1.05);
	-ms-transform: scale(1.05);
	transform: scale(1.05);
}

a.zoom {
	display: block;
	width: 100%; height: 150px; /* IMPERATIF : forcer aux mêmes dimensions que l'image !! */
	overflow: hidden;
}

@media screen and (max-width: 1100px) {
	ul.activites_mosaique li, ul.inscrits_mosaique li, li.lazy_activites, ul.antennes_mosaique li, ul.dossiers_mosaique li {
		width: 31.33%;
		margin: 0 1% 25px 1%;
	}
}

@media screen and (max-width: 900px) {
	ul.activites_mosaique li, ul.inscrits_mosaique li, li.lazy_activites, ul.antennes_mosaique li, ul.dossiers_mosaique li {
		width: 48%;
		margin: 0 1% 25px 1%;
	}
}

@media screen and (max-width: 550px) {
	ul.activites_mosaique li, ul.inscrits_mosaique li, li.lazy_activites, ul.antennes_mosaique li, ul.dossiers_mosaique li {
		display: block;
		width: 100%;
	}
	ul.activites_mosaique li, li.lazy_activites, ul.antennes_mosaique li { height: 130px; margin: 0 0 15px 0; }
	ul.activites_mosaique li a.zoom, li.lazy_activites a.zoom, ul.antennes_mosaique li a.zoom { float: left; display: inline-block; width: 30%; height: 130px; /* display: none; */ }
	ul.activites_mosaique li a.zoom img, li.lazy_activites a.zoom img, ul.antennes_mosaique li a.zoom img { height: 100%; }
	ul.activites_mosaique li p, li.lazy_activites p, ul.antennes_mosaique li p {
		overflow: hidden;
/*
		border-top: 1px solid #F5EDE7;
		border-left: none;
*/
		padding: 10px 15px;
/* PLUS MAINTENANT CAR ON A APPLIQUE UN RADIUS AU LI COMPLET
		-moz-border-radius: 0 5px 5px 0;
		-webkit-border-radius: 0 5px 5px 0;
		-o-border-radius: 0 5px 5px 0;
		border-radius: 0 5px 5px 0;
*/
		line-height: 26px;
		height: 130px;
	}
	ul.activites_mosaique li p a, li.lazy_activites p a, ul.antennes_mosaique li p a { font-size: 1em; }
	ul.activites_mosaique li a.participants, li.lazy_activites a.participants, ul.activites_mosaique li a.messages, li.lazy_activites a.messages {
		top: auto;
		bottom: 0;
		right: 0;
		font-size: 0.9em;
	}
}

ul.activites_mosaique.avec-aside li {
	display: block;
	width: 100%;
	height: 130px;
	margin: 0 0 15px 0;
}
ul.activites_mosaique.avec-aside li a.zoom, ul.activites_mosaique.avec-aside li.lazy_activites a.zoom { float: left; display: inline-block; width: 30%; max-width: 250px; height: 130px; /* display: none; */ }
ul.activites_mosaique.avec-aside li a.zoom img, ul.activites_mosaique.avec-aside li.lazy_activites a.zoom img { height: 100%; }
ul.activites_mosaique.avec-aside li p, ul.activites_mosaique.avec-aside li.lazy_activites p {
	overflow: hidden;
	padding: 10px 15px;
	line-height: 26px;
	height: 130px;
}
ul.activites_mosaique.avec-aside li p a, ul.activites_mosaique.avec-aside li.lazy_activites p a { font-size: 1em; }
ul.activites_mosaique.avec-aside li a.participants, ul.activites_mosaique.avec-aside li.lazy_activites a.participants, ul.activites_mosaique.avec-aside li a.messages, ul.activites_mosaique.avec-aside li.lazy_activites a.messages {
	top: auto;
	bottom: 0;
	right: 0;
	font-size: 0.9em;
}

@media screen and (max-width: 400px) {
	ul.activites_mosaique li, li.lazy_activites, ul.antennes_mosaique li { margin: 0 0 10px 0; }
	ul.activites_mosaique li a.zoom, li.lazy_activites a.zoom, ul.antennes_mosaique li a.zoom { display: none; }
	ul.activites_mosaique li p, li.lazy_activites p, ul.antennes_mosaique li p {
		border-left: 1px solid #F5EDE7;
		padding: 10px;
		font-size: 0.85em;
/* PLUS MAINTENANT CAR ON A APPLIQUE UN RADIUS AU LI COMPLET
		-moz-border-radius: 5px;
		-webkit-border-radius: 5px;
		-o-border-radius: 5px;
		border-radius: 5px;
*/
		line-height: 23px;
	}
	ul.activites_mosaique li p a, li.lazy_activites p a, ul.antennes_mosaique li p a { white-space: normal; overflow: visible; }
}


/*********************************************/
/**** Couleurs d'état de certains boutons ****/
/*********************************************/

.spe_etats.ajoute { background: #50BE87; }
.spe_etats.ban.ajoute { background: #EA6463; }

/******************************/
/******************************/
/******************************/



/****************/
/**** FORUMS ****/
/****************/

table.forum { margin: 20px 0; border-collapse: collapse; }
table.forum tr { transition: background 0.3s; }
table.forum tr:hover, table.forum tr:hover > td:nth-child(2) { /* background: rgba(239, 226, 203, 0.4); */ background: rgba(255, 153, 0, 0.15); }
table.forum tr:first-child td { border-top: 1px solid #E0E4ED; }
table.forum tr td {
	width: 19%;
	min-width: 150px;
	border-bottom: 1px solid #E0E4ED;
	padding: 5px 10px;
	line-height: 25px;
	font-size: 0.9em;
}
table.forum tr td:first-child {
	width: 62%;
	padding: 0 10px;
	font-size: 1em;
}
table.forum tr td:nth-child(2) {
	text-align: center;
	/* background: #EBF5FC; */
	background: #FFF4E7;
	transition: background 0.3s;
}
table.forum tr td a { text-decoration: none; }
table.forum tr td a.lien { font-size: 1em; font-weight: bold; color: rgba(0, 0, 0, 1); }
table.forum tr td a.lien2 { color: rgba(16, 133, 176, 1); }
table.forum tr td a.lien:hover, table.forum tr td a.lien2:hover { border: none; color: rgba(0, 0, 0, 0.7); }
table.forum tr td p {
	color: #888;
	margin: 0;
	font-size: 0.95em;
	line-height: 20px;
}

p.lien_forum_rubrique { text-align: right; margin-bottom: 25px; }
p.lien_forum_rubrique a {
	padding: 5px 15px;
	background: rgba(247, 135, 3, 0.8);
	color: #FFF;
	transition: background 0.3s;
}
p.lien_forum_rubrique a:hover { background: rgba(247, 135, 3, 1); }
p.lien_forum_rubrique a i { margin-left: 10px; }

a.pagine, span.pagine {
	padding: 4px 8px;
	background: rgba(247, 135, 3, 0.5);
	border: 1px solid #FBC380;
	color: #FFF;
	margin-right: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	-o-border-radius: 5px;
	border-radius: 5px;
	transition: all 0.3s;
	font-size: 0.9em;
	text-decoration: none;
}
a.pagine:hover { background: rgba(247, 135, 3, 1); border-color: rgba(247, 135, 3, 1); }
span.pagine { color: rgba(247, 135, 3, 1); border: 1px solid rgba(247, 135, 3, 1); background: #FFF; } /* = version "active" non cliquable (cause ref. nat.) pour les numéros de page */

table.forum.threads tr td { padding: 5px 10px; }
table.forum.threads tr:first-child td { /* background: #EFE2CB; */ background: rgba(255, 153, 0, 0.5); color: #333; font-weight: bold; padding: 15px 0; text-align: center; border-right: 1px solid #FFF; border-top: none; border-bottom: none; }
table.forum.threads.extract tr:first-child td { background: none; padding: 0px 10px 5px 10px; /* border-top: 1px solid #E0E4ED; */ }
table.forum.threads.extract tr td:nth-child(2) { background: none; }

span.btn_repondre { cursor: pointer; background: rgba(247, 135, 3, 0.8); padding: 10px 30px; font-weight: bold; color: #FFF; transition: background 0.3s; }
span.btn_repondre:hover { background: rgba(247, 135, 3, 1); }
div.forum_pagination, div.albums_pagination { line-height: 35px; }
div.albums_pagination { margin: 0 0 15px 0; }

form.form_repondre { display: none; padding: 5px 20px 20px 20px; margin-top: 20px;  background: #E0E4ED; border-radius: 5px; }
form.form_repondre input[type="text"] { width: 100%; margin-top: 20px; /* border: 1px solid rgba(247, 135, 3, 1); */ border: none; padding: 10px; border-radius: 5px; font-size: 1em; }
form.form_repondre textarea { width: 100%; height: 150px; margin: 15px 0; /* border: 1px solid rgba(247, 135, 3, 1); */ border: none; padding: 10px; border-radius: 5px; }
form.form_repondre input[type="submit"] { width: 100%; cursor: pointer; background: rgba(247, 135, 3, 0.8); padding: 10px 0; border: none; color: #FFF; font-size: 1.1em; border-radius: 5px; transition: background 0.3s; }
form.form_repondre input[type="submit"]:hover { background: rgba(247, 135, 3, 1); }

div.infos-mobiles { display: none; font-size: 0.8em; color: #666; }


@media screen and (min-width: 871px) and (max-width: 1000px) {
	table.forum tr td:nth-child(2) { display: none; }
	table.forum tr td:nth-child(3) { background: #EBF5FC; }
	div.infos-mobiles.nb { display: block; }
}
@media screen and (max-width: 650px) {
	table.forum tr td { font-size: 0.9em; }
	table.forum tr td:nth-child(2) { display: none; }
	table.forum tr td:nth-child(3) { background: #EBF5FC; }
	div.infos-mobiles.nb { display: block; }
}
@media screen and (max-width: 550px) {
	table.forum tr td { font-size: 0.9em; }
	table.forum tr td:nth-child(3), p.lien_forum_rubrique { display: none; }
	div.infos-mobiles.nb, div.infos-mobiles.date { display: block; }
}

span.pseudo_sans_fiche { font-weight: bold; color: #444; }

/* Couleur des fonds de posts */
div.frm_msg_sujet { background: #FFF4E7; border: 1px solid #F7C17E; padding: 20px; }
div.frm_msg_alt1 { background: #F5F5F5; padding: 20px; }
div.frm_msg_alt2 { background: #F2F7FB; padding: 20px; }
div.frm_msg_pro { background: #FFF4E7; border: 1px solid #F4A748; padding: 20px; }
div.frm_msg_pro a.pseudo { padding: 4px 15px; background: none; color: #F78703; border: none; font-weight: bold; transition: background 0.3s; }
div.frm_msg_pro a.pseudo:hover { background: #F78703; color: #FFF; }

/*********************************************************************************************************/
/*********************************************************************************************************/
/*********************************************************************************************************/

/****************/
/**** FOOTER ****/
/****************/

footer .bandeau.liste_antennes { background: #FF8421; }
footer .bandeau.liste_antennes p { font-size: 0.9em; color: #FFF; }
footer .bandeau.liste_antennes ul li {
	display: inline-block;
	width: 24%;
	margin-rigth: 1%;
}
footer .bandeau.liste_antennes ul li a {
	text-decoration: none;
	color: #FFF;
	font-size: 0.8em;
}
footer .bandeau.liste_antennes ul li a i { margin-right: 10px; font-size: 0.8em; transition: margin 0.3s; }
footer .bandeau.liste_antennes ul li a:hover i { margin-left: 5px; margin-right: 5px; }

footer a.tchat {
	display: inline-block;
	padding: 7px 20px;
	background: #FFF;
	border: 1px solid #FFF;
	color: #3B5998;
	text-decoration: none;
	font-size: 0.9em;
	transition: background 0.3s;
	margin: 5px 10px;
}
footer a.tchat { color: #337C81; }
footer a.tchat:hover { background: #44A5AC; color: #FFF; }
footer a.tchat i.fa { margin-right: 10px; }

footer p.reseaux { margin-bottom: 30px; }
footer p.reseaux span { display: block; font-size: 1.2em; color: #FFF; margin-bottom: 20px; }
footer p.reseaux a { display: inline-block; margin: 0 20px; color: #FFF; transition: all 0.3s; }
footer p.reseaux a:hover { color: #FF8421; }


@media screen and (max-width: 920px) {
	footer .bandeau.liste_antennes ul li { width: 32%; }
}
@media screen and (max-width: 660px) {
	footer .bandeau.liste_antennes ul li { width: 49%; text-align: center; }
	footer .bandeau.liste_antennes ul li a i { display: none; }
}
@media screen and (max-width: 440px) {
	footer .bandeau.liste_antennes ul li { width: 100%; margin-right: 0; }
}

/******************************/
/******************************/
/******************************/




p.detail_recherche {
	text-align: center;
	font-size: 1.1em;
	line-height: 27px;
	color: #FFF;
	background: #32B1D2;
	padding: 10px 5px;
	margin: 0 0 25px 0;
}
p.detail_recherche span { display: block; margin: 3px 0; }
p.detail_recherche span a { display: inline-block; font-size: 0.72em; padding: 2px 10px; text-decoration: none; color: #32B1D2; background: #F6FCFE; margin: 3px 5px; border-radius: 10px; }
p.detail_recherche b { font-variant: small-caps; }






/************************/
/**** PAGE D'ACCUEIL ****/
/************************/

/* body.accueil h2 { margin-top: 0; font-size: 2em; font-weight: bold; font-family: Raleway, sans-serif; color: #32B1D2; text-align: center; } */
body.accueil h2 { font-size: 2em; }
body.accueil main div.content { padding-top: 35px; padding-bottom: 35px; }
body.accueil div.txt { width: 48%; text-align: center; }
body.accueil div.txt.gauche { float: left; margin-right: 3%; }
body.accueil div.txt.droite { overflow: hidden; }
body.accueil div.txt h2 { font-size: 1.8em; }
body.accueil div.txt p { line-height: 1.7em; font-family: Raleway; text-align: justify; }
body.accueil img.gauche { float: left; width: 48%; margin-right: 3%; }
body.accueil img.droite { overflow: hidden; width: 48%; }

p#revue-de-presse { text-align: center; }
p#revue-de-presse a { display: inline-block; margin: 12px 0; }
p#revue-de-presse img {
	max-height: 40px;
	max-width: 150px;
	margin: 0 15px;
	-webkit-filter: grayscale(1);
	-moz-filter: grayscale(1);
	-o-filter: grayscale(1);
	-ms-filter: grayscale(1);
	filter: grayscale(1);
	opacity: 0.5;
	transition: filter, opacity 0.3s;
}
p#revue-de-presse img.france5 { opacity: 0.9; }
p#revue-de-presse img:hover {
	-webkit-filter: grayscale(0);
	-moz-filter: grayscale(0);
	-o-filter: grayscale(0);
	-ms-filter: grayscale(0);
	filter: grayscale(0);
	opacity: 1;
}
a.revue { text-decoration: none; font-size: 0.95em; color: #FF8421; padding-bottom: 5px; border-bottom: 1px solid #FBFBFB; transition: all 0.3s; }
a.revue i { margin-right: 7px; font-size: 0.8em; }
a.revue:hover { border-bottom: 1px solid #FF8421; }

@media screen and (max-width: 990px) { /****************************** LE MENU VIRE A GAUCHE POUR LES RESOLUTIONS < 800 pixels !!!! ******************************/
	body.accueil h2 { font-size: 1.7em; }
	body.accueil div.txt h2 { margin: 20px 0; font-size: 1.7em; }
	/* body.accueil div.content { padding-left: 15px; padding-right: 15px; } */
	body.accueil div.txt { width: 100%; text-align: center; }
	body.accueil div.txt.gauche { float: none; margin-right: 0; }
	body.accueil img.gauche { float: none; width: 100%; margin-right: 0; }
	body.accueil img.droite { width: 100%; }
}

/****************************************/
/****************************************/
/****************************************/





/*************************/
/**** FICHES ACTIVITE ****/
/*************************/

/*
#navi-interne { position: absolute; top: 15px; right: -80px; width: 60px; }
#navi-interne a { position: relative; display: block; width: 60px; padding: 15px 0; text-align: center; background: #4BB4E6; color: #FFF; text-decoration: none; border-radius: 5px; margin-bottom: 15px; transition: background 0.5s; }
#navi-interne a:hover { background: #50BE87; }
#navi-interne a span { position: absolute; bottom: -10px; right: -25px; padding: 5px 15px; border: 2px solid #FFF; border-radius: 50%; background: #50BE87; color: #FFF; }

@media screen and (max-width: 1200px) { #navi-interne { display: none; } }
*/

#navi-interne-activite, #navi-interne-thread { position: absolute; top: 15px; right: -80px; width: 60px; }
#navi-interne-activite a, #navi-interne-thread a { position: relative; display: block; width: 60px; padding: 15px 0; text-align: center; background: #4BB4E6; color: #FFF; text-decoration: none; border-radius: 5px; margin-bottom: 15px; transition: background 0.5s; }
#navi-interne-activite a.ascenseur { padding: 7px 0; }
#navi-interne-activite a:hover, #navi-interne-thread a:hover { background: #50BE87; }
#navi-interne-activite a span, #navi-interne-thread a span { position: absolute; bottom: -10px; right: -25px; padding: 5px 15px; border: 2px solid #FFF; border-radius: 50%; background: #50BE87; color: #FFF; }

@media screen and (max-width: 1450px) { #navi-interne-activite { display: none; } }

@media screen and (max-width: 1400px) {
	#tetiere-thread { margin-top: 40px; }
	#navi-interne-thread {
		z-index: 9999;
		position: fixed;
		top: 155px;
		right: 0;
		width: 100%;
	}
	#navi-interne-thread a { display: inline-block; width: 50%; padding: 10px; text-align: center; border-radius: 0; margin-bottom: 0; }
	#navi-interne-thread a:first-child { border-right: 2px solid #FFF; }
}

@media screen and (max-width: 780px) { #navi-interne-thread { top: 63px; } }

.bulle-discussion { padding: 15px 15px 0 15px; margin: 10px 0; }
.bulle-discussion.sujet { border: 2px solid #F3AA75; margin: 25px 0; } /* Sujet des threads */
.bulle-discussion.pair { background: #F5EDE7; }
.bulle-discussion.impair { background: #E0F0F8; }
.bulle-discussion.modere { background: #FFBBBB; }
.bulle-discussion div.img { float: left; width: 85px; height: 85px; margin-right: 20px; border-radius: 50%; background-repeat: no-repeat; background-size: cover; background-position: center center; }
.bulle-discussion a.pseudo { color: #FF8421; font-weight: bold; text-decoration: none; }
.bulle-discussion span.date { display: block; color: #888; font-size: 0.8em; }
.bulle-discussion span.pseudo_complement { display: inine-block; margin-left: 10px; color: #888; font-size: 0.8em; }
/* .bulle-discussion p { overflow: hidden; } */
.bulle-discussion p { overflow-wrap: break-word; word-wrap: break-word; overflow: hidden; }
.bulle-discussion p.options { margin-top: 10px; text-align: right; }
.bulle-discussion p.options a.btn { padding: 5px 10px; font-size: 1em; }

@media screen and (max-width: 500px) { .bulle-discussion p { overflow: visible; } }

p.activite_description { float: left; width: 67%; margin-right: 3%; line-height: 1.7em; font-family: Raleway; text-align: justify; font-size: 1em; overflow-wrap: break-word; word-wrap: break-word; overflow: hidden; }
div.activite_infos { overflow: hidden; min-width: 270px; }
div.activite_infos div.rdv { border: 2px solid #FF9900; padding: 10px; border-radius: 5px; font-size: 0.9em; text-align: center; margin-bottom: 20px; }
div.activite_infos div.rdv p { padding: 10px; text-align: center; background: #FF9900; color: #FFF; font-weight: bold; border-radius: 5px; margin: 0 0 10px 0; }
div.activite_infos a.contact i.fa, div.activite_infos div.rdv p i.fa { margin-right: 10px; }
div.activite_infos div.autres { border: 2px solid #FF9900; padding: 10px; border-radius: 5px; font-size: 0.9em; margin-bottom: 20px; line-height: 25px; }
div.activite_infos div.autres span.date_limite { display: block; margin-left: 16px; color: #469646; font-weight: bold; }
div.activite_infos div.autres span.date_limite.depassee { color: #CE0022; }
div.activite_infos a.contact { display: block; padding: 10px; text-align: center; background: #5BB35B; /*#50BE87;*/ color: #FFF; font-weight: bold; border-radius: 5px; margin-bottom: 10px; text-decoration: none; font-size: 0.9em; transition: background 0.3s;}
div.activite_infos a.contact:hover { background: #469646; }

@media screen and (max-width: 970px) {
	p.activite_description { float: none; width: 100%; margin: 0 0 20px 0; }
}

span.avertissement_cheque {
	display: block;
	padding: 10px 15px;
	color: #333;
	background: #F8D69C;
	margin: -15px 0 15px 0;
}

/*
#options_organisateurs, #options_adherents { position: fixed; bottom: 0; width: 100%; padding: 10px 0; text-align: center; background: rgba(239, 144, 53, 0.85); color: #EEE; }

@media screen and (max-width: 750px) { #avertissement, #annonce { font-size: 0.65em; } }

#annonce { display: none; background: rgba(239, 144, 53, 1); border-top: 1px solid #FFF; }
#annonce .contenu { max-width: 1200px; margin: auto; padding: 20px; font-size: 1.3em; color: #000; text-align: left; }
#annonce .contenu p.titre { font-weight: bold; color: #FFF; font-size: 1.2em; margin-top: 0; }
#annonce .contenu img { float: left; margin-right: 20px; height: 190px; }
#annonce .contenu a.lien { display: inline-block; width: 75%; margin-right: 4%; padding: 10px 20px; background: #FFF; border-radius: 10px; text-align: center; color: #FFF; border: 1px solid #FFF; background: rgba(21, 146, 107, 1); transition: border-color 0.3s; }
#annonce .contenu a.lien:hover { border-color: rgba(21, 146, 107, 1); }
#annonce .contenu a.annonce_fermer { display: inline-block; width: 21%; padding: 10px 20px; background: rgba(150, 150, 150 , 1); border-radius: 10px; text-align: center; color: #FFF; border: 1px solid #FFF; transition: border-color 0.3s; }
#annonce .contenu a.annonce_fermer:hover { border-color: rgba(150, 150, 150 , 1); }

@media screen and (max-width: 900px) { #annonce { font-size: 0.75em; } #annonce .contenu img { display: none; } }
@media screen and (max-width: 600px) { #annonce .contenu a.lien, #annonce .contenu a.annonce_fermer { display: block; width: 100%; margin: 7px 0; } }
*/
#options_antenne { z-index: 9999; }
#options_organisateurs, #options_adherents, #options_messagerie, #options_forums, #options_antenne { position: fixed; bottom: 0; width: 100%; padding: 10px 0; text-align: center; /* background: rgba(239, 144, 53, 1); */ background: #DFC4B1; /* border-top: 2px solid #FFF; */ color: #FFF; }
#options_organisateurs .contenu, #options_adherents .contenu, #options_messagerie .contenu, #options_forums .contenu, #options_antenne .contenu { max-width: 1200px; margin: auto; padding: 10px; font-size: 0.9em; color: #000; text-align: center; }
#options_organisateurs .contenu a, #options_adherents .contenu a, #options_forums .contenu a, #options_antenne .contenu a { margin: 0 15px; background: #F5EDE7; color: #FF8421; border: 1px solid #FFF; transition: background 0.3s; }
#options_organisateurs .contenu a:hover, #options_adherents .contenu a:hover, #options_forums .contenu a:hover, #options_antenne .contenu a:hover { background: #FF8421; color: #FFF; }
#options_organisateurs .contenu a i.fa, #options_adherents .contenu a i.fa, #options_forums .contenu a i.fa, #options_antenne .contenu a i.fa { margin-right: 8px; }
#options_organisateurs a.btn.rouge, #options_adherents a.btn.rouge { background: rgba(247, 53, 67, 1); color: #FFF; border-color: rgba(222, 0, 16, 1); }
#options_organisateurs a.btn.rouge:hover, #options_adherents a.btn.rouge:hover { background: rgba(222, 0, 16, 1); }
#options_organisateurs a.btn.vert, #options_adherents a.btn.vert, #options_antenne .contenu a.btn.vert { background: rgba(50, 160, 50, 0.8); color: #FFF; border-color: rgba(50, 160, 50, 1); }
#options_organisateurs a.btn.vert:hover, #options_adherents a.btn.vert:hover, #options_antenne .contenu a.btn.vert:hover { background: rgba(50, 160, 50, 1); }
#options_adherents a.btn.bleu { background: rgba(43, 178, 255, 0.6); color: #FFF; border-color: rgba(43, 178, 255, 1); }
#options_adherents a.btn.bleu:hover { background: rgba(43, 178, 255, 1); }

#options_messagerie a.popup-rechercher, #options_messagerie a.popup-contacts, #options_messagerie a.popup-bannis { font-size: 1em; margin: 0 10px; }

@media screen and (max-width: 900px) {
	#options_messagerie, #options_adherents, #options_antenne { padding: 0; }
	#options_messagerie .contenu, #options_adherents .contenu, #options_antenne .contenu { width: 100%; margin: auto; padding: 5px; }
	#options_messagerie a, #options_adherents a, #options_antenne a { display: inline-block; }
	#options_messagerie a.popup-rechercher, #options_messagerie a.popup-contacts, #options_messagerie a.popup-bannis {
		margin: 0;
		width: 30%;
		padding: 8px 0;
	}

	#options_adherents .contenu a { width: 12%; }
	#options_adherents .contenu a { margin: 4px 0; padding: 5px; border-radius: 0; }
	#options_adherents .contenu a i.fa { margin: 0; }
	#options_adherents .contenu a.special span { display: none; }

	#options_messagerie a.popup-rechercher span, #options_messagerie a.popup-contacts span, #options_messagerie a.popup-bannis span { display: none; }
}

@media screen and (max-width: 600px) {
	#options_adherents .contenu { padding: 5px 0; }
	#options_adherents .contenu a { width: 20%; margin: 5px 3px; }

	#options_adherents.special { display: none; }

	#options_antenne .contenu a { font-size: 1em; }
}


#ajouter-inscrit a.gerer {
	display: inline-block;
	margin: 8px 0 15px 0;
	font-size: 0.85em;
	color: #F17E20;
	text-decoration: none;
}
#ajouter-inscrit a.gerer i.fa { font-size: 0.8em; }

span.invites {
	display: block;
	margin: 10px 0 20px 0;
	text-align: center;
	padding: 10px 0;
/*
	border-top: 1px dotted #666;
	border-bottom: 1px dotted #666;
*/
	color: #FFF;
	background: #60C2E3;
}

ul.album_mosaique li span { position: absolute; bottom: 10px; right: 10px; padding: 5px 15px; border: 2px solid #FFF; background: #50BE87; color: #FFF; }

/****************************************/
/****************************************/
/****************************************/

/***********************************************/
/**** PROPOSITION / MODIFICATION D'ACTIVITE ****/
/***********************************************/

div.proposer-modifier-activite ul.ariane li {
	display: inline-block;
	width: 20%;
	padding: 8px 0;
	text-align: center;
	font-size: 1.2em;
	background: #4BB4E6;
	color: #FFF;
	border-right: 1px solid #FFF;
	transition: background 0.3s;
	cursor: pointer;
}
div.proposer-modifier-activite ul.ariane li.actif { background: #5BB35B; }
div.proposer-modifier-activite ul.ariane li:hover { background: #FF923A; }

div.proposer-modifier-activite a.back { display: inline-block; padding: 15px; border: 1px solid #AAA; color: #AAA; text-decoration: none; margin-right: 15px; transition: background 0.3s; }
div.proposer-modifier-activite a.back:hover { background: #AAA; color: #FFF; }
div.proposer-modifier-activite input[type="submit"].std { display: inline-block; }

@media screen and (max-width: 970px) {
	div.proposer-modifier-activite h1 { font-size: 1.4em; }
	div.proposer-modifier-activite ul.ariane li { font-size: 1em; }
}
@media screen and (max-width: 650px) {
	div.proposer-modifier-activite h1 { font-size: 1.2em; }
	div.proposer-modifier-activite ul.ariane li { font-size: 0.85em; }
}
@media screen and (max-width: 500px) {
	div.proposer-modifier-activite h1 { font-size: 1.1em; }
	div.proposer-modifier-activite ul.-ariane li { font-size: 0.75em; }
}

/****************************************/
/****************************************/
/****************************************/


/*************************/
/**** Blogs d'ANTENNE ****/
/*************************/

/*
p.article-intro { padding: 20px; border: 1px solid #DDD; background: #F9F9F9; box-shadow: 0px 2px 1px rgba(0, 0, 0, 0.1); }
p.article-intro a { color: #222; text-decoration: none; font-weight: bold; }
p.article-intro a.titre { font-size: 1.1em; transition: color 0.3s; }
p.article-intro a.titre:hover { color: #FF8421; }
p.article-intro span { display: block; font-size: 0.8em; margin: 5px 0 15px 0; }
p.article-intro span a { color: #FF8421; }
*/
/*
h3.article-intro { cursor: pointer; text-align: left; padding: 7px 25px; background: #D5EFF9; font-size: 1.25em; box-shadow: 2px 2px 2px rgba(213, 239, 249, 0.8); transition: all 0.3s; }
h3.article-intro:hover { background: #32B1D4; color: #FFF; }
h3.article-intro span { display: block; font-size: 0.7em; margin: 8px 0 0 0; }
h3.article-intro span a { color: #FF8421; }
*/

h3.article-intro { cursor: pointer; text-align: left; padding: 7px 20px; background: #EEE; font-size: 1.25em; color: #666; transition: all 0.3s; }
h3.article-intro:hover { background: #32B1D4; color: #FFF; }
h3.article-intro span { display: block; font-size: 0.7em; margin: 8px 0 0 0; }
h3.article-intro span a { color: #FF8421; }

p.article-intro a { color: #222; text-decoration: none; font-weight: bold; }
p.article-intro a.titre { font-size: 1.1em; transition: color 0.3s; }
p.article-intro a.titre:hover { color: #FF8421; }


/****************************************/
/****************************************/
/****************************************/


/***************************/
/**** Pages TEMOIGNAGES ****/
/***************************/

#tetiere_temoignage { margin-bottom: 20px; padding: 20px; background-color: #FDDDBD; color: #333; }
#tetiere_temoignage h2 { text-align: left; font-size: 1.65em; }
#tetiere_temoignage img { float: left; margin-right: 20px; }
#tetiere_temoignage span { font-size: 0.85em; }

/**** Nouvelle page / nouveaux témoignages (2024) ****/

div.avis {
	display: flex;
	flex-wrap: wrap;
	width: 100%;
	margin-top: 40px;
}
div.avis p {
	font-family: "Caveat", cursive;
	font-size: 1.5em;
	font-weight: 400;
	position: relative;
	flex-basis: 46%;
	padding: 20px 40px 55px 40px;
	margin: 0 2% 30px 2%;
	line-height: 30px;
	background: #FFF5EB;
	border-radius: 30px;
}
div.avis p span {
	position: absolute;
	bottom: 15px;
	right: 0;
	display: block;
	margin: 15px 0 0 0;
	text-align: right;
	padding-right: 50px;
	font-weight: bold;
	font-style: italic;
	font-size: 0.9em;
}
div.avis p i.fa-quote-left, div.avis p i.fa-quote-right {
	position: absolute;
	display: inline-block;
	background: #FFF;
	padding: 15px;
	border-radius: 50%;
}
div.avis p i.fa-quote-left {
	top: -20px;
	left: -20px;
	font-size: 0.9em;
	color: #FF8B2D;
}
div.avis p i.fa-quote-right {
	bottom: -20px;
	right: -20px;
	font-size: 0.7em;
	color: #666;
}
body.accueil div.avis p i.fa-quote-left, body.accueil div.avis p i.fa-quote-right { background: #FBFBFB; }

@media screen and (max-width: 800px) {
	div.avis p {
		flex-basis: 96%;
	}
}

/****************************************/
/****************************************/
/****************************************/



/***********************************************/
/**** BLOCS DE SELECTION D'UNE PHOTOGRAPHIE ****/
/***********************************************/

.media-drop { position: relative; }
/*
.media-drop > button.delete {
    display: none;
    position: absolute;
    right: 8px;
    top: 4px;
}
*/
.media-drop-placeholder {
    //display: table-cell;
display: block;
    background-color: #F7F7F7;
    border: 1px solid #444444;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    text-align: center;
    vertical-align: middle;
    /* box-shadow: 0 2px 0 rgba(0, 0, 0, .2); */
/* Très bien pour profil :
width: 280px;
height: 365px;
*/

width: 100%;
//height: 150px;
padding: 50px;

}

.media-drop.dragover > .media-drop-placeholder {
    border-color: orange;
}

.media-drop img {
    border: 3px solid transparent;
}

.media-drop.dragover img {
    border-color: orange;
}

.media-drop-placeholder.busyloading {
    background-image: url(/images/loading.gif);
    background-position: center center;
    background-repeat: no-repeat;
}

.media-drop-placeholder-title {
    display: block;
    font-weight: bold;
    font-size: 1.35em;
    color: #818177;
    margin-bottom: 10px;
}

.media-drop-placeholder-or {
    display: block;
    font-weight: normal;
    font-size: 1.05em;
    color: #818177;
    margin-bottom: 15px;
}

.media-drop-placeholder-uploadbutton {
    display: block;
    position: relative;
}

/* Fake stylable upload button. */
.media-drop-placeholder-uploadbutton > button {
    position: relative;
    width: 130px;
}

/* Real upload button, centered */
.media-drop-placeholder-uploadbutton > input {
    position: absolute;
    margin-left: auto;
    margin-right: auto;
    left: 0;
    right: 0;
    top: 0;
    opacity: 0;
    z-index: 1;
    width: 130px;
    max-width: 130px;
    overflow: hidden;
}

.photo-placeholder img {
    box-shadow: 0 2px 0 rgba(0, 0, 0, .2);
}










/***********************************/
/**** NAVIGATION + MENU !!!!!!! ****/
/***********************************/

nav {
	display: block;
	/* position: fixed; */
	position: relative;
	width: 100%;
	z-index: 9902;
	color: #FFF;
	background: #1C0D00;
	-moz-box-shadow: 1px 2px 5px rgba(0, 0, 0, 0.5);
	-webkit-box-shadow: 1px 2px 5px rgba(0, 0, 0, 0.5);
	-o-box-shadow: 1px 2px 5px rgba(0, 0, 0, 0.5);
	box-shadow: 1px 2px 5px rgba(0, 0, 0, 0.5);
	filter:progid:DXImageTransform.Microsoft.Shadow(color=#555, Direction=180, Strength=3);
}
ul.nav {
	width: 100%;
	max-width: 1200px;
	margin: auto;
	*zoom: 1;
}

/* ul.nav > li i { margin-right: 7px; } */ /* Les icônes du menu ne doivent apparaître que pour les très faibles résolutions */
ul.nav a {
	text-decoration: none;
	padding: 8px 0;
	color: #FFF;
	/* border-bottom: 3px solid #535353; */
	transition: background 0.4s;
}

/* ul.nav a:hover, ul.nav a.actif, ul.nav > li.top:hover > .parent { color: #FFBE05; border-bottom: 3px solid #FFC002; } */

ul.nav a:hover, ul.nav a.actif, ul.nav > li.top:hover > .parent { background: #444; }
ul.nav a.sorties:hover, ul.nav a.sorties.actif, ul.nav > li.sorties.top:hover > .parent { background: #FF9900; }
ul.nav a.communaute:hover, ul.nav a.communaute.actif, ul.nav > li.top.communaute:hover > .parent { background: #44A5AC; }
ul.nav a.forums:hover, ul.nav a.forums.actif, ul.nav > li.forums.top:hover > .parent { background: #45A775; }
ul.nav a.asso:hover, ul.nav a.asso.actif, ul.nav > li.asso.top:hover > .parent { background: #E64315 }

ul.nav li {
	width: 22.5%;
	text-align: center;
	border-left: 1px solid #404040;
	/* overflow: hidden; */ /* OVERFLOW HIDDEN + NOWRAP pour l'animate horizontale sur mobile ! */
	/* white-space: nowrap; */
}
ul.nav li:last-child { border-right: 1px solid #404040; }
ul.nav li.home { width: 10%; }
ul.nav li.home span { display: none; }
/* ul.nav li:hover, ul.nav li.actif { background: #404040; } */
/* ul.nav li:hover, ul.nav li.actif { background: #FFF; } */
ul.nav li { display: inline-block; }
ul.nav li a { display: block; }

ul.nav li.fermer { display: none; visibility: hidden; text-align: left; padding-left: 15px; line-height: 55px; cursor: pointer; } /**** BOUTON DE FERMETURE SUR VERSION MOBILE ****/
ul.nav li.fermer:hover { color: #F78703; }


/********************************* SOUS-MENUS ! *********************************/

/* Nouvelle classe invisible pour les sous-menus, dans le cas d'une utilisation tactile : */
ul.invisible {
	display: none;
	visibility: hidden;
	opacity: 0;
}

ul.nav > li > ul.sousmenu {
	position: absolute;
	/* display: none; */
	visibility: hidden;
	opacity: 0;
	margin: 0;
	padding: 0;
	left: 0;
	top: 37px; /* ATTENTION ! Normalement, 40 pixels, mais il en faut 35 pour IE11 (et sans doute aussi pour les précédents). PROBLEME : à partir de IE10 ou 11, MS a décidé de ne plus prendre en compte les commentaires conditionnels (if IE) et je n'ai pas trouvé de hack pour toutes les versions d'IE. Merci qui ???! */
	width: 100%;
	background-color: #F5F5F5;
/* transition: opacity 0.9s linear; */
	z-index: 9902;
	/* border-bottom: 4px solid #3F99E5; */
	-moz-box-shadow: 0px 3px 2px 0px #444;
	-webkit-box-shadow: 0px 3px 2px 0px #444;
	-o-box-shadow: 0px 3px 2px 0px #444;
	box-shadow: 0px 3px 3px 0px #888;
	filter:progid:DXImageTransform.Microsoft.Shadow(color=#444, Direction=180, Strength=2);
}

ul.nav li.rencontres a:hover, ul.nav > li.rencontres.actif a, ul.nav > li.rencontres.top:hover > .parent, ul.nav > li.rencontres > ul.sousmenu { border-color: #B5104A; }
ul.nav li.club a:hover, ul.nav > li.club.actif a, ul.nav > li.club.top:hover > .parent, ul.nav > li.club > ul.sousmenu { border-color: #00A796; }
ul.nav li.day a:hover, ul.nav > li.day.actif a, ul.nav > li.day.top:hover > .parent, ul.nav > li.day > ul.sousmenu { border-color: #7E6AB6; }

ul.nav > li > ul.sousmenu > li.content { width: 100%; max-width: 1200px; padding: 15px 0; margin: auto; }

ul.nav > li > ul.sousmenu > li i { display: inline-block; /*visibility: visible;*/ } /* Les icônes des sous-menus, contrairement aux icônes principales, doivent être visibles ici... */


ul.nav > li:hover > ul.sousmenu {
	/* display: block; */
	visibility: visible;
	opacity: 1;
	transition: all 0.2s ease 0.3s;
}
ul.nav > li > ul.sousmenu > li {
/*
	width: 87%;
	margin: 0 3% 0 10%;
*/
	width: 100%;
	padding-bottom: 5px;
	border: none;
	text-align: left;
	color: #000;
}
ul.nav > li > ul.sousmenu > li:hover { background: none; }
/*ul.nav > li > ul.sousmenu > li i { margin-right: 5px; font-size: 0.92em; }
ul.nav > li > ul.sousmenu > li b { display: block; margin: 5px 0; border-bottom: 1px dotted #444; color: #444; }
*/
ul.nav > li > ul.sousmenu > li a {
	padding: 0;
	color: #000;
	border: none;
	font-variant: normal;
}
ul.nav > li > ul.sousmenu > li a:hover { background: none; border: none; color: #BC8900; }
ul.nav > li > ul.sousmenu > li a:after { content: ""; display: block; height: 1px; }

/****/
/**** PERSONNALISATION DES ELEMENTS DE SOUS-MENU ****/
/****/

ul.nav > li > ul.sousmenu > li.content > ul li {
	display: block;
	border: none;
	font-size: 0.9em;
	padding: 3px 0;
	text-align: left;
	width: auto;
}
ul.nav > li > ul.sousmenu > li.content > ul li a span { font-size: 0.85em; font-style: italic; }
ul.nav > li > ul.sousmenu > li.content > ul li i.fa { font-size: 0.9em; margin-right: 8px; }

ul.nav > li > ul.sousmenu > li a.sm-actu, ul.nav > li > ul.sousmenu > li a.sm-temoignages { position: relative; float: left; width: 25%; margin-right: 3%; height: 200px; background-repeat: no-repeat; background-cover: contain; opacity: 1; transition: opacity 0.3s; }
ul.nav > li > ul.sousmenu > li a.sm-actu:hover, ul.nav > li > ul.sousmenu > li a.sm-temoignages:hover { opacity: 0.85; }
ul.nav > li > ul.sousmenu > li a.sm-actu, ul.nav > li > ul.sousmenu > li a.sm-actu:hover { background-image: url(/images/bulle-actu-des-solos.png); }
ul.nav > li > ul.sousmenu > li a.sm-temoignages, ul.nav > li > ul.sousmenu > li a.sm-temoignages:hover { background-image: url(/images/bulle-temoignages.png); }

/****************************************/
/****************************************/
/****************************************/


/************************************************/
/**** NAVIGATION INTERNE DES PAGES D'ANTENNE ****/
/************************************************/

ul#nav_ville li { display: inline-block; width: 18%; text-align: center; border-top: 1px solid #DDD; border-left: 1px solid #DDD; }
ul#nav_ville li:first-child { border-left: 0; width: 10% }
ul#nav_ville li a { display: block; padding: 7px 5px; color: #FFF; text-decoration: none; background: rgba(255, 153, 0, 0.6); text-shadow: none; transition: background 0.3s; }
ul#nav_ville li a:hover { background: rgba(255, 153, 0, 1); }
ul#nav_ville li a.actif { background: #44A5AC; }

/****************************************/
/****************************************/
/****************************************/

/**************************************************/
/**** NAVIGATION INTERNE DES PAGES UTILISATEUR ****/
/**************************************************/

ul#nav_agenda li { display: inline-block; width: 50%; text-align: center; border-top: 1px solid #DDD; border-left: 1px solid #DDD; }
ul#nav_agenda li:first-child { border-left: 0; }
ul#nav_agenda li a { display: block; padding: 15px 5px; color: #FFF; text-decoration: none; background: rgba(255, 153, 0, 0.6); text-shadow: none; transition: background 0.3s; font-weight: bold; }
ul#nav_agenda li a:hover { background: rgba(255, 153, 0, 1); }
ul#nav_agenda li a.actif { background: #44A5AC; }
ul#nav_agenda li a span { display: inline; padding: 5px 13px; color: #FFF; background: #FF8421; border-radius: 50%; margin-left: 10px; }

ul#nav_parametres li { display: inline-block; width: 20%; text-align: center; border-top: 1px solid #DDD; border-left: 1px solid #DDD; }
ul#nav_parametres li:first-child { border-left: 0; }
ul#nav_parametres li a { display: block; padding: 15px 5px; color: #FFF; text-decoration: none; background: rgba(255, 153, 0, 0.6); text-shadow: none; transition: background 0.3s; font-weight: bold; }
ul#nav_parametres li a:hover { background: rgba(255, 153, 0, 1); }
ul#nav_parametres li a.actif { background: #44A5AC; }

ul#nav_profil li { display: inline-block; width: 50%; text-align: center; border-top: 1px solid #DDD; border-left: 1px solid #DDD; }
ul#nav_profil li:first-child { border-left: 0; }
ul#nav_profil li a { display: block; padding: 15px 5px; color: #FFF; text-decoration: none; background: rgba(255, 153, 0, 0.6); text-shadow: none; transition: background 0.3s; font-weight: bold; }
ul#nav_profil li a:hover { background: rgba(255, 153, 0, 1); }
ul#nav_profil li a:actif { background: #44A5AC; }
ul#nav_profil li a span { display: inline; padding: 5px 13px; color: #50BE87; background: #FFF; border-radius: 50%; margin-left: 10px; }

/****************************************/
/****************************************/
/****************************************/



#cuisine, #informations { z-index: 9999; position: fixed; bottom: 0; left: 0; width: 100%; padding: 10px 20px; line-height: 20px; font-size: 0.9em; background: rgba(0, 0, 0, 0.8); color: #FFF; text-align: center; } /* Avertissement cookies */
#cuisine { padding-top: 30px; padding-bottom: 25px; background: rgba(0, 0, 0, 0.9); }
#informations { display: none; background: rgba(0, 0, 0, 0.9); }
#informations .content { text-align: left; padding-top: 30px; line-height: 25px; }
#cuisine a, #informations a { color: #FF8421; }

#cta_readherer, #cta_adherer { position: fixed; bottom: -500px; right: 20px; border: 2px solid #FFF; box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px; padding: 25px; line-height: 25px; background: #5BB35B; color: #FFF; font-size: 1em; z-index: 995; width: 400px; max-width: calc(100% - 40px); border-radius: 10px; text-align: center; transition: all 1s; }
#cta_readherer i.cta_readherer_close, #cta_adherer i.cta_adherer_close { color: #000; }
#cta_readherer a.btn, #cta_adherer a.btn { font-size: 1em; padding: 5px 20px; margin-top: 15px; border: 1px solid #FFF; }
#cta_readherer .cta_readherer_close, #cta_adherer .cta_adherer_close { position: absolute; top: -7px; right: -7px; z-index: 996; background: #FFF; border-radius: 30px; cursor: pointer; }

#liste_emoticones {
	text-align: center;
	margin-top: 0;
}

#liste_emoticones_btn, #liste_emoticones_btn_edition {
	display: inline-block;
	padding: 5px 10px;
	color: #FFF;
	background: #FF9900;
	cursor: pointer;
}
#liste_emoticones_complementaire, #liste_emoticones_complementaire_edition {
	display: none;
	padding: 15px;
	background: #EEE;
	margin-bottom: 15px;
}
#liste_emoticones img, #liste_emoticones_complementaire img, #liste_emoticones_complementaire_edition img { margin: 0 8px; cursor: pointer; }





/*********************************************************************************************************/
/**************************************** MEDIA QUERIES GENERALES ****************************************/
/*********************************************************************************************************/

@media screen and (max-width: 1250px) {
	header .content, footer .content, main .content { max-width: none; padding: 15px; }
	/* main .content { max-width: none; width: 100%; padding: 35px; border: 1px solid red; } */
	body.accueil div.content { padding-left: 15px; padding-right: 15px; }
	ul.nav { width: 100%; max-width: none; }
	ul.nav li:first-child { border-left: none; }
	ul.nav li:last-child { border-right: none; }
	ul.nav > li > ul.sousmenu > li.content { padding-left: 20px; padding-right: 20px; }
}

@media screen and (max-width: 780px) { /****************************** LE MENU VIRE A DROITE POUR LES RESOLUTIONS < 800 pixels !!!! ******************************/
	nav {
		display: none;
		position: fixed;
		top: 0;
		right: 0;
		z-index: 9902;
		width: 235px;
		height: 100%;
	}
	ul.nav li, ul.nav li.home {
		display: block;
		width: 100%;
		text-align: left;
		border: none;
		border-bottom: 1px solid #666;
		white-space: nowrap;
		overflow: hidden;
	}
	ul.nav li.home span { display: inline; margin-left: 10px; }
	ul.nav li a { padding: 10px 40px 10px 15px; }
	ul.nav > li > ul.sousmenu { display: none; visibility: hidden; }
	ul.nav li.fermer { display: block; visibility: visible; }

	header .content { display: none; visibility: hidden; }
	header .content.album { display: block; visibility: visible; } /* Sauf pour les albums !! */
	header table { display: table; visibility: visible; }
	header table td { padding: 10px; text-align: left; background: #FF8421; color: #FFF; }
	header table td:last-child { padding-right: 20px; text-align: right; }
	header table td i { padding: 10px; border: 2px solid #FFF; border-radius: 5px; cursor: pointer; transition: all 0.2s; }
	header table td i:hover { /* border-color: #F78703; */ color: #F78703; background: #FFF; }

	main { padding-top: 63px; }

	ul#identifie-menu li.deconnexion { margin: 30px auto 0 auto; border: none; width: 75%; font-size: 0.85em; }
	ul#identifie-menu li.deconnexion a { border: 1px solid #666; border-radius: 5px; padding: 7px 10px; text-align: center; }
}


/*********************************************************************************************************/
/*********************************************************************************************************/
/*********************************************************************************************************/

.rechvillesadh { padding: 10px 15px; border: 2px solid #B7CAD9; background: #F0F4F7; margin-bottom: 15px; }

.aide_password1 { position: absolute; top: 8px; right: 5px; color: #888; cursor: pointer; }
.aide_password2 { font-size: 1.4em; width: 35px; height: 35px; padding: 5px 0 0 8px; border-radius: 10px; color: #888; cursor: pointer; }
.aide_password1:hover, .aide_password2:hover { color: #00A80C; }