/* ==========================
   STYLE COMMUN À TOUS LES BOUTONS
========================== */
#boutonOcre.INTERF_liensUtilisateur:link,
#boutonOcre.INTERF_liensUtilisateur:visited,
#boutonTerre.INTERF_liensUtilisateur:link,
#boutonTerre.INTERF_liensUtilisateur:visited,
#boutonBois.INTERF_liensUtilisateur:link,
#boutonBois.INTERF_liensUtilisateur:visited,
#boutonMerlot.INTERF_liensUtilisateur:link,
#boutonMerlot.INTERF_liensUtilisateur:visited,
#boutonBle.INTERF_liensUtilisateur:link,
#boutonBle.INTERF_liensUtilisateur:visited,
#boutonFeuille.INTERF_liensUtilisateur:link,
#boutonFeuille.INTERF_liensUtilisateur:visited,
#boutonSapin.INTERF_liensUtilisateur:link,
#boutonSapin.INTERF_liensUtilisateur:visited,
#boutonCharbon.INTERF_liensUtilisateur:link,
#boutonCharbon.INTERF_liensUtilisateur:visited,
#boutonCraie.INTERF_liensUtilisateur:link,
#boutonCraie.INTERF_liensUtilisateur:visited,
#boutonMetal.INTERF_liensUtilisateur:link,
#boutonMetal.INTERF_liensUtilisateur:visited,
#boutonGlacier.INTERF_liensUtilisateur:link,
#boutonGlacier.INTERF_liensUtilisateur:visited,
#boutonLavande.INTERF_liensUtilisateur:link,
#boutonLavande.INTERF_liensUtilisateur:visited {
	text-decoration: none;
	display: inline-block;
	padding: 8px 16px;
	border-radius: 25px;
	border: none;
	transition: background-color 0.3s ease, color 0.3s ease;
	font-weight: 500;
}

/* =======================
   COULEURS INDIVIDUELLES
========================== */

/* Ocre */
#boutonOcre.INTERF_liensUtilisateur:link,
#boutonOcre.INTERF_liensUtilisateur:visited {
	background-color: #CEAB5D;
	color: #000000;
}
#boutonOcre.INTERF_liensUtilisateur:hover {
	background-color: #b9964f;
	color: #000000;
}

/* Terre */
#boutonTerre.INTERF_liensUtilisateur:link,
#boutonTerre.INTERF_liensUtilisateur:visited {
	background-color: #92542A;
	color: #ffffff;
}
#boutonTerre.INTERF_liensUtilisateur:hover {
	background-color: #7b4724;
}

/* Bois */
#boutonBois.INTERF_liensUtilisateur:link,
#boutonBois.INTERF_liensUtilisateur:visited {
	background-color: #472612;
	color: #ffffff;
}
#boutonBois.INTERF_liensUtilisateur:hover {
	background-color: #331a0c;
}

/* Merlot */
#boutonMerlot.INTERF_liensUtilisateur:link,
#boutonMerlot.INTERF_liensUtilisateur:visited {
	background-color: #78151E;
	color: #ffffff;
}
#boutonMerlot.INTERF_liensUtilisateur:hover {
	background-color: #5e1118;
}

/* Blé */
#boutonBle.INTERF_liensUtilisateur:link,
#boutonBle.INTERF_liensUtilisateur:visited {
	background-color: #ECC747;
	color: #000000;
}
#boutonBle.INTERF_liensUtilisateur:hover {
	background-color: #d6b53e;
	color: #000000;
}

/* Feuille */
#boutonFeuille.INTERF_liensUtilisateur:link,
#boutonFeuille.INTERF_liensUtilisateur:visited {
	background-color: #909B25;
	color: #ffffff;
}
#boutonFeuille.INTERF_liensUtilisateur:hover {
	background-color: #7f8b1f;
}

/* Sapin */
#boutonSapin.INTERF_liensUtilisateur:link,
#boutonSapin.INTERF_liensUtilisateur:visited {
	background-color: #45521F;
	color: #ffffff;
}
#boutonSapin.INTERF_liensUtilisateur:hover {
	background-color: #3a471a;
}

/* Charbon */
#boutonCharbon.INTERF_liensUtilisateur:link,
#boutonCharbon.INTERF_liensUtilisateur:visited {
	background-color: #000000;
	color: #ffffff;
}
#boutonCharbon.INTERF_liensUtilisateur:hover {
	background-color: #222222;
}

/* Craie */
#boutonCraie.INTERF_liensUtilisateur:link,
#boutonCraie.INTERF_liensUtilisateur:visited {
	background-color: #DFD7CD;
	color: #000000;
}
#boutonCraie.INTERF_liensUtilisateur:hover {
	background-color: #d2c9bd;
	color: #000000;
}

/* Métal */
#boutonMetal.INTERF_liensUtilisateur:link,
#boutonMetal.INTERF_liensUtilisateur:visited {
	background-color: #C8CDD0;
	color: #000000;
}
#boutonMetal.INTERF_liensUtilisateur:hover {
	background-color: #b8bdc0;
	color: #000000;
}

/* Glacier */
#boutonGlacier.INTERF_liensUtilisateur:link,
#boutonGlacier.INTERF_liensUtilisateur:visited {
	background-color: #7CA7B9;
	color: #000000;
}
#boutonGlacier.INTERF_liensUtilisateur:hover {
	background-color: #6895a8;
	color: #000000;
}

/* Lavande */
#boutonLavande.INTERF_liensUtilisateur:link,
#boutonLavande.INTERF_liensUtilisateur:visited {
	background-color: #8897AF;
	color: #000000;
}
#boutonLavande.INTERF_liensUtilisateur:hover {
	background-color: #74849c;
	color: #000000;
}


/* ================================
   Blocs colorés arrondis
   Utilisation :
   <div class="blocArrondi divOcre">Ocre</div>
   <div class="blocArrondi divMerlot">Merlot</div>
================================ */

/* Style de base commun à tous les blocs arrondis */
.blocArrondi {
  display: inline-block;
  padding: 10px 16px;
  border-radius: 12px;
  font-weight: 500;
  text-align: center;
  margin: 4px;
  color: #000;
}

/* ================================
   Couleurs
================================ */

/* Tons chauds */
.divOcre {
  background-color: #CEAB5D;
  color: #000;
}

.divTerre {
  background-color: #92542A;
  color: #fff;
}

.divBois {
  background-color: #472612;
  color: #fff;
}

.divMerlot {
  background-color: #78151E;
  color: #fff;
}

/* Tons naturels */
.divBle {
  background-color: #ECC747;
  color: #000;
}

.divFeuille {
  background-color: #909B25;
  color: #fff;
}

.divSapin {
  background-color: #45521F;
  color: #fff;
}

.divCharbon {
  background-color: #000000;
  color: #fff;
}

/* Tons neutres / clairs */
.divCraie {
  background-color: #DFD7CD;
  color: #000;
}

.divMetal {
  background-color: #C8CDD0;
  color: #000;
}

.divGlacier {
  background-color: #7CA7B9;
  color: #000;
}

.divLavande {
  background-color: #8897AF;
  color: #000;
}