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

@import url("modal.css");


/* Général
-----------------------------------------------------------------------------------------------------------*/

* {
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	-o-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
}
html {
	width: 100%;
	height: 100%;
	font-size: 16px;
}
body {
	width: 100%;
	height: 100%;
	font: 0.9em 'Rambla', Helvetica, sans-serif;
	color: #212121;
	padding: 0;
	margin: 0;
	background-color: #fff;
}
fieldset {
	border: 0 none;
	margin: 0;
	padding: 0;
}
textarea, input, select {
	display: inline-block;
	outline: none;
	text-overflow: ellipsis;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
}
input[type="text"],
input[type="password"],
input[type="file"],
select,
textarea {
	font: .9em 'Rambla', Helvetica, sans-serif;
	color: #212121;
	border: 0;
	border-radius: 0;	
	background-color: #fff;
	padding: .4em .4em .4em .75em;
	min-height: 32px;
	border-left: 2px solid transparent !important;
}
input[type="text"].form-error, 
input[type="password"].form-error, 
select.form-error {
	border-left: 2px solid #f28b06 !important;
}
::-webkit-input-placeholder {
	color: #aeaeae;
	font-style: italic;
}
::-moz-placeholder {
	color: #aeaeae;
	font-style: italic;
	opacity: 1;
}
::-ms-placeholder {
	color: #aeaeae;
	font-style: italic;
}
:-ms-input-placeholder {
	color: #aeaeae !important;
	font-style: italic !important;
}
::placeholder {
	color: #aeaeae;
	font-style: italic;
}
select::-ms-expand {
    display: none;
}
input[type="submit"],
button {
	cursor: pointer;
	font: 1.1em 'Rambla', Helvetica, sans-serif;
	font-weight: 700;
	text-align: center;
	color: #fff;
	height: 32px;
	line-height: 1.8em;
	background-color: #f28b06;
	padding: 0 .6em 0 .4em;
	-webkit-border-radius: 0;
    border: 0;
	border-left: 2px solid rgba(0,0,0,.1);
}

ul {
	list-style-type: none;	
}
a img {
	border: 0;
}
.wrapper {
	position: relative;
	width: 100%;
	max-width: 1100px;
	margin: 0 auto;
	padding: 0;
}
.clear {
	display: block;
	clear: both;
}

.picker-element {
	left: -999999px;
	position: absolute;
}
.picker {
	margin: 0 0 10px 0;
	overflow: hidden;
}
.picker .picker-label {
	display: inline-block !important;
	color: #aaa;
	font-size: 0.8em;
	cursor: pointer;
	float: left !important;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	-o-user-select: none;
	user-select: none;
}
.picker .picker-handle {
	display: inline-block !important;
	border: 2px solid #bfbfbf;
	cursor: pointer;
	float: left !important;
	width: 16px;
	height: 16px;
	margin: 0 5px 0 0;
}
.picker .picker-handle.form-error {
	border-color: #ef8906 !important;
	color: #212121 !important;
}
.picker .picker-handle.form-error .picker-flag {
	background-color: #ffd195 !important;
}
.picker.picker-radio .picker-handle {
	border-radius: 8px;
	background: #fff;
}
.picker.picker-radio .picker-flag {
	background: #fff;
	display: block;
	border-radius: 4px;
	height: 8px;
	margin: 2px;
	width: 8px;
}
.picker.picker-radio.checked .picker-flag {
	background: #0d0 !important;
}
.picker.picker-radio.checked .picker-handle {
	background: #636363 !important;
	border-color: #636363 !important;
}

.picker.checked .picker-label {
	color: #fff;
}
.picker-label a {
	color: #f28b06;
}
.picker.picker-checkbox .picker-handle {
	border-radius: 4px;
}
.picker.picker-checkbox.checked .picker-handle {
	border-color: #636363 !important;
}
.picker.picker-checkbox .picker-flag {
	background: #fff;
	border-radius: 2px;
	display: block;
	height: 100%;
	margin: 0;
	width: 100%;
}
.picker.picker-checkbox.checked .picker-flag {
	background-color: #636363 !important;
	border-radius: 0px;
}

.picker.picker-checkbox.checked .picker-flag {
	background: #fff url(../_images/forms/checkbox-icon.png) no-repeat center;
}

.picker.disabled .picker-label,
.picker.disabled .picker-handle {
	filter: alpha(opacity=60);
	opacity: 0.6;
	cursor: default;
}
.picker.picker-radio.disabled .picker-flag {
	background: #fff;
}
.picker.picker-radio.disabled.checked .picker-flag {
	background: #eee;
}

a.btn {
	position: relative;
	height: 46px;
	color: #fff;
	background-color: #f28b06;
	text-decoration: none;
	font-size: 20px;
	font-weight: 400;
	line-height: 2.3em;
	padding: 0 50px 0 70px;
}
a.btn strong {
	font-weight: 700;
}
a.btn.valid::before {
	display: block;
	position: absolute;
	content: '';
	top: 0;
	left: 20%;
	width: 20px;
	height: 14px;
	content: url(../_images/prehome/icon-check.svg);
}
.modal {
	font-size: 1.15em;
}
/*.modal.modalI {
	font-size: 1em;
}*/
.modal h4,
.modal h4 strong,
.modal ul lh,
.modal ol lh,
.modal h5 {
	font-family: 'Rambla';
}
.modal h4 strong,
.modal strong span.orange {
	font-weight: 700;
	color: #f28b06;
}
.modal ul lh,
.modal ol lh,
.modal h5 {
	font-weight: 700;
}


/* Header
-----------------------------------------------------------------------------------------------------------*/

header {
	position: absolute;
	width: 100%;
	min-height: 110px;
	z-index: 10;
	background-color: #352b26;
}
header h1 {
	display: inline-block;
	position: relative;
	top: 28px;
	margin: 0 16px 0 30px;
	vertical-align: top;
}
header h1 img {
	max-width: 360px;
}

header.celibrhonealpes .wrapper,
header.celibnormandie .wrapper,
header.celibpicardie .wrapper,
header.celibsudouest .wrapper {
	max-width: 1300px;
}
/* Celibrhonealpes */
header.celibrhonealpes h1 {
	top: 30px;
}
header.celibrhonealpes h1 img {
	max-height: 56px;
}
header.celibrhonealpes h2 {
	font-size: 1.1em;
	top: 26px;
}
/* Celibpicardie */
header.celibpicardie h1 {
	top: 26px;
}
header.celibpicardie h2 {
	font-size: 1.1em;
	top: 30px;
}
/* Celibnormandie */
header.celibnormandie h1 {
	top: 32px;
}
header.celibnormandie h1 img {
	max-height: 58px;
}
header.celibnormandie h2 {
	font-size: 1.1em;
	top: 20px;
}
/* Celibsudouest */
header.celibsudouest h1 {
	top: 28px;
}
header.celibsudouest h1 img {
	max-height: 64px;
}
header.celibsudouest h2 {
	font-size: 1.1em;
	top: 26px;
}
/* Celibouest */
header #minimap {
	display: inline-block;
	position: relative;
	top: 22px;
	margin: 0 30px 0 0;
	vertical-align: top;
}
header h2 {
	display: inline-block;
	position: relative;
	top: 18px;
	color: #fff;
	font-weight: 400;
	font-size: 1.4em;
	line-height: 1.1em;
	letter-spacing: 0.04em;
	vertical-align: top;
}
header h2 em {
	display: block;
	color: #f28b06;
	font-style: normal;
	font-size: 1.2em;
}
header h2 strong {
	font-weight: 700;
}
/**************************************************************************************************************/
/************************************************** MODIF JD **************************************************/
/**************************************************************************************************************/
/*header form {
	display: inline-block;
	position: relative;
	top: 10px;
	width: 400px;
	float: right;
	margin-right: 70px;
	color: #fff;
}*/
header form {
	display: inline-block;
	position: relative;
	top: 10px;
	width: 412px;
	float: right;
	margin-right: 100px;
	color: #fff;
}

/*header form > fieldset > span {
	display: inline-block;
	position: relative;
	width: 100%;
}*/
/*header form > fieldset .errorbox {
	top: 1px;
	right: 336px;
	font-size: .9em;
	width: 140px;
	white-space: normal;
}*/
header form .errorbox {
	font-size: 0.9em;
	height: 32px;
	right: 418px;
	top: 28px;
	white-space: nowrap;
	width: 180px;
	color: #fff;
	background-color: #f28b06;
	background-image: none;
	background-position: unset;
	padding-right: 8px;
	border-left: 2px solid #fff;
	width: unset;
	min-width: 160px;
}
header form .errorbox::before {
    border-color: transparent transparent transparent #f28b06;
}
/*header form span > a,
header form > div {
	display: inline-block;
}*/
/*header form span > a,*/
header form a#forgotpwd,
header form .cnx_auto label {
	color: #b9b9b9;
	cursor: pointer;
	font-size: .8em;
	text-decoration: underline;
}
/*header form span > a:hover,*/
header form a#forgotpwd:hover,
header form .cnx_auto label:hover {
	color: #fff;
	text-decoration: none;
}
/*header form fieldset h4 {
	color: #f28b06;
	font-size: 1.25em;
	font-weight: 700;
	padding: 0 0 5px 0;
	margin: 0;
}
header form fieldset h4 strong {
	color: #fff;
}*/
header form h4 {
	color: #f28b06;
	font-size: 1.25em;
	font-weight: 700;
	padding: 0 0 5px 0;
	margin: 0;
}
header form h4 strong {
	color: #fff;
}
header form label[for='login_cnx'],
header form label[for='password'] {
	display: none;
}
header form input#login_cnx,
header form input#password_cnx {
	/*width: 160px;*/
	width: 180px;
	height: 32px;
	float: left;
	margin-right: 3px;
}
/*header form fieldset,*/ 
header form input#valider_cnx {
	display: inline-block;
	float: left;
	height: 32px;
}
/*header form input#valider_cnx {
	position: relative;
	top: 1px;
	left: -2px;
}*/
/*header form div.cnx_auto {
	display: inline-block;
	margin: 11px 0 0 6px;
	vertical-align: middle;
}*/
header form div.cnx_auto {
	margin: 11px 3px 0 6px;
	float: left;
	width: 174px;
}
/*header form span > a {
	margin: 0 0 0 60px;
}
header form span > a::before {
	content: url(../_images/arrow-grey-small.png);
	margin-right: 0.5em;
}*/
header form  a#forgotpwd {
	margin: 11px 3px 0 6px;
	float: left;
	width: 174px;
	text-align: left;
}
header form a#forgotpwd::before {
	content: url(../_images/arrow-grey-small.png);
	margin-right: 0.5em;
}
.password_container {
	display: inline-block;
	position: relative;
	float: left;
	margin-right: 3px;
}
a.toggle_password {
	display: block;
	position: absolute;
	z-index: 70;
	height: 26px;
	bottom: 3px;
	right: 3px;
	border-radius: 0;
	background-color: #bcbcbc;
	font-size: .85em !important;
	line-height: 2.2em;
	color: #fff !important;
	text-align: center;
	text-decoration: none !important;
	padding: 0 7px;
}
/**************************************************************************************************************/
/************************************************** MODIF JD **************************************************/
/**************************************************************************************************************/


/* Zone inscription
-----------------------------------------------------------------------------------------------------------*/

section#signin {
	position: relative;
	z-index: 9;
	height: 100%;
	top: 0;
	min-height: 700px;
	max-height: 760px;
	overflow: hidden;
	-webkit-transition: top .4s;
	   -moz-transition: top .4s;
		-ms-transition: top .4s;
		 -o-transition: top .4s;
			transition: top .4s;
	background-size: cover, 25px 25px !important;
}
section#signin.bgA {
	background: url(../_images/prehome/section-bg-A_2016.jpg) center center no-repeat, url(../_images/nav/loading.gif) center center no-repeat;
	background-color: #e5e5e3;
}
section#signin.bgB {
	background: url(../_images/prehome/section-bg-B_2016.jpg) center center no-repeat, url(../_images/nav/loading.gif) center center no-repeat;
	background-color: #e9f3fc;
}
section#signin.bgC {
	background: url(../_images/prehome/section-bg-C_2016.jpg) center center no-repeat, url(../_images/nav/loading.gif) center center no-repeat;
	background-color: #d9f8fd;
}
header.opened + section#signin {
	top: 82px
}
section#signin > .wrapper {
	display: table;
	height: 100%;
}
section#signin .infosleg {
	display: block;
	position: relative;
	z-index: 11;
	width: 100%;
	padding: 10px 20px;
	bottom: 0;
	left: 0;
	color: #fff;
	font-size: .7em;
	letter-spacing: .04em;
	text-align: center;
	background-color: rgba(45,45,45,.25);
}
section#signin .infosleg span {
	display: inline-block;
	max-width: 1440px;
}
section#signin .infosleg a {
	color: #fff;
}
section#signin .infosleg a:hover {
	text-decoration: none;
}
section#signin nav {
	display: block;
	position: absolute;
	z-index: 12;
	width: 100%;
	bottom: 0;
	left: 0;
	text-align: center;
}
section#signin nav .menu {
	min-height: 50px;	
	padding: 14px 20px 14px 20px;
	background-color: #ebebeb;
}
section#signin nav ul {
	display: inline-block;
	padding: 0;
	margin: 0;
}
section#signin nav ul li {
	display: inline-block;
	border-left: 1px solid rgba(0,0,0,.08);
}
section#signin nav ul li:first-child {
	border-left: 0;
}
section#signin nav ul li a {
	display: inline-block;
	color: #7a7a7a;
	font-size: .9em;
	text-decoration: none;
	margin: 0 10px;
	border-bottom: 1px solid transparent;
}
section#signin nav ul li a:hover {
	color: #000;
	border-bottom: 1px solid #f28b06;
}
section#signin .centerV {
	display: table-cell;
	text-align: right;
	vertical-align: middle;
}
section#signin form {
	display: inline-block;
	position: relative;
	width: 412px;
	z-index: 13;
	text-align: left;
	font-size: 1.2em;
	background-color: rgba(250,250,250,.8);
	border-top: 2px solid #f28b06;
	margin-top: 20px;
	margin-right: 100px;
	padding: 18px 0 26px 26px;
}
section#signin form legend {
	width: 100%;
	text-align: center;
}
section#signin form > fieldset > span,
section#signin form > fieldset > div#form-complt > span {
	display: inline-block;
	position: relative;
	width: 100%;
}
section#signin form > fieldset > div#form-complt > span.cg {
	margin: 10px 0 0 5px;
}
section#signin form h2 {
	color: #212121;
	font-size: 1.75em;
	font-weight: 400;
	letter-spacing: -.02em;
	margin: 0 0 0 -26px;
	padding-bottom: 14px;
}
section#signin form h2 strong {
	color: #f28b06;
}
section#signin form label.icon {
	display: block;
	position: relative;
	width: 0;
	height: 0;
	text-indent: -999em;
}
section#signin form label.icon::after {
	display: block;
	z-index: 30;
	position: absolute;
	content: '';
	width: 30px;
	height: 30px;
	top: 5px;
	left: 10px;
	background: url(../_images/prehome/icons-form.svg) top left no-repeat;	
}
section#signin form label[for="email"].icon::after {
	background-position: -3px 0;
}
section#signin form label[for="sexe"].icon::after {
	background-position: -29px 0;
}
section#signin form label[for="cp"].icon::after {
	background-position: -59px 0;
}
section#signin form label[for="ville"].icon::after {
	background-position: -89px 0;
}
section#signin form label[for="birthglobal"].icon::after {
	background-position: -119px 0;
}
section#signin form label[for="pseudo"].icon::after {
	background-position: -150px 0;
}
section#signin form label[for="password"].icon::after,
section#signin form label[for="password_confirm"].icon::after {
	background-position: -179px 0;
}
section#signin form label[for="email"].icon.focus::after {
	background-position: -3px -30px;
}
section#signin form label[for="sexe"].icon.focus::after {
	background-position: -29px -30px;
}
section#signin form label[for="cp"].icon.focus::after {
	background-position: -59px -30px;
}
section#signin form label[for="ville"].icon.focus::after {
	background-position: -89px -30px;
}
section#signin form label[for="birthglobal"].icon.focus::after {
	background-position: -119px -30px;
}
section#signin form label[for="pseudo"].icon.focus::after {
	background-position: -150px -30px;
}
section#signin form label[for="password"].icon.focus::after {
	background-position: -179px -30px;
}
section#signin input[type="text"], 
section#signin input[type="password"], 
section#signin input[type="submit"],
section#signin form select {
	display: block;
	position: relative;
	z-index: 23;
	width: 360px;
	height: 43px;
	margin-bottom: 1px;
	border-left: 0;
	padding-left: 46px;
}
section#signin input[type="submit"] {
	padding-left: 36px;
}
section#signin form input:focus,
section#signin form select:focus {
	z-index: 24;
	-moz-box-shadow: 	0 0 8px rgba(0,0,0,.2);
	-webkit-box-shadow: 0 0 8px rgba(0,0,0,.2);
	box-shadow: 		0 0 8px rgba(0,0,0,.2);
}
section#signin form select {
	color: #aeaeae;
	font-style: italic;
	background: url(../_images/prehome/icon-select.svg) center right no-repeat;
	background-color: #fff;
}
section#signin form select.hasinfo {
	color: #212121;
	font-style: normal;
}
section#signin form select option {
	color: #212121;
	font-style: normal;
}
section#signin form select option:disabled {
	color: #aeaeae;
	font-style: italic;
}
section#signin form input[type="submit"] {
	position: relative;
	height: 55px;
	font-size: 1.4em;
	background-image: url(../_images/prehome/icon-check.svg);
    background-position: 110px 20px;
    background-repeat: no-repeat;
}
section#signin form span.valid {
	position: relative;
	display: block;
}
/*section#signin form span.valid::before {
	display: block;
	position: absolute;
	z-index: 100;
	content: '';
	top: 18px;
	left: 28%;
	width: 20px;
	height: 14px;
	content: url(../_images/prehome/icon-check.svg);
	cursor: crosshair;
}*/
section#signin form .birthdetail {
	/*display: inline-block;*/
	position: relative;
}
section#signin form .birthdetail > span {
	display: block;
	position: absolute;
	top: 0;
	height: 0;
	opacity: 0;
	overflow: hidden;
	-webkit-transition: all .3s;
	   -moz-transition: all .3s;
		-ms-transition: all .3s;
		 -o-transition: all .3s;
			transition: all .3s;
}
section#signin form .birthdetail > span.opened {
	opacity: 1;
	z-index: 110;
	height: 43px;
}
section#signin form .birthdetail > span.opened input,
section#signin form .birthdetail > span.opened label {
	display: none;
}
section#signin form .birthdetail select {
	display: block;
	float: left;
	height: 39px;
	border-left: 1px solid #f3f3f3 !important;
	margin: 2px 0 1px 0;
	padding-left: 12px;
}
section#signin form .birthdetail select[name='naissance[d]'] {
	margin-left: 44px;
	width: 80px;
}
section#signin form .birthdetail select[name='naissance[m]'],
section#signin form .birthdetail select[name='naissance[M]'],
section#signin form .birthdetail select[name='naissance[F]'] {
	width: 134px;
}
section#signin form .birthdetail select[name='naissance[Y]'] {
	width: 100px;
}
section#signin form #form-complt {
	max-height: 0;
	overflow: hidden;
	opacity: 0;
}
section#signin form #form-complt.anim {
	-webkit-transition: all .5s;
	   -moz-transition: all .5s;
		-ms-transition: all .5s;
		 -o-transition: all .5s;
			transition: all .5s;
}
section#signin form.opened #form-complt {
	max-height: 250px;
	opacity: 1;
	overflow: visible;
}
section#signin form #form-complt > .picker {
	padding: 8px 18px;
}
section#signin form #form-complt .picker-label {

	color: #212121 !important;
	font-size: .75em !important;
}
#desktop_inscription_password_container {
	position: relative;
}
section#signin form a.toggle_password {
	font-size: .8em !important;
	background-color: #ababab !important;
	top: 6px;
	right: 6px;
	height: 30px;
}
section#signin form#desktop_motdepasseoublie {
	width: 422px;
}

#jauge_password {
	position: absolute !important;
	z-index: 60;
	top: 40px;
	left: 50px;
	height: 3px;
	border-radius: 2px;
	width: 210px;
	margin: 0 0 2px 0;
	float: left;
	position: relative;
}
#jauge_password .valeur {
	height: 3px;
	width: 100%;
	background-color: rgba(255,255,255,.8);
	position: absolute;
	right: 0;
}
#tooltip_password {
	position: absolute;
    /*display: inline-block;*/
	top: 13px;
	right: 4px;
    width: 17px;
    height: 17px;
    overflow: hidden;
    padding: 0;
    background: url(../_images/btn-info-small.png) center center no-repeat;
}
.content_tooltip {
	display: none;
}
.ui-tooltip {
	padding: 8px 14px;
	font-size: 0.9em;
	line-height: 1.4em;
	position: absolute;
	z-index: 9999999;
	max-width: 360px;
	background-color: #fff;
	box-shadow: 0px 0px 6px rgba(0,0,0,.2);
	border-radius: none;

}
.ui-tooltip ul {
	list-style-type: square;
	margin: 2px 0 8px 0;
	padding-left: 20px;
}
.ui-tooltip ul li ul {
	list-style-type: circle;
	margin: 2px 0 0 0;
	padding-left: 20px;
}
.ui-tooltip strong {
	font-size: 1.1em;
}
.ui-tooltip .btn-icon.info {
	vertical-align: text-bottom;
    display: inline-block;
    width: 17px;
    height: 17px;
	paading: 0;
	margin: 0 2px;
    background: url(../_images/btn-info-small.png) center center no-repeat;
}

.errorbox {
	position: absolute;
	/*width: auto;*/
	width: 350px;
	/*top: 10px;*/
	top: 2px;
	right: 400px;
	/*color: #fff;*/
	font-size: .9em;
	/*background-color: #f28b06;*/
	border-left: 2px solid #f28b06;
	white-space: nowrap;
	/*padding: 3px 8px;*/
	padding: 8px 32px 8px 8px;
	text-align: right;
	background-image: url(/desktop/_images/prehome/icon-errorbox.png);
    background-position: right 8px top 8px;
    background-repeat: no-repeat;
}
.cg .errorbox {
	top: -4px;
	/*box-shadow: 0px 0px 4px rgba(255, 255, 255, 0.5);*/
}
.pwcf .errorbox {
	box-shadow: 0px 0px 4px rgba(255, 255, 255, 0.5);
}
.password_container .errorbox {
	right: 374px;
	padding-top: 10px;
}
section#signin form#desktop_motdepasseoublie .errorbox {
	right: 410px;
}
.errorbox::before {
	display: block;
	position: absolute;
	content: '';
	top: 7px;
	right: -4px;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 4px 0 4px 4px;
	/*border-color: transparent transparent transparent #f28b06;*/
}
/*/
.errorbox {
	color: #fff;
	background-color:  rgba(53, 43, 38, 0.6);
}
.errorbox::before {
	border-color: transparent transparent transparent rgba(53, 43, 38, 0.6);
}
/*/
.errorbox {
	color: #212121;
	background-color: rgba(255, 255, 255, 0.8);
}
.errorbox::before {
	border-color: transparent transparent transparent rgba(255, 255, 255, 0.8);
}
/**/

.errorbox .pwd {
	/*padding-left: 10px;*/
	text-align: left;
}
.errorbox .pwd strong {
	font-weight: normal;
}

.errorbox .pwd ul {
	list-style-type: disc;
	padding-left: 24px;
	margin: 2px 0 0 0;
	font-size: 0.9em;
}
.errorbox .pwd ul li ul {
	list-style-type: circle;
	padding-left: 20px;
}
.errorbox .pwd ul li ul li span {
	width: 140px;
	display: inline-block;
}
.errorbox .pwd a {
	float: right;
	margin: -18px 3px 0 0;
}


/* Labels
-----------------------------------------------------------------------------------------------------------*/

section#labels ul {
	margin: 34px 0;
	padding: 0;
	text-align: center;
}
section#labels ul li {
	display: inline-block;
	position: relative;
	width: 24.7%;
	text-align: center;
	font-size: 1.2em;
	padding-top: 80px;
	border-left: 1px solid #f1f1f1;
}
section#labels ul li:first-child {
	border: 0;
}
section#labels ul li::before {
	display: block;
	position: absolute;
	content: '';
	top: 0;
	left: 50%;
	margin-left: -37px;
	width: 74px;
	height: 74px;
}
section#labels ul li strong {
	display: block;
}
section#labels ul li#conf strong {
	color: #43af92;
}
section#labels ul li#mode strong {
	color: #f28b06;
}
section#labels ul li#qual strong {
	color: #bcd300;
}
section#labels ul li#regi strong {
	color: #66b3f4;
}
section#labels ul li#conf::before {
	background: url(../_images/prehome/label_confiance.svg) center center no-repeat;
}
section#labels ul li#mode::before {
	background: url(../_images/prehome/label_moderation.svg) center center no-repeat;
}
section#labels ul li#qual::before {
	background: url(../_images/prehome/label_qualite.svg) center center no-repeat;
}
section#labels ul li#regi.est::before {
	background: url(../_images/prehome/label_regional_est.svg) center center no-repeat;
}
section#labels ul li#regi.lux::before {
	background: url(../_images/prehome/label_regional_lux.svg) center center no-repeat;
}
section#labels ul li#regi.lyon::before {
	background: url(../_images/prehome/label_regional_lyon.svg) center center no-repeat;
}
section#labels ul li#regi.nord::before {
	background: url(../_images/prehome/label_regional_nord.svg) center center no-repeat;
}
section#labels ul li#regi.normandie::before {
	background: url(../_images/prehome/label_regional_normandie.svg) center center no-repeat;
}
section#labels ul li#regi.ouest::before {
	background: url(../_images/prehome/label_regional_ouest.svg) center center no-repeat;
}
section#labels ul li#regi.paris::before {
	background: url(../_images/prehome/label_regional_paris.svg) center center no-repeat;
}
section#labels ul li#regi.picardie::before {
	background: url(../_images/prehome/label_regional_picardie.svg) center center no-repeat;
}
section#labels ul li#regi.rhonealpes::before {
	background: url(../_images/prehome/label_regional_rhonealpes.svg) center center no-repeat;
}
section#labels ul li#regi.sud::before {
	background: url(../_images/prehome/label_regional_sud.svg) center center no-repeat;
}
section#labels ul li#regi.sudouest::before {
	background: url(../_images/prehome/label_regional_sudouest.svg) center center no-repeat;
}


/* Teaser
-----------------------------------------------------------------------------------------------------------*/

section#teaser {
	position: relative;
	text-align: center;
	overflow: hidden;
	padding: 80px 0 90px 0;
	background: url(../_images/prehome/bg-teaser.jpg) center center repeat-y;
	background-color: #f9f1e3;
}
section#teaser .wrapper {
	position: relative;
	z-index: 15;
	padding: 0 40px;
	max-width: 940px;
	width: 50%;
}
section#teaser h3 {
	position: relative;
	font-size: 42px;
	padding: 0 0 20px 0;
	margin: 0 0 40px 0;
	color: #f28b06;
}
section#teaser h3 strong {
	 color: #352b26;
}
section#teaser h3::after {
	display: block;
	position: absolute;
	content: '';
	width: 140px;
	height: 2px;
	bottom: 0;
	left: 50%;
	margin-left: -70px;
	background-color: #d5c7b6;
}
section#teaser p.intro {
	font-size: 1.1em;
	color: #212121;
}
section#teaser p.intro.titre {
	text-align: center;
}
section#teaser p {
	color: #5f5f5f;
	line-height: 1.5em;
	text-align: justify;
}
section#teaser a.btn {
	display: inline-block;
	margin-top: 30px;
}
section#teaser a.btn.valid::before {
	width: 16px;
	height: 11px;
}
section#teaser .photos {
	position: absolute;
	z-index: 120;
	width: 500px;
	height: 600px;
	bottom: -130px;
	left: -80px;
}
section#teaser .photos img {
	position: absolute;
}
section#teaser .photos #photo1 {
	z-index: 3;
	top: 205px;
	right: 0;
}
section#teaser .photos #photo2 {
	z-index: 2;
	top: 130px;
	right: 180px;
}
section#teaser .photos #photo3 {
	top: 0;
	right: 20px;
}
section#teaser p a {
	color: #f28b06;
	border-bottom: 1px solid transparent;
	font-weight: bold;
	text-decoration: none;
}
section#teaser p a:hover {
	color: #5f5f5f;
	border-bottom: 1px solid #f28b06;
}
section#teaser p.intro a:hover {
	color: #212121;
}


/* Description
-----------------------------------------------------------------------------------------------------------*/

section#descr {
	width: 100%;
}
section#descr .img {
	position: relative;
	background-color: #554843;
	overflow: hidden;
	background: url(../_images/prehome/bg-descr.jpg) 20% 15% no-repeat, url(../_images/nav/loading.gif) 75% center no-repeat;
	background-size: cover, 25px 25px;
}
section#descr .text {
	position: relative;
	z-index: 2;
	width: 50%;
	background-color: #fff;
}
section#descr .text h3 {
	position: relative;
	color: #959595;
	font-size: 2.35em;
	font-weight: 400;
	margin: 0;
	padding: 0 0 30px 0;
}
section#descr .text h3 em {
	display: block;
	font-size: 1.35em;
	font-style: normal;
	font-weight: 700;
	line-height: 1em;
	color: #352b26;
}
section#descr .text h3 em strong {
	color: #f28b06;
}
section#descr .text h3::after {
	display: block;
	position: absolute;
	content: '';
	width: 20%;
	height: 2px;
	margin-top: 20px;
	background-color: #e2e2e2
}
section#descr .text {
	padding: 80px 100px;
}
section#descr .text p.intro {
	font-size: 1.1em;
}
section#descr .text p.intro strong {
	color: #f28b06;
}
section#descr .text p {
	text-align: justify;
	line-height: 1.5em;
}
section#descr .text p a {
	color: #212121;
}
section#descr .text p a:hover {
	color: #f28b06;
	text-decoration: none;
}
section#descr ul li a {
	color: #f28b06;
	border-bottom: 1px solid transparent;
	text-decoration: none;
}
section#descr ul li a:hover {
	color: #212121;
	border-bottom: 1px solid #f28b06;
}


/* Témoignages
-----------------------------------------------------------------------------------------------------------*/

section#temoignages {
	background-color: #f7f7f7;
	padding: 80px 0;
}
section#temoignages h3 {
	position: relative;
	font-size: 50px;
	color: #f28b06;
	font-weight: 400;
	text-align: center;
	margin: 0;
	padding: 0 0 20px 0;
}
section#temoignages h3::after {
	display: block;
	position: absolute;
	content: '';
	bottom: 0;
	left: 50%;
	width: 140px;
	height: 2px;
	margin-left: -70px;
	background-color: #ddd;
}
section#temoignages img {
	width: 102px;
	height: 102px;
}
.unslider {
	overflow: auto;
	margin: 0;
	padding: 0;
}
.unslider-wrap {
	position: relative;
}
.unslider-wrap.unslider-carousel > li {
	float: left;
	text-align: center;
	padding: 0 140px;
	color: #7d7d7d;
	font-size: 1.05em;
	line-height: 1.6em;
	font-style: italic;
}
.unslider-wrap.unslider-carousel > li img {
	border-radius: 100%;
	border: 4px solid #e7e7e7;
	margin-top: 50px;
}
.unslider-wrap.unslider-carousel > li h5 {
	font-size: 1.15em;
	font-style: normal;
	color: #535353;
	margin: 0;
	padding: 10px 20px 0 20px;
}
.unslider-wrap.unslider-carousel > li p {
	margin-bottom: 30px;
}
.unslider-vertical > ul {
	height: 100%;
}
.unslider-vertical li {
	float: none;
	width: 100%;
}
.unslider-fade {
	position: relative;
}
.unslider-fade .unslider-wrap li {
	position: absolute;
	left: 0;
	top: 0;
	right: 0;
	z-index: 8;
}
.unslider-fade .unslider-wrap li.unslider-active {
	z-index: 10;
}
.unslider li,.unslider ol,.unslider ul {
	list-style: none;
	margin: 0;
	padding: 0;
	border: none;
}
.unslider-arrow {
	position: absolute;
	display: block;
	top: 50%;
	left: 20px;
	z-index: 2;
	cursor: pointer;
	width: 60px;
	height: 60px;
	text-indent: -999em;
	overflow: hidden;
	background: url(../_images/prehome/btns-text-slider.svg) top left no-repeat;
	opacity: .3;
}
.unslider-arrow:hover {
	opacity: .6;
}
.unslider-arrow.next {
	left: auto;
	right: 20px;
	background-position: -60px 0;
}
.unslider-nav ol {
	list-style: none;
	text-align: center;
}
.unslider-nav ol li {
	display: inline-block;
	width: 10px;
	height: 10px;
	margin: 0 7px;
	background: transparent;
	border-radius: 100%;
	overflow: hidden;
	text-indent: -999em;
	border: 1px solid #a0a0a0;
	cursor: pointer;
}
.unslider-nav ol li.unslider-active {
	background: #a0a0a0;
	cursor: default;
}


/* Famille Celib (logos)
-----------------------------------------------------------------------------------------------------------*/

section#family {
	background-color: #463a33;
	padding: 10px;
	text-align: center;
}
section#family ul li {
	display: inline-block;
	width: auto;
	margin: 0 12px;
	padding: 0;
}
section#family ul li img {
	max-width: auto;
	height: 20px;
}
section#family ul li a.celibest img {
	width: 62px;
}
section#family ul li a.celiblux img,
section#family ul li a.celibsud img {
	width: 66px;
}
section#family ul li a.celiblyon img,
section#family ul li a.celibnord img {
	width: 74px;
}
section#family ul li a.celibouest img {
	width: 82px;
}
section#family ul li a.celibparis img {
	width: 77px;
}
section#family ul li a.celibpicardie img {
	width: 101px;
}
section#family ul li a.celibrhonealpes img {
	width: 128px;
}
section#family ul li a.celibsudouest img {
	width: 112px;
}


/* Footer
-----------------------------------------------------------------------------------------------------------*/

section#footer {
	position: relative;
	background-color: #352b26;
	text-align: center;
	padding: 30px 0;
}
section#footer span.logo {
	color: #fff;
	font-size: .9em;
}
section#footer span.logo em {
	font-style: normal;
	color: #f28b06;
}
section#footer span.logo img {
	max-width: 200px;
	max-height: 40px;
}
section#footer span.celibest img {
	max-width: 124px;
}
section#footer span.celiblux img,
section#footer span.celibsud img {
	max-width: 133px;
}
section#footer span.celiblyon img,
section#footer span.celibnord img {
	max-width: 148px;
}
section#footer span.celibouest img {
	max-width: 165px;
}
section#footer span.celibparis img {
	max-width: 155px;
}
section#footer span.celibpicardie img {
	max-height: 39px;
}
section#footer span.celibrhonealpes img {
	max-height: 31px;
}
section#footer span.celibnormandie img {
	max-height: 32px;
}
section#footer span.celibsudouest img {
	max-height: 35px;
}
section#footer span.copy {
	display: block;
	position: absolute;
	top: 42%;
	right: 60px;
	color: #776a63;
	font-size: .75em;
}


/* Responsive
-----------------------------------------------------------------------------------------------------------*/

@media only screen and (min-width : 2000px) {
	section#teaser .photos {
		left: 3%;
	}
}
@media only screen and (max-width : 1500px) {
	section#teaser .photos {
		bottom: -20px;
		-webkit-transform: scale(.8);
			-ms-transform: scale(.8);
				transform: scale(.8);
	}
}
@media only screen and (max-width : 1280px) {
	header h1 {
		margin-left: 30px;
	}
	section#teaser .wrapper {
		width: 100%;
	}
	section#teaser .photos {
		position: relative;
		height: 370px;
		bottom: 0;
		left: 0;
		margin-top: 40px;
		display: inline-block;
		-webkit-transform: scale(1);
			-ms-transform: scale(1);
				transform: scale(1);
	}
	section#descr .text {
		width: 100%;
		margin-top: 400px;
	}
	section#descr .img {
		background-position: right -40px;
		background-size: contain, 25px 25px;
	}
}
@media only screen and (max-width : 1180px) {
	header h1 img {
		max-width: 300px;
	}
	header.celibrhonealpes h1 img {
		max-height: 47px;
	}
	header.celibnormandie h1 img {
		max-height: 48px;
	}
	header.celibpicardie h1 img {
		max-height: 59px;
	}
	header.celibsudouest h1 img {
		max-height: 53px;
	}
/**************************************************************************************************************/
/************************************************** MODIF JD **************************************************/
/**************************************************************************************************************/
	/*header form {
		margin-right: 0;
	}*/
/**************************************************************************************************************/
/************************************************** MODIF JD **************************************************/
/**************************************************************************************************************/
}
@media only screen and (max-width : 1152px) {
	header form {
		margin-right: 40px;
	}
}
@media only screen and (max-width : 1024px) {
	section#signin form {
		margin-right: 40px;
	}
/*}
@media only screen and (max-width : 1023px) {*/
	header {
		top: -82px;
		-webkit-transition: top .4s;
		   -moz-transition: top .4s;
			-ms-transition: top .4s;
			 -o-transition: top .4s;
				transition: top .4s;
	}
	header.opened {
		top: 0;
	}
	header h1 {
		margin: 80px 0 30px 30px;
	}
	header #minimap {
		margin: 80px 0 30px 16px;
	}
	header h2 {
		margin: 98px 0 30px 30px;
	}

	/* Celibrhonealpes */
	header.celibrhonealpes h1 {
		top: 24px;
	}
	header.celibrhonealpes h2 {
		margin-top: 80px;
	}
	header.celibrhonealpes #minimap {
		margin-top: 72px;
	}

	/* Celibpicardie */
	header.celibpicardie h1 {
		top: 26px;
	}
	header.celibpicardie h2 {
		margin-top: 84px;
	}
	header.celibpicardie #minimap {
		margin-top: 76px;
	}
	
	/* Celibnormandie */
	header.celibnormandie h1 {
		top: 26px;
	}
	header.celibnormandie h2 {
		margin-top: 84px;
	}
	header.celibnormandie #minimap {
		margin-top: 70px;
	}

	/* Celibsudouest */
	header.celibsudouest h1 {
		top: 24px;
	}
	header.celibsudouest h2 {
		margin-top: 84px;
	}
	header.celibsudouest #minimap {
		margin-top: 72px;
	}

/**************************************************************************************************************/
/************************************************** MODIF JD **************************************************/
/**************************************************************************************************************/
	header form {
		position: absolute;
		display: inline-block;
		top: 0;
		left: 0;
		width: 100%;
		min-width: 412px;
		text-align: right;
		padding: 8px 30px 4px 10px;
		height: 82px;
		margin: 0;
		background-color: #51433b;
	}
	header form > div {
		display: inline-block;
	}
	/*header form span {
		display: block;
	}
	header form span > a {
		margin-left: 15px;
	}*/
	/*header form legend {
		display: inline-block;
		position: absolute;
		bottom: -38px;
		right: 0;
		margin-right: 26px;
		padding: 8px 14px 4px 14px;
		cursor: pointer;
		background-color: #51433b;
	}*/
	header form h4 {
		display: inline-block;
		position: absolute;
		bottom: -35px;
		right: 0;
		margin-right: 26px;
		padding: 8px 14px 4px 14px;
		cursor: pointer;
		background-color: #51433b;
		height: 35px;
	}
	header form input#login_cnx,
	header form input#password_cnx {
		width: 160px;
	}
	header form a#forgotpwd,
	header form div.cnx_auto{
		width: 154px;
	}
	header form .errorbox {
		top: 8px;
		left: unset;
		right: 406px;
	}
	/*header form input#valider_cnx {
		top: 1px;
	}*/
/**************************************************************************************************************/
/************************************************** MODIF JD **************************************************/
/**************************************************************************************************************/
	section#signin {
		background-position-x: 40% !important;
	}
}
@media only screen and (max-width : 767px) {
	header h2 {
		position: absolute;
		font-size: .85em !important;
	}

	/* Celibest */
	/* Celibparis */
	/* Celiblyon */
	/* Celibnord */
	/* Celibnord */
	header h1 {
		margin-top: 70px;
	}
	header h2 {
		top: 54px;
		left: 3px;
	}
	header #minimap {
		margin-top: 75px;
	}
	/* Celibrhonealpes */
	header.celibrhonealpes h1 {
		top: 26px;
	}
	header.celibrhonealpes h2 {
		top: 56px;
		left: 1px;
	}
	header.celibrhonealpes #minimap {
		margin-top: 70px;
	}
	/* Celibnormandie */
	header.celibnormandie h1 {
		top: 24px;
	}
	header.celibnormandie h2 {
		top: 50px;
		left: 1px;
	}
	header.celibnormandie #minimap {
		margin-top: 65px;
	}
	/* Celiblux */
	header.celiblux h2 {
		display: none;
	}

	/* Celibpicardie */
	header.celibpicardie h1 {
		top: 27px;
	}
	header.celibpicardie h2 {
		top: 61px;
		left: 142px;
	}
	header.celibpicardie #minimap {
		margin-top: 74px;
	}
	/* Celibsudouest */
	header.celibsudouest h1 {
		top: 26px;
	}
	header.celibsudouest h2 {
		top: 54px;
		left: 3px;
	}
	header.celibsudouest #minimap {
		margin-top: 72px;
	}
	
	header h2 em {
		display: inline-block;
	}
	section#signin form {
		margin-right: 10px;
	}
	section#signin form {
		width: 360px;
	}
	section#signin input[type="text"], 
	section#signin input[type="password"], 
	section#signin input[type="submit"],
	section#signin form select {
		width: 308px;
	}
	section#signin form input[type="submit"] {
		background-position: 84px 20px;
	}
	.errorbox {
		right: 345px;
	}
	.password_container .errorbox {
		right: 322px;
	}
	.errorbox {
		width: 250px;
		text-align: right;
		white-space: normal;
	}
	#jauge_password {
		width: 170px;
	}
	section#descr .text {
		margin-top: 300px;
	}

	section#labels ul li {
		vertical-align: top;
		font-size: 1em;
		width: 23%;
	}
/**************************************************************************************************************/
/************************************************** MODIF JD **************************************************/
/**************************************************************************************************************/
	/*header form legend {
		margin-right: 0;
	}*/
	header form h4 {
		margin-right: 0;
	}
/**************************************************************************************************************/
/************************************************** MODIF JD **************************************************/
/**************************************************************************************************************/
	section#footer span.copy {
		position: relative;
		right: 0;
		margin-top: 30px;
	}
}
@media only screen and (max-width : 600px) {
	.errorbox {
		width: 180px;
	}
}

/* Modif Cnx Email */
#desktop_login .errorbox-email,
#desktop_login.email-cnx .errorbox-email.errorbox-hide {
	display: none !important;
}
#desktop_login.email-cnx .errorbox-email.errorbox-show {
	display: inline-block !important;
}