/* Le pied du site, partage par toutes les pages publiques.
   Il porte l'avertissement bien-etre et les pages legales : un site qui
   collecte une adresse les doit a ses visiteurs. Charge apres la feuille de la
   page, il a donc le dernier mot sur .pied, .avert et .mentions. */

.pied-site{background:#0B3B23;color:#D6E9DC;padding:34px 24px 26px;
  font:15px/1.6 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif}
.pied-site .pied{display:flex;gap:16px;align-items:flex-start;max-width:960px;margin:0 auto 18px}
.pied-site .pied b{color:#fff;font:600 17px/1.3 Georgia,"Times New Roman",serif}
.pied-site .avert{margin:6px 0 0;font-size:13px;color:#A9CDB8;max-width:70ch}
.pied-site .legal{display:flex;flex-wrap:wrap;gap:18px;max-width:960px;margin:0 auto 16px;
  padding-top:16px;border-top:1px solid rgba(255,255,255,.14)}
.pied-site .legal a{color:#D6E9DC;font-size:13.5px;text-decoration:none}
.pied-site .legal a:hover{color:#D9A441;text-decoration:underline}
.pied-site .mentions{max-width:960px;margin:0 auto;font-size:12.5px;color:#8FB49E}

@media (max-width:640px){
  .pied-site{padding:26px 16px 20px}
  .pied-site .legal{gap:12px}
}