/* ========== */
/* = Screen = */
/* ========== */
body{background-image:url(../images/fond.jpg);}
#content{margin:0 auto;width:755px;position:relative;}
/* ========== */
/* = HEADER = */
/* ========== */
#header{padding-left:154px;background:transparent url('../images/feto.png') no-repeat top right;height:180px;font-family:"Times New Roman",Times,serif;line-height:1.8em;}
#swf{height:210px;width:125px;position:absolute;top:5px;left:0px;}
.slogan{color:FloralWhite;font-size:1.5em;left:0px;position:absolute;top:115px;font-style:italic;width:200px;}
h1.lefeto{color:White;font-size:3.5em;padding-top:30px;margin-bottom:0em;}
h2.residences{color:#1D51C9;font-size:2.2em;}

/*menu principal*/
#nav{width:425px;padding:25px 0 0 25px;margin:0 25px;font-family:Arial,"Helvetica Neue",Helvetica,sans-serif;float:right;}
.menu{list-style:none;text-align:center;width:83px;height:34px;float:left;margin-left:2px;}
#nav .menu a{display:block;width:83px;height:29px;padding-top:5px;color:black;text-decoration:none;background:#fff url('../images/bouton_bas.png') no-repeat center;}
#nav .menu a:hover{background-image:url(../images/bouton_haut.png);color:white;}
#galerie #nav .menu a.agalerie,
#presentation #nav .menu a.apresentation,
#services #nav .menu a.aservices,
#localisation #nav .menu a.alocalisation,
#reservation #nav .menu a.areservation{background-image:url(../images/bouton_haut.png);color:white;}

/*menu scondaire*/
#nav2{position:absolute;right:4px;top:115px;color:white;list-style:none;margin:0;padding:0;font-family:"Lucida Grande",Verdana,Arial,Helvetica,sans-serif;}
#nav2 .menu2 a{color:InactiveBorder;text-decoration:none;font-size:0.8em;}
.menu2{text-align:center;float:left;}
#nav2 .menu2 a:hover{text-align:center;color:Bisque;}


/* =========== */
/* = SECTION = */
/* =========== */

#section {
   background-color: #fff;
   margin: 0px 0px 0px 186px;
   padding: 1em 25px 1em 119px;
   position: relative;
   min-height: 200px;
}

#section > * {
   position: relative;
   z-index: 2;
}

#galerie #section, #index #section, #reservation #section, #contact #section {
   padding: 1em 3em;
}

#galerie #section {
   height: 260px;
}

#presentation #section {
   min-height: 314px;
}

/* diaporama index */

#slideshow {
   height: 246px;
   width: 428px;
   position: relative;
   margin: 0 auto;
}

#slideshow img {
   position: absolute;
   top: 0;
   left: 0;
   z-index: 8;
}

#slideshow img.active {
   z-index: 10;
}

#slideshow img.last-active {
   z-index: 9;
}

/* texte accueil*/

.accueil {
   background-color: transparent;
   width: 428px;
   margin: 0 auto;
}

div .accueil p {
   color: SaddleBrown;
}

.bienvenue {
   color: Chocolate;
   font-size: 1.4em;
   font-family: "Times New roman", Georgia, Palatino, serif;
   margin-top: 8px;
}

/*menu presentation feto1 & feto2*/
.tabNavigation {
   list-style-type: none;
   position: absolute;
   margin: 0;
   top: 0;
   left: -104px;
   width: 90px;
}

.tabNavigation li {
   margin-bottom: 0.5em;
   text-align: center;
}

.tabNavigation a {
   display: block;
   padding: 5px;
   border: 1px solid #FF7D01;
   color: #000;
   
}
.tabNavigation a:hover {
}

.tabNavigation a:hover, .selected, .selected:focus {
   background: #FF7D01 ;
   color: white !important;
}

/*liste des servises*/
.liste_service .salle a {
   color: #D75315 ;
}
.liste_service .salle a:hover {
   color: #FF7D01 ;
}
#service_liste {
   top: 205px;
   position: absolute;
   width: 180px;
   left: 0;
}

#service_liste ul {
   margin: 0;
   padding: 0;
}

#service_liste ul li {
   list-style: none;
   color: Lavender;
}

#service_liste ul li a {
   list-style: none;
   color: Lavender;
   border-bottom: 1px dotted;
}

#service_liste ul li a:hover {
   border-bottom: 1px solid #fff;
   color: #fff;
}

#service_liste li:first-letter {
   font-family: "Times New roman", Georgia, Palatino, serif;
   font-size: 1.7em;
   vertical-align: baseline;
   color: #FFCBAF;
}

/*contenu*/

#contenu { 
   width: 472px;
}

.titretext {
   color: highlight;
   font-size: 1.3em;
   margin-left: 10px;
}

#contenu_presentation p {
   width: 350px;
   margin-top: 0;
   color: #800000;
}


/*presentation*/

#section .image_presentation {
   position: absolute;
}

#section .image_presentation2 {
   position: absolute;
   left: -200px;
   top: 58px;
   border-left: thin solid white;
   border-bottom: thin solid white;
}

#section .image_presentation3 {
   position: absolute;
   left: 450px;
}

#contenu_presentation, #contenu_services {
   width: 400px;
   border: thin solid Linen;
   width: 425px;
}

/*services*/
#contenu_services {
   background-color: #fff;
}

#section .image_service {
   position: absolute;
   top:93px;
   left: -200px;
   border-left: thin solid white;
   border-bottom: thin solid white;
}

#section .image_service2 {
   position: absolute;
   left: 377px;
   top:80px;
   z-index: -1;
}

/*localisation*/

#plan_localisation {
   position: absolute;
   margin-left: -6px;
   margin-top: 205px;
}

#contenu_localisation {
   border: thin solid Linen;
   height: 328px;
   margin: 0 auto;
   width: 422px
}

.titretext_localisation {
   color: highlight;
   font-size: 1.3em;
   margin-left: 25px;
}

/*reservation*/

.adresses address {
   float: left;
   width: 50%;
   margin-left: -1px;
   font-style: normal;
}

address.feto2 {
   margin-left: 1em;
   margin-right: -1em;
}

#section .fond_reservation {
   position: absolute;
   top:0;
   left:-214px;
   z-index:1;
}

/*Formulaires*/
#form_contact {clear: both; margin: 1em 0;}
fieldset {border: 1px solid #999; background-color: #fff;}
#form_contact fieldset p{float:left;width:150px;margin:0 0 1em 1em;}
#form_contact p.commentaire{width:252px;}
#bouton{float:left;position:absolute;width:174px;}
#form_contact #type_reservation,#form_contact #lieu_reservation {float:none; width: auto;clear: both;}
#bloc_commentaire{width:500px;height:300px;position:absolute;}
#type_commentaire{margin-left:112px;float:left;height:71px;width:364px;}
#commentaire{height:50px;}
#message{float:left;height:150px;}
#envoyer,#annuler{float:right;margin-left:10px;width:90px;}
#envoyer {margin-top: 2em;}

/*contact*/

.appart_contact {
   color: FloralWhite;
   font-size: 1.3em;
   margin-top: 8px;
}

.color_contact {
   padding-left: 12px;
   width: 466px;
   background-color: #800000;
   height: 100px;
   margin-left: 272px;
   margin-top: 441px;
   position: absolute;
}
#lieu_reservation {
   float: left;
}

/*galerie*/

#menu_galerie {
   position: absolute;
   left: -230px;
   top: 0;
   width: 164px;
}

#nav_gal {
   position: static;
   width: auto;
}
#nav_gal li {
   float: left;
}

#feto1, #feto2 {
   clear: both;
}

#menu_galerie p {
   padding: 0;
   margin: 0;
}

#contenu_galerie {
   width: 400px;
   height: 350px;
   position: relative;
   border: thin solid Linen;
   width: 506px;
   margin: 0 auto;
   text-align: center;
   background-image: url("../images/fond_transparent.png");
}

.titretext_galerie {
   color: highlight;
   font-size: 1.3em;
   margin-left: 70px;
}

#transparent_galerie {
   height: 243px;
   margin-left: -8px;
   margin-top: 194px;
   width: 300px;
   position: absolute;
}

#menu_galerie.menu_salle_conf {
   top: 0px;
   left: -319px;
}

#contenu_galerie.gal-salle_conf  {
   position: absolute;
   top: 0;
   left: -84px;
   border: thin solid Linen;
   width: 506px;
   margin: 0 auto;
   text-align: center;
   display: none;
}

.close {
   background: transparent;
   height: 30px;
   position: absolute;
   right: 19px;
   top: 0px;
   width: 30px;
   z-index: 2;
}

#msg_envoi {
   width: 500px;
   background-color: #a5f1a5;
}

/*Galerie d'images CSS (debut) */

#largeImg {
   border: solid 1px #ccc;
   width: 400px;
   height: 300px;
   padding: 5px;
   display: inline;
}

.thumbs img {
   border: solid 1px #ccc;
   width: 50px;
   height: 37px;
   padding-left: 0;
   margin-top: 10px;
}

.thumbs img:hover {
   border-color: #FF9900;
}

#text_galerie h3 em {
   color: WhiteSmoke;
   font-size: 0.8em;
   font-style: normal;
   font-weight: bold;
}

#text_galerie h3 {
   margin-bottom: 0;
   position: absolute;
   text-align: center;
   top: 290px;
   left: 53px;
   width: 400px;
}

.transparent {
   position: absolute;
   width: 400px;
   height: 50px;
   left: 53px;
   top: 276px;
}

.pcont {
   width: 506px;
   height: 312px;
   margin-top: 20px;
}

/*footer*/

#footer {
   text-align: right;
   background:transparent url('../images/feto.png') no-repeat right bottom;
   height: 120px;
   margin-bottom: 1em;
}

#footer p {
   font-size: 0.8em;
   position: absolute;
   bottom: -0.8em;
   width: 100%;
}

#footer p a {
   color: #880000;
}

#footer p a:hover {
}

/*POF FORMULAIRE*/

#repAjax{padding:0.8em; margin:1em 3em 2em 5em;}
.yupee{border:2px solid #191; background:none repeat scroll 0 0 #71e771;}
.error{border:2px solid #991216; background:none repeat scroll 0 0 #F7B4B8;}
#repAjax h3{color:#125F12; font-size:1.1em;}