/* =INITIAL   v2.1,
 by Faruk Ates - www.kurafire.net
 Addendum by Robert Nyman - www.robertnyman.com
 Addition by Christian Montoya - www.christianmontoya.net */
html, body, form, fieldset,h1, h2, h3, h4, h5, h6, p, blockquote, ul, ol, li, dd, dl, blockquote, address{
 margin: 0; padding: 0; }
li { margin: 0;}
form label { cursor: pointer; } 
fieldset, img, img a {border: none;} 
input, select, textarea { 
	font-size: 100%; font-family: inherit;}
ol, ul { list-style: none;}
h1,h2,h3,h4,h5,h6 { 
	font-size:100%; 
	font-weight:normal; 
} 
table { 
	border-collapse:collapse; 
	/* border-spacing:0;  */
} 
/*---------- END RESET ----------*/

/* HTML5 tags */
header, section, footer, aside, nav, article, figure{
	display: block;
}
/* Couleurs à adapter selon votre charte */
/*  */

/* Couleurs à adapter selon votre charte */
/* a {text-decoration: none;}
a:link {color: #000;}
a:visited {color: #000;}
a:hover {color: #000;}
a:active {color: #000;}
input, textarea, select, button, {border: 1px solid #000;} */

/* Les éléments HTML en général
-------------------------------------------------------- */
html{
	font-size: 100%;
	/* text-align: center; */
	background: #fff;
}

body{
	font-size:62.5%; /* 1em = 10px */
	font-family:"DejaVu Sans", "Liberation Sans", "Nimbus Sans L", Tahoma, Geneva, "Helvetica Neue", Helvetica, sans serif;
	/* width: 100%;*/ 
	margin: 0 auto;
	color: #444;
	background: #c1cad3 url(img/_bkg-page-montagne-fgr.jpg) bottom center no-repeat;
}
a {text-decoration: none;}
p a{ padding-top: .25em;border-bottom:2px solid #876a59;}
a:link { color: #876a59;}
a:visited {border-bottom:0; color: #bb9984; 
}
p a:hover,p a:focus, p a:active ,#footer a:hover,#footer a:focus, #footer a:active {
	background:  #bb9984; color: white; }
/* Opera ne comprend toujours pas :lang() */
*[lang="en"] {
  quotes:"\201C" "\201D" "\2018" "\2019";
}
*[lang="fr"] {
  quotes:"\AB\A0" "\A0\BB" "\201C\A0" "\A0\201D";
}

/* pour les navigateurs qui supportent le selecteur :lang() */
:lang(en) {
  quotes:"\201C" "\201D" "\2018" "\2019";
}
:lang(fr) {
  quotes:"\AB\A0" "\A0\BB" "\201C\A0" "\A0\201D"; 
 /*  quotes:"\00AB\2009" "\2009\00BB"; avec thinsp; ne marche pas dans FF*/
}

#page{
	/*width:94em;*/
	min-width:94em; max-width:125em; 	
	margin:0 auto; overflow: auto;
	min-height: 1150px;	
	background: url(img/bkg-header2.jpg) top center no-repeat;
	position: relative;
}
#main{overflow: auto; padding-bottom: 5em;} 
#header{
	min-width:94em;
	padding-top:1.5em;
	margin-bottom:2em;
	margin-bottom:2em;
}

.left{float: left;}
.right{float: right;}
.clearer{clear: both;}
/* CLEAR FIX*/
.clearfix:after {content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;}
/* .clearfix {display: inline-block;} */

.center{margin: 0 auto;}
.text-right{text-align: right;}
.text-center{text-align: center;}
.relat-pos {position: relative;}
.ln-h-3 {line-height: 3em;}
/*GRIDS
-------------------------------------------------------- */

.generic{
	padding-top:1em;
	margin-bottom:2em;
}
.col75{float:left; width: 75%;}
.col60{float:left; width: 60%;}
.col66{float:left; width: 66.666%;}
.col50{float:left; width: 50%;}
.col40{float:left; width: 40%;}
.col30{float:left; width: 30%;}
.col33{float:left; width: 33.333%;}
.col25{float:left; width: 25%;}
.col20{float:left; width: 20%;}
.col15{float:left; width: 15%;}
.blk25{width: 25em;}
.blk50{width: 50em;}
.blk75{width: 75em;}
.w75{width: 75%;}
.w50{width: 50%;}
.w33{width: 33.333%;}
.wrap-blk-m1 {margin: 0 1em 1em}
.wrap-blk-m1-5 {margin: 0 1.5em 1em}
.wrap-blk-m2 {margin: 0 2em 1em}
.m-l-50pc {margin-left: 50%;}
.p-b-2{padding-bottom: 2em;}
.rd-3{
	border-radius: 3px;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;}
.rd-8{
	border-radius: 8px;
	-moz-border-radius: 8px;
	-webkit-border-radius: 8px;}
.white-8{
	background: rgb(246, 246, 246);
	background: rgba(255, 255, 255, .8);}
.white-6{
	background: rgb(209, 209, 209);
	background: rgba(255, 255, 255, .6);}
.white-4{
	background: rgb(246, 246, 246);
	background: rgba(255, 255, 255, .4);}
.white-2{
	background: rgb(246, 246, 246);
	background: rgba(255, 255, 255, .2);}
.black-5{
	/* background: rgb(246, 246, 246) ;*/
	background: rgba(0,0,0, .5);}
.black-2{
	/* background: rgb(246, 246, 246) ;*/
	background: rgba(0,0,0, .2);}
.blue-5{
		background: rgb(107, 106, 175);
		background: rgba(107, 106, 175,0.5);}
.blue-4{
		background: rgb(107, 106, 175);
		background: rgba(107, 106, 175,0.4);}
.green-4{
		background: rgb(192, 191, 86);
		background: rgba(192, 191, 86,0.4);}
.box-shadow-1{
	box-shadow:1px 1px 3px 0 #111213;
	-moz-box-shadow:1px 1px 3px 0 #111213;
	-webkit-box-shadow:1px 1px 3px 0 #111213;}
	
/*-------------------------------------------+
|                                            |
|                FONT STYLES                 |
|                                            |
+-------------------------------------------*/
/*PARAGRAPHS
-------------------------------------------------------- */
.generic p{
	font-size:1.2em;
	line-height:1.5em;
	margin-bottom:1.5em;
}
.generic table{
	font-size:1.2em;
	line-height:1.5em;} /* */
.generic em{
	font-style:italic;
	font-weight:inherit;
}
.color-bg p {padding: 0 1em;}
.amp{ /* Give those ampersands a right sexy look */
	font-family:Baskerville, "Goudy Old Style", "Palatino", "Book Antiqua", serif;
	font-style:italic;
	font-weight:normal;
	line-height:inherit;
}
blockquote p{
	font-size:1.2em!important;
	line-height:1.5em!important;
	margin-bottom:1.5em!important;
	font-style:italic;
	font-weight:bold;
}
blockquote p cite{
	font-style:normal;
}

/*HEADINGS
-------------------------------------------------------- */
h1{
	color:#110b25;
	font-size:3em;
	margin-bottom:0.6em;
	font-style:italic;
	line-height:1.2em;
}
h2{
	color:#000;
	font-size:2em;
	line-height:0.9em;
	margin-bottom:0.9em;
}
h3{
	color:#000; padding: 0 .5em;
	font-size:1.5em;
	margin-bottom:1.2em;
	line-height:1.2em;
	font-variant:small-caps;
}
h4{
	color:#000;
	font-size:1.2em;
	margin-bottom:1.5em;
	line-height:1.5em;
	font-variant:small-caps;
}
h5{
	color:#000;
	font-size:1em;
	margin-bottom:1.8em;
	line-height:1.8em;
	font-variant:small-caps;
}
h6{
	color:#000;
	font-size:1em;
	margin-bottom:1.8em;
	line-height:1.8em;
}
/*-------------------------------------------+
|                                            |
|               IMAGE STYLES                 |
|                                            |
+-------------------------------------------*/
img.left, .pict.left{ /* Float any image to the LEFT and give it some margin */
	margin-right:2em;
}
img.left.last, .pict.left.last{margin-right:0!important}
img.right, .pict.right{ /* Float any image to the RIGHT and give it some margin */
	margin-left:2em;
}
img.right.last, .pict.right.last{margin-left:0!important}
img{
	font-size:1em;}
img.pict{
	margin-bottom:.5em;}
.pict {
	font-size:1em;
	padding:4px;
	border:1px solid #ccc;
	margin-top:0.3em;
	margin-bottom:1.8em;
	text-align: center; }
.pict em {font-size: 1.2em;}
li .pict em {font-size: 1em;}
em.img-em{padding: .5em;}
img.ol-img{position: relative; top: -1.5em; left: 1.5em;}
hr.separator{
	color: #9696b8; background: #9696b8;
	height: 2px;border-bottom: 1px solid #f8f8ff; margin: 3em 4em ;}
/*-------------------------------------------+
|                                            |
|                LIST STYLES                 |
|                                            |
+-------------------------------------------*/
ul, ol, dl{
	margin-bottom:1.8em;
}
ul li, ol li, dl dt, dl dd{
	font-size:1.2em;
	line-height:1.5em;
}
ul li.caption{ /* Apply this class to the first list item in a list to give it a caption */
	font-variant:small-caps;
	list-style:none;
	color:#000;
}
li > ul, li > ol{
	margin-bottom:0;
	margin-left:3em;
}
li > ul li, li > ol li{
	font-size:1em;
}
ol{list-style:decimal inside;}
.inline-li li {display: inline;}
.inline{display: inline;}
ul.list-rando, .list-rando li li{background:none!important;}
.list-rando>li{
	padding: 1em 0 1em 3em ;
	background-image: url(img/ico-list-rando.png);
	background-position: 0 3px;
	background-repeat: 	no-repeat;margin-bottom: 1.5em; 
}
.list-rando li.caption{ background-image: none;}
/* style des titres de galeries dans a_propos_abcde.php */
.titre-gal{font-weight: bold; font-style: italic;}

/*-------------------------------------------+
|                                            |
|                BLOCKS STYLE                |
|                                            |
+-------------------------------------------*/
.white-4 p,.white-4 ul, .white-4 dl, .list-rando li, em.img-em{
	background-color: rgb(246, 246, 246);
	background-color: rgba(255, 255, 255, .8);	
	border-radius: 3px;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;}
.no-bg{background:none!important;}
.color-bg ul, .color-bg dl {padding: 1em 0 1em 1em ;}
/*-------------------------------------------+
|                                            |
|          NAVIGATION HORIZONTALE            |
|                                            |
+-------------------------------------------*/
ul#prelude {position: absolute; top: 0; }
ul#prelude a {border: 0; font-size: .75em;}
#lang-list {position: absolute;  left:1%; /**/}
#lang-list li{
	text-indent: -9000px; overflow: hidden;
	margin-bottom: 1em;}
#lang-list li a{
	display: block; width: 32px; height: 32px;
	border-bottom: 0;}
#lang-list li a:hover{background: none;}
#fr {background: url(img/french.png);}
#en{background: url(img/english.png);}

#nav-bar ul {
	list-style-type: none; padding: 0;
	margin-left:0;
	}	
#nav-bar a {
	text-decoration: none; display: block;
	padding: .5em; width: 13em;
	color: white;}	
#nav-bar a:hover {background: rgba(255,255,255, .3);}
#nav-bar>ul {
	width: 86.5em; margin:0 auto;}
#nav-bar>ul>li{
	float: left; 
	margin-left: 0; margin-right: .5em; 
	height: 14em; width: 14em;
	background: rgba(255,255,255, .2);}
#nav-bar>ul>li.last{ margin-right: 0; }
#nav-bar>ul>li#active{ 
	background: rgba(147, 124, 90, .3);}
#nav-bar>ul>li>a{
	background: rgba(0,0, 0, .2);
	font-weight: bold;
	text-shadow: 1px 1px 1px rgba(243, 214, 191, .5);}
#nav-bar>ul>li li{margin-left: 0;/* */
	background: url(img/item-sep.png) bottom center no-repeat;}
#nav-bar>ul>li li:last-child{background: none;}
#nav-bar>ul>li li.item-active{background: rgba(0,0, 0, .3);}

ul.sub-menu{margin-top: 4.5em;}
ul.sub-menu li{
	margin-bottom: 1em; padding: 1em 0 1em 1em;
	background: url(img/bkg-ico-activite.png) bottom left repeat-x;
	border-radius: 3px;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	box-shadow:1px 1px 3px 0 rgba(147, 124, 90, .7);
	-moz-box-shadow:1px 1px 3px 0 rgba(147, 124, 90, .7);
	-webkit-box-shadow:1px 1px 3px 0 rgba(147, 124, 90, .7);}
ul.sub-menu li a{
	color: white; font-weight: bold; /* line-height: 4em; */
	padding: 1em 0;
	text-shadow: -1px -1px 1px rgba(0, 0, 0, .5);}
/*-------------------------------------------+
|                                            |
|               CONTENT STYLE                |
|                                            |
+-------------------------------------------*/
/*HOME HEADER
-------------------------------------------------------- */
#page{}
#header {
	overflow: auto;
	padding-bottom: .5em;
	}
#header h2 a {background: none;}
#header h2 em{
	display: block; color:#b2adbb;
	font: bold italic .85em/1em calibri, sans serif;
	margin-top: -.5em; }
/*HOME PAGE
-------------------------------------------------------- */

#index #desc{
	position: absolute;  right: 1em; top: 2em; /* */}
#index #desc p{
	background: #ecebf0 url(img/grey-gradient.jpg) left bottom repeat-x;
	-moz-background-size: 100% 100%;
	-webkit-background-size: 100% 100%;
	-o-background-size: 100% 100%;
}
	/* width: 18em; */}
#hilite{ margin-bottom: 2em;}
#hilite table{width: 100%;}
#hilite div.center {width: 30em;
	background: rgb(246, 246, 246);
	background: rgba(255, 255, 255, .8);	
	border-radius: 3px;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	box-shadow:1px 1px 3px 0 rgba(147, 124, 90, .7);
	-moz-box-shadow:1px 1px 3px 0 rgba(147, 124, 90, .7);
	-webkit-box-shadow:1px 1px 3px 0 rgba(147, 124, 90, .7);}
	
#syndication a{
	padding-left: 20px;
	background : transparent url(img/feed-icon-14x14.png) no-repeat;
}

#news li>div{
	background: rgb(246, 246, 246);
	background: rgba(255, 255, 255, .8);}
#news li>div, #activites li em{	
	border-radius: 3px;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;}
/* #news li>div{} */
#news li p{
	font-size: 1em;
	background:none!important;}
#news img{max-width: 50%; max-height: 50%;}

#activites li{margin-bottom: 10em;} 
#activites li div.wrap{position: relative;}
#activites li em{
	display: block; width:  15em;
	position: absolute; top: 3em; left: 3em;
	color: white; text-align: right;
	font-style: normal;	font-weight: bold; 
	text-shadow: -1px -1px 1px rgba(0, 0, 0, .5);
	background: url(img/bkg-ico-activite.png) bottom left repeat-x;
	box-shadow:1px 1px 3px 0 rgba(147, 124, 90, .7);
	-moz-box-shadow:1px 1px 3px 0 rgba(147, 124, 90, .7);
	-webkit-box-shadow:1px 1px 3px 0 rgba(147, 124, 90, .7);} 
#activites li div.short-line em{line-height: 3em; }
 #activites li a em{padding: 1em; } 
#activites li img{
	width: 75px; height: 75px;
	position: absolute;  z-index: 1;left: 1em; top: -.5em} 
/*pages astro été
-------------------- 
#astronomie div.generic{overflow: auto;}
#refuge div.wrap{margin-left: 15%;}
#reserv div.white-4 h3{margin-left: 50%;} 
*/
/*pages astro hiver
-------------------- 
#reserv  div.white-4{overflow: auto;}*/
#reserv div.generic dl.liste{position: relative; top: 3em;}
#reserv div.white-4 ul  {margin-left: 50%;}

dl.liste dt{font-weight: bold;}
dl.liste dd{display: inline; margin: 0 .5em;}
dl.liste dd.bloc{display: block;}
  
/*style calendrier résas
----------------------- */
div.wrap-cal{
	width: 50em;margin: 0 auto;}	
div.cal-container{
	width:25em; float: left;}

.generic table.tab-calendrier{
	font-size: 1em;
	margin: 0 1em 0.2em;
	border-collapse: separate; 
	border-spacing:1px;
}

table.tab-calendrier th{
	font: bold 1.5em/1.5em monospace;  
	border: thin solid #6495ed;
	padding: 5px;
	background-color: #e7f0fa;
	color: #635f67; line-height: 1.5em;}
table.tab-calendrier td {
	font-size: 1.2em; 
	border: 1px solid silver;
	padding: 2px 0 0;
	height: 3.1em;
	vertical-align: top;
}
 table.tab-calendrier td[title]{
	cursor: help;}
table.tab-calendrier td em {
	line-height: 1.5em; display: block; width: 100%;
	text-align: right;}
table.tab-calendrier td em span{
	position: relative; top: .25em;}

td.chbr-1 em{background: url('img/cellul-dispo.png') 0 9px no-repeat;}
td.chbr-2 em{background: url('img/cellul-dispo.png') 0 -18px no-repeat;}
td.chbr-3 em{background: url('img/cellul-dispo.png') 0 -9px no-repeat;}
td.full{background: #ef1717;}
td.dispo{background: url('img/bkg-dispo.png') bottom center no-repeat;}

ul.lgd li{
	background-position: left bottom;
	background-repeat: no-repeat;
	padding-left: 40px; margin-bottom: .5em;
	}
ul.lgd li em{display: inline-block; width: 34px;}
	
ul.lgd li.caption, li#full{padding-left: 0;}
li#libr {background-image: url('img/bkg-dispo.png');}
li#pl-dispo {
	position: relative;
	background-image: url('img/cellul-dispo.png');}
li#pl-dispo em {position: absolute; left: 15px}
li#full em{
	margin-right: 8px;
	background-color: #ef1717;}
	
/*pages rando
-------------------- */
#blieux #guides {width: 57.5em;}
#majastres ul>li ,#chauvets ul>li {
	/* margin-bottom: 1.5em;  */overflow: auto;} 
#itineraires ul{}  
#itineraires li  {
	overflow: auto; padding: 0 0 0 1em;
	background-image: none;}
#itineraires li h2{
	width: 9.5em; float: left;
	font-size:1.5em;line-height:1.2em;
	} 
#itineraires li h2 a{
	display: block; 
	border: none; padding: 2em 0 1em;}
/*pages circuit-rando
-------------------- */

#circuit-rando div.relat-pos span{
	position: absolute; display: block; padding: 0 .5em;
	text-align: center; line-height: 1.5em;
	font-weight: bold;  font-variant: small-caps; 
	/*  */font-size: 1.2em;
	background: rgba(240, 239, 191, .8); color: #4f443b;}
#circuit-rando div.relat-pos span#rougon{top: 479px; left: 301px;}
#circuit-rando div.relat-pos span#chauvets{top: 419px; left: 104px;}
#circuit-rando div.relat-pos span#chiran{top: 204px; left:34px ;}
#circuit-rando div.relat-pos span#blieux{top: 165px; left: 218px;}
#circuit-rando div.relat-pos span#chasteuil{top: 337px; left: 400px;}
#circuit-rando div.relat-pos>a{
	position: absolute; display: block; 
	text-decoration: none; border: 0;}
#circuit-rando div.relat-pos p a{position: static;}
#circuit-rando div.relat-pos a span{
	display: none; font-size: 1.1em;
	font-weight: normal; font-variant: normal;}	

#circuit-rando div.relat-pos a:hover{background: none;}
#circuit-rando div.relat-pos a:hover span{
	display: block; position: absolute; width: 13em; 
	padding: 5px; background: #f7f6f0; }
#circuit-rando div.relat-pos a:hover span b{white-space: nowrap;}

#circuit-rando div.relat-pos a#rougon-chauvets{
	width:174px; height:63px;
	top:430px; left: 138px;}

#circuit-rando div.relat-pos a#chauvets-chiran{
	width: 79px; height:181px;
	top: 213px;left: 44px; }

#circuit-rando div.relat-pos a#chiran-blieux{
	width: 164px; height:73px;
	top: 134px; left: 49px;}
	
#circuit-rando div.relat-pos a#majastres-lepoil{
	width: ; height:;
	top: ;left; }
#circuit-rando div.relat-pos a#blieux-chasteuil{
	width: 212px; height:143px;
	top: 175px;left: 228px; }
	
#circuit-rando div.relat-pos a#chasteuil-rougon{
	width: 121px; height:117px;
	top: 345px;left: 308px; }

dl.hebergement {
	background-color: rgb(246, 246, 246);
	background: rgba(255, 255, 255, .8);
	overflow: auto; margin-left: 2em;}
dl.hebergement dt, dl.hebergement dd{padding-left: 1em;}
dl.hebergement dt{
	font-weight: bold; font-variant: small-caps;}
dl.hebergement dt img{display: block; float: right;}	
dl.hebergement dt img{
	padding:4px; border:1px solid #ccc;}	
dl.hebergement dt.m-t-img img{margin-top: 1em;}
dl.hebergement dd.fn{font-style: italic;}

/*pages édition
--------------------------- */
#stage-papier ul.photo-list li{
	margin-left: 2em;}
#stage-papier div.col66 ul {margin-left: 2em;margin-right: 2em;}
#bestiaire div.w33 blockquote{margin-top: 6em;}
#bestiaire div.col66 div.wrap-blk-m2{padding-top: 1.5em;}
#edition div.w33 {padding-top: 1.5em;}
/*pages Abcde
--------------------------- */
/* #a-propos div.w33{margin-top: 5em;} */

/* Calendrier des évènements culturels
-------------------------------------------------------- */
#calendar-content {width: 60em;}
#calendrier dt{
	position: relative; left: 1.5em; top: 1.5em;
	width: 12em; padding: 0 .5em;
	font-weight: bold;
	background-color: rgb(246, 246, 246);
	background: rgba(255, 255, 255, .8);
	border-radius: 3px;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;	
}
#calendrier dd{
	/* border-left: 1px solid #B4B061; */
	margin: 0 0 0 16em;
	padding: 0 0 .5em .5em;
}
dl#calendrier dd p.p-img{
	float: left;
	margin-right: 1em;
	width: 56%;
	font-size:1em;
}
#calendrier dd img{
	margin-top: 1em;
	width : 36.5%;
	height: 36.5%;
} 
#contact div.col33 dl{margin-top: 1.5em;}
/* FORMULAIRE
-------------------------------------------------------- */ 
fieldset{margin: 1.5em 2em;}
legend{
	font-size: 1.1em; line-height: 1.5em;
	font-weight: bold;
	background-color: rgb(246, 246, 246);
	background: rgba(255,255,255, .8);}

label{
	width: 48%; float: left;
	text-align: right; padding-right: 1em;
	}
textarea{width: 90%;margin-left: 2em;}

form button{
	display: block; margin:  0 auto 1.5em; padding: .5em 2em;
	border: none;  color: #f8f8ff;
	background: #9790b2;
	-moz-border-radius: 2.8em; 
	-webkit-border-radius: 2.8em;
	border-radius: 2.8em;
	font: 1.25em Georgia, "Times New Roman", Times, serif;
	letter-spacing: 1px;text-transform: uppercase;text-shadow: 0 1px 1px #dbb9cc;	
	-moz-box-shadow: 1px 1px 5px #555;
	-webkit-box-shadow: 1px 1px 8px #555;
	box-shadow: 1px 1px 8px #555;

}
/* FOOTER
-------------------------------------------------------- */ 
#footer {margin-bottom: 0!important;
	position: relative; margin-top: -5em;
	height: 5em; clear:both;}
#footer p{margin-bottom: 0!important;}