html.specific {
  /* Override ici pour changer le thème du site */
  /* Pour les couleurs => RGB ou Hex vers HSLA : https://hslpicker.com/ */

  /* Variable à override pour changer la police d'écriture du site */

  --ig-font-family: Roboto, sans-serif;
  --specific-title-font-family: Josefin Sans, sans-serif;
  .igx-drop-down__inner {
    color: black;
  }
  .igx-stepper__step-indicator {
    color: black;
  }
  /* --------------------------------------------- */

  /* Variables à override pour changer la couleur principale du thème (Boutons & footer) */

  --ig-primary-h: 54deg;
  --ig-primary-s: 100%;
  --ig-primary-l: 63%;

  /* Exemple de variable à surcharger pour forcer la couleur du texte des boutons */

  --ig-primary-200: var(--ig-black);

  /* --------------------------------------------- */

  /* Variables à override pour changer la couleur secondaire du thème (effets (hover, selected, focus)) */

  --ig-secondary-h: 45deg;
  --ig-secondary-s: 18%;
  --ig-secondary-l: 4%;

  /* --------------------------------------------- */

  /* Variables à override pour changer les tonalités de gris du thème */

  /* --------------------------------------------- */

  /* #region SURFACES */

  --footer-fond: hsl(0deg, 0%, 16%); /* Fond du footer */
  --footer-texte: hsl(var(--ig-primary-500)); /* Texte du footer */

  --header-fond: hsl(var(--ig-primary-500)); /* Fond de l'entête */
  --header-texte: hsl(0deg, 0%, 16%); /* Texte de l'entête */

  --surface-2-fond:hsl(0deg, 0%, 85%);
  --surface-1-fond: white;
  /*#endregion */

  /* #region BOUTONS */

  --bouton-fond: hsl(var(--ig-primary-500)); /* Fond des boutons */
  --bouton-texte: hsl(var(--ig-secondary-500)); /* Texte des boutons */
  --bouton-hover-fond: hsl(
    var(--ig-secondary-500)
  ); /* Fond des boutons lors du passage de la souris */
  --bouton-hover-texte: hsl(
    var(--ig-primary-500)
  ); /* Texte des boutons lors du passage de la souris */
  --bouton-focus-fond: hsl(
    var(--ig-secondary-500)
  ); /* Fond des boutons lors du clic */
  --bouton-focus-texte: hsl(
    var(--ig-primary-500)
  ); /* Texte des boutons lors du clic */
  --igx-stepper-current-indicator-color: hsl(
    var(--ig-secondary-500)
  ); /* Couleur de l'indicateur courant du stepper */

  /*#endregion */

  /* #region INPUTS */
  /*#endregion */

  /* #region LIENS*/

  --lien-texte: hsl(var(--ig-secondary-500)); /* Couleur des liens génériques */
  --lien-hover-texte: hsl(
    var(--ig-secondary-500)
  ); /* Couleur des liens génériques lors du passage de la souris */

  /*#endregion*/

  /* #region TITRES */

  --titre-site-texte: hsl(0deg, 0%, 16%); /* Couleur du titre du site (= h1) */
  --sous-titre-site-texte: hsl(
    0deg,
    0%,
    16%
  ); /* Couleur du sous-titre du site */

  --titre-page-texte: hsl(
    var(--ig-secondary-500)
  ); /* Couleur du titre d'une page (= h2) */
  --titre-categorie-texte: hsl(
    var(--ig-secondary-500)
  ); /* Couleur du titre d'une catégorie (= h3) */
  --sous-titre-texte: hsl(
    var(--ig-secondary-500)
  ); /* Couleur des sous-titres de manière générale */
  --ig-h3-font-weight: 700;
  --ig-h3-font-size: 1.875em;
  /*#endregion */
}

.igx-drop-down__item--selected.igx-drop-down__item--focused {
  background: hsla(var(--ig-primary-500)) !important;
}

.igx-drop-down__item--selected:hover {
  background: none !important;
}

.igx-drop-down__list{
  border: 0px;
  box-shadow: 0 2px 12px rgba(0,0,0,.3) !important;
}

igx-checkbox {
  --fill-color: none !important;

  --tick-color: hsla(var(--ig-primary-600)) !important;
}
h3 {
  background-color: hsla(var(--ig-primary-500)) !important;
  font-size: 1.875em;
  font-weight: 700;
  font-family: "Josefin Sans", sans-serif !important;
  margin: 0px !important;
  padding: 17px 10px 8px 10px !important;
}

h4 {
  font-weight: bold;
  font-size: 1.2em;
  font-family: sans-serif;
}
.info{
  font-style: italic;
}

/*Style des cadres pour notes */
.calculs {
  text-align: center;
  background-color: #F4F4F4;
  border: 1px solid #AAAAAA;
  margin: 10px 20px 0 0;
  min-height: 20px;
  padding: 10px;
}

/* Style des tableaux des articles */
.pure-g {
  text-rendering: optimizespeed;
  font-family: FreeSans, Arimo, "Droid Sans", Helvetica, Arial, sans-serif;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-flow: row wrap;
  -ms-flex-flow: row wrap;
  flex-flow: row wrap;
  -webkit-align-content: flex-start;
  -ms-flex-line-pack: start;
  align-content: flex-start;
}
.pure-u-md-2-3 {
  width: 66.6667%;
}
.pure-u-md-1-3,
.pure-u-md-8-24 {
  width: 33.3333%;
}
.pure-table caption {
  color: #000;
  font:
    italic 85%/1 arial,
    sans-serif;
  padding: 1em 0;
  text-align: center;
}
.pure-table {
  border-collapse: collapse;
  border-spacing: 0;
  empty-cells: show;
  border: 1px solid #cbcbcb;
}
.pure-table thead {
  background-color: #e0e0e0;
  color: #000;
  text-align: left;
  vertical-align: bottom;
}
.pure-table td {
  background-color: transparent;
}
.pure-table td,
.pure-table th {
  border-left: 1px solid #cbcbcb;
  border-left-width: 1px;
  border-width: 0 0 0 1px;
  font-size: inherit;
  margin: 0;
  overflow: visible;
  padding: 0.5em 1em;
}
ul, ol {
    display: block !important;
    margin-top: 1rem !important;
    margin-bottom: 1rem !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 40px !important;
}

ul {
    list-style-type: disc !important;
}

ol {
    list-style-type: decimal !important;
}

    /* Restaure les marges des éléments li */
    ul li, ol li {
        display: list-item !important;
        margin: 0 !important;
        padding: 0 !important;
    }