body {
margin: 0;/* sans marges, la page sera collée aux bords */
font-size: 16px; /* on définit la taille de police de base dans la page */
  background-image: url('images/sand.jpg');;
 
 font-family:  'trebuchet ms', 'Verdana', 'Helvetica','Bitsream Vera Sans', 'Lucida Grande',sans-serif;

 
}


h1{ font-family: 'Verdana',  'trebuchet ms', 'Helvetica', 'Bitsream Vera Sans', 'Lucida Grande',sans-serif;

color: #555753;  }
h2{ font-family: 'Helvetica','Verdana',  'trebuchet ms',  'Bitsream Vera Sans', 'Lucida Grande',sans-serif;

 color: #555753; }
h3{ font-family: 'Helvetica','Verdana',  'trebuchet ms','Bitsream Vera Sans', 'Lucida Grande',sans-serif;

color: #555753; }
h4{ font-family: 'Verdana',  'trebuchet ms', 'Helvetica', 'Bitsream Vera Sans', 'Lucida Grande',sans-serif;

}

.head1 {
background-image: url('images/sea.jpg');
width : 100%;
height : 62px;
color:white;
font-family:trebuchet ms;
font-size:26;
 /* on définit la police de head1 */
}
.gauche {
position: absolute;
left:0; /* on place le bloc gauche à gauche en position absolue */

background-image: url('images/sealeft.jpg');
width: 100px;
height: 1200px;
}

.centre {
margin-left: 102px; /* on place le bloc centre par rapport à la largeur du bloc gauche */
width: 586px;
}

ul,li {
list-style-type: none; /* pour ne pas avoir de puces */
margin-top :30;
margin-left: 2;
padding:6;
line-height: 10px; /* interligne */
}


.logo {
margin-top: 15;
margin-left: 30;
font-style: italic;
}

.ligneH{
background-image: url('images/HL.jpg');
width: 1100px;
height: 1px;

font-size :0;
}
.ligneV{
background-image: url('images/VL.jpg');
margin-left: 100px;
width: 1px;
height: 1200px;

font-size :0;
}

ul#menu
{
	margin-left: 0;
	margin-top: 30 ;
	padding: 0 ;
	list-style-type: none ;
/* Suppression du margin, du padding et des puces du <ul> */
}

ul#menu li
{
	margin: 0 0 5px 0 ;
	padding: 0 ;
/* Suppression du padding du <li> et on définit une marge basse de 5px pour aérer le tout */
}

ul#menu li a
{
	display: block ; /* On passe les liens en éléments de type block pour leur donner des propriétés de taille */
	width: 100px ;
	line-height: 30px ;
	color: #000 ;
	text-indent: 20px ; /* On décale le texte de 40px du bord gauche */
color: #555753; 
	text-decoration: none ;
	background: url(images/bg_menu.gif) no-repeat 0 0 ; /* On met une image de background, que l'on positionne à 0px du bord gauche et 0px du bord haut */

}

ul#menu li a:hover
{
	background: url(images/bg_menu.gif) no-repeat 0 -30px ; /* Et ici on décale l'image du background de 30px vers le haut pour laisser apparaître la 2eme partie de l'image */

}
	
.sea
{
	background-image : url('../images/sea.jpg');
    
      background-repeat : repeat-y ;
	background-width : 100% ;
	background-color : #2F639F;
	
	
	}

.sea2
{
	background-image : url('images/sealeftlong.jpg');
      background-height : 100% ;
	background-color : #2F639F;
 background-repeat : repeat  ;
	
	font-family: trebuchet ms, Verdana, Helvetica,'Bitsream Vera Sans', 'Lucida Grande',sans-serif;
      font-weight:bold;
    

}

.sealeftxlong
{
	background-image : url('images/sealeftxlong.jpg');
	background-color:blue;
	
	font-family: trebuchet ms, Verdana, Helvetica,'Bitsream Vera Sans', 'Lucida Grande',sans-serif;
 font-weight:bold;
 color : yellow; 

}








.sand
{
	background-image : url('images/sand.jpg');
	
	font-family:  trebuchet ms, Verdana, Helvetica,'Bitsream Vera Sans', 'Lucida Grande',sans-serif;


 color: black; 

}