#traffic-lights-counts
{
  display:inline-flex;

  #red-count, #amber-count, #green-count
  {
    @include edged-panel();
    max-height: 26px;
    min-width: 15px;
    font-size: 23px;
    text-align: center;
    margin: 0px;
    padding: { left:4px; right:4px; top:2px; bottom:5px; }
    color: lighten(Black, 20%);
    background: lighten($darker-color,30%);
    border: none;
  }

  $fadePercent: 15%;

  #red-count.current   { background: lighten($red,   $fadePercent); }
  #amber-count.current { background: lighten($amber, $fadePercent); }
  #green-count.current { background: lighten($green, $fadePercent); }
}

#traffic-lights-counts
{
  display:inline-flex;

  #red-count, #amber-count, #green-count
  {
    @include edged-panel();
    max-height: 26px;
    min-width: 15px;
    font-size: 23px;
    text-align: center;
    margin: 0px;
    padding: { left:5px; right:5px; top:2px; bottom:5px; }
    color: lighten(Black, 20%);
    background: lighten($darker-color,30%);
    border: none;
  }

  $fadePercent: 15%;

  #red-count.current   { background: lighten($red,   $fadePercent); }
  #amber-count.current { background: lighten($amber, $fadePercent); }
  #green-count.current { background: lighten($green, $fadePercent); }
}

Tweak CSS for red/amber/green counts.
Tweak CSS for red/amber/green counts.
