div, p, h1, h2, h3, ul, ol, li, hr, img, span, form, br, a {margin:0; padding:0;}
body {background-color:#838A3D; font-family:Arial, Helvetica, sans-serif; color:#5a3d1c;}
a img { border: none; }
#container { position:relative;width:950px;padding-top:3px; margin-left:auto; margin-right:auto; text-align:center;background:url(../images/bgPage.png) top left no-repeat; }

/* le header avec baseline flash dynamique et l'anim */
#header {position:relative;margin-left:5px;background:url(../images/bgHeader.png) 50% 0 no-repeat; height:170px; width:940px; text-align:left;}
#baseline { position:absolute;width:450px;height:30px;top:80px; left:230px; font-size:16px; }
#anim {width:265px; height:85px;position:absolute;right:20px;top:20px;}
#flash { width:200px; height:360px; background-color:#FF99CC; margin-left:40px; }

/* Menu général avec comportement de roll-over */ 
#menu {position:absolute;height:30px; width:900px;top:123px;left:25px;text-align:left;font-size:11px;}
#menu a {text-decoration:none; color:#5a3d1c;}
#menu a:hover, #menu a.active {font-weight:bold;}

/*menu zones */
#zones {position:absolute;width:480px;top:5px;}
#zones strong {position:relative;display:block;float:left;padding:0px 25px 0 2px;margin-right:10px;background:url(../images/pictos/puce.png) 100% 0% no-repeat;line-height:19px;font-style:italic;}
#zones ul {position:relative;float:left;display:inline;margin-right:15px; }
#zones li {position:relative;float:left;display:inline;padding:0 5px 0 0px;line-height:20px;}
#zones a.active{color:#ff7d00;}
/* menu nav */
#nav{position:absolute;top:5px;width:320px;left:500px;}
#nav li {position:relative;float:left;display:inline;padding:0 2px 0 0;color:#fff;line-height:20px;}
#nav li a {color:#fff;}
#nav li a:hover,#nav li a.active {color:#5a3d1c;}
#nav li.lienContact a{font-weight:bold;}


/* menu langues */
ul#langues {position:absolute;width:100px;list-style-type:none;text-align:right;top:0;right:0;} 
#langues li {position:relative;float:right;display:inline;padding:10px 1px 0 1px;}


#page { position:relative;width:950px;padding-top:6px; padding-bottom:25px; margin-left:auto; margin-right:auto; text-align:center;background:url(../images/bgPage.png) bottom left no-repeat; }

/* bottomline */
#bottomline { position:relative; font-size:11px; width:900px; margin:10px auto; text-align:center;}
#bottomline a {color:#5a3d1c;}
#bottomline a:hover {color:#CCCC66;}

/* pied de page */
#mentions { position:relative; font-size:11px; width:800px; margin-left:auto; margin-right:auto; text-align:center; }
#mentions a {text-decoration:none; color:#5a3d1c;}
#mentions a:hover {color:#CCCC66;}

.nof {clear:both; visibility:hidden;}
.inline { display:inline; }

/* titres pages new / book / tribu + intro	*/
#page.book h1 {width:922px;font-size:18px;margin-left:20px;padding-left:10px;background-image:url(../images/bgTitresPages.png);background-repeat:no-repeat;text-align:left;height:27px;line-height:30px; }
#page.book.fr h1{background-position:0 0;}
#page.book.en h1{background-position:0 -27px;}
#page.book.pt h1{background-position:0 -54px;}
#page.book.es h1{background-position:0 -81px;}

#page.news h1 {width:922px;font-size:18px;margin-left:20px;padding-left:10px;background-image:url(../images/bgTitresPages.png);background-repeat:no-repeat;text-align:left;height:27px;line-height:30px; }
#page.news.fr h1{background-position:0 0;}
#page.news.en h1{background-position:0 -27px;}
#page.news.pt h1{background-position:0 -54px;}
#page.news.es h1{background-position:0 -81px;}

#page.tribu h1 {width:922px;font-size:18px;margin-left:20px;padding-left:10px;background-image:url(../images/bgTitresPages.png);background-repeat:no-repeat;text-align:left;height:27px;line-height:30px; }
#page.tribu.fr h1{background-position:0 0;}
#page.tribu.en h1{background-position:0 -27px;}
#page.tribu.pt h1{background-position:0 -54px;}
#page.tribu.es h1{background-position:0 -81px;}

#page.liens h1 {width:922px;font-size:18px;margin-left:20px;padding-left:10px;background-image:url(../images/bgTitresPages.png);background-repeat:no-repeat;text-align:left;height:27px;line-height:30px; }
#page.liens.fr h1{background-position:0 0;}
#page.liens.en h1{background-position:0 -27px;}
#page.liens.pt h1{background-position:0 -54px;}
#page.liens.es h1{background-position:0 -81px;}

#intro { position:relative;width:900px;text-align:left; padding:12px 0 20px 0; margin-left:30px; font-size: 12px; }
#intro a {color:#5a3d1c; text-decoration:none;}
#intro a:hover {color:#f06103;  text-decoration:underline;}

/* accueil tribu */
#cadran {position:relative; background:url(../images/fond/bg-tribu.png) 50% no-repeat; height:440px; margin-top:30px; font-size:12px; font-weight:bold; text-align:left; }
#cadran a {display:block; position:absolute; text-decoration:none; color:#5a3d1c;width:110px;}
#cadran a:hover {color:#f06103;}
.tribu_1 { top:160px; left:600px;}
.tribu_2 { top:160px; left:230px;} 
.tribu_3 {top:260px; left:600px;}
.tribu_4 {top:246px; left:230px;}
.tribu_5 {top:170px; left:460px;}

/* Blocs avec grande barre de titre : news / book / tribu */
.bloc-large {position:relative;background:url(../images/bgTitresArticles.png) 0 0 no-repeat; width:800px; margin-left:auto; margin-right:auto; text-align:left; margin-top:20px; clear:both; }
.bloc-large h2 { position:relative;height:38px; line-height:38px; padding-left:30px; font-size:16px;  }
.edition {position:absolute;right:30px;text-align:right;font-size:12px;}
.bloc-large h3 {text-decoration:underline; padding-left:30px; font-size:14px;}

/* Vignettes et textes news, book, tribu */
a.vign {width:100px; height:76px; display:block; float:left; border:1px solid #5a3d1c; margin:5px; }
a.vign img { border: none; width:100px; height:76px; }
a:hover.vign {border:1px solid #ffbf00;}
.txt-post {position:relative;float:left; font-size:12px; margin-top:20px; width:420px;}
.txt-post h3 {position:absolute;top:0;left:0;}
.txt-post div{position:relative;padding-top:15px;}
.txt-post p {padding:0 0 20px 30px;}
.txt-post ul {padding:0 0 20px 45px;}
.txt-post a { color:#5a3d1c; }
.txt-post a:hover {color:#ffbf00; text-decoration:none; }
.vign-post {margin-left:20px;  float:left; margin-top:20px; width:360px; }
.vign-post p {font-size:11px; padding:0 0 0 7px;}


/* page l'esprit */
#page.esprit h1 {width:922px;font-size:18px;margin-left:20px;padding-left:10px;background-image:url(../images/bgTitresPages.png);background-repeat:no-repeat;text-align:left;height:27px;line-height:30px; }
#page.esprit.fr h1{background-position:0 0;}
#page.esprit.en h1{background-position:0 -27px;}
#page.esprit.pt h1{background-position:0 -54px;}
#page.esprit.es h1{background-position:0 -81px;}

#esprit {position:relative;background:url(../images/fond/bg-esprit.png) 50% 20px no-repeat; height:430px; margin-top:20px;font-size:12px; font-weight:bold; text-align:left; }
#esprit a {display:block; position:absolute; width:230px; text-decoration:none; color:#5a3d1c; }
#esprit a:hover {color:#f06103;}
.esp-rel {top:5px; left:360px; text-align:center; } 
.esp-amu {top:190px; left:70px; text-align:right; }
.esp-res {top:150px; left:310px; text-align:right; }
.esp-nat {top:190px; left:650px; text-align:left; }
.esp-ton {top:370px; left:360px; text-align:center;}
.col-esprit {width: 236px; float:left; border-right:1px solid #5a3d1c; height:380px; }
.col-esprit-relax { margin-left:1px; }
.col-esprit h2, .col-esprit-relax h2 { text-align:center; font-size:14px; border-bottom:2px solid #5a3d1c; position:relative; margin-top:-16px; margin-bottom:10px; }
.col-esprit p, .col-esprit-relax p { text-align:left; font-size:11px; padding:0 5px 5px 5px; }
.col-esprit a, .col-esprit-relax a { text-decoration:none; color:#5a3d1c; }
.col-esprit ul li, .col-esprit-relax ul li { list-style:disc; list-style-position:inside; font-size:11px; text-align:left; padding:3px 5px 0 5px; }
#deco-esprit { margin-left:200px; text-align:left; position:relative; margin-top:-25px; }
#deco-esprit img { margin-right:160px; }

/****************************************************************************************
* 		Blocs liens avec pictos et effet de roll over -> page contact et séjours
****************************************************************************************/
.btn-devis {clear:left;}
.btn-preinsc, .btn-inviter, .btn-devis, .btn-mail, .btn-fiche {position:relative; margin-top:20px; height:75px; float:left;display:inline;  }
.btn-preinsc a, .btn-inviter a, .btn-devis a, .btn-mail a, .btn-fiche a { position:relative; height:100%;color:#5a3d1c;display:block;font-size:11px;padding:5px 20px 0 80px; text-align:justify; text-decoration:none; }
.btn-preinsc a strong, .btn-inviter a strong, .btn-devis a strong, .btn-mail a strong, .btn-fiche a strong {font-size:12px;}
.btn-preinsc a { background:url(../images/boutons/preinscription.png) 0 0 no-repeat; }
.btn-inviter a { background:url(../images/boutons/inviter.png) 0 0 no-repeat;}
.btn-devis a { background:url(../images/boutons/devis.png) 0 0 no-repeat;}
.btn-mail a { background:url(../images/boutons/mail.png) 0 0 no-repeat;}
.btn-fiche a { background:url(../images/boutons/fiche.png) 0 0 no-repeat;}
.btn-devis a:hover, .btn-preinsc a:hover, .btn-inviter a:hover, .btn-mail a:hover, .btn-fiche a:hover{ background-position: 0 -129px; }

/*	Page contact	*/
#contact	{ position:relative; height:400px;width:800px;margin:20px auto;text-align:center;}
.txt-contact {position:relative;width:800px; height:202px; background:url(../images/bgContact.png) 0 0 no-repeat; font-size:12px; text-align:left;}
.txt-contact h1 {font-size:16px; padding:25px 0 5px 38px; width:90px; }
.txt-contact p {width:190px; overflow:hidden;line-height:18px; }
.contact1_ {position:absolute; left:40px; top:60px; }
.contact2_ { position:absolute; top:60px; left:245px; }
span.lib {display:block; width:40px; float:left; }

.blocs-contact { position:relative;width:800px;margin-top:20px;}
#contact .btn-preinsc, #contact .btn-inviter, #contact .btn-devis, #contact .btn-mail { position:relative;width:370px;margin:10px 10px 0 10px; }





/*** page liens	***/
#lien_une { position:relative;width:440px;border-left:1px solid #f06103; font-size:12px; float:right;margin:0 20px;padding-left:10px; text-align:left;  }
#lien_une a { color:#5a3d1c; font-weight:bold; }
#lien_une a:hover {color:#f06103; text-decoration:none; }
#lien_une img { float:left; margin:0 10px 5px 0; }

#cat_liens { position:relative;font-size:12px; width:320px;margin-left:30px; text-align:left;  }
#cat_liens h2, #lien_une h2 { font-size:14px; }
#cat_liens a { color:#5a3d1c; text-decoration:none;  }
#cat_liens a:hover { color:#f06103; text-decoration:underline; }

.lesliens { border-bottom:1px solid #ffbf00; margin:10px; padding-top:10px; font-size:12px;}
.lesliens table { text-align:left; margin-bottom:10px; width:100%; }
.lesliens th { width:15%; padding-right:10px; text-align:left; }
.lesliens th, .lesliens td { vertical-align:top; }
.lesliens a { color:#5a3d1c; font-weight:bold;  }
.lesliens a:hover { color:#f06103; text-decoration:none; }

/* Page zone */
#zone { text-align: center; width:922px; margin:0 auto; position:relative; }
.fr #zone div.title, .en #zone div.title {background-image:url(../images/bgTitresZones.png);background-repeat:no-repeat;text-align:left;height: 27px; }
/* sejours */
.fr #zone div.title._2, .fr #zone div.title._4 {  background-position:0 0px;}
.en #zone div.title._2, .en #zone div.title._4 { background-position:0 -27px; }
.pt #zone div.title._2, .pt #zone div.title._4 {  background-position:0 -54px;}
.es #zone div.title._2, .es #zone div.title._4 { background-position:0 -81px; }
/* seminaires */
.fr #zone div.title._1, .fr #zone div.title._3 {  background-position:0 -108px;}
.en #zone div.title._1, .en #zone div.title._3 { background-position:0 -135px; }
.pt #zone div.title._1, .pt #zone div.title._3 {  background-position:0 -162px;}
.es #zone div.title._1, .es #zone div.title._3 { background-position:0 -189px; }

#zone div.title h2 { position:relative;text-align:left; margin-left:14px; line-height:30px; width:430px; font-size:14px; }

#zone_description { position:relative; text-align:left; width:900px; padding:12px 0 20px 0; margin-left:14px; font-size: 12px; }

.sejours_type { position:relative; width:180px; float:left; display:inline; background:url(../images/bgCol5Zones.png) left bottom no-repeat; margin-right:4px;padding-bottom:10px; }
.sejours_type .sejour_title { position:relative;height:190px;width:180px;color:#eb8009; text-align:center;  }
.sejours_type .sejour_title h3 { position:absolute; top:150px; left:0px; font-size:18px; width:100%;background-color:#fff;  }
.sejours_type .sejour_title p { position:absolute; top:172px; left:0px; font-size:12px; width:100%; font-style:italic; background-color:#fff;  }

/* Liste des séjours avec effets de survol */
.sejours_type ul li{position:relative;width:99%;height:75px;text-align:left;cursor:hand;list-style:none;margin-top:8px;overflow:hidden;}
a.jaune, a.vert, a.orange, a.nocolor {position:relative;display:block;width:100%;height:100%; font-size:11px; text-decoration:none; color:#5a3d1c;  }
a.jaune {background:url(../images/bgJaune.png) 1px -85px no-repeat;  }
a.vert {background:url(../images/bgVert.png) 1px -85px no-repeat; }
a.orange {background:url(../images/bgOrange.png) 1px -85px no-repeat; }
a.jaune:hover,a.vert:hover,a.orange:hover {background-position:1px 0;}
.pdt, .desc {display:block;position:absolute;width:90px;height:65px;overflow:hidden;line-height:12px;cursor:hand;}
.pdt {top:5px; left:80px;}
.desc {top:25px;left:80px;}
.jaune img, .vert img, .orange img  {position:absolute;border:0;z-index:2;top:7px;left:8px; }


/****************************************************************************************
*					Fiche détaillée (utilise des éléments de la page contact)			*
****************************************************************************************/
#fiche {position:relative;width:922px;margin:0 auto;text-align:center;}
#fiche div.title {  position:relative;background:url(../images/bgTitresFiches.png) 0 0 no-repeat; height:30px; }
#fiche div.title h1 { position:relative; text-align:left; margin-left:14px; line-height:30px; font-size:14px; }
#fiche div.title h1 em {font-size:12px;}
#tarif {position:absolute;top:-5px;width:350px;right:100px;text-align:left; font-size:16px;}
.prix {font-size:20px;}

#backTop {position:absolute;width:80px;right:10px;top:5px;font-weight:bold;font-size:13px;color:#5a3d1c; text-decoration:none;}
#backBottom {position:relative;display:block;width:100px;margin:30px auto 0 auto;font-weight:bold;font-size:13px;color:#5a3d1c; text-decoration:none;}
#backTop:hover, #backBottom:hover {color:#f06103;}

/* Colonne de gauche : diapo + blocs de liens inscriptions, mail etc (mêmes blocs que page contact */
#fiche-g { position:relative;width:400px; float:left;display:inline; text-align:left; margin-left:20px; margin-top:20px;  }

/* Bloc avec diapo images */
#diapo {position:relative;width:380px; height:350px; font-size:11px;text-align:center; }
#img-diapo { position:absolute;width:380px;height:285px;top:0px; left:0px; text-align:center; }
#nav-diapo {position:absolute;width:410px;height:40px;top:300px;left:5px;  }
#nav-diapo a img {border:0;}
#nav-diapo a {display:block; height:38px;float:left; margin:0 30px 0 0; }
#nav-diapo a:hover {border:1px solid #ffbf00;}



/* colonne de droite : détail séjour - blocs d'infos */
#fiche-d {position:relative;width:450px;float:left;display:inline;margin-left:20px; text-align:left; font-size:11px; margin-top:10px;}
#fiche-d h1 {font-size:16px; text-align:center;height:40px;line-height:40px; }
/* bloc sur fond jaune */
#descSejour {position:relative;background:url(../images/bgDescSejour.png) 0 0 no-repeat; width:450px; height:325px; font-size:11px;  }
#descSejour h2 {font-size:13px; margin:5px 0 0 0;}
.txt-sejour {position:relative; text-align:justify; padding:20px;  }
/* titre sur barre horizontale et paragraphe en retrait */
#infos h2 {background:url(../images/bgTitresSejours.png) 0 0 no-repeat; height:39px; line-height:39px; font-size:12px; text-align:center; margin:20px 0 10px 0;}
#infos p {padding:0 18px 0 18px; text-align:justify;}
#infos ul {padding:0 18px 10px 18px; text-align:justify; list-style-position:inside;}
#fiche-d a {color:#5a3d1c;}
#fiche-d a:hover {color:#f06103;}
/****************************************************************************************
*					Les formulaires de contact / devis / pré-inscriptions			*
****************************************************************************************/
form {width:794px; margin-left:auto; margin-right:auto; font-size:11px; text-align:left;}
form h1 { text-align:left; font-size:18px; text-decoration:underline; padding:0 10px 0 30px; float:left; width:550px; }
form h2 {clear:both; margin-top:5px; background: url(../images/fond/liseret-formulaires.png) 0 0 repeat-x; text-align:left; font-size:16px; padding:15px 0 0 30px; }
form h2.sansdeco { background:none; margin:0; padding:0 0 0 30px; }
form h3 {clear:both; text-align:left; font-size:14px; padding:10px 0 0 30px;}  /*titre sans liseret */
.oblig {color:#f06103; font-weight:bold; font-size:14px; }  /*astérisques de champs obligatoires */
label {font-weight:bold; font-size:12px; display:block; margin-top:10px; }/**/
p.err {clear:both; font-size:14px; color:#f00; font-weight:bold; padding-left:30px; }
.sent {position:relative;width:400px;margin:40px 0 20px 220px;}
.sent h1{font-size:16px;text-align:left;}
p.merci {width:400px; font-size:12px; margin-top:10px; padding-top:30px;  text-align:left; font-weight:bold; background: url(../images/fond/liseret-formulaires.png) 0 0 repeat-x;}
/* pour l'organisation des champs en 2 colonnes et en 3 colonnes */
.moitie {width:330px; float:left; padding-bottom:10px; /*background-color:#CC6666;*/ }
.moitie p {width:135px; float:left; }
.moitie option {width:90px;}
.tiers {width:240px; float:left; margin-right:10px; }
.deuxtiers {width:500px; float:left; margin-right:10px; }
p.demi {width:120px; float:left; }
.tiers option {width:160px;}
.opt-long {width:260px;}
.opt-long select {width:260px; }
/* champs de texte commentaires */
#lab-comm {float:right; width:330px; font-weight:normal; padding:0 40px 0 0; font-size:11px;}
#commentaires {margin:5px 0 0 30px; width:350px; font-family:Arial, Helvetica, sans-serif; font-size:12px;}
/* bouton */
#envoyer { clear:both; margin:5px 0 5px 330px; }
#preview { display:block; float:left; margin:30px 40px 20px 100px;  }
#envoyerinvit { float:left;  margin:30px 0 20px 0;  }
/* mentions pied de page */
#infos-cnil { clear:both; text-align:left; padding:5px 20px 0 30px; font-size:11px; line-height:11px;}
#donnees-sejour, #organisation, #donnees-preinsc, #chef, #membres, #tribu {padding-left:30px;}
#donnees-sejour {float:left; width:330px; height:250px;} /**/
#donnees-sejour input.court {width:110px;}
#activites { width:380px; float:left; padding-top:20px;  }
.saison-activites {width:160px; float:left; margin-right:20px; font-weight:bold; font-size:11px; padding-top:5px; }
.saison-activites label {font-size:11px; height:20px; margin-top:2px;}/**/
/* Reglage longueur des champs des blocs et des paragraphes */
#organisation input {width:220px;}
#organisation input.court {width:100px;}
#chef input {width:180px;}
#chef input.court {width:90px;}
#membres input {width:180px;}
#membres input.age {width:30px;}
label.mobile, label.mail {margin-top:60px;}/**/ /* décalage vertical des champs TELEPHONE MOBILE sur form devis et EMAIL sur form preinsc */
#tribu input {width:180px;}
#tribu p {float:left; margin:0 20px 0 0;}
#tribu p.consignes {width:300px; margin-top:10px;}
#membres p {float:left; margin:0 20px 0 0;}
#message {margin:10px 0 0 30px; width:640px; font-family:Arial, Helvetica, sans-serif; font-size:12px;}/**/
#donnees-sejour input.pers { width:50px;}
/* blocs recommandations */
.recom { width:360px; float:left; padding-left:30px; line-height:11px; }
.recom h3 {padding-left:20px; font-size:12px;}
.recom-long { width:750px; float:left; padding-left:30px;}
.recom a, .recom-long a {color:#5a3d1c; display:inline; }
.recom a:hover, .recom-long a:hover {color:#f06103; }
/* Blocs nom avec M. Mme sur même ligne que le Label du champ */
.labnom {width:90px; float:left;}
#chef span.civilite, #membres span.civilite {display:block; text-align:right; width:90px; float:left; padding-top:5px;}
#chef span.civilite input, #membres span.civilite input {width:10px; }
/* popup calendrier */
#basis { display:inline; position:relative; }
#calender  { position:absolute; top:-170px; left:-180px; width:220px; background-color:#fff; border:3px solid #838A3D; padding:10px; z-index:100; }
#control { text-align:center; margin:0 0 5px 0; }
#control select { font-size:11px; margin:0 5px; vertical-align:middle; width:80px; }
#control option { width:80px;}
#calender  .controlPlus { padding:0 5px; text-decoration:none; color:#333; }
#calender  table { empty-cells: show; width:100%; font-size:11px; table-layout:fixed;}
#calender  .weekdays td {text-align:right; padding:1px 5px 1px 1px; color:#333; }
#calender  .week td { text-align:right; cursor:pointer; border:1px solid #fff; padding:1px 4px 1px 0;}
#calender  .week .today { background-color:#ccc;  border-color:#ccc; }
#calender  .week .holiday { font-weight: bold; }
#calender  .week .hoverEle { border-color:#666; background-color:#cc3; color:#000; }

/*********** Bloc navigation archives page news et book   ********************/
.nav { text-align:center; margin-top:8px; font-weight:bold; font-size:13px; }
.nav h2 { text-decoration:underline; font-size:14px; padding-bottom:10px; }
.nav a { color:#5a3d1c; text-decoration:none;  }
.nav a:hover { color:#f06103;}
.nav a.current, .nav span.current { color:#f06103;}
.nav .disabled { display: none; }

/* Messages d'erreur et formulaires */
.fieldWithErrors label {color:#c00; }
.fieldWithErrors input, .fieldWithErrors select, .fieldWithErrors textarea { border:1px solid #c00; }
