/*==================================================================*/
/* MISE EN PAGE GENERALE DES TYPES                                  */
/*==================================================================*/

/*=====GENERAL=======*/
.page {
  height: 50px;
  background-image: url("/images/titrehorizontal_02.png");
  background-repeat: no-repeat;
  background-position: top left;
}
HTML {
  width: 100%; /* jmb 01/2008 , pour gmaps */
  height: 100%;
  }
BODY { 
  margin: 0px; /* il le faut pour FF */
  width: 100%; /* jmb 01/2008 , pour gmaps */
  height: 100%;
  background-color: #f2f2f2;
  }
/* zone de contenu */
.contenu {
  margin: 0.8%;
  margin-top:3px;
  }
.couleur_fond_amplifiee {
	background-color: #cef99c;
}

/*=====TEXTE=======*/
EM { /* Emphasis: gras+italic */
  font-weight: bold ;
  font-style: italic ;
  }
STRONG { /* Strong Emphasis: gras+italic+rouge */
  font-weight: bold;
  font-style: italic;
  color: #FF0000 ;
  }
CITE { /* Citation: gras+droit */
  font-weight: bold ;
  font-style: normal ;
  }
DFN { /*Definitions */
  border-bottom: thin dotted blue;
  font-style: normal;
  }
DFN:after { /*Definition, ajoute un ? a la fin pour inciter a passer la souris dessus*/
  content: "?";
  font-size: smaller;
  vertical-align: text-top;
  }
BLOCKQUOTE { /* citations: utilisé sur les fiches pour les commentaires ET la citation forum */
  font-style: italic;
  }
BLOCKQUOTE > DIV { /* en particulier les ciations forum */
  border-left: double blue;
  }
BLOCKQUOTE P:before  { /* message forum et commentaires *//* HS sous IE */
  content: open-quote;
  font-size: xx-large;
  }
BLOCKQUOTE P:after  { /* message forum et commentaires */
  content: close-quote;
  font-size: xx-large;
  vertical-align: text-top; /* pour pas que cette derniere quote decale la derniere ligne */
  }

/*======TITRES=======*/
/* on commence au H3 car 1,2 sont vraiment trop gros. je sais ... CSS .... mais maintenant c'est fait.*/
H3 { /* titres de pages */
  font-weight: bold ;
  font-style: normal ;
  font-size: large;
  padding: 0em 2em ; 
  margin: 0em; 
  text-align: center;
  margin-bottom:3px;
  background-color: #A6CEE7;
  }
H4 { /* sous titres */
  padding-top: 4px; /* sous FF, la padding par defo est immense */
  padding-bottom: 2px;
  padding-left: 10px;
  font-size: large;
  margin: 0px; /* sous FF, la padding par defo est immense */
  border-bottom: medium solid #A6CEE7;
  border-left: medium solid #A6CEE7;
  }
H5 { /* sou-sou titre, pour l'instant que dans les fiches de refuges */
  border-bottom: thin solid #A6CEE7 ;
  font-size: medium; /* sinon H5 cest tout petit ... */
  margin-top:15px;
  margin-bottom:3px;
  padding-left: 10px;
  }
h6 { /* utilisé dans la "FAQ" comme question */
  margin-bottom: 0px;
  margin-top: 1em;
  font-size: 12px;
  font-weight: bold ;
  font-size: medium; /* sinon H6 cest tout petit ... */
  }
p {
  margin: 4px;
  }
/*===== LISTES=====*/
UL { /* les listes , y compris news en page de garde */
  list-style-type: none;
  margin: 0px;
  padding: 0px 0px 0px 5px;
  }
DT { /* listes, de definitions */
  font-weight: bold;
  margin-top:4px;
  }
LI {
  margin-bottom:3px;
  }
/* Utilisé pour le formulaire de création ou modification pour les 3 champs libres proprio, accès, remarques */
.libelle { 
  float:left;
  width:150px;
  font-size: 13px;
  }
.textarea {
  float:left;
  width:650px;
  height:170px;
  }
.lien_syntaxe { 
  float:left;
  width:150px;
  }
.big_one {
  float:left;
  }

/*====== FORMULAIRES======*/
FORM { /* les formulaires, dans le navigateur ou dans la recherche */
  padding: 2px;
  }
LEGEND , .fauxfieldset-legend {
  background-color: #EEF ;
  border: thin solid black ;
  font-weight: bold;
  }

/*==========DIVERS=======*/
IMG { /* images sans bordures */
  border: 0px;
  margin: 0px;
  padding: 0px;
  }

/*=========LIENS==========*/
A:hover { /*met en valeur les liens qd on est dessus */
  background-color: #EEF;
  text-decoration: none;
  }
/* 
J'intègre également les class des liens du forum 
en gros je veux tout de la même couleur
*/
A,a.mainmenu,a.forumlink,a.cattitle,a.nav,a.topictitle,a.postlink,a.gen,a.genmed,a.gensmall {
  color : #006699; /* en accord avec le thème du forum, et moins agressif */
  text-decoration: none;
  }
A:visited {
  color : #006699;
  }
/*=========INFOBULLES===========*/
A.infobulle {
  position:relative;
  text-decoration: none;
  color: black;
  }
A.infobulle SPAN { /* au repos, on efface */
  display: none;
  }
A.infobulle:hover SPAN { /* qd on passe dessus, ca affiche */
  display: block;
  position: absolute; /* relativement au relatif du A */
  top: 18px;
  left: -10px;
  padding: 5px;
  color: #000;
  border: 1px solid #bbb;
  background: #ffc;
  white-space: nowrap;
  z-index: 100; /* ?? */
  }

/*=========LIENS==========*/
.don {
  text-decoration: underline; 
  margin-left: 450px;
}

/*==================================================================*/
/*  MENUS                                                           */
/*==================================================================*/

/* ==========MENU DU HAUT ==========        */
  .menu { 
    clear: left;
    white-space: nowrap;
    display: block; /* Au lieu de inline / Modif Dominique 26/12/2008 = Souligné passait sous le bandeau sous IE */
    font-size: 18px;
    font-weight: 700;
    text-align: left;
    margin: 0px;
    padding: 0px;
    border-left: none;
    border-right: none;
    border-top: solid medium #A6CEE7;
    border-bottom: solid medium #A6CEE7;
    }
  .menu LI {
    display: inline;
    padding: 0em 0.1em;
    text-align: center;
    }
  .menu A {
    background-color: transparent;
    padding: 0em 0.5em;
    text-decoration: none;
    }
  .menu A:hover {
    background-color: #A6CEE7;
    color: #fff;
    }
  .lien_ajout_commentaire {
	margin: 20px;
    }
  .lien_ajout_commentaire A {
    border-style: solid; 
    border-color: #A6CEE7; 
    padding-right: 0.5em; 
    padding-left: 0.5em;
}

/* ==========MENU DU BAS ==========        */
/* en bas, il y a un gros div "basdepage" qui englobe la fin */
  #basdepage {
    clear: both;
    text-align: center;
  }
  /* c'est la liste en bas de page */
  #basdepage #racourcismenus {
    clear: both;
    border: dashed thin #096EA1;
    text-align: center;
    margin: 0px;
  }
  #basdepage UL {
    clear: both;
    text-align: center;
  }
  #basdepage LI {
    display: inline;
    margin-right: 2em;
  }
  #basdepage IMG,IFRAME,FORM { /* tout le bazar de pub de bas de page, en ligne! */
    display: inline;
    vertical-align: middle;
  }

/*==================================================================*/
/* LA PAGES DES MASSIFS (Accueil)                                   */
/*==================================================================*/

  .tablo { /* DIV imite une table */
	display:table-cell;
	vertical-align: top;
	float: left; /* pour IE7 */
  }
  
/*==================================================================*/
/* LES PAGES POINTS                                                 */
/*==================================================================*/

  .fauxfieldset { /* DIV imite un fieldset */
	border: thin solid black;
	margin-top: 1em;
	/*padding: 1em;*/
  }
  .fauxfieldset-legend  { /* P imite un fieldset legend */
	float: left;
	margin: -0.2em 1em 0em 1em;
	/*margin-bottom: 1em;*/
	/*vertical-align: super;*/
  }
  .spacer { /* HR de spacer pour la mise en page, en particulier dans les fiches */
	clear: both;
	visibility: hidden;
	margin: 0px;
	padding: 0px;
  }
  /* ENCADRE de présentation de FICHE */
  .fiche_cadre .condense, .fiche_cadre .condense DD, .fiche_cadre .condense DT {
	display: inline;
	margin: 1px 5px 1px 0px;
  }
  .photos {
    float: left; 
    margin: 1px; 
    position: relative; 
  }
  .text_sur_image {
    position:relative;
    font-size:18px;
    color:white;
    left:-110px;
    top:2px;
  }

/*==================================================================*/
/*                              CARTES                              */
/*==================================================================*/

  .carte /* utilisé par TOUTES les images cartes */
   {
	background-image: url(../images/sablier.png);
	background-position: center center;
	background-repeat: no-repeat;
  }
  #carte_nav {
	height: 80%;
	margin-left: 210px;
  }
  #massifs {
	width: 610px;
	height: 610px;
  }
  #vignette { /* utilisé par les petites des fiches points */
	width:  300px;
	height: 300px;
  }
  #carte_edit, .carte_edit {
	width:  400px; 
	height: 400px; 
	float: right;
  }
  
/*==================================================================*/
/*                    PUBLICITE                                     */
/*==================================================================*/
/* toute la pub est contenue dans une table (!) de class "pub" */
.pub * {  /* General a la pub: petits caractères, resserés ... */
	text-decoration: none;
	font-family:"trebuchet ms",arial,sans-serif;
	font-size:10px;
	line-height: 1em;
	border: none;
}

.pub DIV {   /* Pour chaqque annonce */
	width: 300px; /* on fixe chaque annonce. plus simple. */
	height: 60px;
	overflow: hidden; /* au cas ou le contenu depasse, ben il  depasse pas... */ 
	float: left;
	position: relative; /* insispensable pour le morceau "pubannonceur" */
	text-align: justify;
	border: solid blue 1px;
}
.pub DIV IMG {
	height: 50px; /* de tt facon, c'est fourni en hauteur 50. */
	/*width: 40px;*/ /* par contre,  la largeur varie. alors... */
	border: 0px ;
	margin: 0px ;
	float: left ;
}
.pub DIV .pubtitre {
	font-size:12px; /* titre en + gros */
	font-weight: bold;
	margin:2px;
}
.pub DIV .pubdescri {
	color :#000;
}
.pub DIV .pubannonceur {
	position: absolute; /* pas pu faire autrement pour mettre le truc en bas a droite */
	bottom: 0px;
	right: 0px;
	padding: 2px 0px 0px 5px; /* un peu de place autour */
	color: #F00;
	font-weight: bold;
	background-color: #FFF;
}
.pub DIV A:hover { /* sinon ca prends la class generale */
	background-color: transparent;
}