@include keyframes(bounce) {
    0%,
    20%,
    53%,
    80%,
    100% {
        -webkit-transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
        transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
        @include translate3d(0, 0, 0);
    }
    40%,
    43% {
        -webkit-transition-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
        transition-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
        @include translate3d(0, -30px, 0);
    }
    70% {
        -webkit-transition-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
        transition-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
        @include translate3d(0, -15px, 0);
    }
    90% {
        @include translate3d(0, -4px, 0);
    }
}
.bounce {
    -webkit-animation-name: bounce;
    animation-name: bounce;
    -webkit-transform-origin: center bottom;
    transform-origin: center bottom;
}



@include keyframes(bounceIn) {
    0%,
    20%,
    40%,
    60%,
    80%,
    100% {
        -webkit-transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
        transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    }
    0% {
        opacity: 0;
        @include scale3d(0.3, 0.3, 0.3);
    }
    20% {
        @include scale3d(1.1, 1.1, 1.1);
    }
    40% {
        @include scale3d(0.9, 0.9, 0.9);
    }
    60% {
        opacity: 1;
        @include scale3d(1.03, 1.03, 1.03);
    }
    80% {
        @include scale3d(0.97, 0.97, 0.97);
    }
    100% {
        opacity: 1;
        @include scale3d(1, 1, 1);
    }
}
.bounceIn {
    -webkit-animation-name: bounceIn;
    animation-name: bounceIn;
    -webkit-animation-duration: .75s;
    animation-duration: .75s;
}



@include keyframes(bounceInDown) {
    0%,
    60%,
    75%,
    90%,
    100% {
        -webkit-transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
        transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    }
    0% {
        opacity: 0;
        @include translate3d(0, -3000px, 0);
    }
    60% {
        opacity: 1;
        @include translate3d(0, 25px, 0);
    }
    75% {
        @include translate3d(0, -10px, 0);
    }
    90% {
        @include translate3d(0, 5px, 0);
    }
    100% {
        -webkit-transform: none;
        transform: none;
    }
}
.bounceInDown {
    -webkit-animation-name: bounceInDown;
    animation-name: bounceInDown;
}



@include keyframes(bounceInLeft) {
    0%,
    60%,
    75%,
    90%,
    100% {
        -webkit-transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
        transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    }
    0% {
        opacity: 0;
        @include translate3d(-3000px, 0, 0);
    }
    60% {
        opacity: 1;
        @include translate3d(25px, 0, 0);
    }
    75% {
        @include translate3d(-10px, 0, 0);
    }
    90% {
        @include translate3d(5px, 0, 0);
    }
    100% {
        -webkit-transform: none;
        transform: none;
    }
}
.bounceInLeft {
    -webkit-animation-name: bounceInLeft;
    animation-name: bounceInLeft;
}



@include keyframes(bounceInRight) {
    0%,
    60%,
    75%,
    90%,
    100% {
        -webkit-transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
        transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    }
    0% {
        opacity: 0;
        @include translate3d(3000px, 0, 0);
    }
    60% {
        opacity: 1;
        @include translate3d(-25px, 0, 0);
    }
    75% {
        @include translate3d(10px, 0, 0);
    }
    90% {
        @include translate3d(-5px, 0, 0);
    }
    100% {
        -webkit-transform: none;
        transform: none;
    }
}
.bounceInRight {
    -webkit-animation-name: bounceInRight;
    animation-name: bounceInRight;
}



@include keyframes(bounceInUp) {
    0%,
    60%,
    75%,
    90%,
    100% {
        -webkit-transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
        transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    }
    0% {
        opacity: 0;
        @include translate3d(0, 3000px, 0);
    }
    60% {
        opacity: 1;
        @include translate3d(0, -20px, 0);
    }
    75% {
        @include translate3d(0, 10px, 0);
    }
    90% {
        @include translate3d(0, -5px, 0);
    }
    100% {
        @include translate3d(0, 0, 0);
    }
}
.bounceInUp {
    -webkit-animation-name: bounceInUp;
    animation-name: bounceInUp;
}



@include keyframes(bounceOut) {
    20% {
        @include scale3d(0.9, 0.9, 0.9);
    }
    50%,
    55% {
        opacity: 1;
        @include scale3d(1.1, 1.1, 1.1);
    }
    100% {
        opacity: 0;
        @include scale3d(0.3, 0.3, 0.3);
    }
}
.bounceOut {
    -webkit-animation-name: bounceOut;
    animation-name: bounceOut;
    -webkit-animation-duration: .75s;
    animation-duration: .75s;
}



@include keyframes(bounceOutDown) {
    20% {
        @include translate3d(0, 10px, 0);
    }
    40%,
    45% {
        opacity: 1;
        @include translate3d(0, -20px, 0);
    }
    100% {
        opacity: 0;
        @include translate3d(0, 2000px, 0);
    }
}
.bounceOutDown {
    -webkit-animation-name: bounceOutDown;
    animation-name: bounceOutDown;
}



@include keyframes(bounceOutLeft) {
    20% {
        opacity: 1;
        @include translate3d(20px, 0, 0);
    }
    100% {
        opacity: 0;
        @include translate3d(-2000px, 0, 0);
    }
}
.bounceOutLeft {
    -webkit-animation-name: bounceOutLeft;
    animation-name: bounceOutLeft;
}



@include keyframes(bounceOutRight) {
    20% {
        opacity: 1;
        @include translate3d(-20px, 0, 0);
    }
    100% {
        opacity: 0;
        @include translate3d(2000px, 0, 0);
    }
}
.bounceOutRight {
    -webkit-animation-name: bounceOutRight;
    animation-name: bounceOutRight;
}



@include keyframes(bounceOutUp) {
    20% {
        @include translate3d(0, -10px, 0);
    }
    40%,
    45% {
        opacity: 1;
        @include translate3d(0, 20px, 0);
    }
    100% {
        opacity: 0;
        @include translate3d(0, -2000px, 0);
    }
}
.bounceOutUp {
    -webkit-animation-name: bounceOutUp;
    animation-name: bounceOutUp;
}