@font-face {
	font-family: 'slogan';
	src: url('edosz.ttf');
	src: url('edosz.eot?#iefix') format('embedded-opentype'),
			 url('edosz.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: 'texte_normal';
	src: url('Lavi.ttf');
	src: url('Lavi.eot?#iefix') format('embedded-opentype'),
			 url('Lavi.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: 'texte_gras';
	src: url('Lavi.ttf');
	src: url('Lavi.eot?#iefix') format('embedded-opentype'),
			 url('Lavi.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: 'police_spectacle';
	src: url('typewcond_regular.ttf');
	src: url('typewcond_regular.eot?#iefix') format('embedded-opentype'),
			 url('typewcond_regular.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;
}
/*************************************************************************************/
/****	 ELEMENTS COMMUNS A TOUTES LES PAGES	
/*************************************************************************************/

*{
    margin:0;
    padding:0;
}
body{
    background:#222222;
	font-family: 'texte_normal';
	font-size: 100%;
    width:11500px; 		
    position:absolute;
    top:0px;
    left:0px;
    bottom:0px;
	height: 100%;
}
a{
	text-decoration:none;
	color:#000000;
}

a.lien_site{
	text-decoration:none;
	color: inherit;
	cursor: text;
}

.center{
	text-align:center;
}

h1{
	font-size: 180%;
	height:60px;
	margin-top:-60px;
}

h1.titre_box{
	margin-top:inherit;
	height:auto;
	font-size:160%;
}

h2{
	font-size: 160%;
	height:60px;
	margin-top:-60px;
}
h2.sous_titre_box{
	margin-top:inherit;
	height:auto;
	font-size:120%;
}
.section{
    margin:0px;
    bottom:0px;
    float:left;
    height:100%;

	background: #45484d url(../images/bg_page.jpg) repeat-x top left; /* Old browsers */
	background: url(../images/bg_page.jpg) repeat-x top left, -moz-linear-gradient(bottom,  #45484d 0%, #000000 30%); /* FF3.6+ */
	background: url(../images/bg_page.jpg) repeat-x top left, -webkit-gradient(linear, left bottom, left top, color-stop(0%,#45484d), color-stop(30%,#000000)); /* Chrome,Safari4+ */
	background: url(../images/bg_page.jpg) repeat-x top left, -webkit-linear-gradient(bottom,  #45484d 0%,#000000 30%); /* Chrome10+,Safari5.1+ */
	background: url(../images/bg_page.jpg) repeat-x top left, -o-linear-gradient(bottom,  #45484d 0%,#000000 30%); /* Opera 11.10+ */
	background: url(../images/bg_page.jpg) repeat-x top left, -ms-linear-gradient(bottom,  #45484d 0%,#000000 30%); /* IE10+ */
	background: url(../images/bg_page.jpg) repeat-x top left, linear-gradient(to top,  #45484d 0%,#000000 30%); /* W3C */
	/*filter:  progid:DXImageTransform.Microsoft.gradient( startColorstr='#000000', endColorstr='#45484d',GradientType=0 ); /* IE6-9 */

}



/******** Gestion du MENU dans la COLONNE MORRIS ****************************************************/
.menu{
	background: url(../images/colonne.png) no-repeat top left; 
	float:left;
	margin:18px 50px;
	padding:190px 60px 120px 41px;
    font-family:'texte_normal';
    font-size: 90%;
	line-height:20px;
}

.m1{
	margin-left:150px; /*le tout premier menu (page ACCUEIL) est un peu plus à droite que les autres par rapport au bord gauche de la section*/
}

.menu ul{
	width:137px;
}

.menu .nav{
	list-style:none;
	list-style-image:url(../images/separateur_h10.png);
	list-style-position:inside;
}
.menu li  {
    background:#ffffff;
	padding-top:5px;
	padding-left:1px;
	padding-bottom:13px;
	text-align:center;
}

.menu li.rouge:hover {
    background:url(../images/fd_rouge.png) no-repeat top left; 
	background-size:100% 100%;
}
.menu li.jaune:hover {
	background: url(../images/fd_jaune.png) no-repeat top left; 
	background-size:100% 100%;
}
.menu li.violet:hover {
    background:url(../images/fd_mauve.png) no-repeat top left; 
	background-size:100% 100%;
}
.menu li.orange:hover {
    background:url(../images/fd_orange.png) no-repeat top left; 
	background-size:100% 100%;
}

.rouge .menu li.actif{
    background: url(../images/fd_rouge.png) no-repeat top left; 
	background-size:100% 100%;
}
.jaune .menu li.actif{
	background: url(../images/fd_jaune.png) no-repeat top left; 
	background-size:100% 100%;
}
.violet .menu li.actif{
    background: url(../images/fd_mauve.png) no-repeat top left; 
	background-size:100% 100%;
}
.orange .menu li.actif{
    background: url(../images/fd_orange.png) no-repeat top left; 
	background-size:100% 100%;
}


.menu .retour {
	font-size:90%;
	font-family:'texte_normal';
	width:124px;
	padding:5px 0;
	line-height:8px;
}
.menu  .retour .nav{
	list-style-image:url(../images/retour.png);
}
.menu .retour li {
	background:transparent;
}
.menu .retour .nav a:hover{
	text-decoration:underline;
}
/******* fin gestion du menu dans la colonne Morris *******************/


/******************** CONTACT (ligne avec num tel et email) ************/
.contact{
    position:absolute;
	opacity:0.9;
	margin:610px 480px;
	padding:5px;	
	font-size: 120%;
	
}
.contact a:hover{	
	text-decoration:underline;
}


/********** gestion des affiches en fction de leur couleur **********/
.fd_rouge, .fd_rouge_cliquable{
	background: url(../images/fd_rouge.png) no-repeat top left; 
	background-size:100% 100%;
}
.fd_rouge_cliquable:hover{
	background: url(../images/fd_rougeclair1.png) no-repeat top left;
	background-size:100% 100%;
	cursor : pointer;
}
.fd_rougeclair{
	background: url(../images/fd_rougeclair1.png) no-repeat top left;
	background-size:100% 100%;
}
.fd_rougefonce, .fd_rougefonce_cliquable{
	background: url(../images/fd_rougefonce.png) no-repeat top left; 
	background-size:100% 100%;
}
.fd_rougefonce_cliquable:hover{
	background: url(../images/fd_rougeclair1.png) no-repeat top left;
	background-size:100% 100%;
	cursor : pointer;
}

.fd_jaune, .fd_jaune_cliquable{
	background: url(../images/fd_jaune.png) no-repeat top left; 
	background-size:100% 100%;
}
.fd_jaune_cliquable:hover{
	background: url(../images/fd_jauneclair.png) no-repeat top left;
	background-size:100% 100%;
	cursor : pointer;
}
.fd_orange, .fd_orange_cliquable{
	background: url(../images/fd_orange.png) no-repeat top left; 
	background-size:100% 100%;
}
.fd_orange_cliquable:hover{
	background: url(../images/fd_orangeclair.png) no-repeat top left;
	background-size:100% 100%;
	cursor : pointer;
}
.fd_mauve, .fd_mauve_cliquable{
	background: url(../images/fd_mauve.png) no-repeat top left;
	background-size:100% 100%;
}
.fd_mauve_cliquable:hover{
	background: url(../images/fd_mauveclair.png) no-repeat top left;
	background-size:100% 100%;
	cursor : pointer;
}

/********** gestion des fenetres arrivant en surimpression *****************/
.box{
   display:none;
   width:980px;
   height:600px;
   overflow:none;
}

/************ gestion de la fin d'une section avec poteau rouge ************/
.finsection{
	background: url(../images/poteau.png) no-repeat top left; 
	background-size:100% 100%;
	width:75px;
	height:800px;
}


/*************************************************************************************/
/****	 ELEMENTS SPECIFIQUES SELON LES PAGES
/*************************************************************************************/


/**************** SPECIFIQUE page_accueil ***************************/
#page_accueil{
	width:2000px;
}
#page_accueil .finsection{
	margin-left:1430px;
}

#page_accueil .rideau{
    position:absolute;
	float:left;
}
#page_accueil .rideau img{
	height:800px;
	width:170px;
}

#page_accueil .logo_principal{
    position:absolute;
	margin:50px 370px;	
	border:0px solid red;
	padding:20px;
}
#page_accueil .logo_principal img{
    width:800px;
}

#page_accueil .affiche1{
    position:absolute;
	margin-top:365px;
	margin-left:590px;
	width:500px;
	text-align:center;
	font-family:"texte_gras";
	font-size:160%;
    text-shadow:0px 1px 1px #444444;
	transform: rotate(-5deg);
	-moz-transform: rotate(-5deg);
	-webkit-transform: rotate(-5deg);
	-o-transform: rotate(-5deg);
	-ms-transform: rotate(-5deg);
	border:0px solid red;
	z-index:10;
}

#page_accueil .affiche1 p.petit{
	font-size:100%;
	font-family:"texte_gras";
	text-shadow:none;
}
#page_accueil .motscles{ /* situés sous l'affiche rouge centrale */
    position:absolute;
	margin-top:375px;
	margin-left:590px;
	width:490px;
	transform: rotate(-5deg);
	-moz-transform: rotate(-5deg);
	-webkit-transform: rotate(-5deg);
	-o-transform: rotate(-5deg);
	-ms-transform: rotate(-5deg);
	z-index:0;
}
#page_accueil .association{
	position:absolute;
	padding:5px;
	margin-top:100px;
	margin-left:1250px;
	transform: rotate(10deg);
	-moz-transform: rotate(10deg);
	-webkit-transform: rotate(10deg);
	-o-transform: rotate(10deg);
	-ms-transform: rotate(10deg);
	
}

#page_accueil .masques{
	position:absolute;
	margin-top:360px;
	margin-left:380px;
	z-index:0;
}
#page_accueil .masques img{
	width:150px;
	z-index:0;
}
#page_accueil .graff{
	font-family:'slogan';
	font-size:200%;
    text-shadow:0px 2px 2px #FFB273;
	border:0px solid red;
	color:#444444;
	text-align:center;
	transform: rotate(-8deg);
	-moz-transform: rotate(-8deg);
	-webkit-transform: rotate(-8deg);
	-o-transform: rotate(-8deg);
	-ms-transform: rotate(-8deg);
}
#page_accueil .s1{
	background:none;
    position:absolute;
	margin-top:200px;
	margin-left:1250px;
	width:200px
}
#page_accueil .s2{
	background:none;
    position:absolute;
	margin-top:395px;
	margin-left:1150px;
	width:200px;
	transform: rotate(-15deg);
	-moz-transform: rotate(-15deg);
	-webkit-transform: rotate(-15deg);
	-o-transform: rotate(-15deg);
	-ms-transform: rotate(-15deg);


}
/**** box après clic sur affiche1 : *****/
#tesquitoi{
	background:#d7a4a5;
	background-size:100% 100%;
	width:630px;
	padding:20px;
}

#tesquitoi table td{
	padding:5px;
	vertical-align:top;
}
#tesquitoi table td.gauche{
	width:47%;
	padding-right:20px;
}



/*-------------------------------------------------------------------------*/
/************************ SPECIFIQUE page_saison ***************************/
#page_saison{
	width:2000px;
}
#page_saison .finsection{
	margin-left:1600px;
}

#page_saison .slogan{
    position:absolute;
	text-align:center;
	font-family:'slogan';
	font-size:30px;
    text-shadow:0px 2px 2px #FFB273;
	border:0px solid red;
	color:#663333;
}
#page_saison .s1{
	margin-top:420px;
	margin-left:280px;
	transform: rotate(-8deg);
	-moz-transform: rotate(-8deg);
	-webkit-transform: rotate(-8deg);
	-o-transform: rotate(-8deg);
	-ms-transform: rotate(-8deg);
}
#page_saison .s2{
	margin-top:230px;
	margin-left:1520px;
}

#page_saison .annee {
    position:absolute;
	margin-top:40px;
	margin-left:450px;
	padding-bottom:-50px;
	width:230px;
	height: 30px;
	text-align:center;
	font-family:'slogan';
	font-size:30px;
    text-shadow:0px 2px 2px #FFB273;
	color:#663333;
	transform: rotate(-8deg);
	-moz-transform: rotate(-8deg);
	-webkit-transform: rotate(-8deg);
	-o-transform: rotate(-8deg);
	-ms-transform: rotate(-8deg);
	z-index:10;
}

#page_saison .affiche1{
    position:absolute;
	margin-top:65px;
	margin-left:300px;
	width:425px;
	padding:20px;
}

#page_saison .affiche2{
    position:absolute;
	margin-top:360px;
	margin-left:635px;
	padding:5px 20px;
	font-size:16px;
}
#page_saison .affiche2 span{
	float:left;
}

#theme {
	width:500px;
	padding:20px;
}

#page_saison .photo_illustration{
    position:absolute;
	margin-top:45px;
	margin-left:830px;
	padding:20px;
}

#page_saison .rentree{
    position:absolute;
	margin-top:85px;
	margin-left:1140px;
	padding:20px;
	font-size:16px;
	transform: rotate(-5deg);
	-moz-transform: rotate(-5deg);
	-webkit-transform: rotate(-5deg);
	-o-transform: rotate(-5deg);
	-ms-transform: rotate(-5deg);
}

#page_saison .automne{
    position:absolute;
	margin-top:230px;
	margin-left:1185px;
	padding:10px;
	transform: rotate(-5deg);
	-moz-transform: rotate(-5deg);
	-webkit-transform: rotate(-5deg);
	-o-transform: rotate(-5deg);
	-ms-transform: rotate(-5deg);
}
#page_saison .hiver{
    position:absolute;
	margin-top:330px;
	margin-left:1290px;
	padding:10px;
	transform: rotate(-5deg);
	-moz-transform: rotate(-5deg);
	-webkit-transform: rotate(-5deg);
	-o-transform: rotate(-5deg);
	-ms-transform: rotate(-5deg);
}
#page_saison .ete{
    position:absolute;
	margin-top:440px;
	margin-left:1290px;
	padding:10px;
	transform: rotate(-5deg);
	-moz-transform: rotate(-5deg);
	-webkit-transform: rotate(-5deg);
	-o-transform: rotate(-5deg);
	-ms-transform: rotate(-5deg);
}

#page_saison table{
	font-size:16px;
}

#page_saison table td{
	padding-left:10px;
	padding-top:2px;
	vertical-align:top;
}
#page_saison table td.decal_left{
	padding-left:25px;
}
#page_saison table td span.petit{
	font-size:14px;
	text-align:left;
	padding:0;
}

/** spécifique évenements **/
.box_jaune{
	background:#faf3c4;
	background-size:100% 100%;
	padding:20px;
}

/**************** SPECIFIQUE rentree.html ***************************/
#rentree .titre{
	text-align:center;
	font-family:"slogan";
	font-size:28px;
	margin-bottom:-20px;
}

#rentree .logo_principal img{
    width:300px;
	margin-bottom:20px;
}
#rentree .logo_principal{
	text-align:center;
}

#rentree .texte{
	text-align:center;
}

#rentree .texte p{
	font-size:28px;
	font-family:"texte_gras";
}

#rentree .strophe{
	transform: rotate(-5deg);
	-moz-transform: rotate(-5deg);
	-webkit-transform: rotate(-5deg);
	-o-transform: rotate(-5deg);
	-ms-transform: rotate(-5deg);
}
#rentree  ul {
	list-style-type:none;
	padding:0px;
	margin:0px;
}
#rentree  ul li{
	background-image:url(../images/retour.png);
	background-size:12px;
	background-repeat: no-repeat;
	background-position: 5px 10px; 
	padding-left: 20px; 
}

#rentree .s1{
	margin-left:40px;
	margin-top:20px;
}

#rentree .s2{
	margin-top:-40px;
	margin-left:310px;
}

#rentree .s3{
	margin-left:10px;
	margin-top:10px;
}

#rentree .adresse{
	text-align:right;
	font-family:"texte_gras";
	font-size:24px;
}
#rentree .petit{
	font-size:18px;
}

#rentree .plan img{
    width:600px;
}
/**************** SPECIFIQUE automne.html ***************************/
#automne {
	width:520px;
}
/**************** SPECIFIQUE hiver.html ***************************/
#hiver {
	width:520px;
}
/**************** SPECIFIQUE ete.html ***************************/
#ete {
	width:520px;
}




/*-------------------------------------------------------------------------*/
/**************** SPECIFIQUE page_compagnie ********************************/
#page_compagnie{
	width:2500px;
}
#page_compagnie .finsection{
	margin-left:1740px;
}
   
#page_compagnie .affiche1{
    position:absolute;
	margin-top:70px;
	margin-left:300px;
	width:450px;
	padding:20px;
}
.box_mauve{
	width:650px;
	padding:40px;
	padding-bottom:50px;
	background: #d0abd4;
	background-size:100% 100%;
}
#page_compagnie .affiche2{
    position:absolute;
	width:390px;
	margin-top:260px;
	margin-left:660px;
	padding:20px;
	font-size:16px;
}
#page_compagnie .affiche2 img{
	margin:10px 45px;
}

#page_compagnie .affiche3{
    position:absolute;
	margin-top:55px;
	margin-left:1120px;
	padding:20px;
	width:390px;	
	font-size:16px;
}
#page_compagnie .affiche3 img{
	margin:10px 45px;
}

#page_compagnie table td{
	width:10%;
	padding:10px;
}
#page_compagnie .activite{
    position:absolute;
	padding:20px;
}

#page_compagnie .etymologie{
    position:absolute;
	width:640px;
	margin-top:55px;
	margin-left:1570px;
	padding:20px;
}
#page_compagnie .etymologie table{
	background:none;
    text-shadow:1px 1px 2px #B9BDA1;
	color:#6c2f74;
	font-family:'slogan';
	font-size:22px;	
}
#page_compagnie .etymologie table td.grand{
	font-size:24px;	
	padding:0px;
}

#page_compagnie .slogan{
    position:absolute;
	width:500px;
	text-align:center;
	font-family:'slogan';
	font-size:32px;
    text-shadow:2px 2px 2px #B9BDA1;
	color:#6c2f74;
	transform: rotate(5deg);
	-moz-transform: rotate(5deg);
	-webkit-transform: rotate(5deg);
	-o-transform: rotate(5deg);
	-ms-transform: rotate(5deg);
}
#page_compagnie .s1{
	margin-top:340px;
	margin-left:220px;
}
#page_compagnie .s2{
	margin-top:450px;
	margin-left:860px;
}
#page_compagnie .s2 img{
	opacity: 0.9;
}
#page_compagnie .s2 img:hover{
	opacity: 1;
	cursor : pointer;
}


/*-------------------------------------------------------------------------*/
/**************** SPECIFIQUE page_creations ********************************/

#page_creations{
	width:3000px;
}

#page_creations .finsection{
	margin-left:2800px;
}

#page_creations .affiche1{
    position:absolute;
	margin-top:80px;
	margin-left:300px;
	padding:20px 20px 30px 20px;
	width:560px;
}

.box_orange{
	background:#fdca9c;
	background-size:100% 100%;
	padding:20px;
	width:500px;
}

#page_creations .slogan{
    position:absolute;
	margin-top:60px;
	margin-left:780px;
	width:500px;
	text-align:center;
	font-family:'slogan';
	font-size:32px;
    text-shadow:1px 1px 2px #FA9E4D;
	border:0px solid red;
	color:#386D7E;
	transform: rotate(5deg);
	-moz-transform: rotate(5deg);
	-webkit-transform: rotate(5deg);
	-o-transform: rotate(5deg);
	-ms-transform: rotate(5deg);
	z-index:10;
}

#page_creations .spectacles_jeunes{
	position:absolute;
	margin-top:140px;
	margin-left:950px;
	width : 830px;
}

#page_creations .spectacles_jeunes .photo1{
	width:190px;
	float:left;
	transform: rotate(5deg);
	-moz-transform: rotate(5deg);
	-webkit-transform: rotate(-5deg);
	-o-transform: rotate(5deg);
	-ms-transform: rotate(5deg);
	margin-top:20px;
	margin-left:00px;
}

#page_creations .spectacles_jeunes .photo2{
	width:210px;
	float:left;
	transform: rotate(-8deg);
	-moz-transform: rotate(-8deg);
	-webkit-transform: rotate(8deg);
	-o-transform: rotate(-8deg);
	-ms-transform: rotate(-8deg);
	margin-top:60px;
}
#page_creations .spectacles_jeunes .photo3{
	width:180px;
	float:left;
	transform: rotate(2deg);
	-moz-transform: rotate(2deg);
	-webkit-transform: rotate(2deg);
	-o-transform: rotate(2deg);
	-ms-transform: rotate(2deg);
	margin-top:50px;
}
#page_creations .spectacles_jeunes .photo4{
	width:170px;
	float:left;
	transform: rotate(-12deg);
	-moz-transform: rotate(-12deg);
	-webkit-transform: rotate(-12deg);
	-o-transform: rotate(-12deg);
	-ms-transform: rotate(-12deg);
	margin-top:10px;
}

#page_creations .spectacles_jeunes span {
	background: rgba(0, 0, 0, 0.7); /* Les légendes auront un arrière-plan noir avec une opacité de 50% */
	color: #fff;
	display: block;
	font-weight: bold;
	left: 0;
	position: absolute;
	z-index: 20;
	bottom:6px;		
	width:100%;
}
#page_creations .spectacles_adultes{
	position:absolute;
	margin-top:70px;
	margin-left:1850px;
	width : 880px;
}

#page_creations .spectacles_adultes .photo1{
	width:270px;
	float:left;
	transform: rotate(-8deg);
	-moz-transform: rotate(-8deg);
	-webkit-transform: rotate(-8deg);
	-o-transform: rotate(-8deg);
	-ms-transform: rotate(-8deg);
	margin-top:60px;
	margin-left:20px;
}

#page_creations .spectacles_adultes .photo2{
	width:240px;
	float:left;
	transform: rotate(5deg);
	-moz-transform: rotate(5deg);
	-webkit-transform: rotate(5deg);
	-o-transform: rotate(5deg);
	-ms-transform: rotate(5deg);
	margin-top:28px;
}
#page_creations .spectacles_adultes .photo3{
	width:160px;
	float:left;
	transform: rotate(-2deg);
	-moz-transform: rotate(-2deg);
	-webkit-transform: rotate(-08deg);
	-o-transform: rotate(-2deg);
	-ms-transform: rotate(-2deg);
	margin-top:30px;
}
#page_creations .spectacles_adultes .photo4{
	width:160px;
	float:left;
	transform: rotate(-12deg);
	-moz-transform: rotate(-12deg);
	-webkit-transform: rotate(6deg);
	-o-transform: rotate(-12deg);
	-ms-transform: rotate(-12deg);
	margin-top:2px;
}

#page_creations .spectacles_adultes span {
	background: rgba(0, 0, 0, 0.7); /* Les légendes auront un arrière-plan noir avec une opacité de 50% */
	color: #fff;
	display: block;
	font-weight: bold;
	left: 0;
	position: absolute;
	z-index: 20;
	bottom:6px;		
	width:100%;
}	

#page_creations .autres{
	clear:both;
	padding-bottom: 20px;
}

#page_spectacles_jeunes .spectacles{
	position:absolute;
	margin-top:70px;
	margin-left:20px;
	}
#page_spectacles_jeunes .spectacle{
	float : left;
	padding:10px; 
}

#page_spectacles_jeunes .sstitre{
	font-size:14px;
}
#page_spectacles_jeunes .s1{
	margin-top:120px;
	margin-left:10px;
}
#page_spectacles_jeunes .s2{
	margin-top:20px;
	margin-left:10px;
}
#page_spectacles_jeunes .s3{
	margin-top:110px;
	margin-left:15px;
}
#page_spectacles_jeunes .s4{
	margin-top:5px;
	margin-left:12px;
}
#page_spectacles_jeunes .s5{
	margin-top:30px;
	margin-left:24px;
}
#page_spectacles_jeunes .s6{
	margin-top:80px;
	margin-left:26px;
}
#page_spectacles_jeunes .s7{
	margin-top:10px;
	margin-left:10px;
}
#page_spectacles_jeunes .s8{
	margin-top:60px;
	margin-left:13px;
}
#page_spectacles_jeunes .s9{
	margin-top:20px;
	margin-left:9px;
}
#page_spectacles_jeunes .s10{
	margin-top:110px;
	margin-left:7px;
}
#page_spectacles_jeunes .s11{
	margin-top:10px;
	margin-left:20px;
}
#page_spectacles_jeunes .s12{
	margin-top:80px;
	margin-left:15px;
}
#page_spectacles_jeunes .s13{
	margin-top:120px;
	margin-left:10px;
}

#page_spectacles_jeunes .s14{
	margin-top:80px;
	margin-left:10px;
}
/*
#page_spectacles_jeunes .s14{
	margin-top:90px;
	margin-left:12px;
}
*/


#page_spectacles_jeunes .photo img{
	display:block;
	margin: 0 auto;
}
#page_spectacles_jeunes .photo img{
	border:2px solid #f14908;
}
#page_spectacles_jeunes .photo img:hover{
	border:2px solid white;
}

#page_spectacles_jeunes .titre{
    position:absolute;
	margin-top:600px;
	margin-left:500px;
	font-family:'slogan';
	font-size:32px;
    text-shadow:1px 1px 2px #0f0f0f;
}
.page{
	padding:10px;
	color:#FFFFCC;
}

#page_spectacles_adultes .spectacles{
	position:absolute;
	margin-top:70px;
	margin-left:20px;
	}
#page_spectacles_adultes .spectacle{
	float : left;
	padding:10px; 
}

#page_spectacles_adultes .sstitre{
	font-size:14px;
}
#page_spectacles_adultes .s1{
	margin-top:120px;
	margin-left:10px;
}
#page_spectacles_adultes .s2{
	margin-top:20px;
	margin-left:10px;
}
#page_spectacles_adultes .s3{
	margin-top:80px;
	margin-left:15px;
}
#page_spectacles_adultes .s4{
	margin-top:25px;
	margin-left:12px;
}
#page_spectacles_adultes .s5{
	margin-top:70px;
	margin-left:24px;
}
#page_spectacles_adultes .s6{
	margin-top:20px;
	margin-left:26px;
}
#page_spectacles_adultes .s7{
	margin-top:140px;
	margin-left:10px;
}
#page_spectacles_adultes .s8{
	margin-top:80px;
	margin-left:13px;
}

#page_spectacles_adultes .s9{
	margin-top:40px;
	margin-left:9px;
}


#page_spectacles_adultes .photo img{
	display:block;
	margin: 0 auto;
}
#page_spectacles_adultes .photo img{
	border:2px solid #f14908;
}
#page_spectacles_adultes .photo img:hover{
	border:2px solid white;
}

#page_spectacles_adultes .titre{
    position:absolute;
	margin-top:600px;
	margin-left:500px;
	font-family:'slogan';
	font-size:32px;
    text-shadow:1px 1px 2px #0f0f0f;
}
/*-------------------------------------------------------------------------*/
/**************** SPECIFIQUE page_evenement ********************************/
#page_evenement{
	width:2000px;
}

#page_evenement .infos{
	position:absolute;
	margin-top:120px;
	margin-left:270px;
	transform: rotate(-12deg);
	-moz-transform: rotate(-12deg);
	-webkit-transform: rotate(-12deg);
	-o-transform: rotate(-12deg);
	-ms-transform: rotate(-12deg);
	z-index : 50;
	text-align : center;
	padding : 10px;


}

#page_evenement .evenement{
	position:absolute;
	margin-top:135px;
	font-family:'texte_normal';
	font-size:100%;
	padding:10px 25px;
	text-align:center;
}

#page_evenement .rien{
	margin-top:270px;
	margin-left:390px;
	width:500px;
}


#page_evenement .rentree{
	margin-left:320px;
	width:700px;
}

#page_evenement .automne{
	margin-top:160px;
	margin-left:365px;
	width:700px;
}

#page_evenement .hiver{
	margin-left:410px;
	width:640px;
}

#page_evenement .ete{
	margin-left:300px;
	width:800px;
}

#page_evenement .infosete{
	color : #F3F781;
	font-size:130%;
}
#page_evenement .tarif{
	color : #F3F781;
	font-size:130%;
	margin-top:400px;
	margin-left:1020px;

}
#page_evenement .ete .piece_jeunes{
	transform: rotate(0deg);
	-moz-transform: rotate(0deg);
	-webkit-transform: rotate(-8deg);
	-o-transform: rotate(-0deg);
	-ms-transform: rotate(-8deg);
	margin-left:0px;
	width:350px;
	float : left;
	padding:10px;
	color: #ecb6b8;
}
#page_evenement .ete .piece_adultes{
	transform: rotate(8deg);
	-moz-transform: rotate(8deg);
	-webkit-transform: rotate(8deg);
	-o-transform: rotate(8deg);
	-ms-transform: rotate(8deg);
	margin-left:30px;
	width:360px;
	float : right;
	padding:10px;
	color: #ecb6b8;
}
#page_evenement p.titre{
	text-align:center;
	font-size:140%;
	font-family:'texte_gras';
}

#page_evenement p.sous-titre{
	text-align:center;
	font-size:110%px;
	font-family:'texte_gras';
}
#page_evenement p.texte{
	text-align:left;
}

#page_evenement .lien_resas{
	text-decoration: underline;
	font-family:'texte_gras';
}

#page_evenement .lien:hover{
	color:#ecb6b8;
}

#page_evenement .encours{
	position:absolute;
	margin-top:200px;
	margin-left:290px;
	font-family:'texte_gras';
	font-size:140%;
	width:600px;
	padding:20px;
	text-align:center;
}

#page_evenement .img{
	float:center;
}

#page_evenement .slogan{
	position:absolute;
	font-family:'slogan';
	font-size:180%;
    text-shadow:0px 2px 2px #FFB273;
	border:0px solid red;
	color:#444444;
	text-align:center;
	transform: rotate(-8deg);
	-moz-transform: rotate(-8deg);
	-webkit-transform: rotate(-8deg);
	-o-transform: rotate(-8deg);
	-ms-transform: rotate(-8deg);
}
#page_evenement .s1{
	margin-top:115px;
	margin-left:1210px;
}
#page_evenement .s2{
	margin-top:290px;
	margin-left:1240px;	
}
	
#page_evenement .noeud{
	position:absolute;
	font-family:'slogan';
	font-size:140%;
    text-shadow:0px 4px 4px #FFB273;
	border:0px solid red;
	color:#222222;
	text-align:center;
	
	margin-top:440px;
	margin-left:1210px;
}

#page_evenement .noeudresa{
	position:absolute;
	font-family:'slogan';
	font-size:180%;
    text-shadow:0px 4px 4px #FFB273;
	border:0px solid red;
	color:#222222;
	text-align:center;
	
	margin-top:430px;
	margin-left:1160px;
}

#page_evenement .acces_restreint{
	position:absolute;
	font-family:'slogan';
	font-size:100%;
    text-shadow:0px 2px 2px #FFB273;
	border:0px solid red;
	color:#222222;
	text-align:left;
	margin-top:460px;
	margin-left:1299px;
	transform: rotate(-8deg);
	-moz-transform: rotate(-8deg);
	-webkit-transform: rotate(-8deg);
	-o-transform: rotate(-8deg);
	-ms-transform: rotate(-8deg);
}	
#page_evenement .finsection{
	margin-left:1500px;
}
/*** page evenement, dans le cas de l'affiche de la rentrée ***/
/**************** SPECIFIQUE rentree.html ***************************/
#page_evenement .titrerentree{
	text-align:center;
	font-family:"slogan";
	font-size:28px;
	margin-bottom:-20px;
}

#page_evenement .logo_principal img{
    width:300px;
	margin-bottom:10px;
}
#page_evenement .logo_principal{
	text-align:center;
}

#page_evenement .texte{
	text-align:center;
}

#page_evenement .texte p{
	font-size:28px;
	font-family:"texte_gras";
}

#page_evenement .strophe{
	float : left;
	transform: rotate(-5deg);
	-moz-transform: rotate(-5deg);
	-webkit-transform: rotate(-5deg);
	-o-transform: rotate(-5deg);
	-ms-transform: rotate(-5deg);
}
#page_evenement  .strophe ul {
	list-style-type:none;
	padding:0px;
	margin:0px;
}
#page_evenement  .strophe ul li{
	background-image:url(../images/retour.png);
	background-size:12px;
	background-repeat: no-repeat;
	background-position: 5px 10px; 
	padding-left: 20px; 
	padding-right: 20px;
	text-align: left;
}

#page_evenement .adresse{
	text-align:center;
	font-family:"texte_gras";
	font-size:24px;
}

#page_evenement .adresse:hover{
	color: #FFB273;
}

#page_evenement .petit{
	font-size:18px;
}

#page_evenement .plan img{
    width:600px;
}

/*** fancybox affichée lors de l'evenements d'été */
#spectacle_jeunes {
	background-color:#590305;
	font-family: 'police_spectacle';
	font-size : 90%;
	color:#dfd079;
	width:810px;
	padding : 20px;
}
#spectacle_jeunes .titre_box{
	font-family: 'slogan';
	font-size : 38px;;
	text-align:center;
}
#spectacle_jeunes .sous-titre_box{
	font-family: 'slogan';
	font-size : 26px;
	text-align:center;
}
#spectacle_jeunes .sous-sous-titre_box{
	text-align:center;
}

#spectacle_jeunes img{
	width:30%;
}


#spectacle_jeunes img.right{
	float:right;
	padding-left:10px;
}
#spectacle_jeunes img.left{
	float:left;
	padding-right:10px;
}
#spectacle_jeunes img.fin_jeunes{
	width:100%;
}
#spectacle_jeunes table.fin_jeunes td{
	width:50%;
	text-align:center;
}
#spectacle_jeunes table.fin_jeunes td.right{
	float:right;
}
#spectacle_adultes {
	background-color:#590305;
	font-family: 'police_spectacle';
	font-size : 90%;
	color:#dfd079;
	width:800px;
	padding : 20px;
}
#spectacle_adultes .titre_box{
	font-family: 'slogan';
	font-size : 38px;;
	text-align:center;
}
#spectacle_adultes .sous-titre_box{
	font-family: 'slogan';
	font-size : 26px;;
	text-align:center;
}
#spectacle_adultes .sous-sous-titre_box{
	text-align:center;
}

#spectacle_adultes .text_box_center{
	text-align:center;
	float:right;
	padding-left:20px;
}


#spectacle_adultes img.right{
	float:right;
	padding-left:10px;
}
#spectacle_adultes img.left{
	float:left;
	padding-right:10px;
}

#spectacle_adultes table.fin_adultes{
	width:100%;
}
#spectacle_adultes table.fin_adultes td{
	width:33%;
	text-align:center;
}
#spectacle_adultes table.fin_adultes td.right{
	float:right;
}


#spectacle_jeunes .lien_resa, #spectacle_jeunes .lien_resa a, #spectacle_adultes .lien_resa, #spectacle_adultes .lien_resa a{
	text-align : center;
	font-family: 'police_spectacle';
	font-size : 150%;
	color:#dfd079;
	text-decoration : underline;
	
}

/* ---------------------------------------------------------------------------------- */
/* gestion des pages uniques apres clic dans les affiches "activités de la compagnie" */
/* ---------------------------------------------------------------------------------- */
#body_page.body_page_activites{
    width:3500px;
}
#body_page.body_page_spectacles_jeunes{
    width:7900px;
}
#body_page.body_page_spectacles_adultes{
    width:7500px;
}

.page_unique{
    height:100%;
	background: #45484d url(../images/bg_page.jpg) repeat top left; /* Old browsers */
	background: url(../images/bg_page.jpg) repeat top left, -moz-linear-gradient(bottom,  #45484d 0%, #000000 30%); /* FF3.6+ */
	background: url(../images/bg_page.jpg) repeat top left, -webkit-gradient(linear, left bottom, left top, color-stop(0%,#45484d), color-stop(30%,#000000)); /* Chrome,Safari4+ */
	background: url(../images/bg_page.jpg) repeat top left, -webkit-linear-gradient(bottom,  #45484d 0%,#000000 30%); /* Chrome10+,Safari5.1+ */
	background: url(../images/bg_page.jpg) repeat top left, -o-linear-gradient(bottom,  #45484d 0%,#000000 30%); /* Opera 11.10+ */
	background: url(../images/bg_page.jpg) repeat top left, -ms-linear-gradient(bottom,  #45484d 0%,#000000 30%); /* IE10+ */
	background: url(../images/bg_page.jpg) repeat top left, linear-gradient(to top,  #45484d 0%,#000000 30%); /* W3C */

    margin:0px;
    bottom:0px;
	width:100%;
    float:left;
}
#activites .activite{
    position:absolute;
	padding:10px 20px 20px 20px;
	
}
#activites .atelier{
	margin-top:60px;
	margin-left:50px;
}
#activites .cineclub{
	margin-top:240px;
	margin-left:400px;
}
#activites .stage{
	margin-top:100px;
	margin-left:760px;
}

#activites .affiche{
	margin-top:300px;
	margin-left:1090px;
	width:450px;	
}
#activites .lire{
	margin-top:50px;
	margin-left:80px;
	width:350px;	
}
#activites .senior{
	margin-top:-350px;
	margin-left:440px;
}
#activites .classe{
	margin-top:-450px;
	margin-left:900px;
}
#activites .cva{
	margin-top:-480px;
	margin-left:1340px;
}
#activites .autre{
	margin-top:-400px;
	margin-left:1690px;
}
#activites .evenementiel{
	margin-top:-460px;
	margin-left:2140px;
}
#activites .affiche2{
	margin-top:-90px;
	margin-left:2600px;
	width:450px;	
}
#activites .activite img{
	z-index:10;
}

/******** gestion de l'apparition de la légende au survol de la souris dans la balise SPAN:  */
#activites .activite span {
	background: rgba(0, 0, 0, 0.7); /* Les légendes auront un arrière-plan noir avec une opacité de 50% */
	color: #fff;
	display: none;
	font-weight: bold;
	left: 0;
	margin: 20px 20px 0 20px;
	padding: 10px 10px 0 10px;
	position: absolute;
	z-index: 20;
	
	transition: top 0.3s ease-in-out;
	-moz-transition: top 0.3s ease-in-out;
	-o-transition: top 0.3s ease-in-out;
	-webkit-transition: top 0.3s ease-in-out;

}
#activites .activite:hover span.legende-bottom {
	display:block;
	bottom:26px;
}
#activites .activite:hover span.legende-top{
	display:block;
	top:15px;
}
/**************************************************/

#activites .retour{
    position:absolute;
	font-family:'slogan';
	color: #000000;
	font-size:28px;
	z-index:50;
	text-align:right;
}
#activites .retour img{
    width:40px;
}
#activites .r1{
	margin-top:0px;
	margin-left:3100px;
}
#activites .r2{
	margin-top:600px;
	margin-left:1955px;
}
#activites .titre{
    position:absolute;
	margin-top:600px;
	margin-left:500px;
	font-family:'slogan';
	font-size:32px;
    text-shadow:1px 1px 2px #0f0f0f;
}

#activites .activite .citation{
	font-style:italic;
}
#page_spectacles_jeunes .retour{
    position:absolute;
	font-family:'slogan';
	color: #000000;
	font-size:28px;
	z-index:50;
}

#page_spectacles_jeunes .r1{
	margin-top:100px;
	margin-left:55px;
}
#page_spectacles_jeunes .r2{
	margin-top:530px;
	margin-left:7110px;
}

#page_spectacles_jeunes .retour img{
	width : 40px;
}

#page_spectacles_adultes .retour{
    position:absolute;
	font-family:'slogan';
	color: #000000;
	font-size:28px;
	z-index:50;
}
#page_spectacles_adultes .r1{
	margin-top:60px;
	margin-left:55px;
}
#page_spectacles_adultes .r2{
	margin-top:530px;
	margin-left:6810px;
}
#page_spectacles_adultes .retour img{
	width : 40px;
}


/*************** page de gestion des resas *****************/
.body_gestion{
	background-color : #fffeee;
}

.tableau_param{
	text-align : center;
	font-family: 'police_spectacle';
	border : 1px solid red;
}

.tableau_param td{
	padding : 10px;
	border : 1px solid red;
}
.tableau_param tr.titre{
	font-size:140%;
	background-color : #fffddd;
}
.tableau_param tr.sous-titre{
	font-size:120%;
	background-color : #ffeedd;
}