@mixin below($point) {
  @media only screen and (max-width: $point) { @content; }
}

@mixin above($point) {
  @media only screen and (min-width: $point) { @content; }
}

@mixin transition($properties: all, $duration: .3s, $easing: ease-out) {
  @if length($properties) > 1 {
    transition-property: $properties;
    transition-duration: $duration;
    transition-timing-function: $easing;
  } @else {
    transition: $properties $duration $easing;
  }
}

@mixin linear-gradient($start, $end) {
  // background: -webkit-gradient(linear, $start, $end, color-stop(0, $color), color-stop(0.1, #fff), color-stop(0.2, $color));
  // background: -moz-gradient(linear, $start, $end, color-stop(0, $color), color-stop(0.1, #fff), color-stop(0.2, $color));
  // background: gradient(linear, $start, $end, color-stop(0, $color), color-stop(0.1, #fff), color-stop(0.2, $color));
  background: linear-gradient($start, $end);
}
@mixin background-size($width, $height) {
  -webkit-background-size: $width $height;
  -moz-background-size: $width $height;
  background-size: $width $height;
}
@mixin background-clip($width, $height) {
  -webkit-background-size: $width $height;
  -moz-background-size: $width $height;
  background-size: $width $height;
}
@mixin background-clip($value) {
  -webkit-background-clip: $value;
  -moz-background-clip: $value;
  background-clip: $value;
}
