body
{
	margin:  0;
	padding: 0;
	text-align: center ;
	font: 0.8em "Trebuchet MS", helvetica, sans-serif ;
	background: transparent url(../images/fondbody2.png) repeat-y;
	background-position:center;
	
}
/* 	background: url(../images/background.jpg);
J'ajoute de quoi mettre une police de caractère et une couleur de fond */
/* Je définis les marges haute et basse à 10px et les marges droite et gauche à 0 */
/* Je mets le padding à 0 pour le navigateur Opera qui définit des padding par défaut pour le body */
/* J'utilise text-align: center ; pour Internet Explorer, 
c'est la seule façon de centrer les éléments de type block avec ce navigateur */


div#conteneurglobal2
{
	width: 600px ;
	margin: 0 auto ;
	padding: 0;
	text-align: left ;
	border: 2px solid #cc3333 ;
	position:relative ;
	background: url(../images/ImageReactive1.jpg)no-repeat; 

}
/* Une bordure autour de l'ensemble de la page,
et couleur  pour le fond de celle-ci 
	*/
/* Je définis 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), je centre donc cette division avec auto et 0 haut et bas */
/* Il faut rétablir l'alignement du texte à gauche que j'ai changé plus haut */
/*L'utilisation de position: relative sur #conteneurglobal définit les frontières de 
 le positionnement de ses enfants à la position "top: 0px, left: 0px" 
qui est maintenant le coin supérieur gauche de #conteneurglobal, 
au lieu de celui de body.*/
/*il va positionner mon menu */


#conteneurcv
{

margin:0 auto;
padding:0;
text-align:center;
}

#cv
{
background: url(../images/ImageReactive1.png); 
width: 600px; 
height: 849px; 
margin: 0;
padding: 0; 
position:relative;
z-index:1;
}

/*transformation en bloc*/

#cv li
{
margin: 0;
padding: 0;
list-style: none;
position: absolute;
display:block; 
margin:0;
padding:0;
}

#cv a{display:block; margin:0;padding:0;border:none;}

/*taille des li*/

#li1 {left: 127px; top: 25px; width: 300px; height: 125px; }
#li2 {left: 51px; top: 174px; width: 325px; height: 125px;}
#li3 {left: 52px; top: 300px; width: 450px; height: 175px;}
#li4 {left: 52px; top: 477px; width: 500px; height: 250px;}
#li5 {left: 280px; top: 100px;width: 370px; height: 342px;}

/*	 taille des a*/

#li1 a {height: 125px;}
#li2 a {height: 125px;}
#li3 a {height: 175px;}
#li4 a {height: 250px;}
#li5 a {height: 342px; border:0;}

/*définition des hover*/

#li1 a:hover {background: url(../images/ImageReactive1.png) -127px -874px no-repeat;z-index:2;}
#li2 a:hover {background: url(../images/ImageReactive1.png) -51px -1023px no-repeat;z-index:2;}
#li3 a:hover {background: url(../images/ImageReactive1.png) -52px -1149px no-repeat;z-index:2;}
#li4 a:hover {background: url(../images/ImageReactive1.png) -52px -1326px no-repeat;z-index:2;}
/*#li5 a:hover {background: url(../images/postit.png) no-repeat; border:none;}*/

#fermeture img, #fermeture2 img
{
	border:0;
	padding:0;
	margin:0;
	position:absolute;
}

#fermeture a, #fermeture2 a
{
	text-decoration:none;
}
 
#fermeture, #fermeture2
{
	border:0;
	padding:0;
	margin:0;
	position:absolute;
}

#fermeture
{
	left:550px;
	top:40px;
	z-index:2;
}

#fermeture2
{
	left:550px;
	top:650px;
	z-index:2;
}

a:visited
{
	border:0;
}

a:active
{
	border:none;
}
a:focus
{
	border:none;
}

a:hover
{
	border:none;
}

img
{
	border:none;
}

#postit
{
	
	position:absolute;
	left:89px;
	top:63px;
	border:0;

}
#postit:hover
{
	width:370px;
	height:342px;
	position:absolute;
	left:20px;
	top:65px;
}