/* Le body, il ne sert pas à grand chose ici, pas de texte, pas d'image de fond... */



/* Le body         *********************************************************************************
/* *************************************************************************************************/

body
{
	width: 771px;/*100%; origine 780px*/
	margin: auto; /*pour centrer la page*/
	margin-top: 20px; /*pour éviter de trop coller avec le haut du navigateur*/
	margin-bottom: 20px; /*idem, masi pour le bas*/
	background-color: rgb(243,225,175); /*couleur originale rgb(191,253,181); */
	padding-right: 10px;
}


/* L'en-tête *********************************************************************************
/* *************************************************************************************************/

#en_tete
{
	width: 771px;/*100%;*/
	height: 160px;
	background-image: url("images/banniere.jpg");
	background-repeat: no-repeat; /* pour s'assurer que l'image ne sera pas répétée */
	margin-bottom: 10px;
}

/* Le texte en marron****************************************************************************
 ************************************************************************************************/
#present 
{
	width: 735px; /*100%;*/ /*    largeur de div identique a celle du corps    */
	font-family: "Arial", serif;
	color: rgb(219,154,86);
	font-size: 9pt;
	font-weight: bold;
	text-align: left;
	margin-left: 10px; /*pour aligner, à droite, avec la bannière*/	
	padding-top: 0px;
}

/* Les drapeaux dans le meme div que present     ************************************************************************************
 *************************************************************************************************/
#present .drapeau
{
	float: right;
	/*margin-left: 550px;*/	
	
	/*width: 250px;*/
	/*height: 23px;*/
}



a img
{
	border: none; /* Pas de bordure */
}






/* Le Menu     *****************************************************************************************
*************************************************************************************************/

#nav /* LA BALISE DANS LAQUELLE EST INSERE LE INCLUDE FAISANT APPEL AU MENU*/ 
{
float: left;
margin-left: 10px; /*pour aligner, à droite, avec la bannière*/
width: 760px; /*margin:0;*/
padding:0;
/*background-color: rgb(219,154,86);*/
}
#menuDeroulant { /* LE BANDEAU DE MENU */ 
list-style-type: none;
 margin: 0;
 padding: 0;
 border: 0;
}
#menuDeroulant li { /* LES LIENS DU BANDEAU DE MENU */ 
 list-style-type: none;
 float: left;
 width: 8.745em; /*largeur cases menu*/
 margin: 0;
 /*padding: 0;*/
 border: 0;
 font-size: 90%;
}
#menuDeroulant .sousMenu { /* LES CASES DE SOUS MENUS */ 
 /*  Enlevé par Cath (pour tout afficher
     display: none;     */
 display: none;
 list-style-type: none;
 margin: 0;
 padding: 0;
 border: 0;
}
#menuDeroulant .sousMenu li { /* LES LIENS DE SOUS MENUS */ 
float: none;
 margin: 0;
 padding: 0;
 border: 0;
 width: 10em; /* largeur cases ss-menu*/
}
#menuDeroulant li a:link , #menuDeroulant li a:visited { /* COULEUR MENU */ 
display: block;
height: auto;
background-color: rgb(219,154,86); /* fond menu sans souris*/
color: #4a3000;   /*de la police*/
margin: 0;
padding: 2%;
border-collapse: collapse;
border: 1px solid #a37340; /*! couleur des bordures du menu*/
text-decoration: none;
text-align: center;
}
#menuDeroulant li a:hover {          /* EFFET SOURIS SUR LIENS MENU*/
background-color: #a37340; /*couleur fond quand souris*/
color: white;
}
#menuDeroulant li a:active { /*  */ 
background-color: #5F879D;
}
#menuDeroulant .sousMenu { /*  */ 
 color: #B9B9B9;
 font-size: 100%;
 margin: 0;
 padding: 1%;
 text-decoration: none;
 text-align: center;
}
#menuDeroulant .sousMenu li a:link, #menuDeroulant .sousMenu li a:visited { /* EFFET SOUS-MENU SANS SOURIS */ 
 display: block;
background: rgb(219,154,86); /* couleur fond sans souris */
 border:1px solid #a37340; /*! couleur bordures sous-menu*/
}
#menuDeroulant .sousMenu li a:hover { /* EFFET SOURIS SUR LIENS DU SOUS-MENU */ 
 background-image: none;
 background-color: #a37340; /* couleur fond*/
}
#menuDeroulant li:hover > .sousMenu { /*  */ 
 display: block;
}




/* LE CORPS        ************************************************************************************
/* *************************************************************************************************/

#corps
{
	/* placement du div *****/
	float: left;
	margin-left: 10px;
	margin-top: 20px; 
	width: 725px;
	/*height: 430px;*/
	/* intérieur du div ******/
	padding: 0px;
	padding-left: 5px;
	text-align: justify;
	/*overflow: auto;*/
	background-repeat: no-repeat;
	/* couleur ******/
	background-color: rgb(255,249,232);
	color: rgb(149,90,27);
	/* police ******/
	font-size: 10pt;
	font-family: "Arial", serif;
	
	/* bordure et couleur ******/
	border: 3px inset rgb(219,154,86);
	background-color: white; /*rgb(255,249,232);*/ /*  213,253,206) */
	/* position ******/
}

#corps h3
{
	color: rgb(219,154,86);
}

#corps h2
{
	color: rgb(219,154,86);
}

#corps h3 .a
{
	color: rgb(219,154,86);
}

/* pour essayer de faire flotter l'image de la page d'accueil */
.imageflottante
{
	float: right;
	padding-right: 10px;
	padding-top: 20px;
	margin-left: 10px;
}



/* ************************************************************************************************
/* *************************************************************************************************/

/* position et taille du pied de page */
#pied_de_page
{	
	width: 725px;
	/*margin-left: 145px;*/
	padding-top: 5px;	
	color:black;
	text-align: center;
	font-size: 8pt;
	color: rgb(149,90,27); /*rgb(148,32,0);*/
	clear: both; /* pour éviter que le pied colle trop le texte */
}



#referencement
{
	margin-left: 145px;
	/* !!!!!!!!!!!!!!!!!!! TROUVER LE CODE POUR CENTRER TOUT CA !!!!!!!!!!!!!!! */
}

/*pour se débarasser des vilaines couleurs des liens */
a
{
	color: rgb(219,154,86);
}
/* *************************************************************************************************/
/* *************************************************************************************************/




/* PARTIE CONCERNANT LES TABLEAUX       ************************************************************
/* *************************************************************************************************/



td /* les lignes de prix... */
{
   	border: 1px solid rgb(219,154,86); /* ... auront une bordure de 1px */
   	border-collapse: collapse;
	color: rgb(219,154,86);
	background-color: rgb(255,249,232);
 	text-align: center; 
   	padding: 5px; /* Petite marge intérieure aux cellules pour éviter que le texte touche les bordures */
	font-family: "Arial", serif;
}

th/* les entêtes de tableau... */
{
	font-weight: bold;
	border: 1px solid rgb(219,154,86); /* ... auront une bordure de 1px */
	border-collapse: collapse;
	color: rgb(219,154,86);
	background-color: rgb(255,249,232);
 	text-align: center;
	font-family: "Arial", serif;
	padding: 5px;
}

table /* Le tableau en lui-même */
{
   	margin: auto; /* Centre le tableau */
   	border: 3px outset rgb(219,154,86); /* Bordure du tableau avec effet 3D (outset) */
   	border-collapse: collapse; /* Colle les bordures entre elles */
 	text-align: center;
	font-family: "Arial", serif;
}




/* ================================================================ 
=================================
================================
==========================
==============

LE CSS SPECIAL PAGE PHOTO

===============
=================================
=================================================================== */
/* common styling */

a {color:#000;}
a:hover {text-decoration:none;}
a:visited {color:#000;}

/* slides styling */

.photo 
{
width:635px; 
text-align:left; /* !!!!!!!!!!!!!!!!!!!!! JOUER LA DESSUS POUR RETABLIR POSITION   !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!! */
position:absolute; 
margin-left: 30px;
top:350px;
margin:0 auto;
}

.photo ul.topic 
{
padding:0; 
margin:0; 
list-style:none; 
width:635px; 
height:auto; 
position:relative; 
z-index:10;
}


.photo ul.topic li 
{
display:block; 
width:125px; 
height:31px; 
float:left;
}

/*ONGLET*/
.photo ul.topic li a.set 
{
display:block; 
font-size:11px; 
width:124px; 
height:30px; 
text-align:center; 
line-height:30px; 
color:#000; 
text-decoration:none; 
border:1px solid rgb(243,225,175)/*CONTOUR DE TOUT LE BLOCK*/; 
border-width:1px 1px 0 0; 
background:#ccc/* ????? */; 
font-family:verdana, arial, sans-serif;
}

.photo ul.topic li a ul, 
.photo ul.topic li ul 
{display:none;}
/* !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!*/
.photo ul.topic li.active a
{color:#fff; background:rgb(243,225,175)/*rgb(219,154,86)/*Couleur de l'onglet SANS SOURIS et des photos vides #bbb*/;}

.photo ul.topic li a:hover,
.photo ul.topic li:hover a
{
color:#fff/* ??? */; 
background:rgb(243,225,175)/*rgb(219,154,86); /* #aaa agit sur couleur onglet  AVEC SOURIS et couleur fond miniatures vides*/
}

.photo ul.topic li.active ul
{
display:block; 
position:absolute; 
left:75px; 
top:31px; 
list-style:none; 
padding:0; 
margin:0; 
height:1300px/*= hauteur du cadre sans passage souris, determine le nombre de miniatures 375px*/; 
background:rgb(243,225,175)/*   Couleur de fond Grand cadre interieur SANS SOURIS#ddd*/; 
width:464px; 
padding:40px 60px; 
border:20px solid rgb(219,154,86)/*Couleur Contour sous Onglet SANS SOURIS #bbb*/; 
z-index:1;
}



.photo ul.topic li a:hover ul, 
.photo ul.topic li:hover ul
{
display:block;
position:absolute; 
left:75px; 
top:31px/*=position sous onglet*/; 
list-style:none; 
padding:0; 
margin:0; 
height:1300px /*= hauteur du cadre quand passage souris, determine le nombre de miniatures 375px*/; 
background:rgb(243,225,175)/*   Couleur de fond Grand cadre interieur SANS SOURIS#ddd*/; 
width:464px/*= largeur du cadre*/; 
padding:40px 60px; 
border:20px solid rgb(219,154,86)/*Couleur Contour sous Onglet AVEC SOURIS #aaa*/; /*Bordure : largeur ; différencie cadre du fond intérieur ; couleur*/
z-index:100;
}

/*cadre des miniatures*/
.photo ul.topic li ul li
{
display:inline; 
width:112px; 
height:87px; 
float:left; 
border:1px solid #fff/* ????????????? */; 
margin:1px;
}

/*Fond de la miniature*/
.photo ul.topic li ul li a
{display:block;
 width:110px; 
height:85px; 
cursor:default; 
float:left; 
text-decoration:none; 
background:#444 /* ???????????????? */; 
border:1px solid #a37340/*#888*//* Mini Contour de 1 pixel autour de la miniature */;}

/*Photos miniatures*/
.photo ul.topic li ul li a img
{
display:block; 
width:100px; 
height:75px; /*!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!*/
border:5px solid rgb(243,225,175)/* CONTOUR plus large sous le contour precedent autour des miniatures #eee*/;}

.photo ul.topic li a:hover ul li a:hover, 
.photo ul.topic li:hover ul li a:hover 
{white-space:normal; 
position:relative;}

/*Passage souris sur photos*/
.photo ul.topic li a:hover ul li a:hover img, 
.photo ul.topic li:hover ul li a:hover img 
{position:absolute; 
left:-50px; 
top:-32px; 
width:200px; /*si agrandissement souhaite plus grand alors 250x188 pixels*/ 
height:150px; 
border-color:#fff;}