SASS Mixins

@mixin transition($property, $type, $seconds) {
  -webkit-transition: $property $type $seconds;
     -moz-transition: $property $type $seconds;
       -o-transition: $property $type $seconds;
          transition: $property $type $seconds;
}
@mixin gradient($top, $bottom) {
  background-image: -webkit-linear-gradient($top, $bottom);
  background-image:    -moz-linear-gradient($top, $bottom);
  background-image:      -o-linear-gradient($top, $bottom);
  background-image:        -webkit-gradient(linear, 0% 0%, 0% 100%, from($top), to($bottom));
  background-color: $top;
}
@mixin font-smoothing {
  -webkit-font-smoothing: antialiased;
}
@mixin border-radius($px) {
  -webkit-border-radius: $px;
   -khtml-border-radius: $px;
     -moz-border-radius: $px;
          border-radius: $px;
}
@mixin box-shadow($x, $y, $blur, $color:"", $inset:"") {
    box-shadow:         unquote($inset) $x $y $blur unquote($color);
    -moz-box-shadow:    unquote($inset) $x $y $blur unquote($color);
    -webkit-box-shadow: unquote($inset) $x $y $blur unquote($color);
}
@mixin translateY($percent) {
  -webkit-transform: translateY($percent);
     -moz-transform: translateY($percent);
       -o-transform: translateY($percent);
          transform: translateY($percent);
}
@mixin transform($property) {
  -webkit-transform: $property;
     -moz-transform: $property;
      -ms-transform: $property;
       -o-transform: $property;
          transform: $property;
}
@mixin animation($name, $duration, $length) {
  -webkit-animation: $name $duration $length;
     -moz-animation: $name $duration $length;
       -o-animation: $name $duration $length;
          animation: $name $duration $length;
}
@mixin backface-visibility {
  -webkit-backface-visibility: hidden;
     -moz-backface-visibility: hidden;
      -ms-backface-visibility: hidden;
}