html, body {
 font-family: Verdana, Arial, Helvetica, sans-serif; 
 font-size: 12px; 
 margin: 0; padding: 0;
 background-color: white; 
 text-align: center;
 
 }
 /* élements 1ere page */
 
#global {
	position:absolute;
	width : 1000px;
	height:650px;
	left: 50%;
	margin-left: -500px;
	background: url(images/lez2.jpg);
	background-repeat: no-repeat;
 }
	
#drapeau {
 position:absolute;
 left:100px;
 top : 5px;
 text-align: left;
   
 }
 
 #mouette1 {
 position:absolute;
 left:230px;
 top : 30px;
 }
 
 #mouette2 {
	position:absolute;
	left:693px;
	top : 30px;
 }

#gauche {
	position : absolute;
	width: 200px;
	height:610px;
	left:5px;
	top : 40px;
	border:none;
 
}
	


#centre {
	position: absolute;
	top: 10px;
	left : 226px;
	width: 528px;
	height: 642px;
	margin-left:1px;
	text-align:left;

}

#logo {
   width : 310px;
   height:110px;
   background:url(images/logovague.gif);
   margin-left:110px;
   
 } 
 

 
 
#bateau {
   width : 280px;
   height:150px;
   background:url(images/cartes/lelez.jpg);
   margin-left:120px;
   margin-top:10px;
   border: groove  #FF9900;
   
 }

#bateauang {
   width : 280px;
   height:150px;
   background:url(images/cartes/lelez.jpg);
   margin-left:120px;
   margin-top:10px;
   border: groove  #FF9900;
   
 }

#droite {
	position: absolute;
	height: 610px;
	width: 200px;
	left : 785px;
	top : 40px;
 
 }
 
/* -------------------------------------------*/
a.lien:link { 
 color: indigo; 
 text-decoration: none; 
 background-color: aqua; 
 padding:1px;
 }
 
a.lien:visited { 
 color: darkred; 
 text-decoration: none; 
 background-color: #00FF00; 
}

a.lien:hover  {
 color: blue;  
 text-decoration: underline;
 background-color: transparent ;
 font-weight: 400;
 }
 
a.lien:active  {
 color: #900; 
 text-decoration: underline;  
 background-color: transparent;
  }

/*     ___________________________________*/

.titre1 {
 text-align: center ; 
 font-size: 1.2em ; 
 font-weight: 500;
 color: rgb(145,70,0);
 }
 
.titre2 {
    font-size: 24px;
	font-weight: 600;
	color:#FFFF00;
	text-align:center;
	padding-top: 1px;
	padding-right: 1px;
	padding-bottom: 3px;
	padding-left: 1px;

}
/* text-align: center ; 
 font-size: 10px; 
 font-weight: 400; 
 color :green;
 }*/
 
.titre3 {
    position:absolute;
    left:50px ; 
    top:10px;  
    width : 900px; 
	font-size: 20px;
	font-weight: 600;
	color:#000066;
	text-align:center;
	text-decoration:underline;
	padding-top: 1px;
	padding-right: 1px;
	padding-bottom: 3px;
	padding-left: 1px;

 }
 
.titre4 { 
 font-size: 24px; 
 font-weight: 600;
 color:#FFFF00;
 text-align: center;
 margin-left: 20px;
 padding-bottom:5px;
 }
 
.titre5 {
 text-align: center ; 
 font-size: 12px; 
 font-weight: bold;
 color: darkolivegreen;
 }

/*#entete {  }*/



.cartouche  {
 width: 180px; 
 border: 2px solid yellow; 
 margin-left: 5px; 
 margin-top: 15px;
 padding:3px; 
 text-align: center;
 color : black; 
 font-weight: 500; 
 background-color : rgb(250,190,100) ;
   }

.cartouchb  {
 position : absolute;
 left: 98px;
 top: 470px;
 width: 250px; 
 border: 2px solid yellow; 
 margin-left: 5px; 
 margin-top: 15px;
 padding:3px; 
 text-align: center;
 color : black; 
 font-weight: 500; 
 background-color : rgb(250,190,100) ;
   }

.cartouche2  {
 width: 180px; 
 border: 3px solid yellow ;
 margin-left: 5px;
 margin-top: 20px;
 padding:3px; 
 text-align: center;
 color : black; 
 font-weight: 500; 
 background-color : rgb(250,190,100) ; 
 }

.cartouche3  {
 width: 180px; 
 border: 2px solid yellow ; 
 margin-left: 5px; 
 margin-top: 10px;
 padding:3px; 
 text-align: center;
 color : black; 
 font-weight: 500; 
 background-color : rgb(250,190,100) ;
  }

.cartouche4  {
 width: 260px;
 border: 2px solid yellow ; 
 margin-left: 10px;
 margin-top: 385px;
 padding:3px;
 text-align:center;
 color : black; 
 font-weight: 500; 
 background-color : rgb(250,190,100) ;
  }


/* -------------------------------------------*/

a.panlelez {
  text-decoration: none;
 }
 
a.panlelez:hover { 
 border: 1px solid black;
 }

a.panlelez  span {
 display: none ; 
   
 }


a.panlelez:hover span {
 display:block; 
 position:absolute;
 left:15px ; 
 width:500px; 
 top:200px;  
 border:2px solid yellow;   
 font-family: arial; 
 background-color: rgb(160,235,235); 
 color:blue; 
 font-size: 12px; 
 padding: 1px; 
 text-align:justify;

 }/* -------------------------------------------*/


a.panneau {
  text-decoration: none;
 }
 
a.panneau:hover { 
 border: 1px solid black;
 }

a.panneau  span {
 display: none ; 
   
 }


a.panneau:hover span {
 display:block; 
 position:absolute;
 left:15px ; 
 width:500px; 
 top:382px;  
 border:2px solid yellow;   
 font-family: arial; 
 background-color: rgb(160,235,235); 
 color:blue; 
 font-size: 12px; 
 padding: 1px; 
 text-align:justify;

 }

a.pangauche {
  text-decoration: none;
 }
 
a.pangauche:hover { 
 border: 1px solid black;
 }

a.pangauche  span {
 display: none ; 
   
 }


a.pangauche:hover span {
 display:block; 
 position:absolute;
 left:265px ; 
 width:425px; 
 height:400px;
 top:155px;  
 border:2px solid yellow;   
 font-family: arial; 
 font-weight: normal; 
 background-color: rgb(160,235,235); 
 color:blue; 
 font-size: 12px; 
 padding: 10px;
 text-align:justify; 
  }
 
 a.pannavig {
  text-decoration: none;
 }
 
a.pannavig:hover { 
 border: 1px solid black;
 }

a.pannavig  span {
 display: none ; 
   
 }


a.pannavig:hover span {
 display:block; 
 position:absolute;
 left:267px ; 
 width:425px;
 top:140px;  
 border:1px solid yellow;   
 font-family: arial; 
 font-weight: bold; 
 background-color: rgb(160,235,235); 
 color:blue; 
 font-size: 16px; 
 padding: 10px;
 text-align:justify; 

 }
 
a.pandroit {
  text-decoration: none;
 }
 
a.pandroit:hover { 
 border: 1px solid black;
 }

a.pandroit  span {
 display: none ; 
   
 }


a.pandroit:hover span {
 display:block; 
 position:absolute;
 left:-555px ; 
 width:500px;
 height:440px;
 top:120px;  
 border:1px solid yellow;   
 font-family: arial; 
 font-weight: normal; 
 background-color: rgb(160,235,235); 
 color:blue; 
 font-size: 13px; 
 padding: 10px;
 text-align:justify; 
  }
  
a.pantableau {
  text-decoration: none;
 }
 
a.pantableau:hover { 
 border: 1px solid black;
 }

a.pantableau  span {
 display: none ; 
   
 }


a.pantableau:hover span {
 display:block; 
 position:absolute;
 left:-100px ; 
 width:965px; 
 top:-480px;  
 border:1px solid yellow;   
 font-family: arial; 
 font-weight: normal; 
 background-color: rgb(160,235,235); 
 color:blue; 
 font-size: 11px; 
 padding: 10px;
 text-align:justify; 
 

 }
 .bordjaune {
 border: 3px solid 	yellow;
 }
 
.lelez {
 height: 120px;
 width : 280px;
 border: 3px solid 	yellow;
 margin-top: 10px;
 margin-left: 120px;
 }

.imag1{
 padding: 0px ; 
 width: 152px; 
 height: 101px; 
 border: 3px solid yellow;
 margin-top: 10px;
 }

.imag2 {
 height: 189px;
 width : 136px;
 border: 3px solid yellow;
 margin-top: 10px;
 margin-left: 50px;
 }
 
 .imag2b {
 height: 189px;
 width : 136px;
 border: 3px solid 	yellow;
 margin-top: 10px;
 margin-left: 2px;
 }
 
 
 
.titrecontrat {
 color : darkslategray; 
 font-size: 1em ; 
 font-weight: 600;
 }

/*elements pour pages est,nord et ouest -------------------------------------------*/

#conteneur2 {
 position:absolute;
 width: 1000px;
 height:650px;
 left: 50%;
 margin-left: -500px;
 background-image: url("images/fondpapier.jpg" ); 
 background-repeat: repeat;
 
 }

#logo2 {
 position : absolute;
 left : 20px;
 top :60px;
 width : 310px;
 height:110px;
 background:url(images/logovague.gif);
 margin-left:50px;

 }

#colonne1 { 
 position : absolute;
 left : 450px;
 top :50px;
 width: 260px;
 text-align: justify; 
 margin-left: 5px;
 border: 0px  solid khaki ;
 color:#000066;
 padding : 4px; 
 
 }
 
 #colonne2 {
 position : absolute;
 left : 727px;
 top :50px;
 width: 260px;
 text-align: justify;  
 border: 0px solid khaki ;
 color:#000066;
 padding : 4px;
  }

 #colonne3 {
	position : absolute;
	left : 458px;
	top :50px;
	width: 528px;
	text-align: justify;
	margin-left: 5px;
	border: 0px  solid khaki;
	color:#000066;
	padding : 4px;
	height: 531px;
	/*z-index:-1;*/
 }
 
 .cartouche5  {
	position : absolute;
	width: 500px;
	border: 2px solid yellow;
	left: 10px;
	top: 10px;
	padding:10px;
	text-align:left;
	color:#000066;
	font-weight: 500;
	background-color : rgb(250,190,100);
  }
 .cartouche6  {
	/*position : absolute;
	left: 10px;
	top: 300px;*/
	width: 500px;
	border: 2px solid yellow;
	padding:5px;
	text-align:left;
	color:#000066;
	font-weight: 200;
	background-color : rgb(250,190,100);
  }
 
#colonne2 {
 position : absolute;
 left : 727px;
 top :50px;
 width: 260px;
 text-align: justify;  
 border: 0px solid khaki ;
 padding : 4px;
  }


 a.vertical {
  color: darkolivegreen;
  background-color:#FF9900;
  text-decoration: none;
  font-weight: bold;
  text-align: center;
  padding: 4px;
  border: 5px outset #c0c0c0;
  display: block;
  width: 200px;
  

}
a.vertical:hover {
  background-color: #6495ED;
  border: 2px inset #c0c0c0;
}

 a.vertical2 {
  color: darkolivegreen;
  background-color:#FF9900;
  text-decoration: none;
  font-weight:500;
  text-align: center;
  padding: 3px;
  border: 4px outset #c0c0c0;
  display: block;
  width: 150px;
  

}
a.vertical2:hover {
  background-color: #6495ED;
  border: 2px inset #c0c0c0;
}


.cartenord  {
 position : absolute;  
 left: 10px; top: 75px;

  }

.cartenord2  {
 display : block;
 position : absolute;
 left: 20px; top: 180px;
   }
  
a.panoffre {
  text-decoration: none;
 }
/*
a.panoffre:hover { 
 border: 1px solid black;
 }

a.panoffre span {
 display: none ; 
   
 }

	*/
a.panoffre  {
 /*display:block;
 position:absolute;
 left:-610px ;
 width:39em; 
 top:90px;   */
 border:1px solid yellow;   
 font-family: arial; 
 font-weight: normal; 
 background-color: rgb(160,235,235); 
 color:blue; 
 font-size: 13px; 
 padding: 10px; 
 text-align:justify;

 }
  
a.panneausup {
 text-decoration: none;
 color: black;  
 font-weight:500; 
 text-align: center;
 
  }
 
a.panneausup:hover {
  color: yellow; 
 }
 
a.panneausup span {
  display: none ;
 
 }
 
 a.panneausup:hover span { 
 display:block;
 position : absolute;
 left:-445px ;
 height: 415px;
 width:430px;
 top:35px;
 border:1px solid yellow;   
 font-family: arial; 
 font-weight: normal;
 background-color: rgb(160,235,235); 
 color:blue; 
 font-size: 11px; 
 padding: 5px;
 text-align:justify;

 }
 
 a.panneausup2 {
 text-decoration: none;
 color: black;
 font-weight:500;
 text-align: center;

  }

a.panneausup2:hover {
  color: yellow;
 }

a.panneausup2 span {
  display: none ;

 }

 a.panneausup2:hover span {
 display:block;
 position : absolute;
 left:-720px ;
 height: 415px;
 width:430px;
 top:35px;
 border:1px solid yellow;
 font-family: arial;
 font-weight: normal;
 background-color: rgb(160,235,235);
 color:blue;
 font-size: 11px;
 padding: 5px;
 text-align:justify;

 }

#fleurdo {
	display:block;
	position : absolute;
	right:9px;
	top : 11px;
	height: 81px;
	width: 168px;
}