@charset "UTF-8";

/* ===============================================================================================*/
/* Balises SPAN générales pour montrer le texte dans une certaine configuration
/* ===============================================================================================*/

.SFT
{
	color: blue;
	font-style: italic;  
	font-weight: bold;
}

.RSD
{
	color: blue;
	font-weight: bold;
}

/* ===============================================================================================*/

body
{
	margin: 0px;
	padding: 0px;
	background-color: rgb(240,255,255);
/*	background-color: rgb(255,255,255);*/
	font-family: Arial, "Times New Roman", Times, sans-serif;¨
}

h0
{
  
}

h1
{
  text-align: center;
}

/* LIENS */
a
{
  color: #0000FF;
  text-decoration: none;
}

a:hover
{
  text-decoration: underline;
}

.div_adresse
{
  line-height: 120%;
  padding-left: 50px;
}

.txt_centre
{
  text-align: center;
}


.txt_droite
{
	text-align: right;
}

.txt_rouge
{
	color: red;
}

.txt_bleu
{
	color: blue;
}

.txt_gras
{
	font-weight: bold;
}

.div_left
{
	float: left;
}

.div_center
{
	float: center;
}

.div_right
{
	float: left
}

.hidden
{

}

/*==============================================================================
                                 BODY spécifiques
==============================================================================*/
/* Page pour l'introduction du mot de passe (style spécifique différent des autres pages) */
#body_mdp
{
  padding-left: 20px;
}

#body_maintenance
{
  padding-left: 0px;
}


/*==============================================================================
                                     EN-TÊTE
==============================================================================*/
#en_tete
{
  position: relative;  /* 1a) pour permettre le z-index et cacher le <Retour en tête de page */
  z-index: 2;          /* 1b) pour cacher le <Retour en tête de page */
  height: 70px;
  color: blue;
  /* couleur unie gris bleu très clair
  background-color: rgb(240,240,250);   */
  /* gradient linéaire de haut-gauche vers bas-droite */
/*  background: -webkit-linear-gradient(left top, rgb(0,170,255),rgb(240,240,250));*/ /* For Safari 5.1 to 6.0 */
/*  background: -o-linear-gradient(bottom right, rgb(0,170,255),rgb(240,240,250));*/ /* For Opera 11.1 to 12.0 */
/*  background: -moz-linear-gradient(bottom right, rgb(0,170,255),rgb(240,240,250))*/; /* For Firefox 3.6 to 15 */
/*  background: linear-gradient(to bottom right, rgb(0,170,255),rgb(240,240,250));*/ /* Standard syntax */  
  /* gradient radia centré */
  background: -webkit-radial-gradient(50% 50%, farthest-side,rgb(255,255,255),rgb(0,170,255)); /* Safari 5.1 to 6.0 */
  background: -o-radial-gradient(50% 50%, farthest-side,rgb(255,255,255),rgb(0,170,255)); /* For Opera 11.6 to 12.0 */
  background: -moz-radial-gradient(50% 50%, farthest-side,rgb(255,255,255),rgb(0,170,255)); /* For Firefox 3.6 to 15 */
  background: radial-gradient(farthest-corner at 50% 50%,rgb(255,255,255),rgb(0,170,255)); /* Standard syntax (must be last) */  
  border-bottom: 2px ridge rgb(220,220,220);  /* ligne sous le header */
}

#en_tete h1
{
  margin-top: 0px;    /* sinon espace entre le haut de la page et le header */
  padding-top: 15px;  /* sinon, titre collé tout en haut
  line-height: 150%;  /* pour diminuer la hauteur du texte */
  font-variant: small-caps;
  font-size: 2.0em;
}

#en_tete hr
{
  line-height: 0%;  /* pour diminue la hauteur du texte */
}


/*==============================================================================
                                      MENUS
==============================================================================*/
#menu_lat
{
/*  float: left;*/
  position: fixed;
  width: 300px;
  padding-top: 0px;
  /*border: 2px dotted #000000;*/
  /*font-size: 1.5em;*/
  font-size: 1em;
/*  font-size: medium;*/  /* ATTENTION: à répéter dans les autres feuilles de style, je ne sais pas pourquoi */
}

/*=============================== SOUS-MENUS =================================*/
/* Sous-menu incluant le titre */
.sous_menu
{
/*  position: fixed;*/
	margin-top: 20px;
	margin-left: 10px;
/*ICI	border: 2px dotted #000000;*/  
	border: 0px dotted #000000;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	-ms-border-radius: 10px;
	-o-border-radius: 10px;
	border-radius: 10px;
/*ICI	background-color: rgb(210,210,210);*/
	display: block;
}

/* titre du menu: SOFTEAU, RESODO, etc. */
.sous_menu h2  
{
  text-align: left;
  color: blue;
  /* ces deux lignes limitent l'espace au-dessus et au-dessous des titres de menus */
//  margin-top: 10px;
  margin-top: 3px;
  margin-bottom: 4px; 
}
/* Bloc des textes des sous-menu (sans les bullets) */
.sous_menu ul
{
  margin-top: 0px;			/* pour se rapprocher du bord sup */
  margin-bottom: 7px;		/* pour se rapprocher du bord inf */
  line-height: 180%;			/* espacement plus grand entre les items du menu: à adapter pr changer la taille */
  font-size: 100%;			/* taille des textes: à adapter aussi pour changer la taille */
  list-style-type: none;	/* puces non-visibles */
  margin-left: -30px;		/* recule le texte de la liste vers la gauche */
  margin-right: 15px;		/* laisse un espace à droite (pour background qd hover */
}

/* chaque option du sous-menu (sur tte sa largeur: <>li qui n'entoure que le texte */
.sous_menu a
{
  padding-left: 1em; 
  padding-right: -1em; 
  display: block;
  /* prend la même place que le border du hover ci-dessous mais avec la couleur du fond de menu
     de manière à ne pas déplacer légèrement le menu avec la bordure noire quand hover.
	  De plus, ça dépare un peu les sous-menus. */
  border: 1px solid rgb(210,210,210); 
/*  border-radius: 15px;*/
  background-color: rgb(210,210,210);  /*  Gris clair-blanc */
}



/* mise en évidence qd on passe sur le sous-menu */
.sous_menu a:hover 
{
  text-decoration: none;
  color: red;
  background-color: white;
  border: 1px solid black;
/*  border-radius: 15px;*/
}

/* item de sous-menu normal */
#sous_menu_normal_
{
  border: 1px solid rgb(245,245,245); 
/*  border-radius: 15px;*/
  background-color: rgb(150,150,150);  /*  Gris clair-blanc */
  color: blue;
}

/* item de la page sélectionnée */
#sous_menu_sel
{
/*  border: 1px solid rgb(245,245,245); */
  border: 1px solid rgb(127,127,127); 
/*  border-radius: 15px;*/
/*  background-color: rgb(180,180,180); */ /*  Gris moyen */
  background-color: rgb(250,250,250);  /*  Gris clair-blanc */
/*  color: rgb(50,50,50);*/
  color: black;
  font-weight: bold;
}

/* chaque option du sous-menu non sélectionné */
#sous_menu_sel:hover
{
/*  color: red;*/
  background-color: white;
  border: 1px solid black;
/*  border-radius: 15px;*/
}

/*==============================================================================
                                      COOKIES
==============================================================================*/
#Cookies
{
	margin: 10px;
   text-align: center;
	font-variant: small-caps;
	font-size: 0.85em;
}


/*==============================================================================
                                RETOUR EN TÊTE DE SITE
==============================================================================*/

#retour_tete
{
  text-align: center;
  color: blue;         
  width: 300px;  /* même largeur que le menu */
  position: fixed;
  bottom: 40px;
  height: 30px;
  left: 0px;
/*border: 2px dotted #000000;*/
}

#retour_tete_1
{
  position: fixed;
  z-index: 1;       /* pour mettre le bouton derrière le header */
  text-align: center;
  color: blue;         
  width: 300px;  /* même largeur que le menu */
  top: 30px;
  height: 30px;
  left: 0px;
/*border: 2px dotted #000000;*/
}

/*==============================================================================
                                    CORPS DE TEXTE
==============================================================================*/

#corps
{
  max-width: 1300px;
  margin-left: 304px;  /* qq pixels de plus que la largeur du menu */
/*  margin-top: 20px;  */
  padding: 10px;
  padding-top: 0px;

  text-align: justify;
  font-size: 1.0em;
/*  border: 2px dotted #000000;*/
}

#corps h2
{
  /*text-align: center;*/
}

#corps p
{
   line-height: 130%;  /* espacement entre les lignes d'un même para */
   margin-top: -5px;   /* espacement devant le para */
}

#corps li
/* pour un texte retrait sous bullet (Texte_R1), mettre une balise <br> */
{
   line-height: 120%;   /* espacement entre les lignes d'une même puce (si sur plusieurs lignes) */
   margin-top: 8px;     /* espacement devant chaque puce */
}

#corps ul
{
   margin-top: -10px;    /* espace au-dessus de la PREMIERE puce */
   margin-bottom: 5px;   /* espace sous la dernière puce */
}

.1bR2_avt    /* Ne fct pas */
{
   margin-top: 50px;    /* espace au-dessus de la PREMIERE puce d'une bullet de deuxième niveau */
} 

#corps img_Ex
{
  display: block;
  width: auto;
  /* Les deux margins left et right pour centrer l'image*/
  margin-left: auto;
  margin-right: auto;
  /* Les deux margin top et botton pour écarter le texte de l'image*/
  margin-top: 0px;
  margin-bottom: 10px;
}

.img_Ex
{
  display: block;
  width: auto;
  /* Les deux margins left et right pour centrer l'image*/
  margin-left: auto;
  margin-right: auto;
  /* Les deux margin top et botton pour écarter le texte de l'image*/
  margin-top: 0px;
  margin-bottom: 10px;
}

#corps em
{
/*  font-weight: bold;*/
  color: blue;
}

/* ============================================================================================== */
/*
/*   Cadre bleu dans la page principale du site, y compris configuration des bullets              */
/*
/* ============================================================================================== */

.titre_cadre_insist
{
	margin: 20px 10px 0px 0px;  /* top-right-bottom-left */
	border: 2px solid rgb(0,0,255);   /* bleu */
	border-radius: 8px 8px 0px 0px;  /* Haut-gauche, haut-droit, bas-droit, bas-gauche */
	box-shadow: 0px 0px 3px 3px rgb(127,127,255);
	padding: 5px 5px 5px 5px;  /* top-right-bottom-left */
/*	background: radial-gradient(farthest-corner at 50% 50%,rgb(255,255,255),rgb(200,255,255)); /* Standard syntax (must be last) */  
	background-color: rgb(200,255,255);  /* cyan */  
	font-size: 1.5em;  
	text-align: center;
	color: rgb(0,0,255);
	font-weight: bold;
	letter-spacing: 3px;
}

.cadre_insist
{
	border: 2px solid #0000FF;   /* bleu */
	padding: 15px 15px 0px 15px;  /* top-right-bottom-left */
/*  padding: 15px 15px 0px 15px;  /* top-right-bottom-left */
/*  padding-bottom: 0px;  /* Pour limiter la marge au-dessus de la bordure du bas qui est sinon importante à cause du <p> ... </p> */
	margin: 0px 10px 0px 0px;  /* top-right-bottom-left */
	font-size: 1.05em;  
	/*line-height: 0%;*/  /* Ne fct pas car il y a déjà ".corps p" */
	box-shadow: 0px 0px 3px 3px rgb(127,127,255);
	border-radius: 0px 0px 8px 8px;  /* Haut-gauche, haut-droit, bas-droit, bas-gauche */
	background-color: rgb(255,255,250);  /* jaune très clair */  
}

.cadre_insist strong
{
  color: red; 
}

.titre_cadre_insist_2
{
	margin: 20px 10px 0px 0px;  /* top-right-bottom-left */
	border: 2px solid rgb(0,0,255);   /* bleu */
	border-radius: 8px 8px 0px 0px;  /* Haut-gauche, haut-droit, bas-droit, bas-gauche */
	box-shadow: 0px 0px 3px 3px rgb(127,127,255);  
	padding: 5px 5px 5px 5px;  /* top-right-bottom-left */
/*	background: radial-gradient(farthest-corner at 50% 50%,rgb(255,255,255),rgb(200,255,255)); /* Standard syntax (must be last) */  
	background-color: rgb(0,20,255);  /*  */  
/*	background-color: rgb(200,255,255);  /* cyan */  
	font-size: 1.7em;  
	text-align: center;
	color: rgb(255,255,0);
/*	color: rgb(0,0,255);*/
	font-weight: bold;
	letter-spacing: 3px;
}

.cadre_insist_2
{
	border: 2px solid #0000FF;   /* bleu */
	border-top: 0px solid #0000FF;   /* bleu */
	padding: 15px 15px 0px 15px;  /* top-right-bottom-left */
/*  padding: 15px 15px 0px 15px;  /* top-right-bottom-left */
/*  padding-bottom: 0px;  /* Pour limiter la marge au-dessus de la bordure du bas qui est sinon importante à cause du <p> ... </p> */
	margin: 0px 10px 0px 0px;  /* top-right-bottom-left */
  font-size: 1.05em;  
  /*line-height: 0%;*/  /* Ne fct pas car il y a déjà ".corps p" */
  box-shadow: 0px 0px 3px 3px rgb(127,127,255);
  border-radius: 0px 0px 8px 8px;  /* Haut-gauche, haut-droit, bas-droit, bas-gauche */
/*	background-color: rgb(255,255,245);  /* jaune clair */  
	background-color: rgb(255,255,255);  /* blanc */  
}

.cadre_insist_2 strong
{
  color: red; 
}



/* ============================================================================================== */
/* Pour une belle apparence des "bullets", indépendamment de "line-height" grâce aux "%"          */
/* ============================================================================================== */

.cadre_insist p
{
  line-height: 200%;  /* Ne fct pas car il y a déjà ".corps p" */
}
.cadre_insist ul   /* config du bloc des puces ds leur ensemble: espace avant et après */
{
  padding-top: 0.0%;   /* espace au-dessus de la PREMIERE puce */
  padding-bottom: 1%;  /* pour se rapprocher du bord inf */
}

.cadre_insist ul li   /* confi des interlignes entre les puces */
{
	margin-bottom: 0%;  /* Mettre 0% pour resserer les bullets quand le line-height augmente */
}

/* ============================================================================================== */

.cadre_insist_jaune
{
  border: 2px solid #0000FF;   /* bleu */
  padding: 10px;
  margin: 0px;
  margin-top: 20px;
  margin-left: 20px;
  margin-right: 20px;
  font-size: 1.3em;  
  line-height: 130%;
  box-shadow: 0px 0px 3px 3px rgb(127,127,255);
  border-radius: 8px;
  background-color: rgb(255,255,230);  /* jaune clair */  
}

.cadre_ombre
{
  border: 2px solid #0000FF;   /* gris */
  padding: 5px;
  margin: 0px;
  box-shadow: 10px 10px 0px blue;
}

.cadre_retrait
{
  border: 1px solid #0000FF;   /* gris */
  padding: 5px;
  margin: 20px;
}

.h3_color
{  
  color: red;
}

.h4_info_recente
{
/*   color: red;*/
   margin-bottom: 10px;   /* espacement sous le para */
/*   padding-bottom: 50%; */
}

.h4_align
{
  padding-left: 20px;
  color: green;
  /*text-decoration: underline;*/
/*  text-align: center;*/
}  

.p_rem_i_petit
{
  font-size: 90%;
  font-style: italic;  
}

.p_centre
{
  text-align: center;
}

.p_centre_cadre
{
  padding: 4px;
  text-align: center;
  border: 1px solid rgb(100,100,100);	
  border-radius: 8px;    
}

.p_centre_cadre_jaune
{
  padding: 4px;
  text-align: center;
  border: 1px solid rgb(100,100,100);	
  border-radius: 8px;  
  background-color: rgb(255,255,220);  /* jaune clair */
}

.p_gauche
{
  text-align: left;
}

.fBold
{
  font-weight: bold;
}

.fs90
{
	font-size: 90%;
}

.fs80
{
  font-size: 80%;
}

.fs75
{
  font-size: 75%;
}

.fsi
{
  font-style: italic; 
}

/* style pour montrer/cacher les h3 */
.titre_h3_mc
{
  font-size: 125%;  /* correspond à h3 */
  font-weight: bold;
  color: red;
  text-align: left;
}

.titre_h3_mc:hover
{
  cursor: pointer;
  text-decoration: none;
}

/* style pour montrer/cacher les h4 verts */
.titre_h4_mc
{
  padding-left: 20px; /* titre un peu en retrait */
  font-size: 100%;    /* correspond à h4 */
  font-weight: bold;
  color: green;
}

.titre_h4_mc:hover
{
  cursor: pointer;
  text-decoration: none;
}

.avert_tele
{
  padding-left: 30px;
}

/*
.text_det
{
}
*/

/*==================================================================================================
                                            TABLE(AUX)
==================================================================================================*/
caption
{
  color: red;
  text-align: left;
  font-size: 110%
}

th
{
  text-align: center;
}

.table_fichiersRSD  caption
{
  color: rgb(0,0,170);
  text-align: left;
  font-size: 110%
}

.table_fichiersRSD  
{
  border: 3px solid rgb(170,170,170);
}

.table_fichiersRSD th
{
  background-color: rgb(170,170,170);  /* gris moyen */
  border-bottom: 1px solid rgb(127,127,127);
}

.table_fichiersRSD, th, td
{
/*  border: 1px solid rgb(235,235,235);*/
  border-collapse: collapse;
  line-height: 150%;
}

.table_fichiersRSD  td
{
  font-size: 90%;
  text-align: left;
}

.table_fichiersRSD  tr td
{
  padding: 4px 12px;
}

/* lignes paires (première ligne=0) */
.table_fichiersRSD  tr:nth-child(even)
{
/*  background-color: rgb(240,240,240); */  /* gris clair */
  background-color: rgb(250,250,250);  /* gris clair presque blanc*/
}

/* lignes impaires */
.table_fichiersRSD  tr:nth-child(odd)
{
/*  background-color: rgb(255,255,150); */ /* jaune clair */
  background-color: rgb(220,220,220);  /* gris clair */
}

/* survol des lignes */
.table_fichiersRSD  tr:hover
{
  background-color: rgb(200,255,255);  /* bleu ciel clair */
  cursor: default;
}

/*table_fichiersRSD, */
.table_img
{
  border-collapse: separate; /* pour permettre l'espace entre les cellules */
  border-spacing: 15px 1px;   /* espace horizontal et vertical */
  margin-bottom: 0px;        /* espace sous les cellules du tableau: 0 ou -5px car sinon espace indésirable sous les images ds cellules */
  padding: 10px;				  /* espace sous le tableau */
  /* centre le tableau */
  margin-left: auto;
  margin-right: auto;
}


.table_img td
{
  border-style: none;
  vertical-align: center;  /* centre l'image dans la cellule (tt en laissnt l'espace indésirable en-dessous) */
  padding: 0px;
}

.table_img img
{
  display: block;
  height: auto;
  padding: 0px;
}

.table_IV
{
  border-collapse: separate; /* pour permettre l'espace entre les cellules */
  border-spacing: 15px 1px;   /* espace horizontal et vertical */
  margin-bottom: 0px;        /* espace sous les cellules du tableau: 0 ou -5px car sinon espace indésirable sous les images ds cellules */
  padding: 0px;				  /* espace sous le tableau */
  /* centre le tableau */
  margin-left: auto;
  margin-right: auto;
  color: blue;
}

.table_IV_TxtGauche
{
  /*border-style: none;*/
  /*border: 1px solid red;*/
	vertical-align: top;  /* centre l'image dans la cellule (tt en laissant l'espace indésirable en-dessous) */
	padding: 0px;
	text-align: justify;
	color: black;
	font-size: 90%;
}

.table_IV_TxtDroit
{
  /*border-style: none;*/
/*	border: 1px solid red;*/
	vertical-align: top;  /* centre l'image dans la cellule (tt en laissant l'espace indésirable en-dessous) */
	padding: 0px;
	text-align: justify;
	color: black;
	font-size: 90%;
}

.table_IV_Img
{
	border-style: none;
	/*display: inline-block;*/
	display:table-cell;
/*  border: 1px solid blue;*/
  vertical-align: middle;  /* centre l'image dans la cellule (tt en laissant l'espace indésirable en-dessous) */
  padding: 0px;
  text-align: right;
  color: blue;
}


.table_img_vert img
{
  display: block;
  height: auto;
  padding: 0px;
}



/*==============================================================================
                                    IMAGES
==============================================================================*/
.p_centrer_img
{
  border: 1px solid rgb(200,200,200);  /* bordure de l'image */
/*  vertical-align: bottom;  */
  margin: 0px;
  padding: 0px;
}

.p_centrer_img:hover
{
/*  border: 1px solid rgb(200,200,200); */ /* bordure de l'image */
  cursor: pointer;
}

.div_centrer_img
{
  /* espacement devant et derrière image*/
  padding-top: 3px;
  padding-bottom: 0px;
  vertical-align: bottom;  
  margin: 0px;
}

.div_centrer_img:hover
{
  /*cursor: pointer;*/
}

.div_img_tab
{
  /* espacement devant et derrière image*/
  padding: 0px;
  margin: 0px;
}

.img_centre
{
  /*width: auto;*/
  margin: 0px;
}

/*==================================================================================================
                            Pour visualiser les images avec lightbox
==================================================================================================*/
.img-lb-link 
{
	display: inline-block;
	padding: 4px;
	margin: 0 0.5rem 1rem 0.5rem;
/*	background-color: #fff;*/
	background-color: rgb(235,235,235);
/*	background-color: rgb(150,230,255);*/
	line-height: 0;
	-webkit-transition: background-color 0.1s ease-out;
	-moz-transition: background-color 0.1s ease-out;
	-o-transition: background-color 0.1s ease-out;
	transition: background-color 0.1s ease-out;
	-webkit-border-radius: 6px;
	-moz-border-radius: 6px;
	-ms-border-radius: 6px;
	-o-border-radius: 6px;
	border-radius: 6px
}

.img-lb-link:hover
{
/*	background-color: #4ae;*/
	background-color: rgb(60,180,230);
}

.img-lb-1img /* example-image ds listbox */
{
	width: 10rem;
/*	height: 5rem;*/
	-webkit-border-radius:5 px;
	-moz-border-radius: 5px;
	-ms-border-radius: 5px;
	-o-border-radius: 5px;
	border-radius: 5px
}

.img-lb /* example-image ds listbox */
{
	width: 8rem;
	/*height: 5rem;*/
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	-ms-border-radius: 5px;
	-o-border-radius: 5px;
	border-radius: 5px
}

.w10  
{
	width: 10rem;
}

.w12 
{
	width: 12rem;
}

.w15 
{
	width: 15rem;
}

.w20 
{
	width: 20rem;
}

.mw1300
{
	max-width: 1300px;
}


/*==============================================================================
                                    PIED DE PAGE
==============================================================================*/
#pied_page
{
	margin-left: 320px;
	margin-top: 50px;  /* force un espacement au-dessus du footer */
	margin-right: 25px;
	max-width: 1275px;   /* après le margin-right et à adapter au "padding" de "cadre_insist" */
	padding: 0px;  /* !! si <>0, ne centre pas bien la deuxième ligne! */

	border: 1px solid rgb(128,128,128);   /* gris */
	border-radius: 8px;    	
	text-align: center;
	font-size: small;
	color: rgb(128,128,128);  /* gris */
}

#pied_page p
{
   margin-top: 5px;      /* espacement devant le para */
   margin-bottom: 5px;   /* espacement derrière le para */
}

#pied_page_large
{
   margin-left: 10px;
   margin-top: 100px;  /* force un espacement au-dessus du footer */
   margin-right: 25px;
   max-width: 1300px;  /* après le margin-right */
   padding: 0px;  /* !! si <>0, ne centre pas bien la deuxième ligne! */

   border: 1px solid #808080;   /* gris */
   border-radius: 8px;    	

   text-align: center;
   font-size: small;

   color: rgb(128,128,128)
}

#pied_page_large p
{
   margin-top: 5px;      /* espacement devant le para */
   margin-bottom: 5px;   /* espacement derrière le para */
}

/*==============================================================================
                                    BOUTONS
==============================================================================*/

/* Boutons verts dégradés */
.btn_JPL_01
{
  font-size: 12px;
  color: #FFF;
  padding: 3px 6px;
  background: -webkit-linear-gradient(rgb(0,190,0), green); /* For Safari 5.1 to 6.0 */
  background: -o-linear-gradient(rgb(0,190,0), green);      /* For Opera 11.1 to 12.0 */
  background: -moz-linear-gradient(rgb(0,190,0), green);    /* For Firefox 3.6 to 15 */
  background: linear-gradient(rgb(0,190,0), green);         /* Standard syntax */
  border-radius: 5px;
  text-decoration: none;
}

.btn_JPL_01:hover
{
  text-decoration: none;
  /*color: yellow;*/
  background: -webkit-linear-gradient(green,rgb(0,190,0)); /* For Safari 5.1 to 6.0 */
  background: -o-linear-gradient(green,rgb(0,190,0));      /* For Opera 11.1 to 12.0 */
  background: -moz-linear-gradient(green,rgb(0,190,0));    /* For Firefox 3.6 to 15 */
  background: linear-gradient(green,rgb(0,190,0));         /* Standard syntax */
  cursor: pointer;
}

/* Boutons bleus dégradés */
.btn_JPL_02
{
  font-size: 13px;
  color: rgb(255,255,255);
  padding: 3px 6px;
  background: -webkit-linear-gradient(rgb(80,80,255), blue); /* For Safari 5.1 to 6.0 */
  background: -o-linear-gradient(rgb(80,80,255), blue);      /* For Opera 11.1 to 12.0 */
  background: -moz-linear-gradient(rgb(80,80,255), blue);    /* For Firefox 3.6 to 15 */
  background: linear-gradient(rgb(80,80,255), blue);         /* Standard syntax */
/*  background: rgb(72,72,255);*/
  border-radius: 15px;
  text-decoration: none;
}

.btn_JPL_02:hover
{
  text-decoration: none;
  /*color: yellow;*/
  cursor: pointer;
  background: -webkit-linear-gradient(blue,rgb(80,80,255)); /* For Safari 5.1 to 6.0 */
  background: -o-linear-gradient(blue,rgb(80,80,255));      /* For Opera 11.1 to 12.0 */
  background: -moz-linear-gradient(blue,rgb(80,80,255));    /* For Firefox 3.6 to 15 */
  background: linear-gradient(blue,rgb(80,80,255));         /* Standard syntax */
}

/* Boutons rouges dégradés */
.btn_JPL_03
{
  font-size: 14px;
  color: rgb(255,255,255);
  padding: 3px 6px;
  background: -webkit-linear-gradient(rgb(255,120,120), red); /* For Safari 5.1 to 6.0 */
  background: -o-linear-gradient(rgb(255,120,120), red);      /* For Opera 11.1 to 12.0 */
  background: -moz-linear-gradient(rgb(255,120,120), red);        /* For Firefox 3.6 to 15 */
  background: linear-gradient(rgb(255,120,120), red);         /* Standard syntax */
  /*background: rgb(255,50,50);*/
  border-radius: 5px;
  text-decoration: none;
}

.btn_JPL_03:hover
{
  text-decoration: none;
  background: -webkit-linear-gradient(red,rgb(255,120,120)); /* For Safari 5.1 to 6.0 */
  background: -o-linear-gradient(red,rgb(255,120,120));      /* For Opera 11.1 to 12.0 */
  background: -moz-linear-gradient(red,rgb(255,120,120));    /* For Firefox 3.6 to 15 */
  background: linear-gradient(red,rgb(255,120,120));         /* Standard syntax */
  cursor: pointer;
}

/* Boutons gris dégradés */
.btn_JPL_04
{
	font-size: 14px;
	color: rgb(30,30,30);
  padding: 4px 8px;
  background: -webkit-linear-gradient(rgb(255,80,80), rgb(255,180,180)); /* For Safari 5.1 to 6.0 */
  background: -o-linear-gradient(rgb(255,80,80), rgb(255,180,180));      /* For Opera 11.1 to 12.0 */
  background: -moz-linear-gradient(rgb(255,80,80), rgb(255,180,180));        /* For Firefox 3.6 to 15 */
  background: rgb(180,180,180);           /* Standard syntax */
  /*background: rgb(255,50,50);*/
  border-radius: 5px;
  text-decoration: none;
}

.btn_JPL_04:hover
{
	cursor: pointer;
	color: rgb(255,255,255);
	background: linear-gradient(rgb(255,180,180),rgb(255,80,80));         /* Standard syntax */
	background: rgb(255,80,80);         /* Standard syntax */
}

.btn_JPL_05
{

}

.btn_JPL_05:hover
{
	cursor: pointer;
}

/* Titre d'une rubrique: fond gris sur tte la ligne */
.t_rubr, .t_rubr_btn
{
	font-size: 20px;
	font-weight: 500;
	margin-top: 25px;
	margin-bottom: 20px;
	padding: 5px;
	color: rgb(70,70,70);
	color: rgb(0,0,255);
	color: rgb(70,70,70);
	background: linear-gradient(rgb(255,80,80), rgb(255,180,180));         /* Standard syntax */
	background: rgb(180,180,180);         /* Standard syntax */
	background: radial-gradient(farthest-corner at 50% 50%,rgb(150,150,150),rgb(210,210,210)); /* Standard syntax (must be last) */  
	background: linear-gradient(to right, rgb(170,170,170),rgb(220,220,220));
	border-radius: 5px;
}

/* Titre d'une rubrique qui agit comme un bouton: rouge qd on passe dessus */
.t_rubr_btn:hover
{
	cursor: pointer;
	color: rgb(255,255,255);
	background: rgb(255,80,80);         /* Standard syntax */
}

/* =================================================================================================
                                 Détails en vert: sous-titres et textes
==================================================================================================*/

/* Titre d'un détail développable ou fixe (_fx) */
.t_det_btn, .t_det_btn_fx
{
	text-indent: 8px;
	font-size: 16px;
	font-weight: bold;
	font-style: italic;
	margin-top: 25px;     /* marge externe devant le texte lui-même */
	padding-bottom: 4px;  /* marge interne: entre texte et ligne */
	border-bottom: 2px solid green;
	color: green;
}

/* rouge qd on passe sur un sous-titre développable */
.t_det_btn:hover
{
	cursor: pointer;
	color: rgb(0,180,0);
	color: red;
}

/* la division inclut tout le texte vert, titre compris 
  Détermine e.a. les retraits à gauche et droite */
.div_det  
{
	padding-left: 20px;   /* marge à gauche car sous-chapitre */
	padding-right: 30px;  /* marge à droite car sous-chapitre */
}

/* texte vert, sans le titre */
.text_det  
{
	padding-left: 10px;   /* petit retrait à gauche supplémentaire pour que le titre dépasse un peu */ 
	padding-right: 10px;  /* petit retrait à droite supplémentaire pour que le titre dépasse un peu */ 
	padding-top: 10px;
	padding-bottom: 0px;    /* ne fctt pas */
	background-color: white;
	border: 2px solid green;
	border-top: 0px;  /* car il y a déjà le border au-dessous du titre */
}

/* =================================================================================================
                                 Formulaire
==================================================================================================*/

/*  */
.form_comm_rsd
{
	font-size: 0.85em;
	padding-left: 30px;   /* Retrait à gauche de tout le formulaire */ 
	padding-right: 30px;   /* Retrait à droite de tout le formulaire */ 
	color: black;  /* Couleur générale */
	border: 1px solid black;
}

.form_comm_rsd fieldset 
{ 
	display: block;
	margin-left: 2px;
	margin-right: 2px;
	padding-top: 0.75em;
	padding-bottom: 0.75em;
	padding-left: 0.75em;
	padding-right: 0.75em;
	border: 1px solid rgb(150,150,150);
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	-ms-border-radius: 5px;
	-o-border-radius: 5px;
	border-radius: 5px;
} 

.form_comm_rsd legend
{
	color: blue;
	font-weight: bold;
	/* float: left;  /* Permet d'avoir le border du fieldset arrondi dans IE!  Cf. http://www.456bereastreet.com/archive/201302/fieldset_legend_border-radius_and_box-shadow/  */
}

.form_radio
{ 
	padding-left: 10px;  /* Retrait à gauche de l'ensemble des boutons */
}

.form_radio p
{
	color: black;  /* Couleur des choix */
	padding-top: 0px;  /* espacement entre les boutons */
}

.form_comm_rsd input, textarea {
/* Afin de s'assurer que tous les champs textuels utilisent la même police
	Par défaut, textarea utilise une police à espacement constant */
	font: 0.9em sans-serif;

	/* Pour harmoniser l'apparence des bordures des champs textuels */
	border: 1px solid #999;
}

.form_comm_rsd input:focus, textarea:focus {
	/* Afin de rehausser les éléments actifs */
	border-color: blue;
}

/* Permet d'ajouter de l'espace au-dessus de la ligne en question: sorte d'interligne!
Par exemple, pour des boutons radio: pas nécessairement sur le premier bouton (si ds un fieldset,
c'est le padding-top du fiedset qui va gérer cela) mais bien sur les autres boutons
*/

/* Espacement personnalisé pour les champs "text=input" qu'on souhaite non conventionnels */
.DivInput 
{
	margin-top: 0.5em;
}

/* Espacement personnalisé pour les champs "text=radio" qu'on souhaite non conventionnels */
.DivRadio 
{
	margin-top: 0.3em;
}

.Form_Error
{
	color: red;
}