/* ********************************************************************************************** */
/* ***********						Design général de la page							********* */
/* ********************************************************************************************** */

body
{
	background-color : black;
	color: #ffffea;
	font-family: "Bookman Old Style",Arial,"Times New Roman",serif;
	font-size: 1em;
}


/* ********************************************************************************************** */
/* ***********						Design de l'en-tete de page							********* */
/* ********************************************************************************************** */

/* L'en-tête sert à cacher la partie haute de la page lorsque le corps défile */
#en_tete
{
	position: fixed;													/* non compatible avec IE */
	top: 0%;
	background-color: black;
	/* on force la taille du cadre pour être sûr de cacher le haut de la page */
	height: 11%;					
	width: 100%;
	/* on positionne l'en-tête à mi-hauteur */
	z-index: 10;
}


/* ********************************************************************************************** */
/* ***********						Design du Titre de la page							********* */
/* ********************************************************************************************** */

h1
{
	position: fixed;													/* non compatible avec IE */
	background-color: black;
	left: 2%;
	top: 0%;
	border-bottom: #ffffea 4px solid;
	width: 96%;
	padding-bottom: 10px;
	font-style: italic;
	font-size: 2.2em;
	text-align: right;
	/* on positionne le titre au-dessus */
	z-index: 20;

}


/* ********************************************************************************************** */
/* ***********						Design du Corps et des Menus						********* */
/* ********************************************************************************************** */

/* Position spécifique de chacune des parties de la page */
/* ---------------------------------------------------------------------------------------------- */
#corps
{
	width: 65%;
	position: absolute;
	top: 110px;
	left: 28%;
	/* on positionne le corps en-dessous */
	z-index: 1;
}
.menu_general
{
	width: 10%;
	position: fixed;													/* non compatible avec IE */
	top: 23%;
	left: 2%;

}
.menu_photo
{
	top: 40%;
	width: 10%;
	position: fixed;													/* non compatible avec IE */
	left: 14%;
}
.menu_admin
{
	position: fixed;
	top: 510px;
	left: 2%;
	width: 10%;
}
.administration_site
{
	position: fixed;
	top: 30%;
	left: 2%;
	width: 20%;
	border: none;
}
.admin_deconnexion
{
	position: fixed;
	top: 20%;
	left: 2%;
	width: 20%;
	border: none;
}
.traduction
{
	position: fixed;
	top: 24%;
	left: 14%;
	width: 10%;
}

/* Design des menus */
/* ---------------------------------------------------------------------------------------------- */
/* design général des menus */
table
{
	border-collapse: collapse;									/* on colle toutes les cellules */
	font-family: Arial,"Times New Roman",serif;
	border-width: 4px;											/* on définit le bord des menus */
	border-color: #ffffea;
	border: outset;
}
.menu_general
{
	background-image: url("../Environnement/Fonds/Rome2_19_gauche.jpg");
}
.menu_photo
{
	background-image: url("../Environnement/Fonds/Rome2_19_droite.jpg");
}
.menu_admin
{
	background-image: url("../Environnement/Fonds/Rome2_19_gauche.jpg");
}
.traduction
{
	border: none;
	font-size: 0.7em;
	caption-side: bottom;	
}

/* design de chaque cellule */
td
{
	height: 40px;											/* on fixe la hauteur de chaque cellule */
	font-style: italic; 
	font-size: 0.9em;
	font-weight: bold;
	vertical-align: middle;
	text-align: center;
}
/* design des liens dans les menus et drapeau*/
a			
{
	color: #ffffea;
	text-decoration: none;
	border: none;
}


/* Design des chapitres */
/* ---------------------------------------------------------------------------------------------- */
p
{
	text-indent: 30px;
}

#corps p
{
	text-align: justify;
}

/* Design de l'introduction dans le corps de texte */
/* ---------------------------------------------------------------------------------------------- */
.intro
{
	font-weight: bold;

}


/* ********************************************************************************************** */
/* ***********						Design de la page d'index (première page)			********* */
/* ********************************************************************************************** */

.en_tete_fr
{
	position: absolute;										
	top: 0%;
	left: 2%;
	background-color: black;			
	width: 96%;
	border-bottom: #ffffea 4px solid;
	padding-bottom: 1%;
	margin-top: 1%;
	font-style: italic;
	font-weight: bold;
	font-size: 1.5em;
	text-align: left;
	text-indent: 0;
	z-index: 10;
}
.en_tete_gb
{
	position: absolute;										
	top: 10%;
	left: 2%;
	background-color: black;			
	width: 96%;
	padding-bottom: 1%;
	margin-top: 1%;
	font-style: italic;
	font-weight: bold;
	font-size: 1.5em;
	text-align: right;
	text-indent: 0;
	z-index: 10;
}
.entree_gb
{
	position: absolute;										
	top: 24%;
	left: 140px;
	text-align: left;
	z-index: 10;
}
.entree_gb img, .entree_fr img
{
	border-width: 4px;	
	border-color: #ffffea;
	border: outset;
}
.entree_fr
{
	position: absolute;										
	top: 26%;
	left: 430px;
	text-align: right;
	z-index: 20;
}
.texte_photo
{
	text-indent: 0;
	font-size: 0.8em;
	font-style: italic;
}
.texte_lien
{
	text-indent: 0;
	font-size: 1.2em;
	font-weight: bold;
	margin-top: 0%;
}
.pied_page
{
	position: absolute;
	bottom: 0%;
	right: 2%;
	text-indent: 0%;
	text-align: right;
	font-size: 0.55em;
	z-index: 1;
}
.pied_page span
{
	text-decoration: underline;
}


/* ********************************************************************************************** */
/* ***********						Design des pages d'Albums							********* */
/* ********************************************************************************************** */

.album_1
{
	padding: 0px;
	margin: 0px;
	width: 30%;
	height: 12%;
	position: absolute;
	top: 200px;
	left: 31%;
}
.album_2
{
	padding: 0px;
	margin: 0px;
	width: 30%;
	height: 12%;
	position: absolute;
	top: 310px;
	left: 31%;
}
.album_3
{
	padding: 0px;
	margin: 0px;
	width: 30%;
	height: 12%;
	position: absolute;
	top: 420px;
	left: 31%;
}
.album_4
{
	padding: 0px;
	margin: 0px;
	width: 30%;
	height: 12%;
	position: absolute;
	top: 200px;
	left: 60%;
	text-align: right;
}
.album_5
{
	padding: 0px;
	margin: 0px;
	width: 30%;
	height: 12%;
	position: absolute;
	top: 310px;
	left: 60%;
	text-align: right;
}
.album_6
{
	padding: 0px;
	margin: 0px;
	width: 30%;
	height: 12%;
	position: absolute;
	top: 420px;
	left: 60%;
	text-align: right;
}

/**************************/
/* albums Aller plus loin */
/**************************/

.album_7
{
	padding: 0px;
	margin: 0px;
	width: 12%;
	height: 12%;
	position: absolute;
	top: 380px;
	left: 28%;
	text-align: center;
}
.album_8
{
	padding: 0px;
	margin: 0px;
	width: 12%;
	height: 12%;
	position: absolute;
	top: 380px;
	left: 46%;
	text-align: center;
}
.album_9
{
	padding: 0px;
	margin: 0px;
	width: 12%;
	height: 12%;
	position: absolute;
	top: 380px;
	left: 64%;
	text-align: center;
}
.album_10
{
	padding: 0px;
	margin: 0px;
	width: 12%;
	height: 12%;
	position: absolute;
	top: 380px;
	left: 82%;
	text-align: center;
}
.album_11
{
	padding: 0px;
	margin: 0px;
	width: 24%;
	height: 12%;
	position: absolute;
	top: 360px;
	left: 44%;
	text-align: center;
}
.album_1 p, .album_2 p, .album_3 p, .album_4 p, .album_5 p, .album_6 p 
{
	text-indent: 5%;
	font-style: italic;
}
.album_7 p, .album_8 p, .album_9 p, .album_10 p, .album_11 p, .album_12 p, .album_13 p, .album_14 p
{
	text-indent: 5%;
	font-style: italic;
	text-align: center;
}
/**************************/
/* albums Membres		 */
/**************************/
.album_12
{
	padding: 0px;
	margin: 0px;
	width: 12%;
	height: 12%;
	position: absolute;
	top: 320px;
	left: 53%;
	text-align: center;
}
/**************************/
/* albums Membres VIP	  */
/**************************/
.album_13
{
	padding: 0px;
	margin: 0px;
	width: 10%;
	height: 12%;
	position: absolute;
	top: 420px;
	left: 78%;
	text-align: center;
}
.album_14
{
	padding: 0px;
	margin: 0px;
	width: 12%;
	height: 12%;
	position: absolute;
	top: 200px;
	left: 55%;
	text-align: center;
}
.album_15
{
	padding: 0px;
	margin: 0px;
	width: 12%;
	height: 12%;
	position: absolute;
	top: 380px;
	left: 78%;
	text-align: center;
}
.album_88
{
	padding: 0px;
	margin: 0px;
	width: 12%;
	height: 12%;
	position: absolute;
	top: 380px;
	left: 31%;
	text-align: center;
}
.album_99
{
	padding: 0px;
	margin: 0px;
	width: 12%;
	height: 12%;
	position: absolute;
	top: 380px;
	left: 55%;
	text-align: center;
}
/*****************	affichage diaporama	**********************/
#flashcontent
{
	position: absolute;
	top: 100px;
	left: 0%;
	width: 98%;
	height: 80%;
	z-index: 1;
	padding-top: 0px;
}

/***************** bouton retour galeries ********************/
.retour_galeries
{
	position: absolute;
	top: 78px;
	right: 5%;
	z-index: 30;
}
.retour_galeries a
{
	text-decoration: underline;
	font-style: italic;
}

/* ********************************************************************************************** */
/* ***********						Design de la page Identification					********* */
/* ********************************************************************************************** */

#log
{
	position: absolute;
	top: 45%; 
	left: 24%;
}
#passw
{
	position: absolute;
	top: 45%;
	left: 56%;
}
#bouton_soumettre
{
	position: absolute;
	top: 56%;
	left: 77%;
}

/***************** bouton déconnexion ********************/
.bouton_deconnect
{
	position: absolute;
	top: 70px;
	right: 5%;
}
.bouton_deconnect a
{
	text-decoration: underline;
	font-style: italic;
}

/* ********************************************************************************************** */
/* ***********						Design de la page Contact							********* */
/* ********************************************************************************************** */
.adresse_contact
{
	font-style: italic;
	text-align: center;
}


/* ********************************************************************************************** */
/* ***********						Design de la page Membres							********* */
/* ********************************************************************************************** */
.bouton_suite_simple
{
	position: absolute;
	left: 35%;
}
.bouton_suite
{
	position: absolute;
	left:30%;
}
.bouton_suite_simple a, .bouton_suite a
{
	text-decoration: underline;
	font-style: italic;
	font-weight: bold;
}
.titre_seance
{
	font-weight: bold;
}
/* ********************************************************************************************** */
/* ***********						Design de la page Membres							********* */
/* ********************************************************************************************** */
#corps table
{
	margin: auto; /* Centre le tableau */
	border: 4px outset #ffffea; /* Bordure du tableau avec effet 3D (outset) */
	border-collapse: collapse; /* Colle les bordures entre elles */

}
#corps td, #corps th
{
   border: 2px solid #ffffea;
   text-align: center; /* Tous les textes des cellules seront centrés*/
   padding: 5px; /* Petite marge intérieure aux cellules pour éviter que le texte touche les bordures */

}
/* ********************************************************************************************** */
/* ***********						Design de la page Nouveautés						********* */
/* ********************************************************************************************** */
.lien_nouveautes
{
	width: 30%;
	height: 12%;
	position: absolute;
	top: 380px;
	left: 46%;
	text-align: center;
	font-weight: bold;
	text-decoration: underline;
}
/* ********************************************************************************************** */
/* ***********						Design du livre d'or								********* */
/* ********************************************************************************************** */
.cartouche_livreor
{
	text-indent: 0px;
	border: outset 2px #ffffea;
	width: 100%;
	padding: 5px;
}
.message_livreor
{
	text-indent: 0px;
}
.date_livreor
{
	font-size: 0.8em;
}
.liens_pages
{
	text-indent: 40%;
}
.signature_livreor
{
	position: absolute;
	top: 78px;
	right: 5%;
}
.signature_livreor a
{
	text-decoration: underline;
	font-style: italic;
	font-weight: bold;
	font-size: 1.2em;
}
#tableau_livreor table, #tableau_livreor td, #tableau_livreor th
{
	border: 0px;
	text-align: left;
}
#tableau_livreor
{
	border : 0px;
}
/* ********************************************************************************************** */
/* ***********						Design du Post de photos								********* */
/* ********************************************************************************************** */
.post_photo
{
	position: absolute;
	top: 40px;
	left: 20px;
	z-index: 50;
}

.post_photo a
{
	text-decoration: underline;
	font-style: italic;
	font-weight: bold;
	font-size: 1.2em;
}

/* ********************************************************************************************** */
/* ***********						Design de la page des expositions					********* */
/* ********************************************************************************************** */

.expo_1
{
	position: absolute;
	top: 37%;
	left: 40%;
	z-index: 10;
}
.expo_2
{
	position: absolute;
	top:60%;
	right: 5%;
	z-index: 10;
}
.expo_3
{
	position: absolute;
	top: 80%;
	left: 30%;
	z-index: 10;	
}
.image_expo3
{
	position: absolute;
	top: 57%;
	left: 51%;
	z-index: 1;
}
.expo_1 p, .expo_2 p, .expo_3 p
{
	text-indent: 0px;
}
.expo_1 a, .expo_2 a, .expo_3 a
{
	text-decoration: underline;
}
.titre_expo
{
	font-weight: bold;
}
.info_expo
{
	font-style: italic;
	font-size: 0.8em;
}
/* ********************************************************************************************** */
/* ***********						Design de la page de contact						********* */
/* ********************************************************************************************** */
.acquerir
{
	width: 65%;
	position: absolute;
	top: 220px;
	left: 28%;
	/* on positionne le corps en-dessous */
	z-index: 1;
}