/*---------------------------------- STYLE */
*{
	margin: 0px;
	padding: 0px;
}
body{
	font-family: arial;
	/* width: 980px; */
}
p{
	font-size:11px;
}

	/* .....................................................dans firefox enléve le trait autour des liens avec a (liens actif) */
a{
outline:none;
}

	/* .....................................................pour bloquer les float si on agrandis la page */
	
.clearfix{
clear:both;
}	


	/* .....................................................Accueil */
	/* .....................................................En Tête logo IDées folles */
#Logo_CieRVaslap{
	width: 1150px;
	height: 140px;
	margin: 30px 0px 0px 30px;
	
	background-image: url(photos/Logo_Vaslap_entete.jpg);
	background-repeat: no-repeat;
}

#Logo_CieRVaslap h1{
	/* ...........................tricherie on enlève le texte dans l'image, mais le garder dans le code Xhtml  */
	text-indent: -2000px;
	/* ...........................masquer le texte en dehors du cadre  */
	overflow: hidden;
	}

#Logo_CieRVaslap h1 a{
display:block;
	}
	
#Logo_CieRVaslap p{
	padding: 0px; 
	margin: 0;
	font-family: helvetica, arial;
	font-size:11px;
	text-align : right;
	padding-top:0px;
 	padding-bottom:0px;
 	padding-right:0px;
 	padding-left:0px;
	
	}
	
#Logo_CieRVaslaps h2 a{
	text-decoration: none;
	color: #000000;
	}

	
#Logo_CieRVaslap h3{
	font-family: helvetica, arial;
	text-align : right;
	margin-top: 2px;
 	margin-right: 16px;
	font-size: 16px;
	
	}
	
#Logo_CieRVaslap h3 a{
	text-decoration: none;
	color: #000000;
}
#Logo_CieRVaslap h3 a:hover{
	color: #990000;
}

		/* .....................................................Boutons */

#Logo_CieRVaslap ul{
	padding: 0px; 
	margin: 0;
	text-align: center; /* centrer le texte */
	font-size: 35px;
	list-style: none;
	color: #000000;
	padding-top:25px;
 	padding-bottom:0px;
 	padding-right:0px;
 	padding-left:190px;

	}
		
#Logo_CieRVaslap li{
	display:inline;
	list-style: none;
	}
	
#Logo_CieRVaslap ul li a{
	display:inline;
	list-style: none;
	font-size:16px;
	text-decoration: none;
	color: #000000;
	padding: 25px;

	}
	
#Logo_CieRVaslap ul li a:hover{
	color: #990000;
}

  	/* .....................................................Pour une Class La Compagnie (texte en bold)*/
#Logo_CieRVaslap ul li a.Cie{
	font-weight:bold;
}

  	/* .....................................................Pour une Class Les Spectacles(texte en bold)*/
#Logo_CieRVaslap ul li a.Spectacles{
	font-weight:bold;
}

  	/* .....................................................Pour une Class Atelier(texte en bold)*/
#Logo_CieRVaslap ul li a.Ateliers{
	font-weight:bold;
}


  	/* .....................................................Pour une Class Contact(texte en bold)*/
#Logo_CieRVaslap ul li a.Contact{
	font-weight:bold;
}


	

	
		/* .....................................................colonne images HomePage */
#Homepage_photos{
	width: 1150px;
	height: 630px;
	margin-top: 5px;
	margin-left: 30px;
	float: left;
	background-image: url(photos/Photos_homepage.jpg);
	background-repeat: no-repeat;
	background-position: center;
}

#Homepage_photos h1{
	text-indent: -2000px;
	overflow: hidden;
}

		/* .....................................................colonne texte et photo-Compagnie */
#TexteCompagnie{
	width: 1150px;
	height: 630px;

	margin-top: 25px;
	margin-left: 30px;
	float: left;
	background-repeat: no-repeat;
	background-position: center;
}


	/* .....................................................colonne de gauche ou il y a les Images */

#gauche{
	width: 680px;
	height: 850px;
	margin-top:20px;
	margin-left:57px;
	float: left;
	text-align:center;
}

#gauche .follesID{
	border-bottom: 2px solid #ccc;
	margin-bottom: 16px;
	padding-bottom: 15px;
	text-align:center;
}
#gauche .noborder{
	border: none;
}
#gauche .follesID h3{
	color:#333333;
	font-size:12px;
	padding-bottom: 2px;
	padding-top: 2px;
	text-align:left;
}
#gauche .follesID h6{
	color: #000000;
	font-size:10px;
	font-weight: normal;
	text-align: left;
	magin-bottom: 2px;
}
#gauche .follesID p{
	font-size:12px;
	text-align:center;
}



	/* ......................................................Pied de page accueil */
#pied_de_page{
	margin-top: 10px;
	margin-left: 33px;
	width: 1150px;
	height: 60px;
	float: left;
	background-position: center;
	background-repeat: no-repeat;

}

#pied_de_page ul{
	font-size:14px;
	list-style: none;
	border-top: 2px dashed #000;
	border-bottom: 2px dashed #000;
	padding: 12px 0px 12px 0px;
	text-align: center;
}
#pied_de_page ul li{
	display: inline;
}
#pied_de_page ul li a{
	text-decoration: none;
	color: #000000;
}
#pied_de_page ul li a:hover{
	color: #990000;
}
#pied_de_page #Copyright{
	font-size: 10px;
	padding: 0px 0px 0px 0px;
	text-decoration: none;
	color: #000000;


}


		/* ......................................................Grande photo de la Page spectacle (Section images) */
#Gauche{
	width: 760px;
	height: Auto;
	margin-top: 5px;
	margin-left: 30px;
	float: left;
	background-repeat: no-repeat;
	background-position: center;
}

#Gauche h1{
	text-indent: -2000px;
	overflow: hidden;
}


		/* ......................................................Colonne de droite, Navigation (Section images) */

#Colonne_Droite_IMAGES{
	width: 258px;
	margin-top: 28px;
	margin-left: 844px;
	margin-bottom: 5px; 
}
#Colonne_Droite_IMAGES ul{
	font-size:16px;
	list-style: none;
}
#Colonne_Droite_IMAGES ul li{
	padding: 5px 0px 10px 0px;
}
#Colonne_Droite_IMAGES ul li a{
	display: block;
	text-decoration: none;
	color: #000000;
}
#Colonne_Droite_IMAGES ul li a:hover{
	color: #a90000;
}

		/* .....................................................Pour une Class (section zorba) */
#Colonne_Droite_IMAGES ul li a.ZOB{
	font-weight:bold;
}

		/* .....................................................Pour une Class (section matiere grise) */
#Colonne_Droite_IMAGES ul li a.MAT{
	font-weight:bold;
}
		/* .....................................................Pour une Class (section Rien plus rien) */
#Colonne_Droite_IMAGES ul li a.RIEN{
	font-weight:bold;
}

		/* .....................................................Pour une Class (section je te regarde) */
#Colonne_Droite_IMAGES ul li a.Regard{
	font-weight:bold;
}
		/* .....................................................Pour une Class (section Europe) */
#Colonne_Droite_IMAGES ul li a.Euro{
	font-weight:bold;
}
		/* .....................................................Pour une Class (section Victor Vatar) */
#Colonne_Droite_IMAGES ul li a.Vatar{
	font-weight:bold;
}

		/* .....................................................Pour une Class (section Camille) */
#Colonne_Droite_IMAGES ul li a.Camille{
	font-weight:bold;
}

/* .....................................................Pour une Class (section Amour) */
#Colonne_Droite_IMAGES ul li a.AMOUR{
	font-weight:bold;
}

/* .....................................................Pour une Class (section Sous la scene la mer) */
#Colonne_Droite_IMAGES ul li a.MER{
	font-weight:bold;
}

/* .....................................................Pour une Class (section Bien adresser n_est petite affaire) */
#Colonne_Droite_IMAGES ul li a.Affaire{
	font-weight:bold;
}

/* .....................................................Pour une Class (section Pièces Montées) */
#Colonne_Droite_IMAGES ul li a.Montees{
	font-weight:bold;
}

/* .....................................................Pour une Class (section Souriez, vous êtes filmés) */
#Colonne_Droite_IMAGES ul li a.SOURIEZ{
	font-weight:bold;
}

/* .....................................................Pour une Class (section Boire et déboires) */
#Colonne_Droite_IMAGES ul li a.Boire{
	font-weight:bold;
}

/* .....................................................Pour une Class (section Mon Père, je vous pardonne) */
#Colonne_Droite_IMAGES ul li a.PARDONNE{
	font-weight:bold;
}

/* .....................................................Pour une Class (section Jean Villard Gilles) */
#Colonne_Droite_IMAGES ul li a.JOLI{
	font-weight:bold;
}


#Colonne_Droite_IMAGES p{
	font-size:13px;
	text-align:left;
}

#Colonne_Droite_IMAGES p a{
	text-decoration: none;
	color: #000000;
}


#Colonne_Droite_IMAGES h3{
	font-size:14px;
	text-align:left;
	padding-top: 5px;

}

#Colonne_Droite_IMAGES h4{
	font-size:15px;
	text-align:left;
	padding-top: 5px;

}

		/* ......................................................Colonne de droite, CONTACT */


#Colonne_Droite__contact{
	position: absolute;
	z-index: 1;
	top: 250px;
	left: 830px;
	width: 250px;
	margin-top:  px;
	margin-left:  px;
	margin-bottom: 5px; 
}


#Colonne_Droite__contact p{
	font-size:13px;
	text-align:left;
}

#Colonne_Droite__contact p a{
	text-decoration: none;
	color: #000000;
}

#Colonne_Droite__contact p a:hover{
	color: #a90000;
}


#Colonne_Droite__contact h3{
	font-size:14px;
	text-align:left;
	padding-top: 5px;

}

#Colonne_Droite__contact h4{
	font-size:15px;
	text-align:left;
	padding-top: 5px;

}






		/* ......................................................// images //  //photos// */
		
#Gauche .photosBox{
	border-bottom: 0px solid #ccc;
	margin-bottom: 16px;
	padding-bottom: 15px;
	text-align:left;
}
#Gauche .noborder{
	border: none;
}

#Gauche .photosBox h3{
	color:#333333;
	font-size:13px;
	padding-bottom: 2px;
	padding-top: 5px;
	text-align:left;
}

#Gauche .photosBox h3 a{
	color:#333333;
	text-decoration: none;
}

#Gauche .photosBox h3 a:hover{
	color: #a90000;
}


#Gauche .photosBox h4{
	color:#333333;
	font-size:15px;
	padding-bottom: 6px;
	padding-top: 7px;
	text-align:left;
}

#Gauche .photosBox h6{
	color: #000000;
	font-size:10px;
	font-weight: normal;
	text-align: left;
	magin-bottom: 2px;
}
#Gauche .photosBox p{
	font-size:12px;
	text-align:left;
	padding-top: 1px;
}

#Gauche .photosBox p a{
	text-decoration: none;
	color: #000000;
}

#Gauche .photosBox p a:hover{
	color: #a90000;
}

	/* .....................................................colonne de droite dossier de Presse */

#dossierpresse{
	width: 750px;
	margin-top: 32px;
	margin-bottom: 7px;
	margin-left: 30px;
	float: left;
	text-decoration: none;

}

	
#dossierpresse p.DOSSIER a{
	font-size:13px;
	color: #FF6600;
	padding-bottom: 2px;
	text-align: right;
	text-decoration: none;
}

#dossierpresse p.DOSSIER{
	font-size:13px;
	color: #FF6600;
	text-align: right;
	text-decoration: none;

}

#dossierpresse p.DOSSIER a:hover{
	font-size:13px;
	color: #FF6600;
	padding-bottom: 2px;
	text-align: right;
	text-decoration: none;
}