/*
 * Backgammon : remplissage des pastilles du banner des pages internes. La mise
 * en page vient de banner.css partagé, sans animation, comme le veut la charte
 * du réseau.
 */
.deco-banner.pion-clair, .deco-banner.pion-fonce { width: 22px; height: 22px; border-radius: 50%; }
.deco-banner.pion-clair { background: #f2e6cf; box-shadow: inset 0 0 0 2px #b9a67b; }
.deco-banner.pion-fonce { background: #2b2b30; box-shadow: inset 0 0 0 2px #6b6b76; }
.deco-banner.de-banner {
  width: 22px; height: 22px; border-radius: 5px; background: #f7efe0;
  background-image: radial-gradient(circle at 30% 30%, #2a1810 2.4px, transparent 2.6px),
                    radial-gradient(circle at 70% 70%, #2a1810 2.4px, transparent 2.6px),
                    radial-gradient(circle at 50% 50%, #2a1810 2.4px, transparent 2.6px);
}

@media (max-width: 480px) {
  .deco-banner.pion-clair, .deco-banner.pion-fonce, .deco-banner.de-banner { width: 18px; height: 18px; }
}