*{margin: 0; padding: 0;}


body{
margin: 0;
padding: 0;
margin: 10px 0 10px 0;
background: #e6eef4;
font-family: tahoma, "Comic Sans MS", "Times New Roman", Times;
text-align: justify;
font-size: 0.9em;
line-height: 20px;
color: #312d2d;
}

#conteneur{
width: 960px;
margin: 0 auto;
background: #fff url(images/fond2.jpg);  
background-repeat: no-repeat; 
position: relative;
border: 1px solid #5a8db0;
}

#coin_gauche{
position: absolute;
top: -1px;
left: -1px;
}

#coin_gauche_bas{
position: absolute;
bottom: -1px;
left: -1px;
}

#coin_droit{
position: absolute;
top: -1px;
right: -1px;
}

#coin_droit_bas{
position: absolute;
bottom: -1px;
right: -1px;
}

#evitement{
height: 25px;
}

#evitement ul{
list-style-type: none;
margin: 0 20px 0 0;
color: #000;	
}

#evitement li{
float: right;
margin-left: 3px;
}

#evitement li a{
text-decoration: none;
color: #123187;
font-size: 10px;

}

#evitement li a:hover{
text-decoration: underline;
}

#entete{
height: 143px;
position: absolute;
top: 30px;
left: 100px;

}

#entete a {
display: block;
text-decoration: none;
text-align: center;
color: #000;
font-size: 3.5em
}

#entete a  img{
border: 0;

}

#droite{/*----------------------------------- Droite -----------------------------------------------------*/

}

#news{/*--------------------------------------- news ------------------------------------*/
background: url(images/menu0.png);
text-align: left;
color: #133289;
font-size: 0.95em;
height: 150px;
overflow: auto;
width: 201px;
position: absolute;
top: 280px;
right: 10px;
z-index: 5;
}

.sujet{
font-weight: bold; 
display: block; 
margin: auto;
text-align: center;
text-decoration: underline;
}

#news p{
margin: 0 10px 0 10px;
padding: 0; 

font-size: 0.8em;
line-height: 1.4em;
}

#news a{
display: block;
margin: 0 5px 0px 5px;
padding: 0; 
text-align: right;
color: #000;
text-decoration: none;
font-size: 0.8em;
padding-bottom: 10px;
}
#menu{/*---------------------------------------------------------------- Menu ----------------------------------------------------*/
position: absolute;
left: 0;
top: 200px;
z-index: 100;
margin: 55px 3px 0 0px;
}

#menu ul {
text-align: left;
list-style-type: none;
}

#menu li {
float: right;
min-height: 25px;
line-height: 25px;
text-align: center;
font-weight: bold;
margin-left: 1px;
padding-left: 5px;
background: url(images/menu_off_gauche.png);
background-repeat: no-repeat;
}

#menu li a{

display: block;
color:  #FFDB81;
text-decoration: none;
font-size: 0.9em;
padding: 0 10px 0 5px;
background: url(images/menu_off.png);
background-position: top right;
background-repeat: no-repeat;
}

#menu li a span{
display: none;

}

#menu li a:hover span{
width: 201px;
height: 150px;
background: none;
display: block;
position: absolute;
left: 210px;
top: -155px;
z-index: 100;
}

#menu li a span img{
border: 0;

}

#menu li a:hover{
color: #fff;
text-decoration: underline; 

}

#menu li a.courant{
color: #fff;
text-decoration: underline; 
background: url(images/menu_off.png);
background-position: top right;
}

#menu li a.courant:hover{
font-style: italic;
}

/*#menu li a.courant span{
width: 200px;
height: 150px;
background: none;
display: block;
position: absolute;
left: 210px;
top: -100px;
z-index: 100;
}*/

#contenu { /*------------------------------------------------- Contenu ------------------------------------------------*/
min-height: 500px;
background: transparent;
padding: 0px 0 30px 0;

}


#contenu p{
padding: 0 75px 20px 75px;

}

#contenu h1{
margin: 0 0 25px 50px;
padding: 0 0px 10px 80px;
line-height: 66px;
clear: both;
font-size: 14px;
color: #153489;
background: url(images/hyppo.png);
background-repeat: no-repeat;
}

#contenu h2{
margin: 0 0 30px 100px;
padding: 0 20px 10px 30px;
height: 65px;
line-height: 115px;
font-size: 14px;
background: url(images/fond_h2.png);
background-repeat: no-repeat;
}

#contenu a img{
display: block;
padding: 3px;
border: 1px solid #15348a;

}

#contenu  img{
display: block;
padding: 3px;
border: 1px solid #15348a;

}

#contenu a{/* pour IE--------------*/
text-decoration:none;
}

#pied_de_page{ /*--------------------------------- footer --------------------------------------------------*/
width: 940px;
margin: 0 auto;
margin-bottom: 10px; 
}

#pied_de_page a{  
color: #c36b0b;
text-decoration: none;
}

#validation{
position: absolute;
top: 4px;
right: 15px;
color: #133289;
}

#copyright{
color: #000;
font-size: 10px;
line-height: 25px;
height: 25px;
text-align: center;
position: relative;
margin: 0;
padding: 0;
}

.miniature_gauche{/*--------------------------------------- Miniatures --------------------------------------------------*/
float: left;
width: 250px;
height: 188px;
margin: 0  35px 0 75px;
position: relative;
border: 1px solid #406fa8;
padding: 5px;
}

.miniature_droite{
float: right;
margin: 0  75px 0 35px;
width: 250px;
height: 188px;
position: relative;
border: 1px solid #406fa8;
padding: 5px;
}

#contenu .miniature_droite a img, #contenu .miniature_gauche a img, #contenu .miniature_exterieur a img, #contenu .miniature_sdb a img{
border: 0;
}

.miniature_exterieur{
float: right;
width: 250px;
height: 290px;
margin: 0  75px 0 35px;
position: relative;
border: 1px solid #406fa8;
padding: 5px;
}

.miniature_sdb{
float: right;
margin: 0  75px 0 35px;
width: 250px;
height: 188px;
position: relative;
border: 1px solid #406fa8;
padding: 5px;
}

.haut_gauche{
position: absolute;
top: 5px;
left: 5px;
}

.haut_droite{
position: absolute;
top: 5px;
right: 5px;
}

.milieu_gauche{
position: absolute;
top: 100px;
left: 5px;
}

.milieu_droite{
position: absolute;
top: 100px;
right: 5px;
}

.bas_gauche{
position: absolute;
bottom: 5px;
left: 5px;
}

.bas_droite{
position: absolute;
bottom: 5px;
right: 5px;
}

.bas_gauche_sdb{
position: absolute;
bottom: 5px;
left: 15px;
}

.bas_droite_sdb{
position: absolute;
bottom: 5px;
right: 15px;
}

.piece{
font-weight: bold;
color: #4070a8;
}

#rapide{
font-weight: bold;
text-align: center;
}

#rapide a{
color: #4070a8;
}

#rapide a:hover{
color: #fb680f;
}

#visite span{
font-weight: bold;
display: block;
height: 25px;
line-height: 25px;
margin-right: 75px;
float: right;
padding: 0 5px 0 30px;
background: url(images/voir.gif);
background-repeat: no-repeat;
}

#visite em{
clear: right;
}

#visite a{
color: #fb680f;
}

#visite a:hover{
color: #4070a8;
}

/*-------------------------------------------------- Tarifs ----------------------------------------------------------------*/
.tarif{
padding: 0 75px 20px 50px;
list-style-type: circle;
margin: 0 350px 0 75px;
}


.prix{
clear: left;
list-style-type: none;
text-align: center;
padding-bottom: 20px;
}

.tarif_s{
clear: left;
margin: 15px 0 10px 0;
border: 1px solid #5587d3;
font-size: 1em;
}

.tarif p{
clear: left;
padding: 0;
}

#condition{
margin: 0 auto;
padding: 30px 0 50px 0;
width: 860px;
background: #ebf9ff;
border: 1px solid #4370a7;

}

#condition p{
padding: 0;
margin: 5px 75px 5px 75px;
}

#condition h3{
margin-left: 5px;
font-size: 0.9em;
}

.souligne{
text-decoration: underline;
}

.gras{
font-weight: bold;
}

.bleu{
color: #5b7dff;
}

.carte{/*------------------------------ Carte  Géoloc -------------------------------------------------------------*/
margin: 0 auto;
border: 1px solid #4070a8;
}

#geoloc{
list-style-type: none;
margin: 5px 50px 50px 50px;
}

#geoloc li{
font-size: 1em;
font-weight: bold;
margin-top: 20px;
}

#geoloc li span{
padding: 0;
font-weight: normal;

}

#map{
margin-left: 300px;
}

/* --------------------------------------- meteo --------------------------------------------*/

#flag a img{
	border: 0;
	margin-right: 10px;
	vertical-align: middle;	
}

#flag a span{  
	display: none;
}

#flag a:hover{  
	background: none;

}

#flag a:hover span{  
	display: block;
   width: 173px;
   height: 130px;
   overflow: auto;
   position: absolute;
   left: 200px;
   top: -87px;
   background: url(images/fond_meteo.png);
   text-align: center;
   font-size: 0.9em;
   line-height: 1.1em;
   
  }

#flag a span em{
   color: #0030d0;
   font-style: normal;
	vertical-align: middle;
	   font-size: 0.8em;
}
  
.titre_meteo
{  
   font-size: 1em;
   font-weight: bold;
   line-height: 2.2em;
}

.pied_meteo
{  
   color: #0030d0;
   font-size: 0.8em;
}







/*---------------------------------------------- Divers ----------------------------------------------------*/
.cacher{
margin-left: -9999px;
}

.photo_gauche
{
float: left;
margin: 0  35px 0 75px;
overflow: hidden;
}

.photo_droite{
float: right;
margin: 0  75px 0 35px;
overflow: hidden;/* pour ie7 ???? ---------*/
}

#banniere_cap {
margin: 20px auto;
text-align: center;
}

#contenu #banniere_cap img{
border: none;
display: inline;
margin: 10px auto;
}

#banniere_cap a{
color: #4070a8;
}

#banniere_cap a:hover{
color: #fb680f;
}

a em{
display: block;
text-align: center;
color: #312d2d;
text-decoration:none;
}

.lien_seul a{
color: #4070a8;
font-weight: bolder;

}

#contenu .lien_seul a:hover {
color: #4070a8;
text-decoration: underline;

}

.question_accueil {
color: #113086;
list-style-type: none;
margin: 0 75px 20px 450px;
}

.question_accueil li{
  background: url(images/puce1.jpg); 
  background-repeat: no-repeat;
  background-position: 0 3px;
  line-height: 19px;
  padding-left: 20px;
  margin-bottom: 5px;
}

#contenu .reponse_accueil {
  margin: 0 0px 0px 285px;
}

#flag{/*--------------------------------------------------------------------- Flag ------------------------------------------------------------------*/
width: 200px;
position: absolute;
top: 190px;
left: -5px;
z-index: 100;
}

#flag img{
border: 0;
}

.flag{
float: right;
margin-left: 5px;

}
  
#loupe{
width: 44px;
float: right;
margin-left: 5px;
}

#flag #loupe a span{
display: none;

}

#flag #loupe a:hover{
background: none;
}

#flag #loupe a:hover span{
	display: block;
   width: 110px;
   height: 50px;
   overflow: auto;
   position: absolute;
   left: 30px;
   top: -45px;
   background: url(images/bulle.png);
   text-align: left;
   font-size: 0.9em;
   line-height: 45px;
   color: #000;
   text-decoration: none;
}
   
.texte_dessous
{
clear: both;
margin-bottom: 10px;
}

.top {
margin-bottom: 30px;
}

.top a{
float: right;
text-decoration:none;
color: #0030d0;
}

#popup{
width: 350px;
margin: 0 auto;
}

#popup a, #popup a:visited {
overflow: auto;
display: block;
color: #406eaa;
padding: 3px 20px 3px 5px;
font-weight: bold;
width: 350px;
margin: 0 auto;
border: 1px solid #406eaa;
}

#popup a:hover{
background: url(images/popup.gif);
background-position: 355px 6px;
background-repeat: no-repeat;
}

/*------------------------------------------ FAQ -------------------------------------------*/

.faq{
width: 810px;
margin: 30px auto;
line-height: 25px;
text-align: justify;
}

.faq p.question{
border: 1px solid #416ea5;
background: url(images/question.jpg) no-repeat;
background-position: 0 center;
}

.faq p.commentaire{
border: 1px solid #416ea5;
background: url(images/commentaire.jpg) no-repeat;
background-position: 0 center;
}

.faq p.reponse{
margin-bottom: 20px;
border: 0;
background: #edf1f8;
}

#comment  {
display: block;
margin-bottom: 50px; 
margin-left: 300px;
}

#comment a {
font-weight: bold ;
color: #456fa5;
}

#comment a:hover{
color: #9a9a9a;
}

/* --------------------------------------- tableau de liens -------------------------------*/
#contient_lien
{  
width: 810px;
margin: 50px auto;
padding-top: 10px;
border: 1px  solid #5b7dff;
background-color: #f2f2f2;
overflow: hidden;
}

#contient_lien a{
text-decoration: none;
color: #000;
}

#contient_lien p{
text-align: center;
font-size: 80%;
margin-top: 30px;
padding: 5px 0 5px 0;
}

#conteneur #contient_lien img{
border: none;
display: block;
margin: auto;   
}

.colonne_gauche, .colonne_droite
{  
background-color: #f2f2f2;
width: 50%;
height: 1%;
float: left;	
padding-bottom: 30px;
}

.colonne_gauche img, .colonne_droite img
{
border: 0px;

}

.colonne_gauche p, .colonne_droite p
{
text-align: center;
}

form{  /*-------------------- formulaire contact --------------------------------------*/
background: #f2f2f2;
width: 810px;
margin: 0 auto 30px; 
border: 1px solid #5b7dff;
}					

fieldset{
width: 90%;
margin: 0 auto;
border: 0;
} 

label{
color: #000;
font-size: 1em;
}

input, textarea{
border: 1px solid #5b7dff;

}

.envoyer{
border: 1px solid #000;
background: #F7723B;
color: #fff;
font-weight: bold;
}

.erreur{
margin-left: 300px;
text-align: center;
border: 1px solid #000;
background: red;
color: #fff;
font-weight: bold;
}

.reessayer{
text-decoration: none; 
font-weight: bold; 
color: #F7723B;;
}

legend{
font-weight: bold;
padding: 0px;

}

#popup{
width: 300px;
margin: 0 auto;
}

#popup a, #popup a:visited {
overflow: auto;
display: block;
color: #406eaa;
padding: 3px 20px 3px 5px;
font-weight: bold;
width: 300px;
margin: 0 auto;
border: 1px solid #406eaa;
}

#popup a:hover{
background: url(images/popup.gif);
background-position: 305px 6px;
background-repeat: no-repeat;
}

#envoye{
display: block;
font-weight: bold;
color: #133289;
padding:5px 5px 5px 30px;
background: url(images/smiley.jpg);
background-position: left center;
background-repeat: no-repeat;
width: 350px;
height:20px;
margin: 0 auto 20px;
border: 1px solid #406eaa;
}

/* --------------------------------------- site map --------------------------------------------*/

.sitemap   {
list-style-type: none;
margin: 0px 0 30px 250px;
font-weight: bold;
text-decoration: none;
color: #406fa8;
}

.sitemap  li a  {
text-decoration: none;
color: #406fa8;

}

.sitemap  li a:hover,#site_map  li a:focus  {
text-decoration: underline;

}

.sitemap  li ul  {
list-style-type: circle;
margin: 0px 0 20px 50px;
font-weight: normal;

}

.sitemap  li ul  li ul{
list-style-type: disc;
margin: 0px 0 0px 50px;
font-weight: normal;
}

.sitemap  li ul  li ul li {
font-style: italic;
}

blockquote {
margin: 0px 45px 30px 20px;
background: #e6e6e6;
}

/*--------------------------------------------------------------- Menu 2 -------------------------------------------------------------------------------*/

#nav {}

    #nav {
      float:left;
      width:100%;
      background:url("images/bg.gif") repeat-x bottom;
	  margin:190px 0 60px 0;
font-size: 0.8em;	  
      }
    #nav ul {
      margin:0 auto;
      padding:10px 10px 0;
      list-style:none;
      display:table;
      }
    #nav li {
      display:table-cell;
      float:left;
      background:url("images/right_both.gif") no-repeat right top;
      margin:0 0 0 9px;
      padding:0;
      }
    #nav a {
      display:block;
      position:relative;
      left:-9px;
      margin-right:-9px;
      width:.1em;
      background:url("images/left_both.gif") no-repeat left top;
      padding:5px 15px;
      text-decoration:none;
      font-weight:bold;
      color:#333;
      }
    #nav > ul a {width:auto;}
    /* Commented Backslash Hack hides rule from IE5-Mac \*/
    #nav a {float:none;}
    /* End IE5-Mac hack */
    #nav a:hover {
      color:#5a8db0;
      }
    #demos #nav-demos, 
    #menus #nav-menus,
    #layouts #nav-layouts, 
    #boxes #nav-boxes,
    #mozilla #nav-mozilla,
    #explorer #nav-explorer,
    #opacity #nav-opacity {
      background-position:100% -150px;
      }
    #demos #nav-demos a, 
    #menus #nav-menus a,
    #layouts #nav-layouts a, 
    #boxes #nav-boxes a,
    #mozilla #nav-mozilla a,
    #explorer #nav-explorer a,
    #opacity #nav-opacity a {
      background-position:0 -150px;
      padding-bottom:6px;
      color:#5a8db0;
      }
	  /* not for IE5.x or IE6 */
    #nav li:hover, 
	#nav li:hover a {
      background-position:100% -150px;
      color:#5a8db0;
      }
    #nav li:hover a {
      background-position:0 -150px;
      }
	  #nav li a.courant{
color: #c36b0b;
text-decoration: underline; 

}

#reso{/*---------------------------------- RESO ----------------------------------------*/
width: 960px; 
margin: 400px auto 0; 
background: transparent; 
border: 0; 
text-align: center; 
font-size: 8px; 
}

#reso a{
color: #c9c9c9;
}

#reso a:hover{
color: #c9c9c9;
}