.flags .flag{
    display: inline-block;
    width: 16px;
    height: 11px;
    content: "";
    background: url(/images/flags.png) no-repeat -108px -1976px;
}
.flags .en {
    background-position: -36px -26px!important;
}
.flags .fr {
    background-position: 0 -1976px!important;
}
.flags input{
  margin:0;padding:0;
  -webkit-appearance:none;
     -moz-appearance:none;
          appearance:none;

  -webkit-filter: grayscale(1);
  filter: grayscale(1);
}
.flags input:checked {
  -webkit-filter: grayscale(0);
  filter: grayscale(0);
}

.footer span.flags {
 padding: 7px;
 float: inline-end;
 display: block;
}
.footer span.flags input:checked {
  -webkit-filter: grayscale(1);
  filter: grayscale(1);
}
.footer span.flags input:not(:checked) {
  -webkit-filter: grayscale(0);
  filter: grayscale(0);
}