body { 
  /*background: url("./Images/background6.jpg");
  background-repeat:repeat-x;
  background-position:center;*/
}


#header{
	background: url("./Images/background8.jpg");
	margin-top:-10px;
	padding-bottom:20px;
}

#title{
margin-left:350px;
font-size: 50pt;
font-style: italic;
font-family: Tahoma,Verdana, Mistral,sans-serif;
color : #fff;
}

#subtitle{
margin-left:350px;
font-size: 18pt;
font-family: Tahoma,Verdana, Mistral,sans-serif;
color : #fff;
}

/* Starter CSS for Menu */
#cssmenu {
  /*margin-top:20px;*/
  padding-left: 350px;
  /*margin: 0;*/
  border: 0; }

#cssmenu ul, #cssmenu li {
  list-style: none;
  margin: 0;
  padding: 0; }

#cssmenu ul {
  position: relative;
  z-index: 597; }

#cssmenu ul li {
  float: left;
  min-height: 1px;
  vertical-align: middle; }

#cssmenu ul li.hover,
#cssmenu ul li:hover {
  position: relative;
  z-index: 599;
  cursor: default; }

#cssmenu ul ul {
  visibility: hidden;
  position: absolute;
  top: 100%;
  left: 0;
  z-index: 598;
  width: 100%; }

#cssmenu ul ul li {
  float: none; }

#cssmenu ul ul ul {
  top: 0;
  left: auto;
  right: -99.5%; }

#cssmenu ul li:hover > ul {
  visibility: visible; }

#cssmenu ul ul {
  bottom: 0;
  left: 0; }

#cssmenu ul ul {
  margin-top: 0; }

#cssmenu ul ul li {
  font-weight: normal; }

#cssmenu a {
  display: block;
  line-height: 1em;
  text-decoration: none; }

/* Custom CSS Styles */
#cssmenu {
  background: #333;
  border-bottom: 4px solid #1b9bff;
  font-family: 'Oxygen Mono', Tahoma, Arial, sans-serif;
  font-size: 12px; }
  #cssmenu > ul {
    *display: inline-block; }
  #cssmenu:after, #cssmenu ul:after {
    content: '';
    display: block;
    clear: both; }
  #cssmenu ul {
    text-transform: uppercase; }
    #cssmenu ul ul {
      border-top: 4px solid #1b9bff;
      text-transform: none;
      min-width: 190px; }
      #cssmenu ul ul a {
        background: #1b9bff;
        color: #FFF;
        border: 1px solid #0082e7;
        border-top: 0 none;
        line-height: 150%;
        padding: 16px 20px; }
      #cssmenu ul ul ul {
        border-top: 0 none; }
      #cssmenu ul ul li {
        position: relative; }
        #cssmenu ul ul li:first-child > a {
          border-top: 1px solid #0082e7; }
        #cssmenu ul ul li:hover > a {
          background: #35a6ff; }
        #cssmenu ul ul li:last-child > a {
          -moz-border-radius: 0 0 3px 3px;
          -webkit-border-radius: 0 0 3px 3px;
          border-radius: 0 0 3px 3px;
          -moz-background-clip: padding;
          -webkit-background-clip: padding-box;
          background-clip: padding-box;
          -moz-box-shadow: 0 1px 0 #1b9bff;
          -webkit-box-shadow: 0 1px 0 #1b9bff;
          box-shadow: 0 1px 0 #1b9bff; }
        #cssmenu ul ul li:last-child:hover > a {
          -moz-border-radius: 0 0 0 3px;
          -webkit-border-radius: 0 0 0 3px;
          border-radius: 0 0 0 3px;
          -moz-background-clip: padding;
          -webkit-background-clip: padding-box;
          background-clip: padding-box; }
        #cssmenu ul ul li.has-sub > a:after {
          content: '+';
          position: absolute;
          top: 50%;
          right: 15px;
          margin-top: -8px; }
    #cssmenu ul li:hover > a/*, #cssmenu ul li.active > a*/ {
      background: #1b9bff;
      color: #FFF; }
	 
	 /*Rajout Julien*/
	#cssmenu ul li.active_page > a{
	  background: #1b9bff;
      color: #FFF; }
	}
	
        #cssmenu ul li.has-sub > a:after {
      content: '+';
      margin-left: 5px; }
    #cssmenu ul li.last ul {
      left: auto;
      right: 0; }
      #cssmenu ul li.last ul ul {
        left: auto;
        right: 99.5%; }
  #cssmenu a {
    background: #333;
    color: yellow;
	font-weight: bold;
    padding: 0 20px; }
  #cssmenu > ul > li > a {
    line-height: 48px; }
	
/* Ta zone*/
#CorpsDuTexte{
width:1000px;
text-align: justify;
margin:auto;
}

p{
 font-family: Arial-Narrow, Tahoma, Verdana, sans-serif;
 font-style: italic ;
 border-radius: 10px;
}
 
h1	{
	font-family: Verdana, Comic Sans Ms, Tahoma, Arial, sans-serif;
	color : white;
	text-align : center;
	background-color : #b8b5c6;
	}
	
	/*Titre infos colonnes gauche et droite tableau photos randos*/	
h2	{
	font-family: Tahoma, Comic Sans Ms, Tahoma, Arial, sans-serif;
	color : red;
	text-align : center;
	font-style : italic;
	font-size : xx-large;
	background-color : #ffff9f;
	}	

	h3	{
	font-family: Comic Sans Ms, Verdana, Tahoma, Arial, sans-serif;
	font-style: italic ;
	color : blue;
	text-align : center;	
	}
	
h4	{
	font-family: Verdana, Comic Sans Ms, Tahoma, Arial, sans-serif;
	font-style: normal;
	color : #8c4f40;
	text-align : center;
	font-size: small;
	}
h5	{
	font-family: Comic Sans Ms, Verdana, Tahoma, Arial, sans-serif;
	color : black;
	text-align : center;
	font-size: x-large;
	}
/*Sous titre infos colonnes gauche et droite tableau photos randos*/		
h6
	{
	font-family: Tahoma, Comic Sans Ms, Tahoma, Arial, sans-serif;
	font-style : bold;
	color : #7d1820;
	background-color : #b5ff72;
	text-align : center;
	font-size : large;
	}	

	
/*Texte bloc vertical dans accueil*/
h7	{
	font-family: Tahoma,Comic Sans Ms, Verdana, Tahoma, Arial, sans-serif;
	font-size: 15px;
	color : black;
	font-style: italic;
	text-align : center;
	}		

/*NEW Titre de la rando*/
h8 {
	font-family: Verdana, Comic Sans Ms, Tahoma, Arial, sans-serif;
	color : #2a071b;
	text-align : center;
	background-color : #b5ff3d;
	font-size : 1.3em;
	}

/*NEW Titre infos colonnes gauche et droite*/	
h9 {
	font-family: Tahoma, Comic Sans Ms, Tahoma, Arial, sans-serif;
	color : red;
	text-align : center;
	font-style : italic;
	font-size : xx-large;
	background-color : #ffff9f;
	}	
	
/*NEW Sous titre infos colonnes gauche et droite*/			
h10{
	font-family: Tahoma, Comic Sans Ms, Tahoma, Arial, sans-serif;
	font-style : bold;
	color : white;
	background-color : #b5ff3d;
	text-align : center;
	font-size : large;
	}

/*Image de fond contact*/
	
h11	{
	font-family: Comic Sans Ms, Verdana, Tahoma, Arial, sans-serif;
	color : maroon;
	text-align : center;
    border-radius: 10px;
	}
	
h12 { 
	font-family: Comic Sans Ms, Verdana, Tahoma, Arial, sans-serif;
	font-style: italic ;
	font-size: 20px;
	color : red;
	font-weight: bold;
	text-align : center;
	border-radius: 10px;
	}
		

h13	{
	font-family: Comic Sans Ms, Verdana, Tahoma, Arial, sans-serif;
	font-style: italic ;
	color : blue;
	text-align : center;
	border-radius: 10px;
	}
	
/*Ancre liste randos*/
h14{
	font-family: Verdana, Comic Sans Ms, Tahoma, Arial, sans-serif;
	color : white;
	}	

/*Texte bas centre accueil*/	
h15	{
	font-family: Comic Sans Ms, Verdana, Tahoma, Arial, sans-serif;
	font-style: italic ;
	color : blue;
	font-size: 12px;
	}

/*FIN*/	


		
/*POLICE POUR LES PHOTOS*/
	.ongletphotos
		{
		font-family: Papyrus, Arial, Tahoma, Verdana, sans-serif;
		font-style: italic;
		color : black;
		text-align : center;
		font-size : medium;
		}	

/*POLICE ET COULEUR AGRANDIR PHOTOS*/
	.cliquez
		{
		font-family: Papyrus, Arial, Tahoma, Verdana, sans-serif;
		font-style: italic ;
		font-weight: bold;
		color : #dd0010;
		text-align : center;
		font-size : large;
		}	
/*AVERTISSEMENT RANDOS*/
	.avertissement
		{
		font-family: Arial, Tahoma, Verdana, sans-serif;
		font-style: italic ;
		font-weight: bold;
		color :  #40bc30 ;
		text-align : center;
		font-size : normal;
		}	

	.mots
		{
		font-family: Arial, Tahoma, Verdana, sans-serif;
		font-style: italic ;
		color : #dd0010;
		text-align : center;
		font-size : normal;
		}	

/*COULEUR POLICE EAU */

	.eau
		{
		color : blue;
		font-weight : bold;
		}
/*COULEUR POLICE ROCHE*/
	.roche
		{
		color : #d0b51d;
		font-weight : bold;
		}
/*COULEUR POLICE FORET */
	.foret
		{
		color : #219630;
		text-align : center;
		font-weight : bold;
		}

/*COULEUR LIENS AUTRES PAGES */
	.pages
		{
		color : #5f6e37;
		text-align : center;
		font-weight : bold;
		font-style : italic;
		text-decoration : none;
		font-family : Verdana, Comic Sans MS, Arial;
		}
	
/*BOUTON RENVOI ACCUEIL VERS RUBRIQUES */	
	.bouton
		{
		color: red; /* couleur du texte */
		cursor:pointer; /* apparence du curseur */
		}	
		
/*POUR MISE EN RETRAIT DU TEXTE*/		
	.retrait
	{
	text-indent: 50px;
	}
/*FIN*/		
		
/*PUCES ACCUEIL*/
	li1{	 
 font-family: Arial, sans-serif;
 font-size: 100%;
 color: black;
 display : list-item;
 list-style-image : url(puce.gif);
} 
/*FIN*/	
	
	
/*POLICE DEFINITIONS MOT / EXPRESSION PARLER LOCAL*/
	em
		{
		font-style : italic;
		color : #1c85e0;
		font-siza: xx-small;
		}
		
/*POLICE MOT / EXPRESSION PARLER LOCAL*/
	em1
		{
		font-style : bold;
		color : #8f1f13;
		}
		
/*POLICE MOT FOOTER*/		
		
	em2
		{
		font-size: small;
		font-style: italic;
		text-align: center;
		}
			

	
/*POLICE MOT / CITATIONS SPICILEGE*/
		/*Citation1*/
	em3
		{
		color : #e53713;
		font-weight : bold;
		font-style : italic;
		text-align: center;
		}
		/*Citation2*/
	em4
		{
		color : #e9f3f8;
		font-weight : bold;
		font-style : italic;
		text-align: center;
		}	
		/*Auteurs*/
	em5
		{
		color : #7aa900;
		font-weight : bold;
		font-style : italic;
		text-align: center;
		}	
		/*Centrage liste randos*/
	em6
		{
		text-align: center;
		}
	/*Police liste des randos*/
	em7
		{
		font-style : bold;
		color : #8f1f13;
		font-size : large;
		}	
	
	
	
	/*MISE EN PAGE PIED DE PAGE FOOTER*/
	footer
		{
		border-radius: 10 px;
		width: 60%;
		min-width: 300 px;
		max-height: 8 px;
		margin: auto; /*centrage bloc avec auto */
		border: 8px #219630 groove;
		text-align: center;
		padding: 10px;
		margin-bottom: 10px;
		background-color : #bff19d;
		}
	
/*fin*/
/*couleur de fond pour les titres*/
	mark
		{
		background-color: #53f36d;
		}

/*fin*/

/*POSITIONNEMENT ABSOLU ACCUEIL IMAGE A DROITE*/
/*photo*/
	element
		{
		position: absolute;
		right: 15%;
		top: 115%;
		z-index: 1;
		}
/*texte*/
	element2
		{
		position: absolute;
		right: 32%;
		top: 115%;
		z-index: 2;
		}
/*fin*/
/*POSITIONNEMENT ABSOLU ACCUEIL IMAGE A GAUCHE*/
/*photo*/
	element3
		{
		position: absolute;
		left: 15%;
		top: 115%;
		}
		
/*texte*/
	element4
		{
		position: absolute;
		left: 30%;
		top: 115%;
		}

	element7
/*texte cliquez pour agrandir*/
		{
		position: absolute;
		left: 30%;
		top: 70%;
		z-index: 2;
		}	
				
		
	element10
/*texte cliquez pour agrandir*/
		{
		position: absolute;
		left: 80%;
		top: 920%;
		z-index: 1;
		}
/*fin*/

/*POSITIONNEMENT CENTRE BLOCK LA VOUIVRE*/

/*texte vouivre*/
	element11
		{
		position: absolute;
		left: 15%;
		z-index: 2;
		}
		
/*photo vouivre2*/
	element12
		{
		position: absolute;
		right: 50%;
		top: 200%
		z-index: 1; 
		}
					
/*POSITIONNEMENT ABSOLU BLOCKS NOUVEL ACCUEIL*/	
/*LES PHOTOS SONT EN LARG 525 HAUT 250 SANS PROPORTION PHOTOFILTRE*/
	
	/*Triangle à gauche*/
	element15
		{
		position: absolute;
		left: 10%;
		top: 35%;
		z-index: 2;
		background-position:10 px 650px;
		background-image:url("./Images/essai.jpg");
		background-repeat:no-repeat;
		}
	/*fin*/	
	
	/*Triangle à droite*/
	element16
		{
		position: absolute;
		left: 70%;
		top: 46%;
		z-index: 2;
		background-position:10 px 650px;
		background-image:url("./Images/essai1.jpg");
		background-repeat:no-repeat;
		}
	/*fin*/	
	
	/*Bloc central entre triangles*/
	element17
		{
		position: absolute;
		left: 53%;
		top: 43%;
		z-index: 2;
		}	
	/*fin*/		
	
	/*Rectangle en bas*/
	element18
		{
		position: absolute;
		left: 23%;
		top: 140%;
		z-index: 2;
		}	
	/*fin*/		



	
	
	
	/*TEXTE rando nordique*/	
		
	element22
		{
		position: absolute;
		left: 5%;
		right: 50%;
		top: 40%;
		z-index: 2;
		}
	/*fin*/		
		
	/*TEXTE materiel nordique*/	
		
	element23
		{
		position: absolute;
		left: 65%;
		right: 10%;
		top: 65%;
		z-index: 2;
		width: 430px;
		height: 300px;
		background-position:15 px 650px;
		background-image:url("./Images/sn1.jpg");
		background-repeat:no-repeat;
		}
	/*fin*/			
		
	/*IMAGE BANNIERE LA VOUIVRE*/	
	imgfond1
		{
		position: absolute;
		left:10%;
		top:55%;
		background-attachment: fixed;
		background-repeat:repeat-x;
		}
	imgfond2
		{
		position: absolute;
		left:75%;
		top:55%;
		background-attachment: fixed;
		background-repeat:repeat-x;
		}	
		
		
	/*fin*/			
		
		
		
		
		
/*fin*/	

	
/*CREATION BALISES BLOCKS POUR PHOTOS JURA*/
	nav1
		{
		display: inline-block;
		width: 1350px;
		height: 50px;
		border: 2px green solid;
		vertical-align: top;
		background-color: white;
		text-align: center; 
		font-size: small;
		font-family: Tahoma,Sans MS, Verdana, sans-serif; 
		}
/*fin*/

/*CREATION BALISES BLOCKS POUR RANDOS*/
	nav2
		{
		display: inline-block;
		width: 1310px;
		height: 150px;
		border: 2px green solid;
		vertical-align: top;
		border-radius: 12px;
		color: #581566;
		font-style: normal;
		font-size: small;
		text-align: center; 
		background-color: #e9f3f8;
		}
/*fin*/

/*BALISES BLOCKS TEXTE LA VOUIVRE*/
	nav3
		{
		display: inline-block;
		width: 950px;
		height: 900px;
		border: 2px solid;
		border-radius: 2px;
		color: #581566;
		font-style: normal;
		font-family: Verdana, Comic Sans MS, Tahoma, sans-serif;
		text-align: center; 
		background-color: #e9f3f8;
		}
/*fin*/


/*BALISE BLOCK textes d'entête en VERT CLAIR*/
	nav4
		{
		display: inline-block;
		width: 1300px;
		height: 250px;
		border: 2px solid;
		border-radius: 2px;
		color: #581566;
		font-style: normal;
		text-align: center;
		font-family: Verdana, Comic Sans MS, Tahoma, sans-serif;
		background-color: #e9f3f8;
		font-size: small; /*Paragraphe de 8 pixels en hauteur*/
		}
/*fin*/


/*CREATION BALISES BLOCKS POUR LETTRES ABECEDAIRE*/
	/*lettres normales*/
	nav5
		{
		display: inline-block;
		width: 70px;
		height: 40px;
		border: 6px ridge;
		border-radius: 10px;
		vertical-align: top;
		}
	/*fin*/
	
	/*CREATION BALISES BLOCKS POUR SPICILEGE*/
	nav8
		{
		display: inline-block;
		width: 500px;
		height: 60px;
		border: 3px green ridge;
		vertical-align: middle;
		background-color: #f6f15f
		}
		
/*BALISES BLOCKS TEXTE INTRODUCTION RANDO SKIS*/
	nav9
		{
		display: inline-block;
		width: 800px;
		height: 530Px;
		font-size : small;
		font-family: Comic Sans MS, Tahoma, Verdana, sans-serif;
		color:#2f4e60;
		font-style: italic;
		text-align: center; 
		}
/*fin*/	
			
/*BALISES BLOCKS TEXTE lien site rando nordique*/
	nav10
		{
		display: inline-block;
		font-size : small;
		font-family: Comic Sans MS, Tahoma, Verdana, sans-serif;
		color: #2f4e60;
		font-style: italic;
		text-align: center; 
		}
/*fin*/				
		
		
	/*CREATION BALISES BLOCKS POUR NOUVEL ACCUEIL*/
	/*Triangle de gauche et droite*/
	nav11
		{
		display: inline-block;
		width: 600px;
		height: 620px;
		vertical-align: top;
		}
		
	/*Bloc texte centre */	
	nav12
		{
		display: inline-block;
		width: 220px;
		height: 480px;
		border: 5px green solid;
		border-radius: 10px;
		vertical-align: top;
		background-color: #f6f15f
		}

	/*Bloc rectangle bas gauche */	
	nav13
		{
		display: inline-block;
		width: 630px;
		height: 30px;
		border: 3px green solid;
		border-radius: 5px;
		vertical-align: top;
		}

	
	/*fin*/
	
	
	
	
	
	
	
	
	
	
	/*infobulle*/
	a.info{
		position:absolute;
		top:4em; left:2em; width:15em;
		z-index:24;
		color:white;
		text-decoration:none
			}
 
	a.info:hover{
		z-index:25;
		background-color:#21401d;
			}
 
	a.info span{
		display: none
			}
 
	a.info:hover span{
		display:block;
		position:absolute;
		top:2em; left:2em; width:15em;
		border:1px solid #000;
		background-color:#21401d;
		color:white;
		text-align: justify;
		font-weight:none;
		padding:5px;
		}
		
		/*fin*/
	
/*css pour galerie photos .3/.4/2015 - thumbnails 200x150*/
	img {
		border:2px solid black;
		border-radius:10px;
		} 
		
	.thumb {
		width:212px;
		height:152px; 
		margin:5px;
		float:left; 
		background-color:#e3ffa5; 
		display:block;
		} 

	.thumb a {
		display:block;
		}

	.thumb a:hover {
		position:absolute;	
		color:black;
		}	 
	
	.thumb a img { 
		margin:0;
		padding:0;
		width:212px;
		height:152px; 
		}

	.thumb a:hover img, .thumb a:focus img {
		position:relative;
		left:0px;
		top:80px;
		width:300px;
		height:225px;  
		} 

/*fin*/
	/*IMAGES DE COIN TEXTE LA VOUIVRE*/
	
	#contenu {
			background:url("./Images/tn_voui1.jpg") no-repeat left top, 
			url("./Images/tn_voui1.jpg") no-repeat right top, 
			url("./Images/tn_voui1.jpg") no-repeat left bottom, 
			url("./Images/tn_voui1.jpg") no-repeat right bottom; 
			}
	/*fin*/

	
	/*Codes CSS essais legendes photos*/
	
	.imgactu{
		float: left;
		margin: 5px 5px 5px 0;
		background: #333;
		}
	
	.txtphoto{
		margin:0 0 0 3px;
		padding:5;
		color:#ccc;
		font-size:15px;
		font-style:italic;
		}
	/*fin
	
	
	/*CSS 18/10/2016 NOUVELLE PAGE RANDO*/	

.container {
	position: relative;
	/*width: 500px;*/
	width: 100%;
}
.container div {
	height: 715px; /*Hauteur des colonnes*/
}

.column-left {
	width: 14%;
	left: 0;
	position: absolute;
	text-align: center;
}
.column-center {
	width: 70%;
	margin-left: 15%;
	position: absolute;
	text-align: justify;
}
.column-right {
	width: 14%;
	right: 0;
	position: absolute;
	text-align: center;
}

.mytable {
	margin: auto;
}

	/*fin*/		
	
	
	
	
/*Fin de zone*/