/* !! couleur brun foncé du header : #6A4A35 !! */


body
{
	margin: 10px 0 ;
	padding: 0 ;
	text-align: center ;
    font: 0.8em "Trebuchet MS", helvetica, sans-serif ;
	color: #fff ;                                                 /*background: #8F705C ;*/	
	background: url(images/fond2.jpg) ;
                                                           /*background-attachment: fixed;*/

}
/* On définit les marges haute et basse à 10px et les marges droite et gauche à 0 */
/* On met le padding à 0 pour le navigateur Opera qui définit des padding par défaut pour le body */
/* On utilise text-align: center ; pour Internet Explorer, 
c'est la seule façon de centrer les éléments de type block avec ce navigateur */
/* On a ajouté de quoi mettre une police de caractère et une couleur de fond */

div#conteneur
{
	width: 770px ;
	margin: 0 auto ;
 	text-align: left ;
    border: 2px solid #CFB89F ;
                                           /*background: url(images/fond2.jpg) ;*/
	background: #8F705C ;  /*94755C*/

}
/* On définit la largeur de la division qui contient l'ensemble de la page à 770 pixels */
/* margin: 0 auto ; est la méthode correcte pour centrer les éléments de type
 block (comme les divisions), nous centrons donc cette division */
/* Il faut rétablir l'alignement à gauche que nous avons changé plus haut */
/* Une bordure autour de l'ensemble de la page,
et couleur blanche pour le fond de celle-ci */

div#header
{
    height: 220px ;
    background: url(images/header.jpg) no-repeat right top ;
}


/*On définit la hauteur de la partie header, contenant le titre du site */


ul#menu                    
{
	margin: 0 ;
	padding: 4px 0 0 5px ;
	list-style: none ;

}
/*mes tests sur les menus du menu attention a inclure dans un include php*/

ul#menu li.item1 a
{
    width: 46px ;
	height: 29px ;
	display: block ;
    background: url(menu/actu.gif) no-repeat ;
    position: relative ;
	left: 10px ;
	top: 0px ;
	text-indent: -5000px ;
}

ul#menu li.item1 a:hover
{

    background: url(menu/actuhover.gif) no-repeat ;
}


ul#menu li.item2 a
{
    width: 141px ;
	height: 32px ;
	display: block ;
    background: url(menu/histo.gif) no-repeat ;
    position: relative ;
	left: 10px ;
	top: 0px ;
	text-indent: -5000px ;
}

ul#menu li.item2 a:hover
{

    background: url(menu/histohover.gif) no-repeat ;
}


ul#menu li.item3 a
{
    width: 89px ;
	height: 24px ;
	display: block ;
    background: url(menu/contacts.gif) no-repeat ;
    position: relative ;
	left: 10px ;
	top: 0px ;
	text-indent: -5000px ;
}

ul#menu li.item3 a:hover
{

    background: url(menu/contactshover.gif) no-repeat ;
}


ul#menu li.item4 a
{
        width: 84px ;
	height: 25px ;
	display: block ;
        background: url(menu/concerts.gif) no-repeat ;
        position: relative ;
	left: 10px ;
	top: 0px ;
	text-indent: -5000px ;
}

ul#menu li.item4 a:hover
{

    background: url(menu/concertshover.gif) no-repeat ;
}


ul#menu li.item5 a
{
        width: 60px ;
	height: 24px ;
	display: block ;
        background: url(menu/album.gif) no-repeat ;
        position: relative ;
	left: 10px ;
	top: 0px ;
	text-indent: -5000px ;
}

ul#menu li.item5 a:hover
{

    background: url(menu/albumhover.gif) no-repeat ;
}


ul#menu li.item6 a
{
        width: 71px ;
	height: 24px ;
	display: block ;
        background: url(menu/galeries.gif) no-repeat ;
        position: relative ;
	left: 10px ;
	top: 0px ;
	text-indent: -5000px ;
}

ul#menu li.item6 a:hover
{

    background: url(menu/galerieshover.gif) no-repeat ;
}


ul#menu li.item7 a
{
        width: 49px ;
	height: 26px ;
	display: block ;
        background: url(menu/liens.gif) no-repeat ;
        position: relative ;
	left: 10px ;
	top: 0px ;
	text-indent: -5000px ;
}

ul#menu li.item7 a:hover
{

    background: url(menu/lienshover.gif) no-repeat ;
}


ul#menu li.item8 a
{
        width: 104px ;
	height: 29px ;
	display: block ;
        background: url(menu/epro.gif) no-repeat ;
        position: relative ;
	left: 10px ;
	text-indent: -5000px ;
}

ul#menu li.item8 a:hover
{

    background: url(menu/eprohover.gif) no-repeat ;
}

/* fin du menu */


div#bar
{
   padding: 0 ;
   margin-top: -13px ;
   position: relative ;
}

div#bar p
{
    padding:  0;  
    background: #BFAA8A ;
	border: 0px solid #BFAA6A ;
	font-weight: bold ;
	font-size: 1em ;
    text-align: center ;
}


div#bar a
{
        padding: 0 ; 
        text-decoration:none ;
	    font-size: 1em ;
        color: #000000 ;
        text-align: center ;
}

/* fin du header */


div#titre_rubr 
{ 
	height: 90px ;     
}

div#titre_rubr img.logoblind /* Insertion logo blindnote */
{
 
width: 218px ;
height: 90px ;
padding: 0 218px 0 90px ;

}

div#titre_rubr h1
{
    padding-left: 15px ;
	padding-top: 10px ;
	font: 1.8em "Arial", helvetica, sans-serif ;
	color: #d0aeaf ; /*#CFB89F*/ 

}

div#titre_rubr a
{
        padding-left: 30px ;
		padding-top: -20px ;
        text-decoration: none ;
        font: 1.2em "Arial", helvetica, sans-serif ;
        color: #CFB89F ;

}

/*fin titre rubrique */


div#contenu
{
    min-height: 400px; 
	padding: 0 50px 0 100px ;
	margin-left: 10px ;
	background: url(images/cotecontenu.jpg) repeat-y 0px 0px ;
}
/* On ajoute un petit élément décoratif sur le côté
 de la page et on crée un espace à gauche et à droite du contenu */


 
/* div#contenu H1 (contiendra le titre de la rubrique)


div#contenu h1
{
}
*/


div#contenu h2
{
	padding-left: 25px ;
	line-height: 25px ;
	font-size: 1.4em ;
	background: url(images/little_elem.gif) no-repeat left bottom ;
	color: #E3A33F ;
	border-bottom: 1px solid #E3A33F ;
}
/* Mise en forme du titre de page, une petite image,
 on décale le texte en fonction de l'image, on donne un couleur au texte et
  on met une bordure basse */

div#contenu h3
{
	margin-left: 15px ;
	padding-left: 5px ;
        font-size: 1.2em ;
	border-bottom: 1px solid #ECBB6D ;
	border-left: 3px solid #ECBB6D ;
	color: #ECBB6D ;
}
/* De même que pour le titre h2, à ceci près qu'on
 ne donne pas d'image décorative cette fois ci */


div#contenu p
{
	text-align: justify ;
	/*text-indent: 2em ;*/
	line-height: 1.4em ;
        color: #fff ;
}
/* On rend les paragraphes plus propre, alignement justifié,
 alinéa et hauteur de ligne supérieure à l'état normal pour aérer le tout */

div#contenu p.bold
{
	text-align: justify ;
       font-weight: bold ;
	/*text-indent: 2em ;*/
	line-height: 1.4em ;
        color: #fff ;
} /*texte en gras*/



div#contenu img.imagecd 
{
 
width: 516px ;
height: 230px ;
margin: 0 6px 6px 0 ;
border: 1px solid #EBD6C0 ;
}


.conteneurpimg {width: 100%;height: 0%;} /*test conteneur pour paragraphe et image*/

.image {float: right;} /*image coté gauche du paragraphe prevue dans le conteneur*/ 



div#contenu a
{
	color: #d0aeaf ;
}

div#contenu a:hover
{
	color: #d0aead ;
}
/*On met en forme les liens contenu dans la page */

p#footer
{
	margin: 0 ;
    padding-top: 40px ;
	padding-right: 10px ;
	line-height: 30px ;
	text-align: right ;
	color: #EBD6C0 ;
}
/* Mise en forme de la partie pied de page, rien d'extra-ordinaire */


pre
{
	overflow: auto ;
	background: #dea ;
	border: 0px solid #E3A33F /*#d0aeaf */ ;
	padding: 5px 0 0 5px ;
	font-size: 1.2em ;
}
/*une couleur de fond, une bordure, la taille de police
 et un léger espace entre le texte et les bords du pre */


pre span
{
	color: #560 ;
}
/* Couleur de texte des éléments compris dans des span
 eux mêmes compris dans un pre */

pre span.comment
{
	color: #b30000 ;
}
/* Couleur différente pour les span.comment, les span
 utilisés pour les commentaires */
 