/*Généralités*/
* {
margin:0;
padding:0;
}
body {
	background-color:#FFE4C4;
	font-family: Arial, Verdana, sans-serif;
	font-size: 0.7em;
	max-width:1192px;
}
/*Les boites*/
#logo{
	float:left;
	height:115px;
	width:360px;
	background-color:#FF8000;
	}
#entete {
	height: 115px;
	background-color:#00FFFF;
	}
#contenu {
	background-color:#FFE4C4;
	}
#gauche {
	float:left;
	width:205px;
	background-color: #0000FF;
	background-image:  url(images/fonds/bleu/fond.jpg);
	color:white;
	}
#page {
	color: #660000;
	background-color:#FFE4C4;
	padding:5px;
}
#pied {
	clear:both;
	text-align:center;
	background-color: #eeeeef;
	height: 50px;
}
#conteneur {
margin-left:205px;
padding:5px;
width:70%;
}
/*début des 4 colonnes de contenu -----------------------------------------*/
#pension {
float:left;
width:25%;
color:#333333;
padding:2px;
}
#plonger {
float:left;
width:18%;
color:#333333;
padding:2px;
}
#excursion {
float:left;
width:18%;
color:#333333;
padding:2px;
}
#commerce {
float:left;
width:15%;
color:#333333;
padding:2px;
}
/*fin des 4 colonnes ------------------------------------------------------------*/
/*Les images*/
img {
border:4px outset transparent;
}
.logo {
border:1px solid black;
}
.vignette {
border:1px solid red;
}
/* Les liens */
a {
font-weight:700;
text-decoration:none;
}
a:visited {
font-size:95%;
}
a:hover {
font-size:105%;
}
#gauche > a {
color:white;
}
/*Le menu gauche de navigation*/
#menunav {
margin:5px 3px;
text-align:left;
}
#menunav ul {
display:block;
}
a.bouton {
	color: white;
	background-image:  url(images/fonds/bleu/fond1.jpg);
	width: 130px;
	height: 20px;
	display: block;
	text-decoration: none;
	text-align: center;
	font-size:100%;
	font-weight: 700;
	padding: 3px;
	border: 2px outset #c0c0c0;
	}
a.bouton:visited {
	background-image:  url(images/fonds/bleu/wave.gif);
	border: 2px inset #c0c0c0;
	font-size:95%;
	width: 130px;
	height: 20px;
}
a.bouton:hover {
	background-image:  url(images/fonds/bleu/fond1.jpg);
	border: 2px outset #c0c0c0;
	font-size:120%;
	width: 130px;
	height: 20px;
}
#menunav li:hover > .sousmenu {
	display: block;
}
#menunav .sousmenu{
	display: none;
	list-style-type: none;
 }
 #menunav .sousmenu li{
	padding-left: 50px;
	}
/*début du menu déroulant page index ------------------------------------*/
#menuderoul {
position:relative;
margin:5px 50px;
width:130px;
}
#menuderoul dt {
margin:2px 0;
text-align:center;
font-weight:bold;
border:1px solid red;
background:#ccc;
}
#menuderoul dd {
border:1px solid orange;
}
#menuderoul li {
text-align:right;
background:#fff;
display:list-item;
}
#menuderoul li a, #menuderoul dt a {
color:#000;
text-decoration:none;
display:block;
border:0 none;
}
#menuderoul li a:hover, #menuderoul dt a:hover {
background:yellow;
font-size:80%;
}
dl, dt, dd, ul, li {
list-style-type:none;
}
/*fin du menu déroulant*/
/*Les styles*/
p {
text-align:justify;
text-indent:10px;
color:#512427;
}
p:first-letter {
font-size:100%;
font-weight:bold;
color:#440000;
}
.annonce {
padding:5px;
margin:5px 3px;
font-size:150%;
font-weight:700;
color:#ff8000;
}
.subannonce {
margin:5px 3px;
font-size:120%;
text-align:center;
background-color:blue;
}
.droite {
float:right;
margin:3px;
Padding:10px;
width:295px;
height:150px;
border:1px outset darkred;
background-image:url(images/papierpeint.gif);
color:darkred;
text-align:center;
font-size:12px;
font-weight:700;
}
.gauche {
float:left;
margin:3px;
Padding:10px;
width:95%;
height:150px;
border:1px outset green;
background-image:url(images/papierpeint.gif);
text-align:center;
font-size:12px;
font-weight:700;
}

.element1 {
float:left;
margin:20px;
padding:5px;
border:1px solid red;
width:40%;
}
.element11 {
float:right;
margin:2px;
Padding:10px;
border:1px solid #00ff00;
background-color:#808000;
}
.element2 {
float:right;
margin:20px;
padding:10px;
border:1px solid red;
width:85%;
}
.element22 {
float:right;
margin:2px;
Padding:10px;
border:1px solid #00ff00;
background-color:#808000;
}
.entetedroite {
float:right;
margin:3px;
Padding:10px;
width:300px;
height:150px;
border:1px outset darkred;
background-image:url(images/papierpeint.gif);
color:darkred;
text-align:center;
font-size:12px;
font-weight:700;
}
.explique {
float:left;
margin:10px;
padding:15px;
border-left:medium outset #330000;
border-top:medium outset #330000;
font-size:12px;
color:#333000;
width:40%;
}
.flash {
margin:2px;
font-size:130%;
text-align:center;
font-weight:700;
color:#cc00cc;
}
.maliste {
display:inline;
}
.tuyau {
border:1px solid black;
background-color:#400040;
margin:5px;
padding:5px;
font-weight:700;
color:#ffffff;
text-align:center;
}
.xcep {
margin:5px;
font-size:150%;
font-weight:700;
text-align:center;
color:#ffffff;
background-color:#ff0000;
}
/*Les titres*/
h1  {
background-color:grey;
color:darkred;
font-size:14px;
text-align:center;
font-weight:700;
margin-bottom:10px;
}
.titrepage {
padding:10px;
font-size:20px;
font-weight:700;
text-align:center;
color:#000000;
background-color:#eeeeee;
}
h2 {
font-size:10px;
text-align:right;
font-style:oblique;
}
h3 {
color:darkred;
font-size:12px;
text-align:left;
font-style:oblique;
}
/*Les paragraphes ou les images en fonction du positionnement*/
#gauche > p {
color:white;
}
#logo > p {
color:red;
}
#entete > p {
padding-left:370px;
}
span + form {
clear:left;
}
.liste {
padding:100px;
margin:20px;

}