@import url(reset_style.css);

/* @group document */

body { 
	background-color: white;
	margin: 0;
	font-family: "Lucida Grande", Lucida, Verdana, sans-serif;
}
a, a:visited { color: #000; text-decoration: none;}

a:hover {
	color: #f00;
	letter-spacing: 1px;
	text-decoration: none;
	
}

p, form, h5, h4, h3, h2, h1, ul {
  margin: 0px;
  padding: 0px;
}

a img { border: 0px; }

#page {
 	margin: 0 auto;
 	width: 803px;
  	height: 700px;
}

/* @end */

/* @group page */

#content {
	width: 800px;
	height: 500px;
	float: left;
  	position: relative;
	padding: 0px;
	margin: 0px;
}

#img-accueil {
	width: 800px;
	height: 500px;
	float: left;
  	position: relative;
}

#galerie, #galerie_professionnel, #galerie_spectacle, #content_texte {
	width: 800px;
	height: 432px;
	overflow: auto;
	position: relative;
	margin: 0;
	padding: 20px 0 0;
}

#galerie_professionnel,
#galerie_spectacle {
	width: 730px;
	margin: 0;
	padding: 20px 0 0 70px;
}
#galerie_spectacle {
	width: 660px;
	padding: 20px 70px 0;
}
#content_texte {
	clear: both;
}

#content_images {
	width: 170px;
	height: 432px;
	float: left;
	position: relative;
	margin: 0;
	padding: 0 30px 0 70px;
}
#content_image {
	width: 200px;
	height: 432px;
	float: left;
	position: relative;
	margin: 0;
	padding: 0 30px 0 40px;
}
#content_image img,
#content_images img {
	margin-bottom: 10px;
}

#content_txt, #content_txt2 {
	width: 500px;
	height: 432px;
	float: left;
	position: relative;
}
#galerie_spectacle #content_txt {
	width: 386px;
	height: 150px;
}
#galerie_spectacle #tableau {
	width: 660px;
	padding: 0;
	float: left;
	position: relative;
}
#content_txt2 {
	width: 460px;
}

#content_txt3 {
	width: 660px;
	height: auto;
	text-align: right;
}

#content_scroll,
#content_scroll2 {
	width: 500px;
	height: 390px;
	float: left;
	position: relative;

}
#content_scroll2 {
	width: 730px;
}
#textescroll,
#textescroll2 {
	width: 460px;
	overflow:hidden;
	height: 380px;
}
#textescroll2 {
	width: 690px;
}
#scrollbar_track {
	position:absolute;
	top:0;
	right:0;
	height:390px;
	width:10px;
	cursor:move;
	background-color: rgba(0,0,0,0.25);
	    -moz-border-radius: 5px;  
    -webkit-border-radius: 5px;  
    opacity:0.9;  
    -moz-opacity:0.9;  

}

#scrollbar_handle {
	width:10px;
	cursor:move;
	background-color: #f00;
	    -moz-border-radius: 5px;  
    -webkit-border-radius: 5px;  
    opacity:0.9;  
    -moz-opacity:0.9;  

}

#content_menu {
	width: 820px;
  	position: relative;
	clear: both;
	/*overflow: auto;*/
	margin: 0;
	padding: 0;
}

#gauche, #droite { 
	height: 160px;
	width: 70px;
	float: left;
	position: relative;
	background: url(../_images/yeux-gauche.jpg) no-repeat;
	margin: 0;
	padding: 0;
}

#droite{ 
	background: url(../_images/yeux-droite.jpg) no-repeat;
}

.img-0 { background: url(../_images/img-accueil.jpg) no-repeat; }
.img-1 { background: url(../_images/img-graphisme.jpg) no-repeat; }
.img-2 { background: url(../_images/img-spectacle.jpg) no-repeat; }
.img-3 { background: url(../_images/img-photographie.jpg) no-repeat; }
.img-4 { background: url(../_images/img-lacompagnie.jpg) no-repeat; }
.img-5 { background: url(../_images/img-ecouter-herbe.jpg) no-repeat; }
.img-6 { background: url(../_images/img-voliere-humeurs.jpg) no-repeat; }

#num1,
#num2,
#num3 {
	font-size: 9px;
	color: #aaa;
}

#retouraccueil {
	padding: 0;
	margin: 0;
	height: 20px;
	line-height: 20px;
	width:  auto;
	color: #f00;
	font-size: 12px;
	letter-spacing: 3px;
	font-weight: normal;
	font-style: normal;
	top: 460px;
	left: 430px;
	z-index: 2;
	position: absolute;
	visibility: hidden;
}

#texte-accueil,
#texte-accueil2 {
	height: 47px;
	line-height: 46px;
  	position: relative;
	clear: both;
	overflow: auto;
	top: 463px;
}

#texte-accueil2 {
	top: 10px;
}

#texte-accueil h1,
#texte-accueil2 h1 {
	color: #f00;
	width: 210px;
	float: left;
  	position: relative;
	text-align: right;
	font-size: 13px;
	letter-spacing: 5px;
	font-weight: normal;
	font-style: normal;
}

#texte-accueil2 h1 {
	color: #bebebe;

}

#texte-accueil h2,
#texte-accueil2 h2 {
	width : 555px;
	float: left;
  	position: relative;
	z-index: 2;
	padding: 0 0 0 35px;
	margin: 0;
}

#texte-accueil h2,
#texte-accueil h2 a,
#texte-accueil h2 a:visited,
#texte-accueil h2 a:hover,
#texte-accueil2 h2,
#texte-accueil2 h2 a,
#texte-accueil2 h2 a:visited,
#texte-accueil2 h2 a:hover {
	color: #fff;
	font-size: 37px;
	font-weight: normal;
	font-style: normal;
	letter-spacing: 13px;
	vertical-align: bottom;
	text-decoration: none;
}

#texte-accueil2 h2,
#texte-accueil2 h2 a,
#texte-accueil2 h2 a:visited,
#texte-accueil2 h2 a:hover {
	color: #bebebe;
}

#texte-accueil h2 a:hover {
	color: #f00;
}

.textegris {
	color: #bebebe;
}

.texte24 {font-size: 24px; line-height: 25px;
	letter-spacing: 2px;
}
.texte22normal,
.texte22 {
	font-size: 22px;
	line-height: 23px;
}
.texte22 {
	letter-spacing: 2px;
}

.texte20 {font-size: 20px; line-height: 22px;}
.texte18 {font-size: 18px; line-height: 20px;}
.texte16 {font-size: 16px; line-height: 19px;}
.texte14 {font-size: 14px; line-height: 17px;}
.texte13 {font-size: 13px; line-height: 16px;}
.texte12 {font-size: 12px; line-height: 15px;}
.texte11 {font-size: 11px; line-height: 14px;}
.texte10 {font-size: 10px; line-height: 13px;}

.texte8	 {font-size: 8px; line-height: 11px;}

.texte9	 {font-size: 9px; line-height: 12px;}

.soustitrevideo,
.soustitrevideo a,
.soustitrevideo a:visited,
.soustitrevideo a:hover,
.soustitrevideo2 {
	font-size: 15px;
	color: #bebebe;
	text-decoration: none;
	letter-spacing: 5px;
	margin-bottom: 6px;
	text-align: left;
}

.soustitrevideo2 {
	width: 66px;
	position: relative;
	float: left;
}
.soustitrevideo3 {
	width: 84px;
	height: 36px;
	margin-bottom: 4px;
	position: relative;
	float: left;
}

.soustitrevideo3,
.soustitrevideo3 a,
.soustitrevideo3 a:visited,
.soustitrevideo3 a:hover {
	font-size: 9px;
	color: #bebebe;
	text-decoration: none;
	text-align: right;
	line-height: 16px;
}
.soustitrevideo3 a:hover {
	letter-spacing: 1px;
	color: #f00;
}

.lienrouge,
.lienrouge a,
.lienrouge a:visited,
.lienrouge a:hover {
	color: #f00;
	text-decoration: none;
}
.lienrouge a:hover {
	color: #f00;
	text-decoration: none;
}

#txt_presse2,
#txt_presse3 {
	display: none;
}

#ligne1, #ligne2, #ligne3, #ligne4 {
	float: left;
  	position: relative;
}

#ligne3 {
	width: 340px ;
}

#ligne1 img, #ligne2 img, #ligne3 img, , #ligne4 img {
	float: left;
  	position: relative;
	padding-right: 20px;
	padding-bottom: 25px;
}

#ligne3 img {
	padding-bottom: 0;
}
#galerie_spectacle img {
	padding: 0;
}

#galerie_spectacle #ligne1 {
	width: 270px;
	padding-top: 20px;
}
.txt_professionnel {
	width: 240px;
	height: 22px;
	line-height: 22px;
	padding: 0 0 0 80px;
	margin: 0;
	float: left;
  	position: relative;
}

.txt_professionnel,
.txt_professionnel a,
.txt_professionnel a:visited,
.txt_professionnel a:hover {
	font-size: 10px;
	letter-spacing: 1px;
	text-decoration: none;
}

.txt_professionnel a:hover {
	color: #f00;
	letter-spacing: 2px;
	text-decoration: none;
	
}

.contact {
	width: 620px;
	height: 20px;
	clear: left;
	padding-top: 20px;
	text-align: center;
	font-size: 11px;
}
.contact a:hover {
	letter-spacing: 0;
}
#footer {
	clear: both;
	text-align: left;
	font-size: 9px;
	color: #bebebe;
	position: relative;
	height: 18px;
	line-height: 18px;
}
#footer a, #footer a:visited, #footer a:hover {
	color: #bebebe;
	text-decoration: underline;
	letter-spacing: 0px;
}
#footer a:hover {
	text-decoration: none;
}

#credits, #son { 
	float: left;
	position: relative;
	margin: 0;
	padding: 0;
}

#credits { 
	height: 18px;
	width: 772px;
}

#son {
	width: 28px;
	height: 16px;
	padding-top: 2px;
}
/* @end */