/* ==========================================================================
   SYLMERA — LES COULEURS, A UN SEUL ENDROIT                          v339

   CE QU'ON A TROUVE. Le site n'avait pas trois habillages : il en avait
   vingt-six. Chaque page portait sa propre liste de couleurs, recopiee
   d'une page a l'autre puis laissee deriver. Le noir du texte existait en
   cinq versions — #0E1A17 sur neuf pages, #0B1F1C sur six, et trois
   autres. Le fond, en cinq. Le trait, en cinq. Aucune de ces differences
   n'a jamais ete decidee par personne : elles viennent du copier-coller.

   LA VALEUR RETENUE. Pour chaque couleur, celle de l'ecran d'envoi mobile
   money — c'est l'habillage choisi. Quand cet ecran ne la nomme pas, la
   valeur la plus repandue dans le site. Rien n'est invente ici : chaque
   nombre ci-dessous etait deja quelque part dans Sylmera.

   COMMENT CA MARCHE. Ce fichier est charge EN DERNIER sur chaque page.
   Les couleurs qu'une page declare pour elle-meme sont donc remplacees
   par celles-ci, sans qu'on ait a toucher a une seule de ses regles de
   mise en page. Rien ne bouge de place, rien ne change de taille : seules
   les couleurs se rangent.

   LES TROIS FAMILLES DE NOMS. Les pages disent --bg, la console dit
   --paper, l'envoi mobile money dit --sp-bg. Les trois sont declarees
   ici, sur les memes valeurs. Le jour ou l'on voudra changer le vert de
   Sylmera, c'est cette ligne-la qu'on changera, et le site entier
   suivra.
   ========================================================================== */

:root {
  /* --- Les noms employes par les pages ------------------------------- */
  --bg:           #F4F6F5;
  --surface:      #FFFFFF;
  --line:         #E5EAE8;
  --line-2:       #D4DCD9;

  --ink:          #0E1A17;
  --ink-2:        #48605A;
  --muted:        #6A7B76;
  --faint:        #9AA8A4;

  --deep:         #0E3B33;
  --deep-soft:    #EBF2F0;
  --teal:         #0A3A34;
  --teal-2:       #0F4D45;
  --teal-soft:    #E7F0ED;

  --lime:         #C8F21E;
  --lime-deep:    #8CAD12;
  --lime-soft:    #F1FCC7;

  --ok:           #1C6B4E;
  --ok-soft:      #E6F3EC;
  --danger:       #A93A31;
  --danger-soft:  #FBEDEB;
  --warn:         #8A5A0B;
  --warn-soft:    #FDF3E0;
  --violet:       #6B4EE6;

  /* --- Les noms employes par la console ------------------------------ */
  --forest-900:   #0A3A34;
  --forest-800:   #0E3B33;
  --forest-700:   #0F4D45;
  --forest-100:   #E7F0ED;
  --forest-50:    #EBF2F0;

  --lime-400:     #C8F21E;
  --lime-500:     #8CAD12;
  --lime-100:     #F1FCC7;

  --ink-3:        #6A7B76;

  --paper:        #F4F6F5;
  --line-soft:    #EFF3F1;

  --danger-bg:    #FBEDEB;
  --warn-bg:      #FDF3E0;
  --ok-bg:        #E6F3EC;

  /* --- Les noms employes par l'ecran d'envoi mobile money ------------- */
  --sp-bg:        #F4F6F5;
  --sp-ink:       #0E1A17;
  --sp-ink2:      #48605A;
  --sp-mute:      #6A7B76;
  --sp-line:      #E5EAE8;
  --sp-line2:     #EFF3F1;
  --sp-deep:      #0E3B33;
  --sp-lime:      #C8F21E;
  --sp-lime2:     #8CAD12;
  --sp-limet:     #F1FCC7;
  --sp-ok:        #1C6B4E;
  --sp-okt:       #E6F3EC;
  --sp-bad:       #A93A31;
  --sp-badt:      #FBEDEB;
  --sp-warn:      #8A5A0B;
  --sp-warnt:     #FDF3E0;
}


/* v710 — SOUS LA TRADUCTION DU NAVIGATEUR, les textes s'allongent. Rien ne doit elargir la page
   ni sortir de son cadre : la page ne defile jamais sur le cote, et un mot trop long se coupe. */
html,body{max-width:100%;overflow-x:clip}
h1,h2,h3,h4,p,label,li,dt,dd,figcaption{overflow-wrap:break-word}
button,.btn,a.btn{max-width:100%}
font[style]{vertical-align:baseline!important}
