/* styles mise en page globale */
			
				body {
				margin: 0;
				padding: 0;
				font-family: trebuchet, verdana, helvetica, sans-serif;
				background-color: #faf9f5;
				color: #1d0d01;
				padding: 0;
				margin: 0;
				font-weight: 600 ;
				letter-spacing: 0.13em ;
				text-align: center; /* pour corriger le bug de centrage IE */
				}

			div { padding: 0; 	margin: 0; } /* pour rendre tout homogène selon les navigateurs...*/

			div.page {  position: relative; /* on positionne le conteneur pour centrer la page */
				/* top: 40px;	 */			
				width:1100px; 
				height: 619px;				
				margin:0 auto 0 auto;
				background-image: url(images/fond.jpg);
				background-repeat: no-repeat;
				text-align: left; /* on r�tablit l'alignement normal du texte */
				}

/* ==== NAVIGATION ==== */
div#menubas {position:absolute; top: 400px ; left: 180px; }

div#menuhaut {position:absolute; top: 5px ; left: 140px; }

ul#menu {
	width: 100%; overflow: hidden;
	margin: 0; padding: 0;
	list-style: none;
}
	ul#menu li {
		float: left;
		margin: 0 0 0 6px;
		padding: 0;
		line-height: 1em;
	}
		ul#menu li a {
			display: block;
			width: 83px; height: 151px;
			text-decoration: none;
		}
		
		/* Liste des images de fond pour l'effet de roll-over */
		li#accueil a {background: url(images/menuaccueil.png) no-repeat;}
		li#accueil a:hover, li#accueil a:focus {background: url(images/menuaccueil2.png) no-repeat;}
		li#actu a {background: url(images/menuactualite.png) no-repeat;}
		li#actu a:hover, li#actu a:focus {background: url(images/menuactualite2.png) no-repeat;}
		li#origines a {background: url(images/menuorigines.png) no-repeat;}
		li#origines a:hover, li#borigines a:focus {background: url(images/menuorigines2.png) no-repeat;}
		li#arts a {background: url(images/menuarts.png) no-repeat;}
		li#arts a:hover, li#arts a:focus {background: url(images/menuarts2.png) no-repeat;}
		li#spectacles a {background: url(images/menuspectacles.png) no-repeat;}
		li#spectacles a:hover, li#spectacles a:focus {background: url(images/menuspectacles2.png) no-repeat;}
		li#biographie a {background: url(images/menubiographie.png) no-repeat;}
		li#biographie a:hover, li#biographie a:focus {background: url(images/menubiographie2.png) no-repeat;}
		li#presse a {background: url(images/menupresse.png) no-repeat;}
		li#presse a:hover, li#presse a:focus {background: url(images/menupresse2.png) no-repeat;}
		li#catalogue a {background: url(images/menucatalogue.png) no-repeat;}
		li#catalogue a:hover, li#catalogue a:focus {background: url(images/menucatalogue2.png) no-repeat;}
		li#pro a {background: url(images/menupro.png) no-repeat;}
		li#pro a:hover, li#pro a:focus {background: url(images/menupro2.png) no-repeat;}
		li#contact a {background: url(images/menucontact.png) no-repeat;}
		li#contact a:hover, li#contact a:focus {background: url(images/menucontact2.png) no-repeat;}
	

ul#menu a span {
display: none;
}

ul#menu a:hover span {
display: block;
position: absolute;
top: 10px;
left: 50px;
width: 713px;
text-align: left;
color: #1d0d01;
font-size: 12px;
}


			ul li { line-height : 25px ;}

p.notes { color:#582e0b;  font-size: 8px ;  }


div#illustrationactu {position:absolute; top: 145px ; left: 315px;}


div#corpsdepagespectacle {position:absolute; top: 163px ; left: 210px; 	width: 900px; height: 419px;}
div#corpsdepagespectacle img { float:left; margin: 3px }
div#corpsdepagespectacle img.deux { float:left; margin: 5px ; margin-left: 40px }


div#corpsdepage {position:absolute; top: 165px ; left: 255px; 	width: 720px; height: 419px;}




div#colonnedroite {position:absolute; top: 45px ; left: 375px; 	width: 380px; height: 419px;}

h1 {text-align:center; color:#582e0b;  font-size: 18px;}
h1#gauche {text-align:left; color:#582e0b;  font-size: 18px;} 
div#corpsdepage h2 {text-align:center; color:#582e0b;  font-size: 15px; letter-spacing: -1px; }
div#corpsdepage h3 {text-align:center; color:#582e0b;  font-size: 12px; letter-spacing: -1px; }
div#corpsdepage p { font-size: 12px;}
div#corpsdepage img { float:left; margin-right: 20px }

/* Image et texte de US et costumes */
div#phototexte1  {position:absolute; top: 50px ; left: 0px; 	width: 730px; height: 419px;}
div#textedansphototexte1   {position:absolute; top: 0px ; left: 170px; 	width: 550px; height: 419px;}
div#phototexte2  {position:absolute; top: 280px ; left: 10px; 	width: 730px; height: 419px;}

/* page contact */
div#contact { text-align : center; }
div#contact p { color:#582e0b;  font-size: 19px ;  }
div#imagelien  {position:absolute; top: 225px ; left: 340px; }

/* Image à gauche diaporama */
div#imagegauche {position:absolute; top: 35px ; left: 0px; width: 296px; height: 409px;	
	background-image: url(images/fondiaporamacatalogue.png);
				background-repeat: no-repeat;
}
div#imagegauche2 {position:absolute; top: 58px ; left: 23px; width: 252px; height: 354px; }


div#imagegaucheresidence {position:absolute; top: 0px ; left: 0px; }
div#textedroiteresidence {position:absolute; top: 0px ; left: 350px; }

/* Image à gauche diaporama spécifique vie quotidienne */
div#imagegauchevq {position:absolute; top: 0px ; left: 0px; width: 332px; height: 461px;	
	background-image: url(images/fondiapoviequotidienne.png);
				background-repeat: no-repeat;
}
div#imagegauchevq2 {position:absolute; top: 25px ; left: 34px; width: 268px; height: 400px; }




div#textedroite {position:absolute; top: 35px ; left: 325px; width: 296px; height: 409px; }
	

div#textegauche {position:absolute; top: 5px ; left: 5px; width: 380px; height: 409px; }


/* Image à droite diaporama spécifique expo collective */
div#imagedroiteec {position:absolute; top: 15px ; left: 390px; width: 339px; height: 465px;	
	background-image: url(images/fondexpocol.png);
				background-repeat: no-repeat;
}
div#imagedroiteec2 {position:absolute; top: 25px ; left: 400px;  }


		/* Liste des boites HAbitat */
div#textehabitat {position:absolute; top: 35px ; left: 280px; width: 450px; height: 409px; }
div#photohabitat2 {position:absolute; top: 260px ; left: 470px; }

/* Liste des boites animations scolaires */
div#photoanimation {position:absolute; top: 210px ; left: 170px; }


/* PAge d'accueil */

div#accueil-logo {position:absolute; top: 100px ; left: 305px; }

div#accueil-texte {position:absolute; top: 350px ; left:615px; z-index: 10 ; color: #1d0d01;
font-size: 11px; }


		/* Liste des boites pour les logos */


/* Logos en bas à gauche */
div#logoactu {position:absolute; top: 345px ; left: 0px;}
div#logoorigines {position:absolute; top: 345px ; left: 0px;}
div#logoarts {position:absolute; top: 335px ; left: 10px;}
div#logospectacles {position:absolute; top: 335px ; left: 10px;}
div#logobiographie {position:absolute; top: 365px ; left: 30px;}
div#logopresse {position:absolute; top: 345px ; left: -50px;}
div#logocatalogue {position:absolute; top: 345px ; left: 30px;}
div#logopro {position:absolute; top: 355px ; left: -55px;}
div#logocontact {position:absolute; top: 235px ; left: 40px;}


/* Les logos origines */
div#logopremices {position:absolute; top: 235px ; left: 285px;}
div#logoiletaitunefois {position:absolute; top: 255px ; left: 620px;}

/* Les logos arts bistissandres */
div#logoviequotidienne {position:absolute; top: 200px ; left: 275px;}
div#logoexpocollective {position:absolute; top: 200px ; left: 501px;}
div#logoresidence {position:absolute; top: 197px ; left: 725px;}

div#liensuiteresidence {position:absolute; top: 400px ; left: 400px;}


 p#corpsdetexte { font-family: trebuchet, verdana, helvetica, sans-serif;   font-size: 14px; text-align : left ;   letter-spacing: normal ; font-weight: 300 ;}

p#notes { color:#582e0b;  font-style: italic ;  }


/* les différents liens...*/


a img {  border:  none ; }

a#lien:link {
			color: #582e0b;
			text-decoration: none;
			border-bottom: 1px solid #1d0d01;
				}

			a#lien:visited {
			color: #582e0b;
			text-decoration: none;
			border-bottom: 1px solid #1d0d01;
			}

			a#lien:hover {color: #1d0d01;
			text-decoration: none; 
			border-bottom: 1px solid #582e0b;
			}

			a#lien:active { color: #1d0d01; }
			
			
			
			
			ul li { line-height : 200 px ;}