.flag-country-bg {
    background-size: contain;
    background-position: 50%;
    background-repeat: no-repeat;
}

.flag-country {
    @extend .flag-country-bg;
    position: relative;
    display: inline-block;
    width: 1em;
    line-height: 1em;
    &:before {
        content: "\00a0";
    }
}

@mixin flag-icon($country) {
    .flag-country-#{$country} {
        @if $flag-icons-use-square {
            background-image: url(#{$flag-icons-path}#{$flag-icons-square-path}/#{$country}.svg);
        } @else {
            background-image: url(#{$flag-icons-path}#{$flag-icons-rect-path}/#{$country}.svg);
        }
    }
}