body
{
	width: 700px;
	margin: auto;
	margin-top: 25px;
	margin-bottom: 25px;
	background-repeat: no-repeat;
	background-position: center;
}
#bodypf
{
	background-image: url("images/fillelit.jpg");
	background-repeat: no-repeat;
	background-position: 7px 35px;
	font-family: "Garamond", Arial, Times New Roman, serif;
}
#bodyaccueil
{
   background-image: url("images/bebemenu.jpg"); 
   background-repeat: no-repeat; 
   background-position: 700px 200px;
}
#bodypub
{
	background-image: url("images/bebelit.jpg");
	background-repeat: no-repeat;
	background-position: 50px 50px;
	font-family: "Garamond", Arial, Times New Roman, serif;
}
#bodypje
{
	background-image: url("images/ange.jpg");
	background-repeat: no-repeat;
	background-position: 50px 50px;
	font-family: "Garamond", Arial, Times New Roman, serif;
}
#bodyquisuisje
{
	background-image: url("images/chatseul.jpg");
	background-repeat: no-repeat;
	background-position: 750px 450px;
}
#bodyliens
{
	background-image: url("images/cerfvolant.jpg");
	background-repeat: no-repeat;
	background-position: 40px 10px;
	text-align: justify;
	font-family: "Garamond", Arial, Times New Roman, serif;
}
#bodyamnesty
{
	text-align: justify;
	font-family: "Garamond", Arial, Times New Roman, serif;
}

/* Bannière*/

#en_tete
{
	width: 700px;
	height: 10px;
}

/* Menu*/

#menu
{
	width: 700px;
}
.element_menu h3 /*titres du menu*/
{	
	color: teal;
	text-decoration: underline;
	width: 700px;
	font-family: "Garamond", Arial, Times New Roman, serif;
}
.element_menu ul /*listes à puce*/
{
	color: black;	
	font-size: 18px;
	width: 700px;
	font-family: "Garamond", Arial, Times New Roman, serif;

}

#pied_de_page
{
	width: 700px;
	font-size: 14px;
	color: black;
	font-family: "Arial", Times New Roman, serif;
}
h1
{
	text-align: center;
	font-size: 25px;
	font-variant: small-caps;
	color: teal;
	font-family: "Copperplate Gothic Light", Garamond, Arial, Times New Roman, serif;
}
h2
{
	font-size: 26px;
	text-align: center;
	color: black;	
	font-family: "Garamond", Arial, Times New Roman, serif;
	
}
h4
{
	text-align: center;
	font-size: 18px;
	color: black;
	font-family:"Garamond", Arial, Times New Roman, serif;
}
.avertissement
{
	font-size: 12px;
	color: red;
	text-decoration: underlined;
	font-family: "Arial", serif;
}	
a
{
	text-decoration: none;
	cursor: pointer;
	color: black;
}
a:visited
{
	color: black;
	text-decoration: italic;
}
a:hover
{
	color: teal;
}

.rien
{
   list-style-image: url("images/escargot.jpg");
}
.souris
{
	list-style-image: url("images/souris.jpg");
	color: teal;
	font-family: "Garamond", Arial, Times New Roman, serif;
}
p
{
   width: 700px; /* Tous les paragraphes font 700px */
   text-align: justify; /* Tous les paragraphes sont justifiés */
}   
a img /* Toutes les images contenues dans un lien */
{
   border: none; /* Pas de bordure */
}
em
{
   font-style: italic;
}

h3
{
   font-variant: small-caps;
}
.flottante
{
	float: left;
	margin: 10px;
}
.presentation
{	
	color: gray;
	text-decoration: italic;
	font-family: "Book Antiqua", Garamond, Arial, Times New Roman, serif; 
}
.quisuisje
{
	font-size: 20px;
	font-variant: small-caps;
	border: 1px groove teal;
	padding: 2px;
	margin: 5px;
	font-family:"Garamond", Arial, Times New Roman, serif;
}
<style type="text/css">

/*Credits: Dynamic Drive CSS Library */
/*URL: http://www.dynamicdrive.com/style/ */

.gallerycontainer{
position: absolute;
/*Add a height attribute and set to largest image's height to prevent overlaying*/
}

.thumbnail img{
border: 1px solid gray;
margin: 0 5px 5px 0;
}

.thumbnail:hover{
background-color: transparent;
}

.thumbnail:hover img{
border: 1px solid black;
}

.thumbnail span{ /*CSS for enlarged image*/
position: absolute;
background-color: white;
padding: 5px;
left: -700px;
border: 1px gray;
visibility: hidden;
color: black;
}

.thumbnail span img{ /*CSS for enlarged image*/ 
border-width: 0;
padding: 2px;
}

.thumbnail:hover span{ /*CSS for enlarged image*/
visibility: visible;
top: 250px;
left: 500px; /*position where enlarged image should offset horizontally */
}

</style>

