@charset "utf-8";

/*旋转*/

.rotate {
    animation: 10s infinite linear 1s rotate;
    -webkit-animation: 10s infinite linear 1s rotate;
}

@keyframes rotate {
    from {
        -webkit-transform: rotate(0deg)
    }
    to {
        -webkit-transform: rotate(360deg)
    }
}

@-webkit-keyframes rotate {
    from {
        -webkit-transform: rotate(0deg)
    }
    to {
        -webkit-transform: rotate(360deg)
    }
}

@-moz-keyframes rotate {
    from {
        -moz-transform: rotate(0deg)
    }
    to {
        -moz-transform: rotate(360deg)
    }
}

@-webkit-keyframes load {
    0%,
    80%,
    100% {
        box-shadow: 0 2.5em 0 -1.3em #ffffff;
    }
    40% {
        box-shadow: 0 2.5em 0 0 #FFF;
    }
}

@-webkit-keyframes moveIconUp {
    0% {
        -webkit-transform: translateY(100%);
        opacity: 0;
    }
    50% {
        -webkit-transform: translateY(0%);
        opacity: 1;
    }
    100% {
        -webkit-transform: translateY(-100%);
        opacity: 0;
    }
}

@keyframes moveIconUp {
    0% {
        -webkit-transform: translateY(100%);
        transform: translateY(100%);
        opacity: 0;
    }
    50% {
        -webkit-transform: translateY(0%);
        transform: translateY(0%);
        opacity: 1;
    }
    100% {
        -webkit-transform: translateY(-100%);
        transform: translateY(-100%);
        opacity: 0;
    }
}

@keyframes load {
    0%,
    80%,
    100% {
        box-shadow: 0 2.5em 0 -1.3em #ffffff;
    }
    40% {
        box-shadow: 0 2.5em 0 0 #FFF;
    }
}


/*等待加载动画样式*/

@-webkit-keyframes moveIconUp {
    0% {
        -webkit-transform: translateY(100%);
        opacity: 0;
    }
    50% {
        -webkit-transform: translateY(0%);
        opacity: 1;
    }
    100% {
        -webkit-transform: translateY(-100%);
        opacity: 0;
    }
}

@keyframes moveIconUp {
    0% {
        -webkit-transform: translateY(100%);
        transform: translateY(100%);
        opacity: 0;
    }
    50% {
        -webkit-transform: translateY(0%);
        transform: translateY(0%);
        opacity: 1;
    }
    100% {
        -webkit-transform: translateY(-100%);
        transform: translateY(-100%);
        opacity: 0;
    }
}


/*向上按钮动画样式*/

.a-zoomIn {
    -webkit-animation: zoomIn 1.2s linear 0s 1;
    animation: zoomIn 1.2s linear 0s 1;
    -webkit-animation-fill-mode: both;
}

.a-zoomIn-1 {
    -webkit-animation: zoomIn 1.2s linear 0s 1;
    animation: zoomIn 1.2s linear 0s 1;
    -webkit-animation-fill-mode: both;
}

.a-zoomIn-2 {
    -webkit-animation: zoomIn 1.4s linear 0s 1;
    animation: zoomIn 1.4s linear 0s 1;
    -webkit-animation-fill-mode: both;
}

.a-zoomIn-3 {
    -webkit-animation: zoomIn 1.6s linear 0s 1;
    animation: zoomIn 1.6s linear 0s 1;
    -webkit-animation-fill-mode: both;
}

.a-zoomIn-4 {
    -webkit-animation: zoomIn 1.8s linear 0s 1;
    animation: zoomIn 1.8s linear 0s 1;
    -webkit-animation-fill-mode: both;
}

.a-zoomIn-5 {
    -webkit-animation: zoomIn 2.0s linear 0s 1;
    animation: zoomIn 2.0s linear 0s 1;
    -webkit-animation-fill-mode: both;
}

.a-zoomIn-6 {
    -webkit-animation: zoomIn 2.2s linear 0s 1;
    animation: zoomIn 2.2s linear 0s 1;
    -webkit-animation-fill-mode: both;
}

.a-zoomIn-7 {
    -webkit-animation: zoomIn 2.4s linear 0s 1;
    animation: zoomIn 2.4s linear 0s 1;
    -webkit-animation-fill-mode: both;
}

.a-zoomIn-8 {
    -webkit-animation: zoomIn 2.6s linear 0s 1;
    animation: zoomIn 2.6s linear 0s 1;
    -webkit-animation-fill-mode: both;
}

.a-zoomIn-9 {
    -webkit-animation: zoomIn 2.8s linear 0s 1;
    animation: zoomIn 2.8s linear 0s 1;
    -webkit-animation-fill-mode: both;
}

.a-zoomIn-10 {
    -webkit-animation: zoomIn 3.0s linear 0s 1;
    animation: zoomIn 3.0s linear 0s 1;
    -webkit-animation-fill-mode: both;
}

@keyframes zoomIn {
    0% {
        opacity: 0;
        -webkit-transform: scale3d(0, 0, 0);
        transform: scale3d(0, 0, 0);
    }
    50% {
        -webkit-transform: scale3d(.3, .3, .3);
        transform: scale3d(.3, .3, .3) opacity: 0.7
    }
    100% {
        -webkit-transform: scale3d(1, 1, 1);
        transform: scale3d(1, 1, 1) opacity: 1
    }
}

@-webkit-keyframes zoomIn {
    0% {
        opacity: 0;
        -webkit-transform: scale3d(0, 0, 0);
        transform: scale3d(0, 0, 0);
    }
    50% {
        -webkit-transform: scale3d(.3, .3, .3);
        transform: scale3d(.3, .3, .3) opacity: 0.7
    }
    100% {
        -webkit-transform: scale3d(1, 1, 1);
        transform: scale3d(1, 1, 1) opacity: 1
    }
}


/*弹出渐现动画样式*/

.a-enterUpBounce {
    -webkit-animation: enterUpBounce 0.9s linear 1.0s 1;
    animation: enterUpBounce 0.9s linear 1.0s 1;
    -webkit-animation-fill-mode: both;
}

@-webkit-keyframes enterUpBounce {
    0% {
        -webkit-transform: translateY(-120px);
        opacity: 0
    }
    50% {
        -webkit-transform: translateY(300px)
    }
    70% {
        -webkit-transform: translateY(-50px)
    }
    100% {
        -webkit-transform: translateY(0);
        opacity: 1
    }
}

@keyframes enterUpBounce {
    0% {
        -webkit-transform: translateY(-120px);
        opacity: 0
    }
    50% {
        -webkit-transform: translateY(300px)
    }
    70% {
        -webkit-transform: translateY(-50px)
    }
    100% {
        -webkit-transform: translateY(0);
        opacity: 1
    }
}


/*向上反弹动画样式*/

.a-bounceInUp {
    -webkit-animation: bounceInUp 0.4s linear 0.5s 1;
    animation: bounceInUp 0.4s linear 0.5s 1;
    opacity: 0;
    -webkit-animation-fill-mode: forwards;
}

@-webkit-keyframes bounceInUp {
    0% {
        opacity: 0;
        -webkit-transform: translate(-50%, 250%);
        transform: translate(-50%, 250%);
    }
    60% {
        -webkit-transform: translate(-50%-80%);
        transform: translate(-50%-80%);
    }
    80% {
        -webkit-transform: translate(-50%, -60%);
        transform: translate(-50%, -60%);
    }
    100% {
        opacity: 1;
        -webkit-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%);
    }
}

@keyframes bounceInUp {
    0% {
        opacity: 0;
        -webkit-transform: translate(-50%, 250%);
        transform: translate(-50%, 250%);
    }
    60% {
        -webkit-transform: translate(-50%-80%);
        transform: translate(-50%-80%);
    }
    80% {
        -webkit-transform: translate(-50%, -60%);
        transform: translate(-50%, -60%);
    }
    100% {
        opacity: 1;
        -webkit-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%);
    }
}


/*向上回弹动画样式*/

.a-rotating {
    -webkit-animation: rotating 1.2s linear infinite;
    -moz-animation: rotating 1.2s linear infinite;
    -o-animation: rotating 1.2s linear infinite;
    animation: rotating 1.2s linear infinite;
}

@-webkit-keyframes rotating {
    from {
        -webkit-transform: rotate(0deg)
    }
    to {
        -webkit-transform: rotate(360deg)
    }
}

@keyframes rotating {
    from {
        transform: rotate(0deg)
    }
    to {
        transform: rotate(360deg)
    }
}

@-moz-keyframes rotating {
    from {
        -moz-transform: rotate(0deg)
    }
    to {
        -moz-transform: rotate(360deg)
    }
}


/*音乐按钮转圈*/

@-webkit-keyframes fadeInLeft {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(-100%, 0, 0);
        transform: translate3d(-100%, 0, 0)
    }
    100% {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

@keyframes fadeInLeft {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(-100%, 0, 0);
        transform: translate3d(-100%, 0, 0)
    }
    100% {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

.fadeInLeft-1 {
    -webkit-animation: fadeInLeft 1.5s ease 0s both;
}


/*由左至右*/

@-webkit-keyframes fadeInRight {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(100%, 0, 0);
        transform: translate3d(100%, 0, 0)
    }
    100% {
        opacity: 1;
        transform: none
    }
}

@keyframes fadeInRight {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(100%, 0, 0);
        transform: translate3d(100%, 0, 0)
    }
    100% {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

.fadeInRight-1 {
    -webkit-animation: fadeInRight 1.5s ease 0s both;
}

.fadeInRight-2 {
    -webkit-animation: fadeInRight 1.8s ease 0s both;
}


/*由右至左*/
.b-fadeIn-1 {
    -webkit-animation: fadeIn 0.2s linear 0.6s 1;
    opacity: 0;
    -webkit-animation-fill-mode: forwards;
}
.b-fadeIn-2 {
    -webkit-animation: fadeIn 0.2s linear 0.8s 1;
    opacity: 0;
    -webkit-animation-fill-mode: forwards;
}
.b-fadeIn-3 {
    -webkit-animation: fadeIn 0.2s linear 1s 1;
    opacity: 0;
    -webkit-animation-fill-mode: forwards;
}
.b-fadeIn-4 {
    -webkit-animation: fadeIn 0.2s linear 1.2s 1;
    opacity: 0;
    -webkit-animation-fill-mode: forwards;
}
.b-fadeIn-5 {
    -webkit-animation: fadeIn 0.2s linear 1.4s 1;
    opacity: 0;
    -webkit-animation-fill-mode: forwards;
}
.b-fadeIn-6 {
    -webkit-animation: fadeIn 0.2s linear 1.6s 1;
    opacity: 0;
    -webkit-animation-fill-mode: forwards;
}
.b-fadeIn-7 {
    -webkit-animation: fadeIn 0.2s linear 1.8s 1;
    opacity: 0;
    -webkit-animation-fill-mode: forwards;
}
.b-fadeIn-8 {
    -webkit-animation: fadeIn 0.2s linear 2s 1;
    opacity: 0;
    -webkit-animation-fill-mode: forwards;
}
.b-fadeIn-9 {
    -webkit-animation: fadeIn 0.2s linear 2.2s 1;
    opacity: 0;
    -webkit-animation-fill-mode: forwards;
}
.b-fadeIn-10 {
    -webkit-animation: fadeIn 0.2s linear 2.4s 1;
    opacity: 0;
    -webkit-animation-fill-mode: forwards;
}
.b-fadeIn-11 {
    -webkit-animation: fadeIn 0.2s linear 2.6s 1;
    opacity: 0;
    -webkit-animation-fill-mode: forwards;
}

.a-fadeIn-1 {
    -webkit-animation: fadeIn 0.4s linear 0.2s 1;
    animation: fadeIn 0.4s linear 0.2s 1;
    opacity: 0;
    -webkit-animation-fill-mode: forwards;
}

.a-fadeIn-2 {
    -webkit-animation: fadeIn 0.4s linear 0.8s 1;
    animation: fadeIn 0.4s linear 0.8s 1;
    opacity: 0;
    -webkit-animation-fill-mode: forwards;
}

.a-fadeIn-3 {
    -webkit-animation: fadeIn 0.4s linear 1.2s 1;
    animation: fadeIn 0.4s linear 1.2s 1;
    opacity: 0;
    -webkit-animation-fill-mode: forwards;
}

.a-fadeIn-4 {
    -webkit-animation: fadeIn 0.4s linear 1.4s 1;
    animation: fadeIn 0.4s linear 1.4s 1;
    opacity: 0;
    -webkit-animation-fill-mode: forwards;
}

.a-fadeIn-5 {
    -webkit-animation: fadeIn 0.4s linear 1.8s 1;
    animation: fadeIn 0.4s linear 1.8s 1;
    opacity: 0;
    -webkit-animation-fill-mode: forwards;
}

.a-fadeIn-6 {
    -webkit-animation: fadeIn 0.4s linear 2.2s 1;
    animation: fadeIn 0.4s linear 2.2s 1;
    opacity: 0;
    -webkit-animation-fill-mode: forwards;
}

.a-fadeIn-7 {
    -webkit-animation: fadeIn 0.4s linear 2.6s 1;
    animation: fadeIn 0.4s linear 2.6s 1;
    opacity: 0;
    -webkit-animation-fill-mode: forwards;
}

.a-fadeIn-8 {
    -webkit-animation: fadeIn 0.4s linear 3s 1;
    animation: fadeIn 0.4s linear 3s 1;
    opacity: 0;
    -webkit-animation-fill-mode: forwards;
}

.a-fadeIn-9 {
    -webkit-animation: fadeIn 0.4s linear 3.4s 1;
    animation: fadeIn 0.4s linear 3.4s 1;
    opacity: 0;
    -webkit-animation-fill-mode: forwards;
}

.a-fadeIn-10 {
    -webkit-animation: fadeIn 0.4s linear 3.8s 1;
    animation: fadeIn 0.4s linear 3.8s 1;
    opacity: 0;
    -webkit-animation-fill-mode: forwards;
}

.a-fadeIn-11 {
    -webkit-animation: fadeIn 0.4s linear 4.2s 1;
    animation: fadeIn 0.4s linear 4.2s 1;
    opacity: 0;
    -webkit-animation-fill-mode: forwards;
}

.a-fadeIn-12 {
    -webkit-animation: fadeIn 0.4s linear 4.6s 1;
    animation: fadeIn 0.4s linear 4.6s 1;
    opacity: 0;
    -webkit-animation-fill-mode: forwards;
}

.a-fadeIn-13 {
    -webkit-animation: fadeIn 0.4s linear 5s 1;
    animation: fadeIn 0.4s linear 5s 1;
    opacity: 0;
    -webkit-animation-fill-mode: forwards;
}


.fadeIn-1 {
    -webkit-animation: fadeIn 1s linear 2s 1;
    animation: fadeIn 1s linear 2s 1;
    opacity: 0;
    -webkit-animation-fill-mode: forwards;
}

.fadeIn-2 {
    -webkit-animation: fadeIn 1s linear 4s 1;
    animation: fadeIn 1s linear 4s 1;
    opacity: 0;
    -webkit-animation-fill-mode: forwards;
}

.fadeIn-3 {
    -webkit-animation: fadeIn 1s linear 6s 1;
    animation: fadeIn 1s linear 6s 1;
    opacity: 0;
    -webkit-animation-fill-mode: forwards;
}

.fadeInDown-1 {
    -webkit-animation: fadeInDown 1s ease 1s both;
}

.fadeInDown-2 {
    -webkit-animation: fadeInDown 1s ease 3s both;
}

.fadeInDown-3 {
    -webkit-animation: fadeInDown 1s ease 5s both;
}


@-webkit-keyframes fadeIn {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}

@keyframes fadeIn {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}


/*渐现动画样式*/

.a-bounceIn-1 {
    -webkit-animation: bounceIn 1s ease 1.5s infinite both;
}

@-webkit-keyframes bounceIn {
    0%,
    20%,
    40%,
    60%,
    80%,
    100% {
        -webkit-transition-timing-function: cubic-bezier(0.215, .610, .355, 1.000);
        transition-timing-function: cubic-bezier(0.215, .610, .355, 1.000)
    }
    0% {
        opacity: 0;
        -webkit-transform: scale3d(.3, .3, .3);
        transform: scale3d(.3, .3, .3)
    }
    20% {
        -webkit-transform: scale3d(1.1, 1.1, 1.1);
        transform: scale3d(1.1, 1.1, 1.1)
    }
    40% {
        -webkit-transform: scale3d(.9, .9, .9);
        transform: scale3d(.9, .9, .9)
    }
    60% {
        opacity: 1;
        -webkit-transform: scale3d(1.03, 1.03, 1.03);
        transform: scale3d(1.03, 1.03, 1.03)
    }
    80% {
        -webkit-transform: scale3d(.97, .97, .97);
        transform: scale3d(.97, .97, .97)
    }
    100% {
        opacity: 1;
        -webkit-transform: scale3d(1, 1, 1);
        transform: scale3d(1, 1, 1)
    }
}

@keyframes bounceIn {
    0%,
    20%,
    40%,
    60%,
    80%,
    100% {
        -webkit-transition-timing-function: cubic-bezier(0.215, .610, .355, 1.000);
        transition-timing-function: cubic-bezier(0.215, .610, .355, 1.000)
    }
    0% {
        opacity: 0;
        -webkit-transform: scale3d(.3, .3, .3);
        transform: scale3d(.3, .3, .3)
    }
    20% {
        -webkit-transform: scale3d(1.1, 1.1, 1.1);
        transform: scale3d(1.1, 1.1, 1.1)
    }
    40% {
        -webkit-transform: scale3d(.9, .9, .9);
        transform: scale3d(.9, .9, .9)
    }
    60% {
        opacity: 1;
        -webkit-transform: scale3d(1.03, 1.03, 1.03);
        transform: scale3d(1.03, 1.03, 1.03)
    }
    80% {
        -webkit-transform: scale3d(.97, .97, .97);
        transform: scale3d(.97, .97, .97)
    }
    100% {
        opacity: 1;
        -webkit-transform: scale3d(1, 1, 1);
        transform: scale3d(1, 1, 1)
    }
}


/*缓慢变大正常*/

.a-bounceInDown-1 {
    -webkit-animation: bounceInDown 1s ease 0s 1 both;
}

.a-bounceInDown-2 {
    -webkit-animation: bounceInDown 1s ease 0.2s 1 both;
}

.a-bounceInDown-3 {
    -webkit-animation: bounceInDown 1s ease 1.6s 1 both;
}

.a-bounceInDown-4 {
    -webkit-animation: bounceInDown 1s ease 1.8s 1 both;
}

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

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


/*由下掉落*/

.a-wobble-1 {
    -webkit-animation-name: wobble;
    -webkit-animation-duration: 5s;
    -webkit-animation-timing-function: linear;
    -webkit-animation-delay: 0;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-direction: ;
    -moz-animation-name: wobble;
    -moz-animation-duration: 5s;
    -moz-animation-timing-function: linear;
    -moz-animation-delay: 0;
    -moz-animation-iteration-count: infinite;
    -moz-animation-direction: ;
}

@-webkit-keyframes wobble {
    0% {
        -webkit-transform: rotateX(0deg) rotateX(0deg) rotateZ(0deg) translateZ(0px);
    }
    25% {
        -webkit-transform: rotateX(0deg) rotateX(0deg) rotateZ(0deg) translateZ(90px);
    }
    50% {
        -webkit-transform: rotateX(0deg) rotateX(0deg) rotateZ(0deg) translateZ(160px);
    }
    75% {
        -webkit-transform: rotateX(0deg) rotateX(0deg) rotateZ(0deg) translateZ(90px);
    }
    100% {
        -webkit-transform: rotateX(0deg) rotateX(0deg) rotateZ(0deg) translateZ(0px);
    }
}

@-moz-keyframes wobble {
    0% {
        -webkit-transform: rotateX(0deg) rotateX(0deg) rotateZ(0deg) translateZ(0px);
    }
    25% {
        -webkit-transform: rotateX(0deg) rotateX(0deg) rotateZ(0deg) translateZ(90px);
    }
    50% {
        -webkit-transform: rotateX(0deg) rotateX(0deg) rotateZ(0deg) translateZ(160px);
    }
    75% {
        -webkit-transform: rotateX(0deg) rotateX(0deg) rotateZ(0deg) translateZ(90px);
    }
    100% {
        -webkit-transform: rotateX(0deg) rotateX(0deg) rotateZ(0deg) translateZ(0px);
    }
}


/*Y轴旋转*/

.a-rubberBand-1 {
    -webkit-transform: none;
    -webkit-animation: rubberBand 1s ease 0s both;
}

@-webkit-keyframes rubberBand {
    0% {
        -webkit-transform: scale3d(1, 1, 1);
        transform: scale3d(1, 1, 1)
    }
    30% {
        -webkit-transform: scale3d(1.25, .75, 1);
        transform: scale3d(1.25, .75, 1)
    }
    40% {
        -webkit-transform: scale3d(.75, 1.25, 1);
        transform: scale3d(.75, 1.25, 1)
    }
    50% {
        -webkit-transform: scale3d(1.15, .85, 1);
        transform: scale3d(1.15, .85, 1)
    }
    65% {
        -webkit-transform: scale3d(.95, 1.05, 1);
        transform: scale3d(.95, 1.05, 1)
    }
    75% {
        -webkit-transform: scale3d(1.05, .95, 1);
        transform: scale3d(1.05, .95, 1)
    }
    100% {
        -webkit-transform: scale3d(1, 1, 1);
        transform: scale3d(1, 1, 1)
    }
}

@keyframes rubberBand {
    0% {
        -webkit-transform: scale3d(1, 1, 1);
        transform: scale3d(1, 1, 1)
    }
    30% {
        -webkit-transform: scale3d(1.25, .75, 1);
        transform: scale3d(1.25, .75, 1)
    }
    40% {
        -webkit-transform: scale3d(.75, 1.25, 1);
        transform: scale3d(.75, 1.25, 1)
    }
    50% {
        -webkit-transform: scale3d(1.15, .85, 1);
        transform: scale3d(1.15, .85, 1)
    }
    65% {
        -webkit-transform: scale3d(.95, 1.05, 1);
        transform: scale3d(.95, 1.05, 1)
    }
    75% {
        -webkit-transform: scale3d(1.05, .95, 1);
        transform: scale3d(1.05, .95, 1)
    }
    100% {
        -webkit-transform: scale3d(1, 1, 1);
        transform: scale3d(1, 1, 1)
    }
}


/*扩大挤压动作*/

.a-rotate-1 {
    -webkit-animation: rotating 1.2s linear infinite;
    -moz-animation: rotating 1.2s linear infinite;
    -o-animation: rotating 1.2s linear infinite;
    animation: rotating 1.2s linear infinite
}

@-webkit-keyframes rotating {
    from {
        -webkit-transform: rotate(0deg)
    }
    to {
        -webkit-transform: rotate(360deg)
    }
}

@keyframes rotating {
    from {
        transform: rotate(0deg)
    }
    to {
        transform: rotate(360deg)
    }
}

@-moz-keyframes rotating {
    from {
        -moz-transform: rotate(0deg)
    }
    to {
        -moz-transform: rotate(360deg)
    }
}


/*X轴旋转*/

@-webkit-keyframes fadeInUp {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0, 100%, 0);
        transform: translate3d(0, 100%, 0)
    }
    100% {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

@keyframes fadeInUp {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0, 100%, 0);
        -ms-transform: translate3d(0, 100%, 0);
        transform: translate3d(0, 100%, 0)
    }
    100% {
        opacity: 1;
        -webkit-transform: none;
        -ms-transform: none;
        transform: none
    }
}

.fadeInUp-1 {
    -webkit-animation: fadeInUp 1.5s ease 0s both;
}

.fadeInUp-2 {
    -webkit-animation: fadeInUp 1s ease 2s both;
}

.fadeInUp-11 {
    -webkit-animation: fadeInUp 1.5s ease 4s both;
}

.fadeInUp-12 {
    -webkit-animation: fadeInUp 1.5s ease 4.4s both;
}


/*由下至上*/

@-webkit-keyframes fadeInDown {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0, -100%, 0);
        transform: translate3d(0, -100%, 0)
    }
    100% {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

@keyframes fadeInDown {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0, -100%, 0);
        -ms-transform: translate3d(0, -100%, 0);
        transform: translate3d(0, -100%, 0)
    }
    100% {
        opacity: 1;
        -webkit-transform: none;
        -ms-transform: none;
        transform: none
    }
}


/*由上至下*/

@-webkit-keyframes bounceInUp {
    0%,
    60%,
    75%,
    90%,
    100% {
        -webkit-transition-timing-function: cubic-bezier(0.215, .610, .355, 1.000);
        transition-timing-function: cubic-bezier(0.215, .610, .355, 1.000)
    }
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0, 3000px, 0);
        transform: translate3d(0, 3000px, 0)
    }
    60% {
        opacity: 1;
        -webkit-transform: translate3d(0, -25px, 0);
        transform: translate3d(0, -25px, 0)
    }
    75% {
        -webkit-transform: translate3d(0, 10px, 0);
        transform: translate3d(0, 10px, 0)
    }
    90% {
        -webkit-transform: translate3d(0, -5px, 0);
        transform: translate3d(0, -5px, 0)
    }
    100% {
        -webkit-transform: none;
        transform: none
    }
}

@keyframes bounceInUp {
    0%,
    60%,
    75%,
    90%,
    100% {
        -webkit-transition-timing-function: cubic-bezier(0.215, .610, .355, 1.000);
        transition-timing-function: cubic-bezier(0.215, .610, .355, 1.000)
    }
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0, 3000px, 0);
        transform: translate3d(0, 3000px, 0)
    }
    60% {
        opacity: 1;
        -webkit-transform: translate3d(0, -25px, 0);
        transform: translate3d(0, -25px, 0)
    }
    75% {
        -webkit-transform: translate3d(0, 10px, 0);
        transform: translate3d(0, 10px, 0)
    }
    90% {
        -webkit-transform: translate3d(0, -5px, 0);
        transform: translate3d(0, -5px, 0)
    }
    100% {
        -webkit-transform: none;
        transform: none
    }
}

.a-bounceInUp-3 {
    -webkit-animation: bounceInUp 1s ease 1.6s 1 both;
}


/*由下至上*/

.a-scalebig-1 {
    -webkit-animation: scalebig 2s ease 1.5s infinite;
    animation: scalebig 2s ease 1.5s infinite;
    opacity: 0;
}

.a-scalebig-2 {
    -webkit-animation: scalebig 1s ease 3s infinite;
    animation: scalebig 1s ease 3s infinite;
    opacity: 0;
}

.a-scalebig-3 {
    -webkit-animation: scalebig 1s ease 2s infinite;
    animation: scalebig 1s ease 2s infinite;
    opacity: 0;
}

@-webkit-keyframes scalebig {
    0% {
        opacity: 0.1;
    }
    100% {
        opacity: 1;
        -webkit-transform: scale(1);
    }
}


/* 闪烁 */

@-webkit-keyframes bouncedelay {
    0%,
    80%,
    100% {
        -webkit-transform: scale(0.0)
    }
    40% {
        -webkit-transform: scale(1.0)
    }
}

@keyframes bouncedelay {
    0%,
    80%,
    100% {
        transform: scale(0.0);
        -webkit-transform: scale(0.0);
    }
    40% {
        transform: scale(1.0);
        -webkit-transform: scale(1.0);
    }
}


/*加载loading*/

.a-flutter-1 {
    -webkit-animation: flutter 2s linear infinite backwards;
    animation: flutter 2s linear infinite backwards;
}

@keyframes flutter {
    0% {
        margin-top: 0px
    }
    50% {
        margin-top: -10px
    }
    100% {
        margin-top: 0px
    }
}

@-webkit-keyframes flutter {
    0% {
        margin-top: 0px
    }
    50% {
        margin-top: -10px
    }
    100% {
        margin-top: 0px
    }
}


/*上下浮动*/

.tinRightIn-1 {
    opacity: 0;
    -webkit-animation: tinRightIn 1s linear 1.6s 1;
    animation: tinRightIn 1s linear 1.6s 1;
    -webkit-animation-fill-mode: forwards;
}

.tinRightIn-2 {
    opacity: 0;
    -webkit-animation: tinRightIn 1s linear 2.8s 1;
    animation: tinRightIn 1s linear 2.8s 1;
    -webkit-animation-fill-mode: forwards;
}

.tinLeftIn-1 {
    opacity: 0;
    -webkit-animation: tinLeftIn 1s linear 1s 1;
    animation: tinLeftIn 1s linear 1s 1;
    -webkit-animation-fill-mode: forwards;
}

.tinLeftIn-2 {
    opacity: 0;
    -webkit-animation: tinLeftIn 1s linear 2.2s 1;
    animation: tinLeftIn 1s linear 2.2s 1;
    -webkit-animation-fill-mode: forwards;
}



@keyframes load{
    20%{-webkit-transform:rotate(5deg);-moz-transform:rotate(5deg);-ms-transform: rotate(5deg);-o-transform: rotate(5deg);transform: rotate(5deg);}
   30%{-webkit-transform:rotate(0deg);-moz-transform:rotate(0deg);-ms-transform: rotate(0deg);-o-transform: rotate(0deg);transform: rotate(0deg);}
   100%{-webkit-transform: rotate(0.1deg);-moz-transform:rotate(0.1deg);-ms-transform: rotate(0.1deg);-o-transform: rotate(0.1deg);transform: rotate(0.1deg);}
}
@-webkit-keyframes load{
    20%{-webkit-transform:rotate(5deg);-moz-transform:rotate(5deg);-ms-transform: rotate(5deg);-o-transform: rotate(5deg);transform: rotate(5deg);}
   30%{-webkit-transform:rotate(0deg);-moz-transform:rotate(0deg);-ms-transform: rotate(0deg);-o-transform: rotate(0deg);transform: rotate(0deg);}
   100%{-webkit-transform: rotate(0.1deg);-moz-transform:rotate(0.1deg);-ms-transform: rotate(0.1deg);-o-transform: rotate(0.1deg);transform: rotate(0.1deg);}
 }
 .taitao{
    -webkit-animation:load 2s linear 2s infinite;   
    animation: load 2s linear 2s infinite;
 }