/***********Le Saule Fleuri *****************/
/*Feuille de style
copyright Alain Thyssen : www.architecture-informatique.com
*/
* {
	margin: 0;
	padding: 0;
	
}
body {
	font-family:"Trebuchet MS", Arial, sans-serif;
	font-size: 62.5%;  /*Le texte par défaut de tous les élémnets vaut 10 pixels*/
	text-align:center;
	line-height: 1.2em;
}
/*Description de la page et des éléments*/
#page { 
	width:1000px;
	height: 100%;
	margin: 2px auto;
	background: white url(../images/ombre.jpg) repeat-y right top;
	text-align: left;
}
/*haut de page*/
#header {
  background: transparent url(../images/header.jpg) no-repeat left top;
	width:960px;
	height: 140px;
	margin-left: 10px;
	float: left;
}
a#logo {
	display:block;
	float: left;
	text-indent:-3000px;
	width: 240px;
	height: 100px;
}
h1 {
  float: left;
  color: rgb(57,150,156);
  font-size: 1.6em;
  margin-top: 90px;
  /*height: 30px;*/
}
h1 a {
  color: rgb(57,150,156);
  font-size: 1em;
  text-decoration: none;
  display: block;
  /*height: 30px;*/
	line-height: 1.4em;
}
#langue {
  float: left;
  padding-left: 350px;
}
#langue ul li {
  display: block;
  float: left;
  font-size: 1em;
  font-weight: bold;
  color: rgb(156,156,156);
  padding: 5px 5px;
}
#langue ul li a {
  font-size: 0.9em;
  font-weight: normal;
  color: rgb(214,214,214);
}
#ombrehaut {
  height: 10px;
  width: 10px;
  background: url(../images/ombre_haut.jpg) no-repeat left top;
  float: right;
}
#menu {
  padding-left: 495px;
}
#menu ul li {
  display: block;
  float: left;
  font-size: 1.1em;
  color: black;
  font-weight: bold;
  padding: 5px 5px;
}
#menu ul li a {
  font-size: 1em;
  color: rgb(57,150,156);
  font-weight: normal;
}
#menu ul li a:hover {
  text-decoration: underline;
}
/*fin de haut de page*/
/*Corps de la page*/
#contenu, #bienvenue, #chambre, #alentour, #prestation, #pratique, #recommande, #contact {
	width:980px;
	height: 412px;
	margin-left: 10px;
}
/*page bienvenue*/
#bienvenue {
  background: transparent url(../images/bienvenue.jpg) no-repeat left top;
}
#bienvenue h2, #bienvenue p {
  color: white;
  margin-left: 600px;
  margin-right: 15px;
}
#bienvenue h2 {
  /*padding-top: 20px;*/
  font-size: 1.8em;
  font-weight: bold;
}
#bienvenue p {
  padding-top: 10px;
  font-size: 1.2em;
  font-weight: normal;
}
/*page les chambres*/
#chambre {
  background: transparent url(../images/fondchambres.gif) no-repeat left top;
}
#gauche, #droite, #gauch, #droit {
  float: left;
}
#gauche, #gauch {
  width: 30%;
  padding-left: 30px;
  padding-top: 30px;
}
#gauche h3 {
  float: left;
  text-indent: -3000px;
  margin: 0 ;
  padding: 0;
}
#camille, #anatole, #jules, #palmyre, #camilleh, #anatoleh, #julesh, #palmyreh {
  display: block;
  height: 145px;
  width: 145px;
}
#camille {
  background: transparent url(../images/camille.gif) no-repeat center center;
}
#camille:hover {
  background: transparent url(../images/camilleh.gif) no-repeat center center;
}
#anatole {
  background: transparent url(../images/anatole.gif) no-repeat center center;
}
#anatole:hover {
  background: transparent url(../images/anatoleh.gif) no-repeat center center;
}
#jules {
  background: transparent url(../images/jules.gif) no-repeat center center;
}
#jules:hover {
  background: transparent url(../images/julesh.gif) no-repeat center center;
}
#palmyre {
  background: transparent url(../images/palmyre.gif) no-repeat center center;
}
#palmyre:hover {
  background: transparent url(../images/palmyreh.gif) no-repeat center center;
}
#camilleh{
  background: transparent url(../images/camilleh.gif) no-repeat center center;
}
#julesh{
  background: transparent url(../images/julesh.gif) no-repeat center center;
}
#anatoleh{
  background: transparent url(../images/anatoleh.gif) no-repeat center center;
}
#palmyreh{
  background: transparent url(../images/palmyreh.gif) no-repeat center center;
}

#droite, #droit {
  width: 65%;
  position: relative;
}
#gauche img {
  display: block;
  text-indent: 0;
}
#droite h2, #droite p, #droite li {
  font-size: 1.2em;
  color: black;
  margin-left: 160px;
  margin-right: 15px;
  font-weight: normal;
}
#droite h2 {
  padding-top: 70px;
  font-size: 1.8em;
  font-weight: bold;
}
#droite p {
  padding-top: 10px;
}
#droite p a, #droite h2 a {
  font-size: 1em;
  text-decoration: none;
  color: #1a7d86;
}
#droite p a:hover, #droite h2 a:hover {
  text-decoration: underline;
}
#droite h4, #droite h5 {
  width: 25%;
}
#droite h4 {
  margin-top: 140px;
  font-size: 1.5em;
  color: #7F302E;
}
#droite h5 {
  font-size: 1.3em;
  color: #7F302E;
}
.decalh {
  margin-top: 10px;
}
#droite h6 {
  margin-top: 2px;
  font-size: 1em;
  color: #7F302E;
  float: left;
  width: 10%;
}
#droite h6 a {
  font-size: 1em;
  color: #1a7d86;
  text-decoration: none;
}
#droite h6 a:hover {
  text-decoration: underline;
}
#droite span {
  margin-top: 10px;
  font-size: 1em;
  color: #7F302E;
  display: block;
  margin-left: 45px;
  font-weight: bold;
}
#conimg {
  position: absolute;
  top: 25px;
  left: 130px;
  width: 80%;
  text-align: center;
}
/*FIN de chambre*/
/*Prestation*/
#prestation {
  background: transparent url(../images/Prestation.jpg) no-repeat left top;
}
.col {
  width: 49%;
  float: left;
}
#droit {
  padding-top: 100px;
}
#prestation p, #prestation h2, #prestation li {
  /*padding-left: 610px;*/
  padding-right: 20px;
  font-size: 1.2em;
  color: black;
  font-weight: normal;
}
#prestation h2{
  font-size: 1.8em;
  font-weight: bold;
}
#prestation p {
  padding-top: 5px;
}
#prestation p a {
  font-size: 1em;
  text-decoration: none;
  color: #1a7d86;
}
#prestation p a:hover {
  text-decoration: underline;
}
.padh {
  padding-top: 15px;
}
/*FIN Prestation*/
/*les alentours*/
#alentour {
  background: transparent url(../images/fondalentours.jpg) no-repeat left top;
  /*height: 550px;*/
}
#calentour {
  margin-left: 20px;
  margin-right: 20px;
  width: 940px;
}
div.quart {
  width: 24.9%;
  float: left;
}
.quart h2 {
  padding-top: 8px;
}
.quart h2, .quart p, .quart li {
  font-size: 1.2em;
  color: black;
  padding-left: 30px;
}
.quart li:first-letter {
  font-weight: bold;          
}
.quart li {
  padding-top: 4px;
}
.quart p a, .quart li a {
  font-size: 1em;
  text-decoration: none;
  color: #1a7d86;
}
.quart p a:hover, .quart li a:hover {
  text-decoration: underline;
}

/*FIN les alentours*/
/*Cotés pratique*/
#pratique {
  background: transparent url(../images/fondacces.jpg) no-repeat left top;
}
#carte {
  width: 640px;
  float: left;
}
#carte img {
  padding-left: 100px;
  padding-top: 30px;
}
#acces {
  float: left;
  width: 310px;
}
#acces p, #acces h3 {
  font-size: 1.2em;
  color: white;
  /*font-weight: normal;*/
}
#acces p, #carte p {
  padding-top: 5px;
}
#acces h2, #carte h3 {
  padding-top: 30px;
}
#carte p, #carte h3 {
  color: black;
  font-size: 1.2em;
  margin-left: 35px;
  margin-right: 260px;
}
#acces h2 {
  font-size: 1.8em;
  color: white;
  font-weight: bold;
}
#carte p a {
  font-size: 1em;
  text-decoration: none;
  color: #1a7d86;
}
#carte p a:hover {
  text-decoration: underline;
}
/*FIN Cotés pratique*/
/*Nous contacter*/
#contact {
  background-color: #E3D5C7 ;
	height: 670px;
}
#contactgauche {
  width: 30%;
  float: left;
}
#contactgauche h2, #contactdroite h2 {
  font-size: 1.8em;
  font-weight: bold;
  color: black;
  margin-left: 20px;
}
#contactgauche p, #contactdroite p {
  font-size: 1.2em;
  color: black;
  margin-top: 20px;
  margin-left: 20px;
}
#contactdroite {
  width: 69%;
  float: left;
}
#contactdroite h2 {
  margin-left: 340px;
}
.contactdroite label, .contactdroite p, .choix label {
  width: 45%;
  float: left;
  margin-right: 10px;
  font-size: 1.2em;
  text-align: right;
  color: black;
  margin-top: 10px;
}
.contactdroite input, .contactdroite textarea {
  width: 30%;
  float: left;
  font-size: 1.2em;
  text-align: left;
  color: black;
  margin-top: 10px;
}
.choix input{
  margin-top: 10px;
  float: left;
  cursor: pointer;
}
.bouton input {
	color:#fff;
	background: rgb(8,8,8);
	border: 0px;
	height:25px;
	width:60px;
	margin-left: 460px;
	cursor: pointer;
}
/*FIN Nous contacter*/

/*Recommander ce site*/
#recommande {
  background-color: #E3D5C7 ;
}
#recommande h2{
  font-size: 1.8em;
  font-weight: bold;
  color: black;
  margin-left: 400px;
}
div.recommandedroite, div.recommandegauche {
  width: 45%;
  float: left;
  margin-right: 10px;
  margin-top: 20px;
  font-size: 1.2em;
}
.recommandedroite input, .recommandedroite textarea, .recommandegauche input, .recommandegauche textarea {
  width: 30%;
  float: left;
  font-size: 1.2em;
  text-align: left;
  color: black;
  margin-top: 20px;
}
.recommandegauche label, .recommandedroite label, .recommandegauche p {
  width: 45%;
  float: left;
  margin-right: 10px;
  font-size: 1.2em;
  text-align: right;
  color: black;
  margin-top: 25px;
}
/*FIN Recommander ce site*/
/*infos legales*/
#legalesgauche p, #legalesdroite p {
  font-size: 1.2em;
  color: black;
  margin-top: 20px;
  margin-left: 20px;
  margin-right: 10px;
}
#legalesgauche p a, #legalesdroite p a {
  font-size: 1em;
  color: black;
  text-decoration: none;
}
#legalesgauche p a:hover, #legalesdroite p a:hover {
  text-decoration: underline;
}
#legalesdroite, #legalesgauche {
  width: 34%;
  float: left;
}
#legales {
  float: left;
  width: 69%;
}
#legales h2 {
  margin-left: 190px;
  font-size: 1.8em;
  font-weight: bold;
  color: black;
}
#legales p {
  font-size: 1.2em;
  color: black;
  margin-top: 20px;
  margin-left: 20px;
  margin-right: 10px;
}
#legales p a {
  font-size: 1em;
  color: black;
  text-decoration: none;
}
#legales p a:hover {
  text-decoration: underline;
}
/*FIN infos legales*/
/*Fin Corps de la page*/
/*pied de la page*/
#pied {
	width:980px;
	height: 40px;
	background: transparent url(../images/footer.gif) no-repeat left top;
	margin-left: 10px;
}
a#info {
  float: right;
  display: block;
  padding: 15px 1px;
  color:black;
  font-size: 1em;
}
a#recommander {
  float: left;
  display: block;
  padding: 15px 20px;
  color:black;
  font-size: 1.1em;
}
#ombrebas {
  height: 14px;
  width: 990px;
  background: url(../images/ombre_bas.jpg) no-repeat left top;
	margin-left: 10px;
}
/*Fin pied de la page*/
/*ELéments générique*/
a {
  text-decoration: none;
  cursor: pointer;
}
/*a:hover {
  text-decoration: underline;
}*/
li {
  list-style: none ;
}
img {
  border: 0 none;
}
/*Class et divers*/
.clear{ clear:both;}
.left{text-align: left;}
.right{text-align: right;}
.gras {font-weight: bold;}
/***********Le Saule Fleuri *****************/
/*
copyright Alain Thyssen : www.architecture-informatique.com
*/
/*backgroundImage: url(../images/Anatoleh.gif);*/