sample.css

.course {
  background-repeat: no-repeat;
  background-position: 510px center;
}
.course.ruby-on-rails {
  background-image: image-url("ruby-on-rails.svg");
}
.no-svg .course.ruby-on-rails {
  background-image: image-url("ruby-on-rails.png");
}
.course.javascript {
  background-image: image-url("javascript.svg");
}
.no-svg .course.javascript {
  background-image: image-url("javascript.png");
}
.course.nodejs {
  background-image: image-url("nodejs.svg");
}
.no-svg .course.nodejs {
  background-image: image-url("nodejs.png");
}
.course.jquery {
  background-image: image-url("jquery.svg");
}
.no-svg .course.jquery {
  background-image: image-url("jquery.png");
}
.course.responsive-web-design {
  background-image: image-url("responsive-web-design.svg");
}
.no-svg .course.responsive-web-design {
  background-image: image-url("responsive-web-design.png");
}

sample.scss

@mixin course-background($name) {
  &.#{$name} {
    background-image: image-url("#{$name}.svg");
  }

  .no-svg &.#{$name} {
    background-image: image-url("#{$name}.png");
  }
}

.course {
  @include course-background("ruby-on-rails");
  @include course-background("javascript");
  @include course-background("nodejs");
  @include course-background("jquery");
  @include course-background("responsive-web-design");

  background-repeat: no-repeat;
  background-position: 510px center;
}

👍