$icon-vert-px-increment: 35px;
$icon-hori-px-increment: 35px;
@mixin icon($background-position, $offsetx: 0, $offsety: 0) {
  @include vertical-sprite($icon-vert-px-increment, $background-position, $offsetx, $offsety, $icon-hori-px-increment, $hover: true, $active: true);
}
@function icon-pos-y($n) {
  @return $n * $icon-vert-px-increment * -1;
}

// $background-pos-order is 0 based
@mixin vertical-sprite($vertical-px-increment, $background-pos-order, $offsetx: 0, $offsety: 0, $horizontal-px-increment: null, $hover: null, $active: null) {
  $background-pos-y: $vertical-px-increment * $background-pos-order * -1;
  background-position: 0 + $offsetx $background-pos-y + $offsety;
  &:after {
    background-position: 0 + $offsetx $background-pos-y + $offsety;
  }
  @if $horizontal-px-increment != null {
    $background-pos-x: $horizontal-px-increment * $background-pos-order * -1;
    @if $hover != null {
      $hover-pos: $horizontal-px-increment * -1;
      &:hover {
        background-position: $hover-pos + $offsetx $background-pos-y + $offsety;
        &:after {
          background-position: $hover-pos + $offsetx $background-pos-y + $offsety;
        }
      }
      &.hover {
        background-position: $hover-pos + $offsetx $background-pos-y + $offsety;
      }
      @if $active != null {
        $active-pos: $horizontal-px-increment * 2 * -1;
        &:active {
          background-position: $active-pos + $offsetx $background-pos-y + $offsety;
          &:after {
            background-position: $active-pos + $offsetx $background-pos-y + $offsety;
          }
        }  
      } 
    }
  }
}