/*
* @Author: chenjun
* @Date:   2017-11-23 15:09:13
* @Last Modified by:   chenjun
* @Last Modified time: 2017-11-23 15:48:41
*/

@charset "utf-8";

@mixin center-block {
    margin: 0 auto;
    display: block;
}

@mixin clearfix() {
    background-color: #fff;
    &:before,
    &:after {
        content: " ";
        display: table;
    }

    &:after {
        clear: both;
    }
}

@mixin border-box {
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

@mixin transform($transforms) {
    -moz-transform: $transforms;
    -o-transform: $transforms;
    -ms-transform: $transforms;
    -webkit-transform: $transforms;
    transform: $transforms;
}

@mixin transition($args...) {
    -webkit-transition: $args;
    -moz-transition: $args;
    -ms-transition: $args;
    -o-transition: $args;
    transition: $args;
}

@mixin animation($args...) {
    -webkit-animation: $args;
    -moz-animation: $args;
    -ms-animation: $args;
    -o-animation: $args;
    animation: $args;
}

// rotate
@mixin rotate($deg) {
    @include transform(rotate(#{$deg}deg));
}

// scale
@mixin scale($scale) {
    @include transform(scale($scale));
}

// translate
@mixin translate($x, $y) {
    @include transform(translate($x, $y));
}

// skew
@mixin skew($x, $y) {
    @include transform(skew(#{$x}deg, #{$y}deg));
}

//transform origin
@mixin transform-origin($origin) {
    moz-transform-origin: $origin;
    -o-transform-origin: $origin;
    -ms-transform-origin: $origin;
    -webkit-transform-origin: $origin;
    transform-origin: $origin;
}

@mixin keyframes($animationName) {
    @-webkit-keyframes #{$animationName} {
        @content;
    }

    @-moz-keyframes #{$animationName} {
        @content;
    }

    @-o-keyframes #{$animationName} {
        @content;
    }

    @keyframes #{$animationName} {
        @content;
    }
}

@mixin box-shadow($top, $left, $blur, $color, $inset: "") {
    -webkit-box-shadow: $top $left $blur $color #{$inset};
    -moz-box-shadow: $top $left $blur $color #{$inset};
    box-shadow: $top $left $blur $color #{$inset};
}

@mixin linear-gradient($args...) {
    background-image: -o-linear-gradient($args);
    background-image: -moz-linear-gradient($args);
    background-image: -webkit-linear-gradient($args);
    background-image: linear-gradient($args);
}