/* @override 
	http://compagnie-ecurie.fr/assets/css/compagnie.css?*
	https://compagnie-ecurie.fr/assets/css/compagnie.css?*
	https://www.compagnie-ecurie.fr/assets/css/compagnie.css?*
	https://compagnie-ecurie.image.ac/assets/css/compagnie.css?*
*/

body {
	margin-left: 0px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	padding-top: 0px;
}
b,
strong {
	font-weight: 600;
}

* {outline: none;}

body,td,th {
	font-family: 'Poppins', sans-serif;
	
	line-height: 25px;
	font-weight: normal;
}

@media (min-width: 778px) {
	body,td,th {
		font-size: 15px;
		line-height: 20px;
	}
}
blockquote {
	font-style: italic;
	color: #424141;
	padding-left: 8px;
	position: relative;
	text-align: left;
	padding-right: 10px;
	
}
@media (max-width: 991px) {
	blockquote {
		padding-top: 20px;
		padding-bottom: 10px;
		background-color: white;
	}
}
blockquote:before {
	content: "“";
	font-size: 60px;
	display: block;
	position: absolute;
	top: -19px;
	right: 100%;
	transform: rotatex(-180deg);
	margin-right: 3px;
}
blockquote footer {
	text-align: right;
	font-style: normal;
	padding-top: 7px;
}
address {
	margin-bottom: 10px;
	margin-top: 10px;
}
.text-center {
	text-align: center;
}
.text-italic {
	font-style: italic;
}

.posRelative {
	position: relative;
}
.vert {
	color: #70dd70;
}
.nomarge {
	margin: 0;
}

.texte_blanc {
	color: #fff;
}
.grand {
	font-size: 32px;
	line-height: 18px;
}

.mobileNot {
	display: none;
}
@media (min-width: 992px){
	.mobileOnly {
		display: none;
	}
}

@media (min-width: 996px){
	.mobileNot {
		display: inline-block;
	}

}

.container .row img {
	max-width: 100%;
}

/* Header, logo */

a#retouraccueil {
	display: block;
	height: 109px;
	position: relative;
}


#encre {
	position: absolute;
	z-index: -1;
	width: 300px;
	height: 300px;
	top: -80px;
	left: 40px;
	
	transform: scale(.6) rotate(180deg);
	
	transition: transform .5s ease-in-out 0s;
}

@media (min-width: 992px) {
	#encre {
		top: -80px;
		left: -80px;
	}
}
a:hover #encre {
	transform: scale(.7) rotate(210deg);
}


a#retouraccueil img {
	margin-top: 1px;
}
#actu_header {
	display: none;
}
/* Acutalité dans le header */
@media (min-width: 996px){
	
	a#retouraccueil {
		margin-bottom: 1px;
		margin-left: -15px;
	}

	#actu_header {
		display: block;
	}
	#actu_header li.actu {
		display: block;
		font-size: 14px;
		list-style-type: none;
		padding-right: 40px;
		padding-top: 20px;
	}
	
	#actu_header li.actu .actu_contenu {
		font-style: italic;
		font-family: Georgia, "Times New Roman", Times, serif;
		padding-left: 49px;
	
		display: inline-block;
		position: relative;
	}
	#actu_header li.actu .actu_contenu a {
		white-space: nowrap;
	}

	#actu_header li#nouvelle_fraiche.actu {
		display: block;
	}
	.citation_ouvre,
	.citation_ferme {
		font-family: Georgia, "Times New Roman", Times, serif;
		font-size: 78px;
		display: block;
	}
	#actu_header .citation_ouvre {
		line-height: 40px;
		position: absolute;
		right: 94%;
	}
	#actu_header .citation_ferme{
		position: absolute;
		right: -25px;
	}
}
@media (min-width: 1024px){
	#actu_header li.actu {
		font-size: 16px;
	}
}	
@media (min-width: 1200px){
	#actu_header li.actu {
		font-size: 18px;
	}
}
/* Annulation des guillemets pour le footer : 
	Comme j'ai du les passé en dur dans le code de toutes les news pour qu'ils s'aligne correctement en fonction du contenu */
#piedpage .citation_ouvre,
#piedpage .citation_ferme {
	display: none;
}


/* messages pour les visiteur */
#messages {
	text-align: center;
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 19px;
	display: block;
	position: absolute;
	top: 30px;
	left: 0;
	right: 0;
	
}
#scene {
	position: relative;
	padding: 90px 3% 45px;
	z-index: 1;
}
	/* Pour visulaiser les bootstrap

#scene {
	border-left: 1px solid red;
	border-right: 1px solid red;
}
#scene:before {
	content: "Ces lignes rouges matérialisent le bord de la page";
	color: red;
	transform: rotate(-90deg);
	transform-origin: 0 0;
	display: block;
	position: absolute;
	top: 45%;
	left: -30px;
	background-color: white;
	padding-right: 10px;
	padding-left: 10px;
}
 */



@media (min-width:996px){
	#scene {
		min-height: 650px;		
		transition: min-height .5s ease-in-out 0s, height .5s ease-in-out 0s;
	}
}

@media (max-width:991px){
	.page #scene .illustrations {
		position: relative;
		top: auto !important;
		right: auto !important;
		left: auto !important;
		bottom: auto !important;
		width: auto;
		height: auto;
		display: block;
		margin: -30px auto -50px;
		z-index: 1 !important;
	}
	.page #scene .illustrations + .illustrations {
		display: none;
	}
	.index #illustrations-container {
		position: relative;
		margin: 0 0 -15px;
		height: 614px;
		overflow-y: visible !important;
		overflow-x: visible !important;
		width: 100%;
	}
	.index #illustrations-container > * {
		margin-top: 40px;
	}

	#gazontondu {
/*		left: 0 !important;
		top: 180px !important;*/
	}
	.index #shakespeare {
		display: none;
	}
	a#micro {
		margin-top: -150px !important;
		margin-bottom: -13px !important;
		width: calc(100% + 30px) !important;
		margin-left: -15px !important;
		background-position-x: -70px !important;
	}
	a#bourse {
		margin-bottom: -73px !important;
		max-width: 100% !important;
		margin-left: -15px !important;
		display: none !important;
	}
	a#telephone_jaune {
		margin-bottom: -63px !important;
		margin-top: -50px !important;
		margin-left: -25px !important;
		width: calc(100% + 40px) !important;
	}
}
/* les illsutrations dans la scene */

.illustrations label {
	display: none;
}

@media (min-width: 992px) {
	body.page_stage #illustrations-container {
		width: 100%;
		height: 100%;
	}
	.index #shakespeare {
		left: auto !important;
		right: 1% !important;
	}
	.index #gazontondu {
		top: auto !important;
		bottom: 170px;
	}
	#enfant {
		top: auto !important;
		left: auto !important;
		right: 20px;
		bottom: 110px;
	}
}
@media (min-width: 1200px) {
	.index #shakespeare {
		left: auto !important;
		right: 10% !important;
	}
}	

/* On retente un sticky qui marche */
.sticky {
	position: sticky;
	width: 100%;
	margin-top: 0;
	height: auto;
}
.page_atelier .sticky {
	height: 970px;
	position: relative;
	width: 100%;
}
@media (min-width: 768px) {
	.page_atelier .sticky {
		width: 1px;
		position: sticky;
		z-index: 3;
		top: 120px;
	}
}

#galerie {
	position: absolute;
	top: 325px;
	left: 10px;
	z-index: 5;
	display: inline-block; 
	
}
@media (max-width: 991px) {
	a#bateau.illustrations {
		display: none !important;
	}	
}

body.galeries #scene.container {
	overflow-x: hidden !important;
	overflow-y: visible !important;
	
	overflow: hidden !important;
	
	width: 100% !important;
	max-width: 100% !important;
	margin: 0;
	transition: height .6s ease-in-out 0s;
}

#projet {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;   
 	position: relative;
	margin-top: 30px;
}
@media (max-width: 991px) {
	body.galerieOpened #projet {
		display: none !important;
	}
}
@media (min-width: 768px) {
	body.galeries #scene.container {
		padding-right: 0%;
		padding-left: 0%;
	}
	#projet {
	  transform: perspective(400px) rotateX(45deg) translateY(-520px) scaleX(1.5) scaleY(1);
	  margin-top: -250px;
	}

}

@media (min-width: 992px) {
	body.galeries #scene.container {
		padding-right: 5%;
		padding-left: 5%;
	}
	#projet {
	  transform: perspective(400px) rotateX(45deg) translateY(-520px) scaleX(1.6) scaleY(1.3);
	  margin-top: -170px;
	  position: absolute;
	}
	
}
.flexDivider {
	width: 100%;
}
.affichesForModal img {
	width: 150px;
	box-shadow: 0 1px 2px black;
}
.affichesForModal div {
	position: relative;
	z-index: 1;
	transition: transform .5s ease-in-out 0s;
	cursor: pointer;
}
.affichesForModal div::before,
.affichesForModal div::after {
	content:"";
	display: block;
	position: absolute;
	background-color: white;
	box-shadow: 0 1px 2px black;
	top: 0; right: 0; bottom: 0; left: 0;
	z-index: -1;
	transform: rotate(-1deg);
	transition: transform .3s ease-in-out 0s;
}
.affichesForModal div::after {
	transform: rotate(-2deg);
	z-index: -2;
}
.affichesForModal div:nth-child(odd) {
	transform: rotate(7deg);
}
.affichesForModal div:nth-child(even) {
	transform: rotate(-5deg);
}
.affichesForModal [data-galerie=''] {
	display: none;
}
@media (min-width: 768px) {
	.affichesForModal [data-galerie=''] {
		visibility: hidden;
		display: block;
	}
}

/* Hover */
.affichesForModal div:hover {
	transform: rotate(0) scale(1.2);
	z-index: 10;

	transition: transform .3s ease-in-out 0s;
}
.affichesForModal div:hover::before {
	transform: rotate(-2deg);
}
.affichesForModal div:hover::after {
	transform: rotate(-4deg);
}

/* Les modals qui présentent les galeries */
.galerieModal {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: flex-end;
	z-index: 1000;
	opacity: 0;
	overflow: visible;
	
	
	transform:  scale(0.5);
	
	transition: transform 0.9s ease-in-out 0s, opacity 0.9s ease-in-out 0s, background 0.9s ease-in-out 0s;

	position: relative;
	background-color: rgba(0, 0, 0, 0);
	padding: 15px;
}

.galerieModal.opened {
	transform:  scale(1);
	opacity: 1;
	transition: transform 0.3s ease-in-out 0s, opacity 0.3s ease-in-out 0s;
	background-color: rgba(0, 0, 0, .8);
	box-shadow: 0 1px 2px rgba(0, 0, 0, 0.48);
}
.galerieModal .close {
	display: block;
	position: absolute;
	z-index: 1000;
	width: 31px;
	height: 31px;
	opacity: 1;
	right: 50px;
	top: 20px;
	font-weight: normal;
	line-height: 33px;
	text-shadow: 0 1px 2px rgba(0, 0, 0, 0.52);
}
.galerieModal h1 {
	text-align: center;
	width: 100%;
	margin-bottom:10px;
	margin-top: 20px;
	position: relative;
}
.galerieModal h1 small,
.galerieModal h1 sub {
	/* texte "photographies" + L'année de la pièce */
	background-color: #f56555;
	color: white;
	font: 21px/23px Georgia, "Times New Roman", Times, serif;

	display: block;
	position: absolute;
	top: -20px;
	bottom: auto; /* A cause de Bootstrap */
	right: 50%;

	box-shadow: 0 1px 3px rgba(0,0,0,0.16), 0 1px 3px rgba(0,0,0,0.23);
	transform: rotate(-5deg);
	padding: 3px 5px;
}

.galerieModal h1 sub {
	/* L'année de la pièce */
	left: 50%;
	right: auto;
	transform: rotate(5deg);
}



@media (min-width: 768px) {
	.galerieModal h1 {
		margin-top: 20px;
	}
}
.galerieModal h1 div {
	line-height: 7px;
}
.galerieModal img {
	max-width: 200px;
	max-height: 200px;
	margin: 1px;
	box-shadow: 0 1px 3px black;
}
.galerieModal > div > img {
	/* L'affiche */
	transform:rotate(-6deg);
	max-width: 220px;
	max-height: 220px;
	margin-bottom: -10px;
}

.galerieModal a img {
	border: 10px solid #FFF;
}
.galerieModal a:hover img {
	border: 10px solid #fedad5;
}
/* Les ombres des textes */
.scene h1, 
.scene h2, 
.scene h4, 
.scene h3, 
.scene p, 
.scene ul {
	text-shadow: 0 1px 2px rgba(0, 0, 0, 0.49);
}
.noShadow {
	text-shadow: none !important;
}
.scene h1 {
	font-size: 60px;	
	margin-top: 0;
}
.scene h2, 
.scene h3 {
	font-size: 40px;
}
/*#plancher h1, 
#plancher h2, 
#plancher h3 {
	color: #ff6150;
	font-weight: 500;
	text-shadow: 0 1px 2px rgba(255, 255, 255, 0.49);
	position: relative;
	letter-spacing: -1px;
}*/
/*#plancher h1::before, 
#plancher h2::before, 
#plancher h3::before {
	content: "";
	/* Souligner les titres *!/
	display: block;
	height: 20px;
	background-color: white;
	position: absolute;
	bottom: 4px;
	left: 0;
	right: 0;
	z-index: -1;
	
	box-shadow: 0 1px 3px rgba(0,0,0,0.16), 0 1px 3px rgba(0,0,0,0.23);
	background: linear-gradient(to bottom, rgba(255, 255, 255, 0.8) 0%, rgba(255, 255, 255, 0.5) 100%), url(/assets/plancher/papier-creme.jpg) white;
	
}*/ 


h1 {
/*	font: 36px Georgia, "Times New Roman", Times, serif;*/
	font-weight: 200;
	margin-bottom: 30px;
	margin-top: 10px;
}
h1 small {
	font-weight: 200;
}
h2 {
/*	font: italic 17px/17px Georgia, "Times New Roman", Times, serif;*/
	margin-top: 20px;
	margin-bottom: 10px;
	font-weight: 200;
}
h1 + h2 {
	margin-top: -8px;
}


div#zone {
	height: 120px;
	width: 390px;
	overflow: hidden;
	position: relative;
	display: block;
}
div#liste_photos_1 {
	height: 120px;
	position: absolute;
	display: block;
}
div#liste_photos_2 {
	height: 120px;
	position: absolute;
	display: none;
}
#galerie a {
	margin: 0;
	padding: 0;
	float: left;
}


/* Page Ateliers */

/* Pas d'illustration de personnages sur mobile */
@media (max-width: 992px) {
	.page #scene a#acteur_2.illustrations {
		display: none;
	}
}

h2.cool,
#plancher h2.cool,
p.cool {
	text-align: center;
	font: 20px/24px Georgia, "Times New Roman", Times, serif;
	position: relative;
	display: block;
	color: white;
	text-shadow: 0 1px 2px rgba(0, 0, 0, 0.49);
	
	transform-origin: 50% 0;
	transition: transform 0.3s ease-in-out 0s;
	padding-top: 0;
	margin: auto;
	height: 150px;
}
	#plancher h1#arg0 {
		height: 70px;
		font-size: 40px;
	}
	#arg1 {
/*		transform: translate(-80px);*/
		height: 62px;
	}
	#arg2 {
		height: 100px;
		width: 100%;
	}
	#arg3 {
		width: 220px;
	}
	#arg4 {
		width: 180px;
		height: 110px;
	}
	#arg5 {
		width: 200px;
	}
	#arg6 {
		width: 250px;
		height: 70px;
	}

@media (min-width: 992px) {
	
		h1.cool,
		#plancher h1.cool,
		h2.cool,
		p.cool {
			position: absolute;
			transform: translate(0px) !important;
			margin: 0 !important;
			height: auto !important;
		}
		p.cool span {
			padding-top: 12px;
		}
		#plancher h1#arg0 {
			margin-top: 80px;
		}
		
		#arg0 {
			top: 0;
			left: 80px;
			width: 350px;
		}
		#arg1 {
			top: 174px;
			left: 250px;
			width: 210px;
		}
		#arg2 {
			top: 85px;
			left: 0;
			width: 480px;
		}
		#arg3 {
			top: 183px;
			left: 0px;
		}
		#arg4 {
			top: 482px;
			left: 340px;
		}
		#arg5 {
			top: 220px;
			left: 210px;
		}
		#arg6 {
			top: 250px;
			left: 319px;
		}
}



/* La liste (UL, LI) est partagée avec les autres pages du même type : Coaching */


#ateliers_lieu {
	position: absolute;
	width: 848px;
	top: 387px;
	left: 45px;
}


.petitgris,
.etiquette,
#atelier_base_line {
	background-color: #f56555;
	display: flex;
	align-items: center;
	justify-content: center;
	font: 19px/23px Georgia, "Times New Roman", Times, serif;
	position: relative;
	
	transform: rotate(0deg);
	transform-origin: 50% 0;
	transition: transform 1s ease-in-out 1s;
	margin-top: 10px;
	box-shadow: 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23);
	padding: 15px;
}
.petitgris {
	font-size: 12px;
	width: 80%;
	margin: auto auto 10px;
	box-shadow: 0 1px 3px rgba(0,0,0,0.16), 0 1px 3px rgba(0,0,0,0.23);
	color: white;
}
form#contact .petitgris {
	text-align: center;
	line-height: 13px;
	padding: 10px;
}
.actu_date.etiquette {
	display: inline-block;
	color: white;
	font-size: 12px;
	padding-right: 5px;
	padding-left: 5px;
	box-shadow: 0 1px 3px rgba(0,0,0,0.16), 0 1px 3px rgba(0,0,0,0.23);	
	
	/* En fait non : */
	display: none;
}
.petitgris,
.etiquette,
#atelier_base_line {
	transform: rotate(-3deg);
}
.etiquette p,
#atelier_base_line p {
	margin-bottom: 0;
}
.petitgris::before,
.etiquette::before,
#atelier_base_line::before {
	content: "";
	display: block;
	background-color: inherit;
	position: absolute;
	width: 20px; height: 20px;
	top: -10px;
	left: calc(50% - 10px);
	border-radius: 50%;
	z-index: -1;
}
h1 .etiquette {
	display: inline-block;
	padding: 1px 10px 2px;
	font-size: 15px;
	float: right;
	
	font-size: 18px;
}
@media (min-width: 992px) {
	
	#specialAnimationSpectacle-V2 .etiquette {
		position: absolute;
		top: 360px;
		left: 137px;
		font-size: 14px;
		padding: 5px 10px 5px 15px;
		z-index: 100;
	}
}

body.page_tarifs #plancher h1 {
	font-size: 40px;
	position: relative;
	margin-bottom: 50px;
}
body.page_tarifs #plancher h1 .etiquette {
	float: none;
	position: absolute;
	left: -15px;
	bottom: -37px;
	
	/* test */
	text-transform: uppercase;
	font-size: 13px;
	letter-spacing: 1px;
	padding-top: 5px;
	font-family: 'Poppins', sans-serif;
	z-index: -1;
}
#plancher h2.etiquette_tarif {
	height: 100px;
	
	flex-wrap: nowrap;
	flex-direction: column;
	justify-content: space-around;
	width: 350px;
/*	margin: auto;*/
	margin-bottom: 30px;
	margin-top: 20px;
	padding-top: 50px;
	padding-bottom: 40px;
	font-size: 29px;
}
#plancher h2.etiquette_tarif small {
	font-size: 15px;
	line-height: 17px;
	margin-top: 0;
}
#plancher h2.etiquette_tarif small:first-of-type {
	margin-top: 10px;
}




#ateliers H2,
#ateliers_lieu H2 {
	margin-top: -10px;
	margin-bottom: -10px;
	padding-top: 20px;
	padding-bottom: 10px;
	margin-left: -60px;
	padding-left: 50px;
}

#ateliers UL,
#coaching UL,
#tarifs UL {
	list-style-type: circle;
	list-style-image: none;
	list-style-position: outside;
	padding: 0;
}
#ateliers UL LI,
#coaching UL LI,
#tarifs UL LI {
	padding-top: 6px;
	list-style-position: inside;
}


/* Page la compagnie */ 


article {
	margin-bottom: 50px;
}
#trois_cv IMG {
	margin-left: 20px;
	margin-bottom: 10px;
	width: 150px;
	
	border: 10px solid #fff;
	box-shadow: 0 1px 2px rgba(0, 0, 0, 0.53);
	
}
#trois_cv HR {
	clear: both;
}



h1 a {
	cursor: pointer;
}

/* Page plans */
div.planGoogle {
	overflow: hidden;
	height: 304px;
	margin-top: 10px;
	margin-bottom: 15px;
}
div.planGoogle iframe {
	margin-top: -46px;
	height: 436px;
}
@media (min-width: 996px) {
	div.planGoogle iframe {
		height: 236px;
	}
	div.planGoogle {
		height: 174px;
	}
}

div#qrcode_gd_studioDTM,
div#qrcode_gd_AGITAKT {
	background-color: #fff;
	width: 390px;
	display: block;
	position: absolute;
	box-shadow: #000 -1px 2px 10px;
	border-radius:10px;
	padding: 10px;
	margin-left: -195px;
	display:none;
	z-index: 1000;
	margin-top: -90px;
	left: 50%;
}
div#qrcode_gd_studioDTM p,
div#qrcode_gd_AGITAKT p {
	padding-left: 50%;
	
}
div#qrcode_gd_studioDTM p#fermer_qrcode_studioDTM,
div#qrcode_gd_AGITAKT p#fermer_qrcode_AGITAKT {
	text-align: center;
	cursor: pointer;
	text-decoration: underline;
	margin-top: 5px;
	padding-left: 0;
}
#plan_un {
	top: 51px;
	left: auto;
	right: 5%;
	width: 430px;
	z-index: 11;
	padding-top: 0;
}

#plan_deux {
	top: 51px;
	left: 5%;
	width: 430px;
	z-index: 10;
	padding-top: 0;
}

#plan_un h1,
#plan_deux h1 {
	margin-bottom: -5px;
}
@media (min-width: 996px) {}
@media (min-width: 768px) {
	.qrcode {
		display: block !important;
	}
}

a.bouton.gauche,
a.bouton.droite {
	display: block;
	margin-top: 5px;
	background-image: url(/images/bouton_fleche.png);
	background-repeat: no-repeat;
	text-decoration: none;
	height: 28px;
	width: 100%;
}

a.bouton span {
	background-image: url(/images/bouton_fleche.png);
	background-repeat: no-repeat;
	height: 28px;
	display: block;
	line-height: 27px;
}

a.bouton.gauche {
	background-position: right top;
	margin-left: -4px;
}

a.bouton.droite {
	background-position: left top;
	margin-left: -16px;
}

a.bouton.gauche span {
	background-position: left bottom;
	padding-left: 30px;
	margin-left: -20px;
	margin-right: 20px;
	padding-right: 0;
}

a.bouton.droite span {
	background-position: right bottom;
	padding-left: 0;
	margin-left: 20px;
	margin-right: -20px;
	padding-right: 30px;
	text-align: center;
}
#specialAnimationSpectacle-V2 .affiches-container {
	display: block;
	position: absolute;
	transition: all 0.3s ease-in-out;
	min-height: 200px;
	background-size: contain;
	background-repeat: no-repeat;
}
@media (max-width:996px){
	
	.affiches-container {
		right: auto !important;
		margin-right: auto !important;
		margin-left: auto !important;
		left: auto !important;
		max-width: 100%;
		margin-top: 0;
	}
	a#vache.illustrations {
		display: none;
	}
}

#hack-affichesContainer {
	position: relative;
	min-height: 650px;
	width: 100%;
	overflow: hidden;
}


@media (min-width: 992px) {
	a#vache.illustrations {
		transform: scale(.65);
		transform-origin: 0 100%;
	}
	
	#hack-affichesContainer {
		display: block;
		padding: 15px;
		
		position: absolute;
		right: 0;
		top: 30px;
		max-width: 970px;
		width: 100%;
		
		/*overflow: visible;*/
	}
}


/*@media (min-width: 768px) {
	.affiches-container {
		margin-left: 150px;
		margin-top: -50px;
		/* Pouf *!/
	}
}
@media (min-width: 992px) {
	.affiches-container {
		margin-left: 150px;
		margin-top: -210px;
	}
	
}
@media (min-width: 1024px) {
	.affiches-container {
		margin-left: 10%;
		margin-top: -170px;
	}
	
}*/
/* Début de la time line */

ul#timeline {
	display: none;
}
/*
ul#timeline {
	position: absolute;
	right: 15px;
	z-index: 50;
	list-style: none;
	padding: 0;
	text-align: center;
}
ul#timeline li:before {
	content: "";
	border-left: 1px solid #c72f7f;
	position: absolute;
	display: block;
	height: 50px;
	left: 50%;
	top: 20px;
	z-index: -1;
}
ul#timeline li {
	display: block;
	width: 50px;
	height: 50px;
	line-height: 50px;
	border-radius: 50px;
	position: relative;
	color: white;
	margin-top: 18px;
	opacity: 0.6;
	cursor: pointer;
	font-size: 11px;
	transition: transform .3s ease-in-out 0s;
}
ul#timeline li:hover{
	opacity: 1;
}
.annee2019 ul#timeline li.li-2019,
.annee2018 ul#timeline li.li-2018,
.annee2017 ul#timeline li.li-2017,
.annee2016 ul#timeline li.li-2016,
.annee2015 ul#timeline li.li-2015,
.annee2014 ul#timeline li.li-2014,
.annee2013 ul#timeline li.li-2013,
.anneeavant ul#timeline li.li-avant,
.annee2011 ul#timeline li.li-2011,
.annee2009 ul#timeline li.li-2009 {
	transform: scale(1.2);
}
*/
/* Fin de la time-line */


/* La vue en 2024 */

.annee2024 #affiches-2024 {
	top: 160px;
	left: 80px;
	z-index: 12;
    transform: skewY(5deg) scale(1);
	width: 650px;
	
	display: block;
	opacity: 1;
}
.annee2024 #affiches-2023 {
	top: 80px;
	left: 270px;
	z-index: 12;
    transform: skewY(-5deg) scale(.7);
	width: 650px;
	
	display: block;
	opacity: 1;
}

.annee2024 #affiches-2022 {
/*	top: 170px;
	left: 13px;
	z-index: 12;
    transform: skewY(-5deg) scale(.75);
	width: 650px;*/
}


.annee2024 #affiches-2022 {
	top: 20px;
	left: 263px;
	z-index: 12;
    transform: skewY(5deg) scale(.5);
	width: 980px;
}


.annee2024 #affiches-2020 {
    transform: skewY(-7deg) scale(.35);

	top: -50px;
	left: 250px;
	z-index: 11;
}

.annee2024 #affiches-2019 {
    transform: skewY(5deg) scale(.2);

	height: 200px;
	width: 300px;
	
	top: 0px;
	left: 650px;
	z-index: 11;
	
	opacity: 0;
}

.annee2024 #affiches-2018 {
	height: 230px;
	width: 170px;

	top: -11px;
	left: 370px;
	z-index: 11;
	opacity: 0;
}

.annee2024 #affiches-2017 {
	height: 230px;
	width: 170px;

	top: -11px;
	left: 370px;
	z-index: 11;
	opacity: 0;
}

.annee2024 #affiches-2016 {
	width: 180px;
	
	top: -20px;
	left: 531px;
	z-index: 11;
	opacity: 0;
}


















/* La vue en 2023 */

.annee2023 #affiches-2024 {
	top: 560px;
	left: 0px;
	z-index: 12;
    transform: skewY(5deg) scale(1.2);
	width: 650px;
	
	display: block;
	opacity: 1;
}

.annee2023 #affiches-2023 {
	top: 180px;
	left: 120px;
	z-index: 12;
    transform: skewY(-5deg) scale(.8);
	width: 650px;
	
	display: block;
	opacity: 1;
}

.annee2023 #affiches-2022 {
/*	top: 170px;
	left: 13px;
	z-index: 12;
    transform: skewY(-5deg) scale(.75);
	width: 650px;*/
}


.annee2023 #affiches-2022 {
	top: 110px;
	left: 163px;
	z-index: 12;
    transform: skewY(5deg) scale(.6);
	width: 980px;
}


.annee2023 #affiches-2020 {
    transform: skewY(-6deg) scale(.4);

	top: 20px;
	left: 83px;
	z-index: 11;
}

.annee2023 #affiches-2019 {
	height: 390px;
	width: 400px;
	
	top: 20px;
	left: 510px;
	z-index: 11;
}

.annee2023 #affiches-2018 {
	height: 230px;
	width: 170px;

	top: -11px;
	left: 370px;
	z-index: 11;
	opacity: 0;
}

.annee2023 #affiches-2017 {
	height: 230px;
	width: 170px;

	top: -11px;
	left: 370px;
	z-index: 11;
	opacity: 0;
}

.annee2023 #affiches-2016 {
	width: 180px;
	
	top: -20px;
	left: 531px;
	z-index: 11;
	opacity: 0;
}









/* La vue en 2022 */

.annee2022 #affiches-2024 {
	top: 560px;
	left: 0px;
	z-index: 12;
    transform: skewY(5deg) scale(1.2);
	width: 650px;
	
	display: block;
	opacity: 0;
}

.annee2022 #affiches-2023 {
	display: block;
	opacity: 1;
	top: 490px;
	left: -50px;
	z-index: 12;
    transform: skewY(-5deg) scale(.9);
	width: 650px;
}

.annee2022 #affiches-2022 {
	top: 170px;
	left: 13px;
	z-index: 12;
    transform: skewY(-5deg) scale(.75);
	width: 650px;
}


.annee2022 #affiches-2020 {
	top: 110px;
	left: 163px;
	z-index: 12;
    transform: skewY(5deg) scale(.6);
	width: 980px;
}


.annee2022 #affiches-2019 {
    transform: skewY(-6deg) scale(.4);

	top: 20px;
	left: 83px;
	z-index: 11;
}

.annee2022 #affiches-2018 {
	height: 390px;
	width: 400px;
	
	top: 20px;
	left: 510px;
	z-index: 11;
}

.annee2022 #affiches-2017 {
	height: 230px;
	width: 170px;

	top: -11px;
	left: 370px;
	z-index: 11;
	opacity: 0;
}

.annee2022 #affiches-2016 {
	width: 180px;
	
	top: -20px;
	left: 531px;
	z-index: 11;
	opacity: 0;
}







/* La vue en 2020 */

.annee2020 #affiches-2024 {
	display: none;
}


.annee2020 #affiches-2023 {
	display: none;
}

.annee2020 #affiches-2022 {
/*	display: none !important;*/
	top: 490px;
	left: -50px;
	z-index: 12;
    transform: skewY(-5deg) scale(.9);
	width: 650px;
}
.annee2020 #affiches-2020 {
	top: 200px;
	left: 113px;
	z-index: 12;
    transform: skewY(5deg) scale(.7);
	width: 980px;
}


.annee2020 #affiches-2019 {
    transform: skewY(-6deg) scale(.5);

	top: 80px;
	left: 113px;
	z-index: 11;
}

.annee2020 #affiches-2018 {
	height: 390px;
	width: 460px;
	
	top: 40px;
	left: 510px;
	z-index: 11;
}

.annee2020 #affiches-2017 {
	height: 230px;
	width: 200px;

	top: 9px;
	left: 370px;
	z-index: 11;
}

.annee2020 #affiches-2016 {
	width: 210px;
	
	top: 0;
	left: 561px;
	z-index: 11;
}

/* Plus dans le champs :  */
.annee2020 #affiches-2015 {
	height: 270px;
	width: 28%;
	
	top: 30px;
	left: 306px;
	z-index: 1;
	opacity: 0;
}
.annee2020 #affiches-2014 {
	width: 50%;
	
	top: 90px;
	left: 473px;
	z-index: 10;
	opacity: 0;
}
.annee2020 #affiches-2012-2013 {
	height: 170px;
	width: 30%;
	
	top: -20px;
	left: 240px;
	z-index: 3;
	opacity: 0;
}
.annee2020 #affiches-2010-2012 {
	width: 20%;
	
	top: -20px;
	left: 520px;
	z-index: 8;
	opacity: 0;
}
.annee2020 #affiches-2006-2009 {
	width: 10%;
	
	top: 3px;
	left: 405px;
	z-index: 7;
	opacity: 0;
}



/* La vue en 2019 */
.annee2019 #affiches-2024 {
	display: none;
}

.annee2019 ul#timeline li.li-2019 {
	opacity: 1;
}
.annee2019 #affiches-2023 {
	display: none;
}

.annee2019 #affiches-2020 {
/*	display: none !important;*/
	top: 490px;
	left: 0;
	z-index: 12;
    transform: skewY(5deg) scale(0.8);
	width: 980px;
}

.annee2019 #affiches-2019 {
	top: 190px;
	left: 113px;
	z-index: 11;
}

.annee2019 #affiches-2018 {
	height: 390px;
	width: 670px;
	
	top: 150px;
	left: 410px;
	z-index: 11;
}

.annee2019 #affiches-2017 {
	height: 230px;
	width: 330px;

	top: 39px;
	left: 380px;
	z-index: 11;
}

.annee2019 #affiches-2016 {
	width: 290px;
	
	top: 0;
	left: 640px;
	z-index: 11;
}
.annee2019 #affiches-2015 {
	height: 270px;
	width: 28%;
	
	top: 30px;
	left: 306px;
	z-index: 1;
	opacity: 0;
}
.annee2019 #affiches-2014 {
	width: 50%;
	
	top: 90px;
	left: 473px;
	z-index: 10;
	opacity: 0;
}
.annee2019 #affiches-2012-2013 {
	height: 170px;
	width: 30%;
	
	top: -20px;
	left: 240px;
	z-index: 3;
	opacity: 0;
}
.annee2019 #affiches-2010-2012 {
	width: 20%;
	
	top: -20px;
	left: 520px;
	z-index: 8;
	opacity: 0;
}
.annee2019 #affiches-2006-2009 {
	width: 10%;
	
	top: 3px;
	left: 405px;
	z-index: 7;
	opacity: 0;
}

/* La vue en 2018 */
.annee2018 #affiches-2024 {
	display: none;
}

.annee2018 ul#timeline li.li-2018 {
	opacity: 1;
}

.annee2018 #affiches-2023 {
	display: none;
}
#affiches-2020 {
/*	display: none !important;*/
	top: 630px;
	left: 0;
	z-index: 12;
    transform: skewY(5deg) scale(1);
	width: 980px;
}
.annee2018 #affiches-2019 {
	
	transform: scale(.9);
	
	top: 480px;
	left: 0;
	z-index: 11;
}
.annee2018 #affiches-2018 {
	height: 390px;
	width: 820px;
	
	top: 230px;
	left: 150px;
	z-index: 11;
}

.annee2018 #affiches-2017 {
	height: 230px;
	width: 400px;
	
	top: 99px;
	left: 220px;
	z-index: 11;
}

.annee2018 #affiches-2016 {
	width: 340px;
	
	top: 20px;
	left: 580px;
	z-index: 11;
}
.annee2018 #affiches-2015 {
	height: 270px;
	width: 28%;
	
	top: 30px;
	left: 306px;
	z-index: 1;
	opacity: 0;
}
.annee2018 #affiches-2014 {
	width: 50%;
	
	top: 90px;
	left: 473px;
	z-index: 10;
	opacity: 0;
}
.annee2018 #affiches-2012-2013 {
	height: 170px;
	width: 30%;
	
	top: -20px;
	left: 240px;
	z-index: 3;
	opacity: 0;
}
.annee2018 #affiches-2010-2012 {
	width: 20%;
	
	top: -20px;
	left: 520px;
	z-index: 8;
	opacity: 0;
}
.annee2018 #affiches-2006-2009 {
	width: 10%;
	
	top: 3px;
	left: 405px;
	z-index: 7;
	opacity: 0;
}



/* La vue en 2017 */
.annee2017 #affiches-2024 {
	display: none;
}
.annee2017 #affiches-2023 {
	display: none;
}

.annee2017 ul#timeline li.li-2017 {
	opacity: 1;
}
.annee2017 #affiches-2019 {
	transform: scale(1);
	
	top: 660px;
	left: 0;
	z-index: 11;
}

.annee2017 #affiches-2018 {
	height: 390px;
	width: 900px;
	
	top: 530px;
	left: 240px;
	z-index: 11;
}
.annee2017 #affiches-2017 {
	width: 820px;
	height: 390px;
	
	top: 200px;
	left: 220px;
	z-index: 11;
}
.annee2017 #affiches-2016 {
	height: 190px;
	width: 530px;
	
	top: 110px;
	left: 470px;
	z-index: 11;
}
.annee2017 #affiches-2015 {
	width: 21%;
	
	top: 40px;
	left: 350px;
	z-index: 1;
}
.annee2017 #affiches-2014 {
	width: 30%;
	
	top: 0;
	left: 563px;
	z-index: 10;
	opacity: 0;
}
.annee2017 #affiches-2012-2013 {
	height: 170px;
	width: 30%;
	
	top: -20px;
	left: 240px;
	z-index: 3;
	opacity: 0;
}
.annee2017 #affiches-2010-2012 {
	width: 20%;
	
	top: -20px;
	left: 520px;
	z-index: 8;
	opacity: 0;
}
.annee2017 #affiches-2006-2009 {
	width: 10%;
	
	top: 3px;
	left: 405px;
	z-index: 7;
	opacity: 0;
}


/* La vue en 2016 */
.annee2016 #affiches-2024 {
	display: none;
}
.annee2016 #affiches-2023 {
	display: none;
}

.annee2016 ul#timeline li.li-2016 {
	opacity: 1;
}
.annee2016 #affiches-2019 {
	transform: scale(1);
	
	top: 660px;
	left: 0;
	z-index: 11;
}

.annee2016 #affiches-2018 {
	width: 900px;
	height: 390px;
	
	top: 530px;
	left: 240px;
	z-index: 11;
	opacity: 0;
}
.annee2016 #affiches-2017 {
	width: 860px;
	height: 430px;
	
	top: 480px;
	left: -100px;
	z-index: 11;
}

.annee2016 #affiches-2016 {
	width: 820px;
	height: 390px;
	
	top: 220px;
	left: 220px;
	z-index: 11;
}
.annee2016 #affiches-2015 {
	height: 270px;
	width: 40%;
	
	top: 60px;
	left: 296px;
}
.annee2016 #affiches-2014 {
	width: 20%;
	
	top: 19px;
	left: 493px;
	z-index: 10;
}
.annee2016 #affiches-2012-2013 {
	height: 170px;
	width: 30%;
	
	top: -20px;
	left: 240px;
	z-index: 3;
	opacity: 0;
}
.annee2016 #affiches-2010-2012 {
	width: 17%;
	
	top: -20px;
	left: 520px;
	z-index: 8;
	opacity: 0;
}
.annee2016 #affiches-2006-2009 {
	width: 10%;
	
	top: 3px;
	left: 405px;
	z-index: 7;
	opacity: 0;
}

/* La vue en 2015 */
.annee2015 #affiches-2024 {
	display: none;
}
.annee2015 #affiches-2023 {
	display: none;
}

.annee2015 ul#timeline li.li-2015 {
	opacity: 1;
}
.annee2015 #affiches-2019 {
	transform: scale(1);
	
	top: 660px;
	left: 0;
	z-index: 11;
}

.annee2015 #affiches-2018 {
	width: 900px;
	height: 390px;
	
	top: 530px;
	left: 240px;
	z-index: 11;
	opacity: 0;
}
.annee2015 #affiches-2017 {
	height: 430px;
	width: 860px;
	
	top: 480px;
	left: -100px;
	z-index: 11;
	opacity: 0;
}

.annee2015 #affiches-2016 {
	height: 390px;
	width: 810px;
	
	top: 480px;
	left: 340px;
	z-index: 11;
}
.annee2015 #affiches-2015 {
	width: 80%;
	height: 410px;
	
	top: 150px;
	left: -14px;
	z-index: 10;
}
.annee2015 #affiches-2014 {
	width: 60%;
	height: 220px;
	
	top: 100px;
	left: 473px;
	z-index: 10;
}
.annee2015 #affiches-2012-2013 {
	width: 40%;
	height: 170px;
	
	top: -10px;
	left: 228px;
	z-index: 3;
}
.annee2015 #affiches-2010-2012 {
	width: 25%;
	
	top: -19px;
	left: 530px;
	z-index: 8;
	opacity: 0;
}
.annee2015 #affiches-2006-2009 {
	width: 12%;
	
	top: 4px;
	left: 407px;
	z-index: 1;
	opacity: 0;
}

/* La vue en 2014 */
.annee2014 #affiches-2024 {
	display: none;
}
.annee2014 #affiches-2023 {
	display: none;
}

.annee2014 ul#timeline li.li-2014 {
	opacity: 1;
}
.annee2014 #affiches-2019 {
	transform: scale(1);
	
	top: 660px;
	left: 0;
	z-index: 11;
}

.annee2014 #affiches-2018 {
	width: 900px;
	height: 390px;
	
	top: 530px;
	left: 240px;
	z-index: 11;
	
	opacity: 0;
	display: none;
}
.annee2014 #affiches-2017 {
	width: 860px;
	height: 430px;
	
	top: 530px;
	left: -100px;
	z-index: 11;
	
	opacity: 0;
	display: none;
}
.annee2014 #affiches-2016 {
	width: 830px;
	height: 390px;
	
	top: 540px;
	left: 390px;
	z-index: 11;
	
	opacity: 0;
}
.annee2014 #affiches-2015 {
	width: 90%;
	height: 430px;
	
	top: 440px;
	left: -44px;
	z-index: 10;
}
.annee2014 #affiches-2014 {
	height: 360px;
	width: 110%;
	
	top: 180px;
	left: 113px;
	z-index: 10;
}
.annee2014 #affiches-2012-2013 {
	width: 50%;
	height: 190px;
	
	top: 0;
	left: 238px;
	z-index: 3;
}
.annee2014 #affiches-2010-2012 {
	width: 27%;
	
	top: -2px;
	left: 540px;
	z-index: 8;
}
.annee2014 #affiches-2006-2009 {
	width: 14%;
	
	top: 4px;
	left: 387px;
	z-index: 1;
	
	opacity: 0;
}

/* La vue en 2013 */
.annee2013 #affiches-2024 {
	display: none;
}
.annee2013 #affiches-2023 {
	display: none;
}

.annee2013 ul#timeline li.li-2013 {
	opacity: 1;
}
.annee2013 #affiches-2019 {
	transform: scale(1);
	
	top: 660px;
	left: 0;
	z-index: 11;
}

.annee2013 #affiches-2016 {
	width: 870px;
	height: 400px;
	
	top: 560px;
	left: 390px;
	z-index: 11;
	
	opacity: 0;
	display: none;
}
.annee2013 #affiches-2015 {
	width: 100%;
	height: 450px;
	
	top: 470px;
	left: -34px;
	z-index: 10;
	
	opacity: 0;
	display: none;
}
.annee2013 #affiches-2014 {
	width: 130%;
	height: 360px;
	
	top: 481px;
	left: 303px;
	z-index: 10;
}
.annee2013 #affiches-2012-2013 {
	width: 120%;
	height: 620px;
	
	top: -30px;
	left: 28px;
	z-index: 3;
}
.annee2013 #affiches-2010-2012 {
	width: 57%;
	height: 240px;
	
	top: 8px;
	left: 540px;
	z-index: 1;
}
.annee2013 #affiches-2006-2009 {
	width: 27%;
	
	top: 34px;
	left: 327px;
	z-index: 1;
}


/* La vue pour les archives (...)  */
.anneeavant ul#timeline li.li-avant {
	opacity: 1;
}
.anneeavant #affiches-2024 {
	display: none;
}
.anneeavant #affiches-2023 {
	display: none;
}

.anneeavant #affiches-2019 {
	transform: scale(1);
	
	top: 660px;
	left: 0;
	z-index: 11;
}

.anneeavant #affiches-2016 {
	width: 870px;
	height: 400px;
	
	top: 560px;
	left: 390px;
	z-index: 11;
	
	opacity: 0;
	display: none;
}
.anneeavant #affiches-2015 {
	width: 100%;
	height: 450px;
	
	top: 470px;
	left: -34px;
	z-index: 10;
	
	opacity: 0;
	display: none;
}
.anneeavant #affiches-2014 {
	height: 360px;
	width: 130%;
	
	top: 481px;
	left: 303px;
	z-index: 10;
}
.anneeavant #affiches-2012-2013 {
	width: 120%;
	height: 620px;
	
	top: -10px;
	left: -32px;
	z-index: 3;
}
.anneeavant #affiches-2010-2012 {
	width: 65%;
	height: 260px;
	
	top: 8px;
	left: 370px;
	z-index: 1;
}
.anneeavant #affiches-2006-2009 {
	width: 37%;
	
	top: -6px;
	left: 517px;
	z-index: 1;
}

/* La vue en 2011 */
.annee2011 ul#timeline li.li-2011 {
	opacity: 1;
	background-color: white;
}
.annee2011 #affiches-2016 {
	width: 870px;
	top: 560px;
	left: 390px;
	z-index: 11;
	height: 400px;
	opacity: 0;
}
.annee2011 #affiches-2015 {
	width: 100%;
	top: 470px;
	left: -34px;
	z-index: 10;
	height: 450px;
	opacity: 0;
}
.annee2011 #affiches-2014 {
	width: 130%;
	top: 481px;
	left: 303px;
	z-index: 10;
	height: 360px;
	opacity: 0;
}
.annee2011 #affiches-2012-2013 {
	width: 120%;
	top: 290px;
	left: 168px;
	z-index: 3;
	height: 620px;
}
.annee2011 #affiches-2010-2012 {
	width: 128%;
	top: 8px;
	left: 270px;
	z-index: 1;
	height: 520px;
}
.annee2011 #affiches-2006-2009 {
	width: 47%;
	top: 34px;
	left: 347px;
	z-index: 1;
}


/* La vue en 2009 */
.annee2009 ul#timeline li.li-2009 {
	opacity: 1;
	background-color: white;
}
.annee2009 #affiches-2016 {
	width: 870px;
	top: 560px;
	left: 390px;
	z-index: 11;
	height: 400px;
	opacity: 0;
}
.annee2009 #affiches-2015 {
	width: 100%;
	top: 470px;
	left: -34px;
	z-index: 10;
	height: 450px;
	opacity: 0;
}
.annee2009 #affiches-2014 {
	width: 130%;
	top: 481px;
	left: 303px;
	z-index: 10;
	height: 360px;
	opacity: 0;
}
.annee2009 #affiches-2012-2013 {
	width: 120%;
	top: 290px;
	left: 168px;
	z-index: 3;
	height: 620px;
	opacity: 0;
}
.annee2009 #affiches-2010-2012 {
	width: 128%;
	top: 308px;
	left: -80px;
	z-index: 1;
	height: 520px;
}
.annee2009 #affiches-2006-2009 {
	width: 127%;
	top: 74px;
	left: 207px;
	z-index: 6;
	height: 390px;
}
/*  To do
 *
 *
 * 
 * à continuer de factoriser / mutualiser :  */
 
/* Toutes les affiches hors champs suppérieures à la date en cours : elles ont disparues devant, en bas… */
.anneeavant #affiches-2022,
.annee2009 #affiches-2022,
.annee2011 #affiches-2022,
.annee2013 #affiches-2022,
.annee2014 #affiches-2022,
.annee2015 #affiches-2022,
.annee2016 #affiches-2022,
.annee2017 #affiches-2022,
.annee2018 #affiches-2022,
.annee2019 #affiches-2022 {
	top: 570px;
	left: -50px;
	z-index: 12;
    transform: skewY(-5deg) scale(1);
	width: 650px;
	
	opacity: 0;
}
/* Toutes les affiches hors champs inférieures à la date en cours : elles sont disparue au fond, en haut */


/* Fin des vues par années  */

area, area:hover{
	border: 1px solid pink;
	outline: 5px pink;
	background-color: red;
}
#choix_reservations {
	width: 893px;
	height: 442px;
	display: block;
	position: absolute;
	left: 40px;
	background: url(/images/reservation.choix.png) 0 0px no-repeat;
	top: 47px;
}
#affiches_gauche a,
#affiches_droite a {
	display: block;
	position: absolute;
	border: none;
	border-radius:5px;
	-moz-border-radius:5px;
	
	line-height: 26px;
	height: 28px;
	width: 139px; 
	text-align:center; 
	color:#000;
}
#choix_reservations a {
	display: block;
	position: absolute;
	border: none;
	
	text-align:center; 
	color:#000;
}
#choix_reservations a span {
	background: url(/images/bouton_fleche.png) right -300px no-repeat;
	position: relative;
	display: block;
	height: 26px;
	line-height: 26px;
	width: 140px;
	border-radius: 30px;
	margin: auto;
	opacity: 0;
}
#choix_reservations a:hover span {
	background: url(/images/bouton_fleche.png) right -40px no-repeat;
	-moz-box-shadow: -2px 0 1px #abb8c2;
	box-shadow: -2px 0 1px #abb8c2;
	opacity: 1;
}


a#bouton_reservation1 {
	left: 26px;
	top: 40px;
	right: 592px;
	bottom: 20px;
	padding-top: 130px;
}

a#bouton_reservation2 {
	left: 318px; top: 20px;
	right: 309px;
	bottom: 91px;
	padding-top: 166px;
}

a#bouton_reservation3 {
	left: 594px;
	top: 17px;
	right: 4px;
	bottom: 69px;
	padding-top: 130px;
}


#affiches_gauche a:hover,
#affiches_droite a:hover {
	border: 2px dashed #f62792;
}

#affiche_temporaire {
	display: block;
	position: absolute;
	z-index: 6;
	top: 160px;
	right: 75px;
}

#affiche_temporaire IMG {
	width: 380px;
}
a#zoom_confusion {
	height: 220px; 
	left: 760px; 
	top: 180px; 
	width: 170px;
	display: block;
	position: absolute;
}
a#zoom_smoking {
	height: 50px;
	left: 334px; 
	top: 417px; 
	width: 85px;
	display: block;
	position: absolute;
}
a#zoom_mariezvous {
	height: 204px;
	left: 579px;
	top: -43px;
	width: 172px;
	display: none;
	position: absolute;
}
a#zoom_hommes {
	height: 200px;
	left: 498px;
	top: 75px;
	width: 107px;
	display: block;
	position: absolute;
}
a#zoom_fiesta {
	height: 168px;
	left: 405px;
	top: 142px;
	width: 90px;
	display: block;
	position: absolute;
}
a#zoom_gare {
	left: 625px;
	top: 132px;
	width: 118px;
	height: 208px;
	display: block;
	position: absolute;
}

a#zoom_ravissement {
	left: 297px; top: 196px; width: 105px; height: 217px;
	display: block;
	position: absolute;
}

a#zoom_boulon {
	left: 157px; top: 256px; width: 130px; height: 217px;
	display: block;
	position: absolute;
}

a#zoom_tempsdifficiles {
	left: 1px; top: 281px; width: 150px; height: 217px;
	display: block;
	position: absolute;
}
img#suicide,
img#dieu,
img#milieu,
img#droite,
img#gauche {
	display: block;
	position: absolute;
	top: 50px;
	left: -80px;
	width: 640px;
}

img#gauche {
	
}

img#droite {
	left: 417px;
	top: -20px;
}

img#milieu {
	left: 719px;
	top: 325px;
	width: 250px;
}

img#dieu {
	left: 355px;
	top: 284px;
	width: 270px;
}

img#suicide {
	left: 530px;
	top: 304px;
	width: 280px;
}
p.infos {
	border-left: 3px solid #ef1d9d;
	padding-left: 5px;
}	
/* Page coaching */



#tarifs {
	width: 530px;
	top: -2px;
	left: auto;
	right: 0;
}

#calendrier-paiement {
	right: 0;
	left: 0;
	top: 100%;
	margin-top: 1px;
}
#ateliers_lieu_dans_tarifs {
	width: 380px;
	top: 68px;
	left: 150px;
 }
.box,
.box-like {
	position: relative;
	margin-bottom: 30px;
}
@media (max-width: 991px) {
	
	body#liste-produit .row {
		/* Trop bizarre !!! */
		margin-left: 0;
		margin-right: 0;
	}
	.fiche {
		max-width: 80%;
		margin: auto;
	}
}
.produit {
	background-color: white;
	box-shadow: 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23);
	padding: 15px;
}
.produit * {
	text-shadow: none;
}

@media (min-width:996px){
	.box {
/*		position: absolute;*/
		display: block;
		margin-bottom: 0;
		padding-bottom: 0;
	}
	
}
@media (max-width:996px){
	.box {
		width: 95% !important;
		margin-right: auto;
		margin-left: auto;
		top: auto !important;
		right: auto!important;
		bottom: auto!important;
		left: auto!important;
		margin-top: 15px;
	}
}

/* Les balises UL et LI de la page Coaching sont définies dans la partie CSS de Ateliers */


p.date {
	text-align: center;
	font-weight: bold;
	font-size: 14px;
	margin-top: 20px;
	margin-bottom: 20px;
	line-height: 18px;
}
p.date small {
	display: block;
	margin-bottom: -10px;
}


.lettrine {
/*	display: inline-block;
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 59px;
	line-height: 30px;
	font-weight: normal;
	margin-right: -2px;
	margin-left: -12px;*/
}
h2 .avecLettrine::first-letter,
.avecLettrine::first-letter {
/*	font-size: 200%;*/
}
#numero,
#numero_resa,
#mail,
#stages_lieu p,
#titre_photo {
	text-align: left;
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 19px;
	display: block;
	z-index: 40;
}
#stages_lieu {
	text-align: center;
	line-height: 20px;
	text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.47);
	margin-bottom: 15px;
	background-color: rgb(255, 97, 80);
}
#mail a { text-decoration: none;	 }
#mail a:hover { text-decoration: underline;	 }
#numero {
	text-align: center;
	margin-bottom: 15px;
	margin-top: 20px;
	font-size: 50px;
	color: white !important;
	text-decoration: none;
}
#numero a {
	color: white !important;
	text-decoration: none;
}

@media (min-width:996px) {
	#numero,
	#numero_resa,
	#mail,
	#titre_photo {
		position: absolute;
		width: 250px;
		top: 120px;
		left: 800px;
		padding-top: 140px;
	}
	#stages_lieu {
		text-align: left;
	}
	#numero {
		top: 100px;
		left: 60px;
		text-align: right;
		width: 350px;
		margin-bottom: 0;
	}	
	#numero_resa {
		top: 20px;
		left: 100px;
		text-align: right;
	}
	#mail {
		top: 20px;
		left: 300px;
	}

}






	div.legende {
		font-size: 11px;
		line-height: 40px;
	}


/* Actualité dans le pied de page */
.news {
	list-style-type: none;
	margin:0;
	padding: 0;
	padding-left: 0;
	text-align: left;
}


.actu {
	padding-bottom: 20px;
}




/* partenaires en bas de page */

a.partenaire,
.lien_format_html {
	display: block;
	padding-bottom: 40px;
}
@media (min-width: 992px) {
	a.partenaire,
	.lien_format_html {
		padding-bottom: 30px;
	}
}

/* formulaire */

#contact_form {
	position: relative;
	background-color: rgba(255, 255, 255, 0.9);
	color: black;
	z-index: 2;
	
  transition: all 0.3s cubic-bezier(.25,.8,.25,1);
 
  box-shadow: 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23);
  margin-top: 50px;
	margin-bottom: 20px;
}
#contact_form h1 {
	font-size: 40px;
}

#contact_form h1,
#contact_form h2,
#contact_form * {
	text-shadow: none;
}

#cours_gratuit_choisi,
#cours_lieu_choisi {
	display: none;}

#cours_gratuit_form {
	box-shadow: 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23);
	background: linear-gradient(to bottom, rgba(255, 255, 255, 0.8) 0%, rgba(255, 255, 255, 0.5) 100%), url(/assets/plancher/papier-creme.jpg) white;
	color: #000;
	padding: 20px;
	text-shadow: none;
	margin-bottom: 60px;
}	
#cours_gratuit_form * {
	text-shadow: none;
}
#cours_gratuit_form p.petitgris {
	margin-top: -50px;
	margin-bottom: 20px;
	flex-wrap: wrap;
	min-height: 76px;
}	
/* Mise en form edu titre récupéré par JS */
#cours_gratuit_form p small {
	font-size: inherit;
	padding-right: 4px;
	font-weight: bold;
}
#cours_gratuit_choisi h3.desccourt,
#cours_gratuit_choisi a.lienProduit {
	display: none !important;
}	
@media (min-width: 992px) {
	#cours_gratuit_form {
		width: 550px;
		top: 80px;
		left: 50%;
		right: auto;
		z-index: 20;
		margin-left: -70px;
	}	
	
	#cours_gratuit_choisi,
	#cours_lieu_choisi {
		display: block;
		width: 310px;
		transform: scale(0.6) rotate(-5deg);
		right: 50%;
		left: auto;
		top: 50px;
		position: absolute;
		z-index: 19;
		transition: transform 0.3s ease-in-out 0s;
	}
	#cours_gratuit_choisi:hover {
		transform: scale(0.8) rotate(1deg);
		z-index: 22;
	}
	#cours_lieu_choisi:hover {
		transform: scale(1) rotate(0deg) translateY(-100px);
		z-index: 22;
	}
	#cours_lieu_choisi {
		transform: scale(0.6) rotate(5deg);
		right: 77%;
		top: 117px;
	}
}

#resa_form {
	width: 420px;
	top: 90px;
	left: 100px;
	z-index: 7;
}
#complet {
	width: 527px;
	top: 160px;
	left: 10px;
	z-index: 8;
	text-align: center;
}
#complet h2 {
	margin-top: 10px;
	margin-right: auto;
	text-transform: uppercase;
	transform: rotate(-35deg);
	padding: 10px;
	width: 200px;
	margin-left: auto;
	-moz-box-shadow: 0 0 4px black;
	box-shadow: 0 0 4px black;
}


#resa_form p,
#resa_form table.radio_group {
	line-height: 21px;
}
label,
input, textarea {
	width: 100%;
}
input, textarea {
	font-size: 16px;
	padding: 11px 10px 8px;
}
select {
	margin-top: 6px;
	margin-left: 4px;
}
.admin_form input,
input.rose,
input[type="submit"],
input#modifier_intro,
input#annuler_identification {
	color: white;
	border: none;
	border-radius: 3px;
	cursor: pointer;
}

.form_5050 label {
	width: 40%;
}
.form_5050 input {
	width: 55%;	
}
.form_miniForm label {
	width: auto;
	margin-top: 6px;
}
.form_miniForm input {
	float: right !important;
	margin-left: 0 !important;
	width: auto !important;
}

input#annuler_identification {
	background-color: gray;
	margin-right: 20px;
	margin-left: 0;
}

input[type="submit"]:hover {
	text-decoration: underline;
}

@media (min-width: 768px) {
	
	
	label {
		width: 48%;
		float: left;
		clear: left;
		text-align: right;
		padding-right: 5px;
		padding-top: 7px;
		line-height: 19px;
		margin-bottom: 0;
		padding-left: 5px;
	}
	input, textarea, select {
		float: left;
		width: 50%;
	}
	input[type="checkbox"] {
		width: auto;
		margin-top: 10px;
		margin-right: 3px;
	}
	input[type="checkbox"] + label,
	form > p.forDates label {
		text-align: left;
		width: auto;
		float: left;
		white-space: nowrap;
	}
	
	#cours_gratuit_form input[type="submit"] {
		float: none;
		margin: auto;
	}
}


input[type="text"],
input[type="password"] {
	border-style: none;
	border-bottom: 1px dotted #000;
	background-color: transparent;
	font: italic 15px Georgia, "Times New Roman", Times, serif;
}

textarea {
	height: 150px;
	background-color: transparent;
	border: none;
	border-radius: 0 !important;
	border-left: 1px dotted #000;
	font: italic 15px/23px Georgia, "Times New Roman", Times, serif;
}
#contact_erreur,
#contact_ok {
	background-color: #88bb8c;
	background-image: none;
}

#contact_erreur *,
#contact_ok * {
	color: white;
	text-shadow: 0 1px 3px black;
}
#contact_ok i,
#contact_erreur i {
	display: block;
	font-size: 40px;
}

@media (min-width: 996px) {
	#contact_erreur {
		display:block;
		left: 189px;
		position:absolute;
		top: 324px;
		width: 300px;
		z-index: 100;
	}
	#contact_ok {
		left:55%;
		position:absolute;
		top: 230px;
		margin-left: -70px;
		padding-left: 20px;
	}	
}

#reservation_erreur {
	display:block;
	left: 580px;
	position:absolute;
	top: 120px;
	width: 370px;
	z-index:10;
}
#reservation_erreur ul,
#contact_erreur ul {
	color: #000;
	list-style-position: inside;
	padding: 0;
}



#resa_ok {
	left: 310px;
	position:absolute;
	top:20px;
}

/* footer */

#piedpage {
	position: relative;
	display: block;
	padding-bottom: 100px;
	
	/* Pour passer devant les illsutrations */
	z-index: 2;
	box-shadow: 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23);
	background-color: white;
}
@media (min-width: 992px) {
	#piedpage {
		padding-top: 20px;
	}
}
#footer .row {
	display: flex;
	justify-content: space-between;
}
#footer .row .col {
	/* On override les col de bootstrap */
	max-width: 100%;
	margin-top: 0;
	text-shadow: 0 1px 2px rgba(255, 255, 255, 0.76);
}
@media (max-width: 991px) {
	#colPartenaires {
		order: 3;
		margin-bottom: 30px;
	}
	#colActus {
		order: 1;
		margin-bottom: 30px;
	}
	#colContact {
		order: 2;
		margin-bottom: 30px;
	}
}
@media (min-width: 992px) {
	#footer .row .col {
		max-width: 33%;
		margin-top: -10px;
}
}
#footer .row .col.jsColAnime {
	box-shadow: 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23);
	background: linear-gradient(to bottom, rgba(255, 255, 255, 0.18) 0%, rgba(255, 255, 255, 0.55) 100%), url(/assets/plancher/papier-creme.jpg) white;
	position: relative;
	
}
/* Logo dans le footer */
#colContact img {
	max-width: 50%;
	margin: 40px auto auto;
	display: block;
}
/* Dégrader l'ombre des colonnes */
#footer .row .col.jsColAnime > * {
	position: relative;
	z-index: 2;
}

#footer .row .col.jsColAnime::after {
	content: "";
	background: -webkit-linear-gradient(top, rgba(255, 255, 255, 0) 0%, #ffffff 100%);
	background: -moz-linear-gradient(top, rgba(255, 255, 255, 0) 0%, #ffffff 100%);
	background: -ms-linear-gradient(top, rgba(255, 255, 255, 0) 0%, #ffffff 100%);
	background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, #ffffff 100%);
	display: block;
	position: absolute;
	bottom: -15px;
	left: -15px;
	right: -15px;
	height: 70%;
	
}
@media (max-width: 991px) {
	#footer .row .col.jsColAnime::after {
		left: 0;
		right: 0;
	}
}


.dernierePhrase {
	text-align: center;
	color: #b1bbc4;	
	padding-top: 30px;
	position: relative;
}
h6,
#piedpage th {
	font-size: 30px;
	text-shadow: white 1px 0 1px;
	padding-top: 27px;
	padding-left: 15px;
	font-weight: 200;
}
#colPartenaires h6 {
	color: silver;
	margin-top: 40px;
	padding-left: 8px;
}

#preFooterForMobile {
	position: relative;
	z-index: 1000;
	text-align: center;
}
#preFooterForMobile img {
	width: 100%;
}
@media (min-width:768px) {
	#preFooterForMobile {
		display: none;
	}
	div#footer.container div.row div.col-sm.text-right h6.text-left {
		text-align: right !important;
	}
}


@media (max-width:996px){
	#piedpage .text-left,
	#piedpage h6,
	a.partenaire,
	#piedpage .lien_format_htm *,
	#piedpage .text-right {
		text-align: center !important;
	}
	#colPartenaires {
		text-align: center;
		background: none !important;
	}
}

/* Ordonner les liens */

#partnaires {
	display: flex !important;
	flex-direction: column;
}
#colPartenaires h6 { order: 0; }
#partnaires #lien_6 { order: 10; }
#partnaires #lien_8 { order: 20; }
#partnaires #lien_5 { order: 30; }
#partnaires #lien_7 { order: 40; }
#partnaires #lien_2 { order: 50; }
#partnaires #lien_9 { order: 60; }

#partnaires #lien_8 { font-size: 20px }
#partnaires #lien_5 { font-size: 20px }

#colPartenaires img {
	max-height: 70px;
}
div#lien_6.lien_format_html a img {
	max-height: 50px;
}

#piedpage a {
	/*color: #000;*/
	text-decoration: underline;
	color: #ff6150;
/*	white-space: nowrap;*/
}
a.js-lien-email {
	padding: 5px 15px;
	margin-right: -15px;
	border-radius: 3px;
	margin-left: -15px;
}
table.radio_group {
}

table.radio_group INPUT {
	width: auto;
	float: right;
}
label.for_radio {
	float: left;
	text-align: left;
	padding-right: 0;
	line-height: 19px;
	color: #000;
	clear: none;
	padding-left: 10px;
	width: 100%;
}

/* Galerie photos sur page dédiée 2 septembre 2011 */

#carrousel {
	margin-top: 150px;
	padding-top: 130px;
}

#carrousel_index {
	width: 400px;
	height: 270px;
	margin-top: 0;
	padding-top: 140px;
	padding-left: 20px;
}


/* Accès à l'admin : */
a#acces_admin {
	background: url(/images/btn_acces_admin.png) no-repeat -30px;
	display: block;
	height: 28px;
	width: 28px;
	float: right;
	position: absolute;
	top: 0;
	right: -50px;
	cursor: pointer;
}
a#acces_admin:hover {
	background-position: 0;
}
a#logout {
	color: #fff;
	font-size: 12px;
	text-decoration: none;
	font-family: Arial, Verdana, Geneva, sans-serif;
	padding: 0 5px;
	-webkit-border-radius:10px;
	-moz-border-radius:10px;
	border-radius:10px;
	float: right;
}


#identification {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: 10001;
}
.admin_form {
	background-color: rgba(0,0,0,0.5);
	padding: 20px;
	z-index: 1001;
	position: relative;
	border-radius:10px;
	display: block;
}


#titre_bo {
	padding-top: 15px;
}
.admin_form#introduction {
	top: 319px;
	left: 50%;
	width: 320px;
	margin-left: 55px;
}
.admin_form#actualites {
	position: absolute;
	
	top: 100%;
	left: 50%;
	margin-left: -150px;
	width: 300px;
	margin-top: 470px;
}
.admin_form#partenaires {
	position: absolute;
	left: 0%;
	margin-left: 50px;
	width: 250px;
	top:  100%;
	margin-top: 180px;
}
.admin_form#bernadette {
	position: absolute;
	top: 260px;
	left: 50%;
	margin-left: -60px;
	width: 301px;
}
.admin_form#martial {
		position: absolute;

	top: 480px;
	left: 50%;
	margin-left: -200px;
	width: 268px;
}
.admin_form#patrick {
		position: absolute;

	top: 491px;
	left: 50%;
	margin-left: 252px;
	width: 260px;
}
.admin_form#spectacles {
	top: 250px;
	left: 50%;
	margin-left: -246px;
	width: 460px;
	z-index: 99;
}
.admin_form#galeries {
	top: 250px;
	left: 50%;
	margin-left: -246px;
	width: 460px;
	z-index: 99;
}
.admin_form#coaching {
	position: absolute;
	top: 430px;
	left: 50%;
	margin-left: 100px;
	width: 230px;
}
.admin_form#acces {
	top: 240px;
	left: 50%;
	margin-left: -175px;
	width: 350px;
}



.admin_form#stageEte {
	top: 340px;
	left: 50%;
	margin-left: -400px;
	width: 290px;
}
.admin_form#nouvelles {
	top: 53px;
	margin-left: -450px;
	width: 850px;
	left: 50%;
	z-index: 2000;
}
.admin_form#modif_actus {
	top: 504px;
	margin-left: -450px;
	width: 850px;
	left: 50%;
	z-index: 2000;
}
.admin_form#modif_actus textarea {
	width: 95%;
}
.admin_form li,
.admin_form#nouvelles .actu,
.admin_form#modif_actus .actu {
	border-bottom: 1px solid #fff;
	padding-top: 20px;
	list-style: none;
}
p.actu_affichage_header {
	padding-top: 20px;
	padding-bottom: 11px;
}
p.actu_affichage_header label,
p.actu_publier label {
	padding-top: 0;
}
.admin_form#coordonnees {
	top: 860px;			
	margin-left: -500px;
	width: 200px;
	left: 50%;
}
.admin_form#coordonnees2 {
	top: 381px;			
	margin-left: -330px;
	width: 400px;
	left: 50%;
}
.admin_form#atelier {
	left: 50%;
	width: 420px;
	margin-left: -210px;
	top: 270px;
}
.admin_form#mise_en_page {

	padding: 20px;
	text-align: center;
	
	height: 72px;
	
}
.admin_form#mise_en_page:before {
	content: ": )";
	color: white;
	display: block;
	width: 24px;
	height: 24px;
	border-radius: 24px;
	position: absolute;
	top: -14px;
	left: 50%;
	margin-left: -12px;
	font-size: 10px;
	line-height: 23px;
	transform: rotate(90deg);
}

.admin_form#nouvelle {
	top: 274px;			
	margin-left: 50%;
	width: 277px;
	left: -89px;
	padding: 10px;
}
.admin_form label,
.admin_form input[type="text"],
.admin_form input[type="password"] {
	color: #fff;
	border-color: #fff;
	white-space: nowrap;
}
.admin_form input[type="radio"] {
	width: auto;
}
.admin_form textarea {
	height: 150px;
	font: 12px/21px Arial, Verdana, Geneva, sans-serif;
	color: #000;
	background-image: none;
	background-color: #fffeff;
	-webkit-border-radius:10px;
	-moz-border-radius:10px;
	border-radius:10px;
	margin-bottom: 5px;
	padding: 7px 10px 10px;
	width: 469px;
	-webkit-box-shadow: #000 1px 1px 5px;
	-moz-box-shadow: #000 1px 1px 5px;
	box-shadow: #000 1px 1px 5px;
	min-height: 235px;
}
input[type="button"] {
	margin-left: 10px;
	width: 30%;
	margin-right: 10px;
	background-color: black;
	border: none;
	border-radius: 3px;
	color: white;
}
.admin_form input[type="submit"] {
}

/* Temporaire */

#flyer_reservation {
	margin-top: -60px;
	margin-left: 540px;
	
	display: block;
	position: absolute;	
}

#flyer_reservation img {
	border:none; margin:0;
}

/*  Flyer reservation en 3D from flat JPEG */
.affiche_facette_container {
	border-top: 2px solid black;
	border-left: 20px solid transparent;
	border-right: 30px solid transparent;
	min-width: 550px;
	border-radius: 20px;
	padding-top: 7px;
	min-height: 200px;
	
    transform: skewY(5deg) scale(.7);
	padding-left: 30px;
}

@media (max-width: 991px) {
	.affiche_facette_container {
		margin: auto;
		min-width: 0;
		padding-left: 0;
	}
}
@media (min-width: 992px) {
	.affiche_facette_container {
		display: block;
		position: absolute;	
		margin-left: -50px;
		z-index: 0;
		left: 50%;
		top: 20px;
		transform: skewY(5deg) scale(1);
	}
	
	#les-temps-difficiles2 .affiche_facette_container.jsZoomMe {
    	transform: skewY(0deg) scale(1.2) translate(-50px, -10px);
	}
	#pudding-or-not-pudding .affiche_facette_container.jsZoomMe {
    	transform: skewY(0deg) scale(1.5) translate(-50px, 0);
	}
    #pudding-or-not-pudding .affiche_facette_container {
		/* Affiches à l'horizontales */
		top: 200px;
	}
	 #pudding-or-not-pudding .affiche.affiche_reservation.grande_affiche {
		/* Affiches à l'horizontales */
		transform: scale(.6) skewY(2deg) translate(-250px, 0);
	 }

}


@media (max-width: 991px) {
	.affiche.affiche_reservation {
		position: relative;
	}
}
.affiche.affiche_reservation.grande_affiche {
	/* Parce que pour .grande_affiche j'ai mis une très grande taille… */
	transform: scale(.4) skewY(2deg) translate(-120px, 0);
	perspective: 2500px;
}


.jsToZoomThis {
	cursor: pointer;
	transition: all .3s ease-in-out 0s;
	transform-origin: 50% 50% !important;
}
.jsToZoomThis.jsZoomMe {
	transform: scale(1.5);
	z-index: 1000;
}
.jsZoomMe.affiche_facette_container {
	border-top: 2px solid transparent;
}

/* Pola sur la home */
.absoluteHack {
	display: block;
	position: absolute;
	top: 20px;
	left: -100px;
	width: 480px;
	height: 460px;
}
#polaroidcontainer { 
	height: 330px; 
	width: 540px; 
	position: relative;
	z-index: 4;
	margin-left: 0;
}

.polaroid { width:147px; height:150px; background-image:url(/images/polaroid-bg.png); position:absolute; cursor: move;
	line-height: 150px;
	vertical-align: middle;
	text-align: center;
}
.polaroid img { max-width:131px; max-height:107px; margin: 11px 0 0 3px;
	vertical-align: middle;
	width: auto;
	height: auto;
	display: inline-block;
}
.polaroid p { text-align:center; font-family:Georgia,serif; font-size:9px; color:#2E2E2E; margin-top:6px; }


/* Page des galeries photos */




#titre_photo {
	top: 10px;
	left: -16px;
	text-align: right;
	width: 350px;
}

.galerie {
	text-align: center;
	padding-top: 88px;
	position: relative;
	z-index: 2;
	margin-right: -50px;
	margin-left: -50px;
}

.galerie a.a_img img {
	border: 5px solid white;
	height: 110px;
	-moz-box-shadow: 0 1px 2px black;
	box-shadow: 0 1px 2px black;
	margin-bottom: 3px;
	transition: transform 0.2s ease-in-out 0s;
}
#fancybox-wrap {
	z-index: 11110;
}
#fancybox-overlay {
	z-index: 11109;
}
#fancybox-close {
	top: -10px;
	right: -30px;
	background-color: white;
	border-radius: 50%;
	background-position: 30px 2px;
}
#fancybox-close:hover {
	top: -10px;
	right: -30px;
	background-color: white;
	border-radius: 50%;
	background-position: 30px 2px;
}

.galerie a:hover.a_img img {
	transform: scale(1.2);
}

/* Nouveau système de reservation via plateforme de payement extérieure */
.dates_resa td {
	background-image: none;
	padding-bottom: 10px;
	padding-top: 15px;
}
#scene a.date-material {
	display: block;
	text-decoration: none;
	width: 70px;
	margin: auto;
	text-align: center;
	background-color: white;
	text-transform: uppercase;
	-moz-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.34);
	box-shadow: 0 1px 2px rgba(0, 0, 0, 0.34);
	position: relative;
	transition: transform 0.5s ease-in-out 0s;
	
}
#scene a.date-material.annulee:before {
	content: "annulée";
	display: block;
	position: absolute;
	background-color: red;
	color: white;
	top: 45%;
	right: -10px;
	left: -10px;
	-webkit-transform: rotate(-45deg); /* Ch <36, Saf 5.1+, iOS < 9.2, An =<4.4.4 */
	      -ms-transform: rotate(-45deg); /* IE 9 */
	          transform: rotate(-45deg); /* IE 10, Fx 16+, Op 12.1+ */
          }

.multidates {
	text-align: center;
	margin-bottom: 20px;
}
#scene .multidates a.date-material {
	display: inline-block;
}
#scene .multidates a.date-material:first-child {
	transform: rotate(-9deg) translateY(7px) scale(1);
}
#scene .multidates a.date-material:last-child {
	transform: rotate(9deg) translateY(8px) scale(1);
}
#scene a.date-material:hover,
#scene .multidates a.date-material:hover {
	-moz-box-shadow: 0 1px 5px rgba(0, 0, 0, 0.48);
	box-shadow: 0 1px 5px rgba(0, 0, 0, 0.48);
	z-index: 10;
	transform: scale(1.2);
	transition: transform 0.2s ease-in-out 0s;
}
.date-material span {
	display: block;
}
.jour_string {
	color: white;
	border: 1px solid rgba(0, 0, 0, 0.14);
	border-bottom-style: none;
}
.jour_int {
	font: 31px Georgia, "Times New Roman", Times, serif;
	color: black;
	line-height: 37px;
}
.jour_int sup {
	font-size: 11px;
	top: -10px;
}
.mois_string {
	color: black;
	line-height: 20px;
	margin-top: -5px;
	margin-bottom: 2px;
}
.heure_float {
	background-color: black;
	color: white;
	font: 20px/27px Georgia, "Times New Roman", Times, serif;
	text-transform: none;
	transform: rotate(-10deg);
	-webkit-transform: rotate(-10deg);
	margin-bottom: -27px;
}
a.date-material:hover .heure_float  {
	transform: rotate(-15deg);
	-webkit-transform: rotate(-15deg);

}

.papier {
	background-color: white;
	box-shadow: 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23);
	padding: 15px;


	box-shadow: 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23);
	background: linear-gradient(to bottom, rgba(255, 255, 255, 0.18) 0%, rgba(255, 255, 255, 0.55) 100%), url(/assets/plancher/papier-creme.jpg) white;


	text-shadow: 0 1px 2px rgba(255, 255, 255, 0.76);
	
	color: black;
	margin-top: 20px;
}
.papier .multidates {
	margin-top: -30px;
	margin-bottom: 30px;
}

#pola_0.illustrations,
#pola_1.illustrations,
#pola_2.illustrations,
#pola_3.illustrations,
#pola_4.illustrations,
#pola_5.illustrations,
#pola_6.illustrations,
#pola_7.illustrations,
#pola_8.illustrations,
#pola_9.illustrations,
#pola_10.illustrations,
#pola_11.illustrations,
#pola_12.illustrations {
	width: 200px !important;
	height: 200px !important;
	/* Override la BBD */
	
	transform: rotate(-5.5deg);

	background-size: cover;
	background-position: center;
	cursor: pointer;
	border: 10px solid #fff;
	box-shadow: 0 1px 2px rgba(0, 0, 0, 0.53);
	margin-top: -100px;
}

#scene a.reserverLieu {
	text-decoration: none;
	text-align: center;
}
a.reserverLieu big,
a.reserverLieu small {
	display: block;
}
a.reserverLieu big {
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 20px;
	text-shadow: white 1px 0 1px;
}
a.reserverLieu small {
	color: white;
	font-size: 16px;
	line-height: 22px;
	display: block;
	margin: 5px auto 10px;
	width: 120px;
	padding-top: 8px;
	transition: transform 0.5s ease-in-out 0s;
	padding-bottom: 4px;
	text-shadow: 0 1px 2px rgba(0, 0, 0, 0.27);
}
a.reserverLieu:hover small {
	transform: rotate(-5.5deg) scale(1.2);
	box-shadow: 0 3px 5px rgba(0, 0, 0, 0.25);	z-index: 10;
	transition: transform 0.2s ease-in-out 0s;
}

a.reserverLieu:hover {
	text-decoration: underline;
}

/* Mise en confirmité de la page reservation suite à la v2 du site */
.titreReservation {
	display: block;
	text-align: left;
	font-size: 38px;
}
.titreReservation small {
	font-size: 50%;
}

/* Nouvelle page Mentions légales */

#mentionlegalesimg {
	position: absolute; left: 353px; top: 259px;
	z-index: 21;
}
#mentionlegales {
	left: 108px; top: 69px; width: 450px
}
#mentionlegalessite {
	left: 749px; top: 183px; width: 320px
	z-index: 1;
	z-index: 22;
}
#mentionlegales img,
#mentionlegalessite img {
	display: block; width: 200px; margin: auto;	
}
#mentionlegalessite img {
	 width: 75px;
}

/* Page lieu */
#dtm-info {
	width: 564px;
	padding-right: 15px;
	padding-bottom: 15px;
}
#dtm-info h2 {
	margin-top: 0;
}
#dtm-info h2 .lettrine {
	margin-right: -12px;
}
#dtm-acces {
	width: 460px;
}
@media (max-width: 991px) {
	#cours_lieu {
		max-width: 90%;
		margin: auto;
	}
	
	#cours_lieu img,
	.page_lieux	img {
		max-width: 100%;
		width: 100%;
	}
	.couche.verso.box-like {
		background-color: white;
		color: #000;
		padding-bottom: 10px;
		border-top: 10px solid #FFF;
	}
	.couche.verso.box-like::before {
		/* Un triangle, une fleche… */
		content: '';
		display: block;
		position: absolute;
		width: 40px; height: 30px;
		
		background-color: white;
		clip-path: polygon(50% 30%, 100% 100%, 0 100%);
		bottom: 100%;
		left: calc(50% - 20px);
	}

	.scene .couche.verso.box-like p {
		text-shadow: none;
		padding-left: 5%;
		padding-right: 5%;
	}

}
@media (min-width: 992px) {
	#carte-dtm {
		position: absolute;
		top: 100px;
		left: 0%;
	}
	#carte-agitakt {
/*		position: absolute;*/
		/*top: 60px;*/
/*		left: calc(60% - 564px / 2);*/
		left: 33%;
	}
	.page_lieux #carte-agitakt {
		margin-bottom: 30px;
	}
	
	#standalone_produit #carte-agitakt {
		left: 55%;
	}
	
}
#carte-dtm .carte_visite_recto_verso .carte .recto {
	background-size: auto 100%;
	background-color: #fbf7f9;
	background-repeat: no-repeat;
	background-position: right top;
}

.modale#modale_lieu #carte-dtm,
.modale#modale_lieu #carte-agitakt {
	position: relative;
	top: 50px;
	left: 0;
}

@media (min-width: 992px) {
		
		#carte-dtm .carte_visite_recto_verso .carte .recto {
			background-position: 258px top;
			background-image: url(/images/Studio-DTM-Impasse.png);			
		}
		#carte-ecole .carte_visite_recto_verso .carte .recto {
			background: url(/images/Cours_de_theatre_Antoine-Chantin-v2.jpg) 258px top no-repeat white;
			background-size: auto 100%;
		}
		#carte-agitakt .carte_visite_recto_verso .carte .recto {
			background: url(/images/agitakt-1.jpg) 130% no-repeat #fbf7f9;
			background-size: auto 100%;
		}
	
		/* Les lieux en cartes recto / verso  */
		/* Mise en forme du conteneur principal*/
									
		.carte_visite_recto_verso {
			-webkit-perspective: 800px;   
			perspective: 800px;
			position: relative;
			z-index: 1000;
			width: 570px;
		}
		 /* Mise en forme générale de la carte (taille et préservation de la position 3D des objets fils)*/
									
		.carte_visite_recto_verso .carte {
			width: 570px; 
			/*height: 420px; */
			-webkit-transform-style: preserve-3d;
			transform-style: preserve-3d;
		}
		 /* Principe générale des couches : non affichée en mode retourné*/
									
		.carte_visite_recto_verso .carte .couche {
			margin:0px !important;
			-webkit-transition: 0.5s;
			transition: 0.5s;
			-webkit-backface-visibility: hidden ;
			backface-visibility: hidden;
			
			background-color: white;
			box-shadow: 0 1px 2px black;
			color: #000;
			padding: 15px;
			width: 610px;
		}
		 /* Positionnement du recto à l'intérieur du bloc carte*/
									
		.carte_visite_recto_verso .carte .recto {
			width: 610px; 
			position: absolute;
			z-index: 1;
		}
}

.nowrap {
	white-space: nowrap;
}
.legendeagitakt {
	display: block;
	position: absolute;
	padding: 5px 5px 5px 7px;
	background-color: rgba(0, 0, 0, 0.5);
	color: white;
	width: 171px;
	right: 15px;
	text-align: left;
	bottom: 0;
}
@media (min-width: 992px) {
	.legendeagitakt {
		right: -65px;
		bottom: -51px;
		width: 165px;
	
	}
}
.legendeagitakt a {
	color: white;
	white-space: nowrap;
}

/*#carte-agitakt .carte_visite_recto_verso .carte .recto {
	background-size: 100% auto;
	background: url(../images/agitakt-2.jpg) -90px -40px no-repeat #fbf7f9;
}*/
 /*Rotation initiale des couches dont la couche verso est retournée (-180) pour la rendre invisible*/
							
 /*cette rotation sert aussi pour revenir à l'état non retourné de la carte*/
 
.scene a.rectoverso {
	color: white;
	padding: 7px 15px 5px;
	cursor: pointer;
	border-radius: 3px;
	
	display: none;
}
.scene a.rectoverso:hover {
	color: white;
	text-decoration: underline;
}
 
@media (min-width: 992px) {
	.scene a.rectoverso {
		display: inline-block;
	}
							
	.carte_visite_recto_verso .carteModeRecto .recto {
		-webkit-transform: rotatey(-0deg);
		transform: rotatey(-0deg);
	}
								
	.carte_visite_recto_verso .carteModeRecto .verso {
		-webkit-transform: rotatey(-180deg);
		transform: rotatey(-180deg);
	}
	 /*Création d'une surclasse pour la carte qui applique une rotation à chacune des couches*/
								
	.carte_visite_recto_verso .carteModeVerso .recto {
		-webkit-transform: rotatey(+180deg);
		transform: rotatey(+180deg);
	
	}
								
	.carte_visite_recto_verso .carteModeVerso .verso {
		-webkit-transform: rotatey(0deg);
		transform: rotatey(0deg);
	
	}
}
.lieu_cours {
	display: block;
	position: absolute;
	right: 0;
	top: 0;
	margin-right: 0;
	margin-top: 0;
}
.r_lieu_cours {
	display: inline-block;
	white-space: nowrap;
	color: white;
	clear: right;
	float: right;
	padding-right: 6px;
	padding-left: 6px;
	margin-bottom: 1px;
	margin-left: 1px;
}
@media (min-width: 992px) {
	.lieu_cours {
		margin-right: -65px;
		margin-top: 170px;
	}
}



/* Dessin d'un semainié */

#planning .titrePage .lettrine {
	line-height: 15px;
	text-indent: 12px;
}
#semaine {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	z-index:3;
	
	background-color: rgba(255, 255, 255, 0.9);
	box-shadow: 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23);
	
	color: #000;
}
ul.horaires {
	padding: 10px 10px 0 30px;
	list-style: none;
	width: 100%;
}
ul.horaires.libre {display: none;}

#planning a.lienProduit {
	display: none !important;
}

@media (min-width:768px) {
	
	#semaine {
		flex-wrap: nowrap;
		padding-top: 31px;
	}
	ul.horaires {
		margin-right: 1px;
		width: 25%;
	}
	ul.horaires.libre {
		margin-right: -10px;
		width: 60px;
		transform: scale(0.95);
		display: inline-block;
	}
	ul.horaires.libre p.j-libelle {
		transform: rotate(90deg) translate(20px, 10px);
		text-align: left;
	}
}

@media (min-width:1200px) {
	ul.horaires#j-samedi,
	ul.horaires#j-dimanche {
		opacity: 0.7;
	}
	ul.horaires {
		width: 14%;
	}
	ul.horaires.libre {
		margin-right: 1px;
		width: 14%;
		transform: none;
	}
	ul.horaires.libre p.j-libelle {
		transform: none;
		text-align: center;
	}
}

.j-libelle {
	/* Nom du jour */
	margin-left: -30px;
	margin-right: -10px;
	text-align: center;
	margin-bottom: 30px;
	text-shadow: none !important;
}

ul.horaires li {
	display: block;
	height: 50px;
	width: 100%;
	padding: 0;
	border-top: 1px dotted #afbbc4;
	position: relative;
	text-shadow: none !important;
	
}
ul.horaires li:nth-child(2) { opacity: 0.4; }
ul.horaires li:nth-child(3) { opacity: 0.6; }
ul.horaires li:nth-child(4) { opacity: 0.8; }

ul.horaires li:before {
	content: attr(data-heure);
	font-size: 11px;
	display: block;
	position: absolute;
	left: -22px;
	top: -13px;
}
@media (min-width:992px) {
	ul.horaires li:before {
		content: attr(data-heure) 'h';
	}
}

/* Placer les cours */
.cours {
	color: black;
	z-index: 3000;
	position: relative;
	z-index: 1000;
	height: 129px;
	text-align: center;
	margin-left: -16px;
	text-shadow: 0 1px 2px rgba(255, 255, 255, 0.52);
	display: block;
}

/* Annuler des cours : */
#cc1 {
/*	display: none;*/
}
#cc3 {
	display: none;
}


/* Ligne couleur sur horaires */
.cours:before {
	content: "";
	display: block;
	position: absolute;
	width: 5px;
	top: -3px;
	left: -4px;
	bottom: -3px;
	border-radius: 5px;
}

/* Etiquette couleurs des heures */
.debut,
.fin {
	display: block;
	position: absolute;
	right: 100%;
	top: 0;
	margin-top: -30px;
	width: 50px;
	text-align: center;
	margin-right: -23px;
	border-radius: 3px;
	font-weight: bold;
	color: white;
	z-index: 100000;
	text-shadow: 0 1px 2px rgba(0, 0, 0, 0.52);
	transition: margin 0.2s ease-in-out 0s;
}
.fin {
	top: 100%;
	margin-top: 10px;
}
.cours:hover .debut {
	margin-top: -35px;
}
.cours:hover .fin {
	margin-top: 15px;
}


/* Ajsutement horaire et durées */
.cours#cc1 { margin-top: 20px; height: 110px;
}
.cours#cc3 { height: 99px; }
.cours.cc5 { height: 49px; }

.cours a {
	border-radius: 0 3px 3px 0;
	text-decoration: none;
	letter-spacing: -0.3px;
	display: block;
	padding: 20px 5px 5px;
	color: black;
	height: 100%;
	transition: background 0.2s ease-in-out 0s;
	
	position: relative;
	z-index: 1;
}

.cours::after {
	/* Pour faire du blanc sous la transparence de la couleur */
	content: "";
	display: block;
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	background-color: white;
	z-index: 0;
}

.cours a em {
	padding: 3px 5px;
	color: white;
	font-style: normal;
	text-shadow: none;
}

/* Cours id cc1 en jaune */
.cours.jaune a { background-color: rgba(236, 172, 48, 0.3); }
.cours.jaune a:hover { background-color: rgba(236, 172, 48, 0.5); }
.cours.jaune:before,
.cours.jaune a em,
.cours.jaune .debut,
.cours.jaune .fin {
	background-color: rgb(236, 172, 48);
	border-color: rgba(236, 172, 48);
}
.jaune .nom {
	color: rgb(236, 172, 48);
}
/* Cours id cc2 en rose */
.cours.rose a { background-color: rgba(238, 107, 176, 0.4); }
.cours.rose a:hover { background-color: rgba(238, 107, 176, 0.7); }
.cours.rose:before,
.cours.rose a em,
.cours.rose .debut,
.cours.rose .fin {
	background-color: rgb(244, 38, 146);
	border-color: rgb(244, 38, 146);
}
.rose .nom {
	color: rgb(244, 38, 146);	
}

/* Cours id cc3 en bleu */
.cours.bleu a { background-color: rgba(129, 178, 214, 0.6); }
.cours.bleu a:hover { background-color: rgba(129, 178, 214, 0.8); }
.cours.bleu:before,
.cours.bleu a em,
.cours.bleu .debut,
.cours.bleu .fin {
	background-color: #278cd7;
	border-color: #278cd7;
}
.bleu .nom {
	color: #278cd7;
}
#cc3 .fin {	display: none; }


/* Cours id cc4 en vert */
.cours.vert a { background-color: rgba(112, 171, 107, 0.4); }
.cours.vert a:hover { background-color: rgba(112, 171, 107, 0.6); }
.cours.vert:before,
.cours.vert a em,
.cours.vert .debut,
.cours.vert .fin {
	background-color: rgba(112, 171, 107, 1);
	border-color: rgba(112, 171, 107, 1);
}
.vert .nom {
	color: rgba(112, 171, 107, 1);
}

/* Cours id cc5 en orange */
.cours.orange a { background-color: rgba(214, 178, 129, 0.5); }
.cours.orange a:hover { background-color: rgba(214, 178, 129, 0.7); }
.cours.orange:before,
.cours.orange a em,
.cours.orange .debut,
.cours.orange .fin {
	background-color: #f38c1a;
	border-color: #f38c1a;
}
.orange .nom {
	color: #f38c1a;
}

/* Exceptions pour les coaching qui manquent de place */
.cc5 em {
	display: block;
	position: absolute;
	top: 14px;
	left: 50%;
	width: 100px;
	margin-left: -50px;
	opacity: 0;
}
.cc5 a:hover em {
	opacity: 1;
}


/* Petites flèches des étiquettes des heures */
.debut:after {
	top: 100%;
	left: 50%;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
	border-color: rgba(136, 183, 213, 0);
	border-top-color: inherit;
	border-width: 7px;
	margin-left: -7px;
}
.fin:after {
	bottom: 100%;
	left: 50%;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
	border-color: rgba(136, 183, 213, 0);
	border-bottom-color: inherit;
	border-width: 7px;
	margin-left: -7px;
}


.nom {
	font: 16px Georgia, "Times New Roman", Times, serif;
	margin-bottom: 15px;
	display: block;
}

small.niveau {
	display: block;
}

/* Mettre en valeur les lieux, les arrondissments */
.lieu i {
	margin: -45px auto 0;
	transform: rotate(7deg);
	transform-origin: 50% 100%;
	font-size: 50px;
	display: block;
	transition: transform 0.3s ease-in-out 0s;
}
.lieu {
	transform: rotate(-7deg);
	transform-origin: 50% 10px;
	position: absolute;
	text-align: center;
	z-index: 1;
	padding: 10px;
	background-color: white;
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.54);
	border-radius: 3px;
	bottom: 104%;
	width: 120px;
	left: calc(50% - 60px);
	transition: transform 0.3s ease-in-out 0s;
}
.lieu:hover {
	transform: rotate(2deg);
}
.lieu:hover i {
	transform: rotate(-2deg);
}

.ville, .salle, .arrondissement {
	margin-bottom: 0;
}
.salle {
	text-transform: uppercase;
}
.catalogue {
	margin-top: 0px;
	margin-right: auto;
	position: relative;
	margin-left: auto;
}
@media (min-width: 992px) {
	.catalogue {
		margin-top: -60px;
	}
}
.catalogue .row {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
}
.catalogue h3.desccourt {
	display: none;
}
.catalogue-mini .row {
	/* Sur les pages des fiches produit */
	display: flex;
	justify-content: center;
	width: 100%;
}
.catalogue-mini h2 {
	text-align: center;
	display: block;
	width: 100%;
}
.catalogue-mini .prix,
.catalogue-mini ul,
.catalogue-mini a.reserverProduit,
.catalogue-mini p.lieu_adresse {
	display: none !important;
}
.page #scene a.toPlanning
 {
	display: block;
	position: relative;
	z-index: 220;
	background-image: url(/illustrations/Agenda.png);
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
	text-align: center;
	height: 200px;
	text-decoration: none;
	margin-bottom: -59px;
	margin-top: 10px;
}
a.toPlanning span {
	background-color: rgba(0,0,0,0.6);
	padding: 2px 10px 1px;
	border-radius: 3px;
	color: white;
	position: relative;
	margin-top: 16px;
	display: inline-block;
}
a.toPlanning span:after	{
	top: 100%;
	left: 50%;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
	border-color: rgba(136, 183, 213, 0);
	border-top-color: rgba(0,0,0,0.6);
	border-width: 7px;
	margin-left: -7px;
}
@media (min-width: 992px) {
	.page #scene a.toPlanning {
/*		position: absolute;
		top: 75%;
		left: 100%;*/
		background-image: url(/illustrations/Agenda.png);
		background-size: contain;
		background-repeat: no-repeat;
		width: 200px;
		text-align: center;
		height: 200px;
		margin-left: -140px;
		margin-bottom: -100px;
		margin-top: -70px;
		text-decoration: none;
	}
}
#liste-produit .fiche {
	z-index: 223;
	padding-right: 0;
	padding-left: 0;
}
@media (min-width: 992px) {
	#liste-produit .fiche {
		transform: scale(0.9);
		transform-origin:50% 80%;
		transition: transform 0.3s ease-in-out 0s;
	}
	#liste-produit .fiche:hover {
		transform: scale(1);
	}

}

.modale {
	display: none;
	position: fixed;
	z-index: 2222;
	margin-bottom: 0;
	text-align: center;
	left: 7%;
	right: 7%;
	top: 0%;
	background-image: -webkit-linear-gradient(top, rgb(228, 159, 197) 0%, rgb(234, 183, 210) 17.6%, rgb(234, 183, 210) 99.3%);
	background-image: -moz-linear-gradient(top, rgb(228, 159, 197) 0%, rgb(234, 183, 210) 17.6%, rgb(234, 183, 210) 99.3%);
	background-image: -ms-linear-gradient(top, rgb(228, 159, 197) 0%, rgb(234, 183, 210) 17.6%, rgb(234, 183, 210) 99.3%);
	background-image: linear-gradient(to bottom, rgb(228, 159, 197) 0%, rgb(234, 183, 210) 17.6%, rgb(234, 183, 210) 99.3%);
}
.modale {
	background-image: -webkit-linear-gradient(top, rgb(196, 206, 214) 0%, rgb(206, 213, 219) 17.7%, rgb(206, 213, 219) 99.3%);
	background-image: -moz-linear-gradient(top, rgb(196, 206, 214) 0%, rgb(206, 213, 219) 17.7%, rgb(206, 213, 219) 99.3%);
	background-image: -ms-linear-gradient(top, rgb(196, 206, 214) 0%, rgb(206, 213, 219) 17.7%, rgb(206, 213, 219) 99.3%);
	background-image: linear-gradient(to bottom, rgb(196, 206, 214) 0%, rgb(206, 213, 219) 17.7%, rgb(206, 213, 219) 99.3%);
}
.modale.z-max {
	z-index: 2223;
}
.modale#modale_lieu {
	background: none;
	text-align: left;
	width: 580px;
}

#overlay {
	content: "";
	display: none;
	position: fixed;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	background-color: rgba(0, 0, 0, 0.43);
	z-index: 2221;
	filter: blur(4px);	
}

@media (min-width: 992px) {
	
	.modale {
		position: absolute;
		width: 460px;
		margin-left: 120px;
		margin-bottom: 0;
		right: auto;
		top: -70px;
		margin-top: -50px;
	}
	.modale#modale_prod_4 {
		margin-left: 150px;
		margin-top: 20px;
	}
}
.produit {
	text-align: center;
}

.not_actif #content * {
	filter: blur(5px);
}
.not_actif #content .not_actif_message {
	display: block;
	transform: rotate(-5deg);
	font-size: 16px !important;
	filter: blur(0px);
	margin: 50px -40px -130px;
	z-index: 2;
	position: relative;
	padding: 40px 50px;
}
.close {
	margin-right: -48px;
	margin-top: -31px;
	border-radius: 50%;
	width: 30px;
	height: 30px;
	line-height: 30px;
	text-align: center;
	color: white;
	text-shadow: 0 1px 2px black;
}
.close:hover {
	color: white !important;
	text-shadow: 0 -1px 2px black;
	opacity: 1 !important;
}

#modale_lieu .close {
	margin-right: 0;
	margin-top: 38px;
	position: relative;
	z-index: 1500;
}
#produit .close {
	display: none;
}
.produit small {
	display: block;
}
.produit h2 {
	margin-top: 0;
	color: black;
	margin-bottom: 20px;
}
.produit h2 small {
	font-size: 17px;
	line-height: 23px;
}
.produit h3 {
	font-size: 16px;
	margin-top: 30px;
}
.produit ul {
	text-align: left;
	color: black;
	padding-left: 30px;
	padding-top: 10px;
	padding-bottom: 10px;}
@media (min-width: 992px) {
	.produit ul {
		line-height: 18px;
		font-size: 14px;
	}
}
.produit p {
	text-align: center;
	line-height: 18px;
	color: #000;
}
#plancher .produit h1 {
	line-height: 22px;
	text-shadow: 0 1px 2px black;
	text-shadow: 0 1px 2px rgba(0, 0, 0, 0.49);
	padding-top: 10px;
	padding-bottom: 10px;
	margin-top: -7px;
	margin-bottom: 3px;
	font-size: 20px;
	font-weight: 400;
	
	min-height: 80px;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-wrap: wrap;
}
.produit h1 small {
	font-size: 16px;
	color: inherit;
}
.prix,
.produit h1,
.desccourt,
#scene a.reserverProduit,
#scene a.lienProduit {
	color: white;
	transform: rotate(-3deg);
	margin-right: 0px;
	margin-left: 0px;
}
h3.desccourt {
	transform: rotate(0deg);
	padding: 20px;
}

.prix,
.produit h1 {
	margin-right: -20px;
	margin-left: -20px;
}
.produit h1 strong {
	text-shadow: inherit;
	font-weight: normal;
	display: block;
	width: 100%;
	font-size: 26px;
	line-height: 29px;
}

small.sku {
	color: black;
	font-size: 10px;
	text-transform: uppercase;
	opacity: 0.1;
	transition: opacity 1s ease-in-out 0s;
}
small.sku:hover {
	opacity: 1;
	transition: opacity .3s ease-in-out 0s;
}
@media (min-width: 992px) {
	.desccourt,
	#scene a.reserverProduit,
	#scene a.lienProduit {
		margin-right: -20px;
		margin-left: -20px;
	}
	.desccourt {
	
	}


}
#scene a.reserverProduit,
#scene a.lienProduit {
	padding: 10px 15px;
	font-size: 14px;
	text-transform: uppercase;
	transform: rotate(3deg);
	display: inline-block;
	transition: all 0.3s ease-in 0s;
	margin-bottom: 10px;
	margin-right: auto;
	box-shadow: 0 0px 2px rgba(0, 0, 0, 0.52);
	margin-left: auto;
}
#scene a.lienProduit {
	transform: rotate(-2deg);
}

#scene a.reserverProduit:hover,
#scene a.lienProduit:hover {
	transform: rotate(0deg) scale(1.2);
	text-decoration: none;
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.52);
}
.jaune h1,
.jaune .prix,
.jaune .desccourt,
#scene .jaune a.reserverProduit,
#scene .jaune a.lienProduit,
.jaune .not_actif_message {
	background-color: #f6aa19 !important;
}
.bleu h1,
.bleu .prix,
.bleu .desccourt,
#scene .bleu  a.reserverProduit,
#scene .bleu  a.lienProduit,
.bleu .not_actif_message {
	background-color: #0983dd !important;
}
.vert h1,
.vert .prix,
.vert .desccourt,
#scene .vert  a.reserverProduit,
#scene .vert  a.lienProduit,
.vert .not_actif_message {
	background-color: #3d9037 !important;
}
.rose h1,
.rose .prix,
.rose .desccourt,
#scene .rose  a.reserverProduit,
#scene .rose  a.lienProduit,
.rose .not_actif_message {
	background-color: #ff614f !important;
}
p.prix {
	line-height: 24px;
	font-size: 23px;
	padding-top: 11px;
	padding-bottom: 5px;
	font-weight: bolder;
	text-transform: uppercase;
	margin-bottom: 2px;
	margin-top: -12px;
	
	color: white;
}
.prix small {
	font-size: 12px;
	letter-spacing: 1px;
	line-height: 13px;
}
#plancher h2.lieu_nom {
	margin-bottom: 5px;
	font-size: 26px;
}
h2.lieu_nom i {
	display: block;
	font-size: 39px;
}

.jsModalLieu:hover,
.jsModalLieu:hover * {
	cursor: help;
}
.lieu_logo {
	max-width: 200px;
	display: none;
}
p.lieu_adresse {
	margin-bottom: 0;
}
.jsModalLieu * {
	text-shadow: none !important;
}

.lieu_metro img {
	width: 20px;
	margin: auto;
	display: none;
}

/* Si les fiches produtis sont affichées sur leur page standalone */

#standalone_produit a.lienProduit {
	display: none;
}
#standalone_produit .catalogue-mini a.lienProduit {
	display: inline-block;
}

@media (min-width: 992px) {
	#standalone_produit #produit {
		width: 350px;
		left: 90px;
	}
	#standalone_produit .catalogue-mini {
		display: flex;
		justify-content: center;
		width: 100%;
	}
	#standalone_produit .catalogue-mini #produit {
		width: auto;
		left: 0 !important;
	}
	#standalone_produit #cours_lieu {
		transform: rotate(3deg) scale(0.8);
		transform-origin: 100% 0;
		position: absolute;
		display: block;
		top: 100px;
		left: 40%;
	}
	#standalone_produit #cours_lieu #carte-dtm {
		left: 51%;
	}
}


/* mardi 25 aout 2020 : Des actions sur le numéros de téléphone */
.numero {
	position: relative;
}
.numero strong {
	font-weight: normal;
}

ul.actionsTel {
	font-size: 18px;
	text-align: center;
	list-style: none;
	padding: 0;
	
	display: block;
	position: absolute;
	right: 0;
	width: 190px;
	top: 100%;
	margin-top: 10px;
}
ul.actionsTel a {
	display: block;
	background-color: rgba(255,255,255,0.5);
	margin-bottom: 1px;
	padding-top: 6px;
	padding-bottom: 7px;
	cursor: pointer;
	border-radius: 3px;
	text-decoration: none;
}

.verifiez {
	font-size: 14px !important;
	background-color: #fe6150;
	padding: 10px;
	color: white;
	box-shadow: 0px 3px 5px #444;
	
	
	margin-bottom: 100px;
	margin-top: -40px;
	text-align: center;
}
@media (min-width: 992px) {
	.verifiez {
		position: absolute;
		display: block;
		top: auto;
		bottom: 80px;
		left: 50%;
		z-index: 500;
		width: 250px;
		margin: 0;
	}
}
/* 11 avril : modification des style de l'admin après installation de SummerNote */
.modal-content {
	background-color: rgba(0, 0, 0, 0.9);
}
.modal-content * {
	color: white;
	border-color: black;
}
.modal-content label {
	width: 100%;
	text-align: left;
	padding-top: 20px;
	padding-bottom: 10px;
}
.modal-content label.form-check-label {
	padding-top: 1px;
	padding-bottom: 1px;
	margin-top: 10px;
}

.modal-content input {
	color: #000;
	background-color: white;
	margin-top: 3px;
}
.modal-content .form-control:focus {
	background-color: #f56151;
}
.modal-content .close {
	margin-right: 0;
	margin-top: 0;
	border-radius: 2;
	width: 30px;
	height: 30px;
	line-height: 0;
	text-align: center;
	color: black;
	text-shadow: none;
}
.modal-content .close:hover {
	color: black !important;
}


/* Admin 2022 */
.admin_form#connexion {
	

	padding-top: 60px;

}
.toAdmin#connexion {
	position: fixed;
	top: 15px;
	right: 15px;
	width: 440px;
}
.toAdmin {
	background-color: rgba(0,0,0,0.5);
	padding: 20px;
	border-radius:10px;
	color: white;
	text-decoration: none;
}
a.toAdmin,
#piedpage a.toAdmin {
	color: white;
	text-decoration: none;
	text-shadow: none;
}
.toAdmin legend {
	font-size: 16px;
	margin: 0;
}
.toAdmin.arrowRight {
	position: absolute;
	right: 100%;
	top: 50%;
	z-index: 10;
	width: 100%;
	max-width: 250px;
	
	transition: top 1s ease-in-out 0s;
	margin-right: 7px;
	margin-top: -30px;
}
.toAdmin.arrowRight::before {
	left: 100%;
	top: 50%;
	border: solid transparent;
	content: "";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
	border-color: rgba(0,0,0,0);
	border-left-color: rgba(0,0,0,0.5);
	border-width: 20px;
	margin-top: -20px;
}
.toAdmin.arrowTop {
	position: absolute;
	left: calc(50% - 240px);
	top: 100%;
	z-index: 10;
	width: 480px;
	
	transition: top 1s ease-in-out 0s;
	margin-top: 20px;
}
.toAdmin.arrowTop::before {
	bottom: 100%;
	left: 50%;
	border: solid transparent;
	content: "";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
	border-color: rgba(0,0,0,0);
	border-bottom-color: rgba(0,0,0,0.5);
	border-width: 20px;
	margin-left: -20px;
}
.toAdmin.arrowBottom {
	position: absolute;
	left: calc(50% - 140px);
	top: 100%;
	z-index: 10;
	width: 480px;
	
	transition: top 1s ease-in-out 0s;
	margin-top: 20px;
}
.toAdmin.arrowBottom::before {
	top: 100%;
	left: 50%;
	border: solid transparent;
	content: "";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
	border-color: rgba(0,0,0,0);
	border-top-color: rgba(0,0,0,0.5);
	border-width: 20px;
	margin-left: -20px;
}
.closeAdmin {
	position: absolute;
	right: -5px;
	top: -5px;
	background-color: #000;
	width: 25px;
	height: 25px;
	line-height: 25px;
	text-align: center;
	border-radius: 50%;
	cursor: pointer;
	
	display: none;
}
.open .closeAdmin {
	display: block;
}
.closeAdmin:hover {
	background-color: #ff7665;
}
.toAdmin form {
	height: 0;
	overflow: hidden;
	transition: height 1s ease-in-out 0s;
}
.toAdmin.open form {
	height: 100%;
	max-height: 1000px; /* ? */
	min-height: 490px;	
	top: 0;
}

.page_nouvelles .toAdmin.open form {}

.toAdmin.open {
	top: -20px;
	min-width: 520px;
	max-width: 100%;
	z-index: 1000;
	margin-right: -9px;
	background-color: rgba(0,0,0,0.7);
}
.toAdmin.open.arrowRight::before {
	border-left-color: rgba(0,0,0,0.7);
}

.note-editor {
	margin-bottom: 20px;
}
.note-editable.card-block {
	/* Le texte dans le éditeurs */
	color: black;
	min-height: 200px;
}
/* Quelques styles du FO sont à supprimer dans les formaulaires */
.note-editable.card-block p,
.note-editable.card-block ul {
	text-shadow: none;
}
.note-editable.card-block a {
	color: #ff6150;
}

form > p {
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
}
form > p.forDates,
form > p.forCheckbox {
	justify-content: flex-start;
}



.open#cssException_1 {
	position: relative;
}
#cssException_1.toAdmin.open form {
	max-height: 1000px;
}

/*
 *
 *
 *
 *
 *
 Le menu */
 
 /* Hack le logo from v0 */

a#retouraccueil {
	background: url(/images/logo-gris.png) center top no-repeat;
	background-size: auto 132px;
	height: 180px;
}
a#retouraccueil::after {
	content: "";
	background: url(/images/logo-gris.png) 1px -107px no-repeat;
	background-size: auto 132px;
	display: none;
	width: 120px;
	height: 50px;
	position: relative;
}

a#retouraccueil img {
	opacity: 0;
}
@media (min-width: 992px) {
	a#retouraccueil {
		background-size: 70% auto;
		background-position: left top;
		margin-bottom: -70px;
	}
}
@media (min-width: 1200px) {
	a#retouraccueil::after {
		display: block;
	}
}

/* Hack l'admin */
a#acces_admin {
	background: none;
	box-shadow: none;
}

#header.container .row {
	justify-content: center;
}


/* Le menu Bootstrap */
.navbar {
	padding: 0 0 20px;
	height: 52px;
	margin-top: -2px;
	margin-right: auto;
	margin-left: auto;
	z-index: 2000;
	position: relative;	
}
.nav-item {
	margin-top: -1px !important;
	position: relative;
}

.navbar-light .navbar-nav .nav-item.active .nav-link::after {
	content: "";
	display: block;
	height: 3px;
	position: absolute;
	top: 100%;
	right: 0;
	left: 0;
	margin-top: -1px;
}

.navbar-light .navbar-nav .nav-link,
.nav-link {
	color: #000;
	padding: 19px 7px 20px;
	text-align: center;
	line-height: 11px;
	white-space: nowrap;
}
.nav-link:hover {
	color: #fff;
	text-decoration: underline;
}


@media (min-width:992px) {
	.navbar-light .navbar-nav .nav-link,
	.nav-link {
		background: linear-gradient(to bottom, rgba(255, 255, 255, 0.18) 0%, rgba(255, 255, 255, 0.55) 100%) center, url(/assets/plancher/papier-creme.jpg) center top white;
	}
	
	#header.container {
		padding-top: 40px;
	}
	.navbar {
		margin-top: -1px;
		margin-left: 0;
		margin-right: 0;
	}
	.nav-item {
		margin-right: 2px;
		margin-left: 2px;
		position: relative;
		z-index: 1;
	}
	.nav-item:hover {
		z-index: 2;
	}
	
	.navbar-light .navbar-nav .nav-link,
	a.nav-link {
		color: black;
		background-color: rgba(255,255,255,1);
		padding-top: 33px;
		transform-origin: 50% 15px;
		transition: transform 0.7s ease-in-out 0s;
		box-shadow: 0 2px 1px rgba(0, 0, 0, 0.5);
		padding-bottom: 14px;
		
		font-weight: 200;
	}
	
	/*
	
	.nav-item::after {
		line-height: 0;
		font-size: 20px;
		text-align: center;
		content: "•";
		color: white;
		z-index: 9;
		display: block;
		position: absolute;
		top: 8px;
		left: 0;
		right: 0;
}*/
	
	.navbar-light .nav-item:nth-child(1) > a:hover { transform: rotate(-1deg) scale(1.1); }
	.navbar-light .nav-item:nth-child(2) > a:hover { transform: rotate(1deg) scale(1.1); }
	.navbar-light .nav-item:nth-child(3) > a:hover { transform: rotate(-1deg) scale(1.1); }
	.navbar-light .nav-item:nth-child(4) > a:hover { transform: rotate(1deg) scale(1.1); }
	.navbar-light .nav-item:nth-child(5) > a:hover { transform: rotate(-1deg) scale(1.1); }
	.navbar-light .nav-item:nth-child(6) > a:hover { transform: rotate(1deg) scale(1.1); }
	.navbar-light .nav-item:nth-child(7) > a:hover { transform: rotate(-1deg) scale(1.1); }
	.navbar-light .nav-item:nth-child(8) > a:hover { transform: rotate(1deg) scale(1.1); }
	.navbar-light .nav-item:nth-child(9) > a:hover { transform: rotate(-1deg) scale(1.1); }
	
	.navbar-light .navbar-nav .nav-link:hover,
	a.nav-link:hover {
		transition: transform 0.2s ease-in-out 0s;
		color: white;
		z-index: 10;
	}
	.navbar-light .navbar-nav .nav-item:nth-child(even) .nav-link:hover {
	}
	li#linkCompagnie.nav-item {
		
	}

}


/* Sous menu */
.dropdown-menu {
	border-radius: 0;
	margin-top: -1px;
	border: none;
}
.dropdown-item {
	padding-top: 10px;
	color: white;
}
.dropdown-item:hover {
	text-shadow: none;
}
.navbar-toggler {
	border: none;
	margin-right: auto;
	margin-left: auto;
	border-radius: 75px;
	width: 75px;
	height: 75px;
	padding: 0;
	margin-top: -14px;
	transition: margin-top 0.5s ease-in-out;
	z-index: 1001;
}
.navbar-toggler.collapsed {
	margin-top: 0;	
}
.navbar-light .navbar-toggler-icon{
	background-image:url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(255, 255, 255, 0.9)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E")
}
.dropdown-toggle::after {
	display: block;
	margin-left: -2px;
	position: absolute;
	top: 100%;
	left: 50%;
	margin-top: -8px;
	opacity: 0.3;
}
.dropdown-toggle:hover::after {
	opacity: 1;
}
.navbar-collapse {
	margin-top: 30px;
}
@media (max-width:991px) {
	.navbar-collapse {
		transition: margin-top 0.5s ease-in-out;
		margin-top: 10px;
	}
	.navbar-collapse.collapse.show {
		background-color: rgba(197, 115, 159, 0.9);
		font-size: 16px;
		transition: background-color 0.2s ease-in-out;
		margin-top: -17px;
		padding-top: 20px;
	}
	.nav-link {
		padding: 40px 20px 10px;
		color: #fff !important;
	}
	a#acces_admin {
		top: 1px !important;
		padding: 0;
	}
	#linkGalerie {
		display: none;
	}

}
/* Ajustement des liens pour faire place au logo */
@media (min-width: 1200px) {
	li#linkCompagnie.nav-item {
		margin-left: 60px;
	}
}


/* Font size du menu qui évolue avec la taille de l'écran */
ul.navbar-nav { font-size: 18px; }

@media (min-width: 992px) {
	ul.navbar-nav { font-size: 16px;
		margin-top: 10px;
	}
}

/*
 *
 *
 *
 *
 *
 *
 *
 Les couleurs
 */
 
 body {
	background-position: center 200px;
}

body > header {
	box-shadow: 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23);
	background: linear-gradient(to bottom, rgba(255, 255, 255, 0.8) 0%, rgba(255, 255, 255, 0.5) 100%), url(/assets/plancher/papier-creme.jpg) white;
	position: relative;
	z-index: 2;
}
body #plancher {
	color: white;
	
	position: relative;
	
	z-index: 0;
}
#plancherFixed {
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	min-height: 100%;
	
	background-image: url(/assets/plancher/5-red.jpg);
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center bottom;
	background-size: 200% 100%;
}


.filtreColor {
	background-color: rgba(245, 97, 81, 0.2);
	display: block;
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
}
/* Ecriture en couleur forte */
h1 mall,
h1 a,
#choix_reservations a:hover,
#numero_resa,
#mail,
#titre_photo,
#mail a,
.news a,
h6,
#piedpage th,
#scene a.reserverLieu,
.galerieModal h1 .titre  {
	color: #ff6251;
}
.scene p a,
.scene .box ul a {
	color: white;
	text-decoration: none;
	position: relative;
}
/* Exception pour la page d'accueil */
body.index .scene p a {
	font-size: 20px;
}
.scene p a::after,
.scene .box ul a::after {
	content: "";
	/* trait de soulignement */
	position: absolute;
	height: 3px;
	bottom: 0;
	right: 0;
	left: 0;
	background-color: #ff6251;
	z-index: -1;
	
	transition: height .8s ease-in-out 0s;
}
.scene p a:hover::after,
.scene .box ul a:hover::after {
	height: 100%;
	transition: height .3s ease-in-out 0s;
	background-color: #bd1705;
}

/* Ecriture en couleur atténuée 1 */
blockquote:before,
.citation_ouvre,
.citation_ferme {
	color: #ff6251;
}
blockquote {
	border-left: 3px solid #ff6251;
}

/* Ecriture en couleur atténuée 2 */
div#qrcode_gd_studioDTM p#fermer_qrcode_studioDTM,
div#qrcode_gd_AGITAKT p#fermer_qrcode_AGITAKT {
	color: #f85cac;
}
/* Ecriture couleur sombre */
a.bouton.gauche,
a.bouton.droite,
/*#stages_lieu,*/
.jsModalLieu:hover,
.jsModalLieu:hover * {
	color: #d5390c;
}
/* Ecrture couleur très sombre */
input[type="text"],
input[type="password"],
textarea {
	color: #000;
}
#connexion input {
	color: white;
}

/* Background flashy */

.navbar-toggler,
a#logout,
a.reserverLieu small,
.scene a.rectoverso,
.r_lieu_cours,
.cours:before,
.debut,
.fin,
.close,
.prix,
.produit h1,
#scene a.reserverProduit,
.admin_form#mise_en_page:before,
.admin_form input,
input.rose,
input[type="submit"],
input#modifier_intro,
input#annuler_identification,
.jour_string,
#complet h2,
.navbar-light .navbar-nav .nav-item.active .nav-link::after {
	background-color: #ff6251;
}
.nav-link:hover,
.navbar-light .navbar-nav .nav-link:hover,
a.nav-link:hover,
.dropdown-menu {
	background-color: #ff6251;
	background-image: none;
}
ul.actionsTel a
 {
	background-color: #ff6251;
	color: white !important;
	text-shadow: none;
}
@media (max-width:991px) {
	.navbar-collapse.collapse.show {
		background-color: rgba(254, 97, 80, 0.9);
	}
}

input[type="submit"]:hover,
ul#timeline li {
	background-color: #ff6251;
}

#contact_erreur {
	background-color: #bd1705;
}

.debut,
.fin {
	border-color: #f52792;
	font-size: 11px;
}

/* Filet orange */
/*#piedpage address,
#piedpage ul.news,
#piedpage #partnaires {
	padding-top: 40px;
}
#piedpage address {
	border-right: 1px solid #ff6250;
	padding-right: 10px;
	margin: 0; 
}
#piedpage ul.news,
#piedpage #partnaires {
	border-left: 1px solid #ff6250;
	padding-left: 10px;
}*/

/* Ombre comme le menu */
#piedpage address,
#piedpage ul.news,
#piedpage #partnaires {
	padding: 40px 10px 10px;
	position: relative;
}
#piedpage address ul {
	padding: 0;
}
#piedpage address li {
	list-style: none;
	padding-bottom: 15px;
}

ul#timeline li:before {
	border-left: 1px solid #ff6250;
}
#scene a.date-material {
	border-bottom: 28px solid #ff6251;
}


/* Nouvelle page pour toutes les nouvelles */
section {
	position: relative;
}
.page_nouvelles div.actu_contenu {	
	box-shadow: 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23);
	background: linear-gradient(to bottom, rgba(255, 255, 255, 0.8) 0%, rgba(255, 255, 255, 0.5) 100%), url(/assets/plancher/papier-creme.jpg) white;
	position: relative;

	color: #000;
	text-shadow: none;
	padding-left: 10px;
	padding-top: 20px;
	padding-bottom: 20px;
}
.page_nouvelles div.actu_contenu.brouillon {	
	opacity: .5;
	filter: grayscale(100%);
	transition: opacity 1s ease-in-out 0s;
}
.page_nouvelles div.actu_contenu.brouillon:hover {	
	opacity: 1;
	transition: opacity .3s ease-in-out 0s;
}
.page_nouvelles div.actu_contenu,
.page_nouvelles div.actu_contenu p {	
	color: #000;
	text-shadow: none;
}
.page_nouvelles div.actu_contenu a,
.page_nouvelles div.actu_contenu p a {
	color: #ff6251;
}
.page_nouvelles div.actu_contenu::before,
.page_nouvelles div.actu_contenu::after {	
	content: "“";
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 78px;
	display: block;
	color: #ff6251;
	position: absolute;
}
.page_nouvelles div.actu_contenu::after {	
	content: "”";
	display: none;
}
.page_nouvelles div.actu_contenu::before {
	top: 15px;
	left: -15px;
}
#erreur {
	display: block;
	position: absolute;
	top: 5px;
	background-color: maroon;
	color: white;
	z-index: 1000;
	border-radius: 3px;
	padding: 10px;
}





ul.news .owl-nav {
	display: none;
}


#update {
	display: block;
	position: absolute;
	
	max-width: 350px;
	
	top: 50px;
	left: calc(50% - 175px);
	z-index: 10000;
	
	background-color: #ff6251;
	padding: 70px 15px 15px;
	box-shadow: 0 1px 10px rgba(0, 0, 0, 0.54);
	
}
#update::before {
	content: "";
	display: block;
	width: 120px; height: 120px;
	background-color: white;
	position: absolute;
	top: -60px;
	left: calc(50% - 60px);
	border-radius: 50%;

	background-image: url(/images/logo-gris.png);
	background-size: 100px;
	background-repeat: no-repeat;
	background-position: center;
}