.fib,
.fi {
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: contain;
}

.fi {
  display: inline-block;
  line-height: 1em;
  position: relative;
  width: 1em;
}

.fi:before {
  content: "\00a0";
}

.fi-us.fis { background-image: url(flag-icons-main/flag-icons-main/flags/1x1/us.svg); }
.fi-ca.fis { background-image: url(flag-icons-main/flag-icons-main/flags/1x1/ca.svg); }
.fi-gb.fis { background-image: url(flag-icons-main/flag-icons-main/flags/1x1/gb.svg); }
.fi-au.fis { background-image: url(flag-icons-main/flag-icons-main/flags/1x1/au.svg); }
.fi-de.fis { background-image: url(flag-icons-main/flag-icons-main/flags/1x1/de.svg); }
.fi-fr.fis { background-image: url(flag-icons-main/flag-icons-main/flags/1x1/fr.svg); }
.fi-mx.fis { background-image: url(flag-icons-main/flag-icons-main/flags/1x1/mx.svg); }
.fi-br.fis { background-image: url(flag-icons-main/flag-icons-main/flags/1x1/br.svg); }
.fi-in.fis { background-image: url(flag-icons-main/flag-icons-main/flags/1x1/in.svg); }
.fi-jp.fis { background-image: url(flag-icons-main/flag-icons-main/flags/1x1/jp.svg); }
.fi-it.fis { background-image: url(flag-icons-main/flag-icons-main/flags/1x1/it.svg); }
.fi-es.fis { background-image: url(flag-icons-main/flag-icons-main/flags/1x1/es.svg); }
.fi-nl.fis { background-image: url(flag-icons-main/flag-icons-main/flags/1x1/nl.svg); }
.fi-se.fis { background-image: url(flag-icons-main/flag-icons-main/flags/1x1/se.svg); }
.fi-no.fis { background-image: url(flag-icons-main/flag-icons-main/flags/1x1/no.svg); }
.fi-dk.fis { background-image: url(flag-icons-main/flag-icons-main/flags/1x1/dk.svg); }
.fi-ch.fis { background-image: url(flag-icons-main/flag-icons-main/flags/1x1/ch.svg); }
.fi-ie.fis { background-image: url(flag-icons-main/flag-icons-main/flags/1x1/ie.svg); }
.fi-nz.fis { background-image: url(flag-icons-main/flag-icons-main/flags/1x1/nz.svg); }
.fi-sg.fis { background-image: url(flag-icons-main/flag-icons-main/flags/1x1/sg.svg); }