Scss mixin for responsive backgrounds (Bootstrap 3)

responsive-background.scss

@mixin responsive-background($img: 'img', $ext: 'jpg') {
  background-image: url("#{$img}-xs.#{$ext}");
  @media(min-width: $screen-sm-min) {
    background-image: url("#{$img}-sm.#{$ext}");
  }
  @media(min-width: $screen-md-min) {
    background-image: url("#{$img}-md.#{$ext}");
  }
  @media(min-width: $screen-lg-min) {
    background-image: url("#{$img}-lg.#{$ext}");
  }
  @media(min-width: 1600px) {
    background-image: url("#{$img}-xl.#{$ext}");
}