/* 
Les couleurs :
Des couleurs sont déjà associées à certains noms.
On peut donc par exemple écrire :
--couleur_texte : white;

Les noms de couleurs reconnus sont (entre autres) : blue, black, gray, silver, aqua, navy,
teal, green, olive, lime, yellow, orange, red, fuchsia, purple, maroon, darken-1, darken-2, darken-3

Pour sélectionner une couleur précise avec un code Hex, il existe de nombreux sites ou outils : 
http://www.rapidtables.com/web/color/RGB_Color.htm#color%20picker

Border radius : 
Augmenter border radius permet d'arrondir les boutons. 
un border radius égal à 0 donne des boutons rectangulaires.
*/

/* déclaration des variables dans la pseudo-classe root */
:root {
  --couleur_texte: white;
  --couleur_bouton_arriere_plan: #999999;
  --couleur_bouton_survol: #767676;
  --couleur_bouton_clique: #555555;
  --couleur_bouton_visite: #BBBBBB;
  --border_radius : 3px;
}

html {
  overflow-x: hidden; 
}

html, body {
  font-family: "Arial", cursive, sans-serif;
}

h1 {
  font-size: 28px;
}

p {
  text-align: justify;
}

/*
a:link {
    text-decoration: none;
}

a:visited {
    text-decoration: none;
}

a:hover {
    text-decoration: none;
}

a:active {
    text-decoration: none;
}*/

/* personnalisation des boutons */
.btn {
  padding: 2px 6px;
  border: 0px !important;
}

.btn-primary {
  border: 0px;
  color: var(--couleur_texte);
  background-color: var(--couleur_bouton_arriere_plan);
  border-radius: var(--border_radius);
}

/*passage de la souris au dessus du bouton */
.btn-primary:hover {
  box-shadow: inset 0 0 0 20rem var(--darken-1);
  background-color: var(--couleur_bouton_survol) !important;
}

.btn-primary:focus {
  background-color: var(--couleur_bouton_survol);
  outline-color: var(--couleur_bouton_survol) !important;
}

/* clic souris enfoncé sur le bouton*/
.btn-primary:active {
  background-color: var(--couleur_bouton_clique) !important;
  box-shadow: inset 0 0 0 20rem var(--darken-2), inset 0 3px 4px 0 var(--darken-3), 0 0 1px var(--darken-2);
}

.btn-primary:active:hover {
  background-color: var(--couleur_bouton_clique);
  box-shadow: inset 0 0 0 20rem var(--darken-2), inset 0 3px 4px 0 var(--darken-3), 0 0 1px var(--darken-2);
}

/*
.btn-primary:visited {
  background-color: var(--couleur_bouton_visite);
}*/

.btn-primary:disabled, 
.btn-primary.is-disabled {
  opacity: .5;
}

.hide_first{
   display: none;
}

.Section{
  line-height:150%;
  /*border-bottom: 1px solid rgba(53,86,129, 0.3);*/
}

.error_message {
  color :black;
  font-weight: bold
}

.thumbnail h3 {
  margin-top: 0px
}

/*
.footer {
  background-color: #FFFFFFF ; //Couleur de fond
  bottom: 0;
  width: 100%;
  color : white;
  font-family: "Arial", cursive, sans-serif;
  z-index: 5;
}*/

.footer > a {
  float: right;
}