/* 动画开始 */
@-webkit-keyframes bounce {
    0%,100%,20%,53%,80% {
        -webkit-transition-timing-function:cubic-bezier(0.215,.61,.355,1);
        transition-timing-function:cubic-bezier(0.215,.61,.355,1);
        -webkit-transform:translate3d(0,0,0);
        transform:translate3d(0,0,0)
    }
    40%,43% {
        -webkit-transition-timing-function:cubic-bezier(0.755,.050,.855,.060);
        transition-timing-function:cubic-bezier(0.755,.050,.855,.060);
        -webkit-transform:translate3d(0,-30px,0);
        transform:translate3d(0,-30px,0)
    }
    70% {
        -webkit-transition-timing-function:cubic-bezier(0.755,.050,.855,.060);
        transition-timing-function:cubic-bezier(0.755,.050,.855,.060);
        -webkit-transform:translate3d(0,-15px,0);
        transform:translate3d(0,-15px,0)
    }
    90% {
        -webkit-transform:translate3d(0,-4px,0);
        transform:translate3d(0,-4px,0)
    }
}
@-moz-keyframes bounce {
    0%,100%,20%,53%,80% {
        -webkit-transition-timing-function:cubic-bezier(0.215,.61,.355,1);
        transition-timing-function:cubic-bezier(0.215,.61,.355,1);
        -webkit-transform:translate3d(0,0,0);
        transform:translate3d(0,0,0)
    }
    40%,43% {
        -webkit-transition-timing-function:cubic-bezier(0.755,.050,.855,.060);
        transition-timing-function:cubic-bezier(0.755,.050,.855,.060);
        -webkit-transform:translate3d(0,-30px,0);
        transform:translate3d(0,-30px,0)
    }
    70% {
        -webkit-transition-timing-function:cubic-bezier(0.755,.050,.855,.060);
        transition-timing-function:cubic-bezier(0.755,.050,.855,.060);
        -webkit-transform:translate3d(0,-15px,0);
        transform:translate3d(0,-15px,0)
    }
    90% {
        -webkit-transform:translate3d(0,-4px,0);
        transform:translate3d(0,-4px,0)
    }
}
@-ms-keyframes bounce {
    0%,100%,20%,53%,80% {
        -webkit-transition-timing-function:cubic-bezier(0.215,.61,.355,1);
        transition-timing-function:cubic-bezier(0.215,.61,.355,1);
        -webkit-transform:translate3d(0,0,0);
        transform:translate3d(0,0,0)
    }
    40%,43% {
        -webkit-transition-timing-function:cubic-bezier(0.755,.050,.855,.060);
        transition-timing-function:cubic-bezier(0.755,.050,.855,.060);
        -webkit-transform:translate3d(0,-30px,0);
        transform:translate3d(0,-30px,0)
    }
    70% {
        -webkit-transition-timing-function:cubic-bezier(0.755,.050,.855,.060);
        transition-timing-function:cubic-bezier(0.755,.050,.855,.060);
        -webkit-transform:translate3d(0,-15px,0);
        transform:translate3d(0,-15px,0)
    }
    90% {
        -webkit-transform:translate3d(0,-4px,0);
        transform:translate3d(0,-4px,0)
    }
}
@keyframes bounce {
    0%,100%,20%,53%,80% {
        -webkit-transition-timing-function:cubic-bezier(0.215,.61,.355,1);
        transition-timing-function:cubic-bezier(0.215,.61,.355,1);
        -webkit-transform:translate3d(0,0,0);
        -ms-transform:translate3d(0,0,0);
        transform:translate3d(0,0,0);
    }
    40%,43% {
        -webkit-transition-timing-function:cubic-bezier(0.755,.050,.855,.060);
        transition-timing-function:cubic-bezier(0.755,.050,.855,.060);
        -webkit-transform:translate3d(0,-30px,0);
        -ms-transform:translate3d(0,-30px,0);
        transform:translate3d(0,-30px,0);
    }
    70% {
        -webkit-transition-timing-function:cubic-bezier(0.755,.050,.855,.060);
        transition-timing-function:cubic-bezier(0.755,.050,.855,.060);
        -webkit-transform:translate3d(0,-15px,0);
        -ms-transform:translate3d(0,-15px,0);
        transform:translate3d(0,-15px,0);
    }
    90% {
        -webkit-transform:translate3d(0,-4px,0);
        -ms-transform:translate3d(0,-4px,0);
        transform:translate3d(0,-4px,0);
    }
}
.bounce {
    -webkit-transform-origin:center bottom;
    -ms-transform-origin:center bottom;
    transform-origin:center bottom;
    animation:bounce 1s ease-in-out 0s;
    -moz-animation:bounce 1s ease-in-out 0s;
    -o-animation:bounce 1s ease-in-out 0s;
    -webkit-animation:bounce 1s ease-in-out 0s;
    -ms-animation:bounce 1s ease-in-out 0s;
    z-index:6;
}

.bounce1 {
    -webkit-transform-origin:center bottom;
    -ms-transform-origin:center bottom;
    transform-origin:center bottom;
    animation:bounce 1s ease-in-out 0s;
    -moz-animation:bounce 1s ease-in-out 0s;
    -o-animation:bounce 1s ease-in-out 0s;
    -webkit-animation:bounce 1s ease-in-out 0s;
    -ms-animation:bounce 1s ease-in-out 0s;
    z-index:6;
    animation-iteration-count:2;
}


@-webkit-keyframes lightSpeedIn {
    0% {
        -webkit-transform:translate3d(100%,0,0) skewX(-30deg);
        transform:translate3d(100%,0,0) skewX(-30deg);
        opacity:0
    }
    60% {
        -webkit-transform:skewX(20deg);
        transform:skewX(20deg);
        opacity:1
    }
    80% {
        -webkit-transform:skewX(-5deg);
        transform:skewX(-5deg);
        opacity:1
    }
    100% {
        -webkit-transform:none;
        transform:none;
        opacity:1
    }
}
@-moz-keyframes lightSpeedIn {
    0% {
        -webkit-transform:translate3d(100%,0,0) skewX(-30deg);
        transform:translate3d(100%,0,0) skewX(-30deg);
        opacity:0
    }
    60% {
        -webkit-transform:skewX(20deg);
        transform:skewX(20deg);
        opacity:1
    }
    80% {
        -webkit-transform:skewX(-5deg);
        transform:skewX(-5deg);
        opacity:1
    }
    100% {
        -webkit-transform:none;
        transform:none;
        opacity:1
    }
}
@-ms-keyframes lightSpeedIn {
    0% {
        -webkit-transform:translate3d(100%,0,0) skewX(-30deg);
        transform:translate3d(100%,0,0) skewX(-30deg);
        opacity:0
    }
    60% {
        -webkit-transform:skewX(20deg);
        transform:skewX(20deg);
        opacity:1
    }
    80% {
        -webkit-transform:skewX(-5deg);
        transform:skewX(-5deg);
        opacity:1
    }
    100% {
        -webkit-transform:none;
        transform:none;
        opacity:1
    }
}
@keyframes lightSpeedIn {
    0% {
        -webkit-transform:translate3d(100%,0,0) skewX(-30deg);
        -ms-transform:translate3d(100%,0,0) skewX(-30deg);
        transform:translate3d(100%,0,0) skewX(-30deg);
        opacity:0
    }
    60% {
        -webkit-transform:skewX(20deg);
        -ms-transform:skewX(20deg);
        transform:skewX(20deg);
        opacity:1
    }
    80% {
        -webkit-transform:skewX(-5deg);
        -ms-transform:skewX(-5deg);
        transform:skewX(-5deg);
        opacity:1
    }
    100% {
        -webkit-transform:none;
        -ms-transform:none;
        transform:none;
        opacity:1
    }
}
.lightSpeedIn{
    animation:lightSpeedIn 1s ease-out 3.5s;
    -moz-animation:lightSpeedIn 1s ease-out 3.5s;
    -o-animation:lightSpeedIn 1s ease-out 3.5s;
    -webkit-animation:lightSpeedIn 1s ease-out 3.5s;
    -ms-animation:lightSpeedIn 1s ease-out 3.5s;
}

@-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
    }
}
@-moz-keyframes fadeInDown {
    0% {
        opacity:0;
        -webkit-transform:translate3d(0,-100%,0);
        transform:translate3d(0,-100%,0)
    }
    100% {
        opacity:1;
        -webkit-transform:none;
        transform:none
    }
}
@-ms-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
    }
}
.active .fadeInDown {
    animation:fadeInDown 2s ease-in-out 1.5s forwards;
    -moz-animation:fadeInDown 2s ease-in-out 1.5s forwards;
    -o-animation:fadeInDown 2s ease-in-out 1.5s forwards;
    -webkit-animation:fadeInDown 2s ease-in-out 1.5s forwards;
    -ms-animation:fadeInDown 2s ease-in-out 1.5s forwards;
}

@-webkit-keyframes zoomIn {
    0% {
        opacity:0;
        -webkit-transform:scale3d(.3,.3,.3);
        transform:scale3d(.3,.3,.3)
    }
    50% {
        opacity:1
    }
}
@-moz-keyframes zoomIn {
    0% {
        opacity:0;
        -webkit-transform:scale3d(.3,.3,.3);
        transform:scale3d(.3,.3,.3)
    }
    50% {
        opacity:1
    }
}
@-ms-keyframes zoomIn {
    0% {
        opacity:0;
        -webkit-transform:scale3d(.3,.3,.3);
        transform:scale3d(.3,.3,.3)
    }
    50% {
        opacity:1
    }
}
@keyframes zoomIn {
    0% {
        opacity:0;
        -webkit-transform:scale3d(.3,.3,.3);
        -ms-transform:scale3d(.3,.3,.3);
        transform:scale3d(.3,.3,.3)
    }
    50% {
        opacity:1
    }
}
.zoomIn {
    animation:zoomIn 1s ease-in-out 0s;
    -moz-animation:zoomIn 1s ease-in-out 0s;
    -o-animation:zoomIn 1s ease-in-out 0s;
    -webkit-animation:zoomIn 1s ease-in-out 0s;
    -ms-animation:zoomIn 1s ease-in-out 0s;
}
@-webkit-keyframes fadeIn{
    0% {
        opacity:0
    }
    25% {
        opacity:0.1
    }
    50% {
        opacity:0.3
    }
    75% {
        opacity:0.6
    }
    100% {
        opacity:1
    }
}
@-moz-keyframes fadeIn{
    0% {
        opacity:0
    }
    25% {
        opacity:0.1
    }
    50% {
        opacity:0.3
    }
    75% {
        opacity:0.6
    }
    100% {
        opacity:1
    }
}
@-ms-keyframes fadeIn{
    0% {
        opacity:0
    }
    25% {
        opacity:0.1
    }
    50% {
        opacity:0.3
    }
    75% {
        opacity:0.6
    }
    100% {
        opacity:1
    }
}
@keyframes fadeIn {
    0% {
        opacity:0
    }
    25% {
        opacity:0.1
    }
    50% {
        opacity:0.3
    }
    75% {
        opacity:0.6
    }
    100% {
        opacity:1
    }
}
.active .fadeIn {
     animation:fadeIn 1s ease-in-out 1.5s forwards;
     -moz-animation:fadeIn 1s ease-in-out 1.5s forwards;
     -o-animation:fadeIn 1s ease-in-out 1.5s forwards;
     -webkit-animation:fadeIn 1s ease-in-out 1.5s forwards;
     -ms-animation:fadeIn 1s ease-in-out 1.5s forwards;
 }
.active .fadeIn2 {
    animation:fadeIn 1s ease-in-out 2.5s forwards;
    -moz-animation:fadeIn 1s ease-in-out 2.5s forwards;
    -o-animation:fadeIn 1s ease-in-out 2.5s forwards;
    -webkit-animation:fadeIn 1s ease-in-out 2.5s forwards;
    -ms-animation:fadeIn 1s ease-in-out 2.5s forwards;
}
.active .fadeIn3 {
    animation:fadeIn 1s ease-in-out 3.5s forwards;
    -moz-animation:fadeIn 1s ease-in-out 3.5s forwards;
    -o-animation:fadeIn 1s ease-in-out 3.5s forwards;
    -webkit-animation:fadeIn 1s ease-in-out 3.5s forwards;
    -ms-animation:fadeIn 1s ease-in-out 3.5s forwards;
}
.active .fadeIn4 {
    animation:fadeIn 1s ease-in-out 4.5s forwards;
    -moz-animation:fadeIn 1s ease-in-out 4.5s forwards;
    -o-animation:fadeIn 1s ease-in-out 4.5s forwards;
    -webkit-animation:fadeIn 1s ease-in-out 4.5s forwards;
    -ms-animation:fadeIn 1s ease-in-out 4.5s forwards;
}
.active .fadeIn5 {
    animation:fadeIn 1s ease-in-out 5.5s forwards;
    -moz-animation:fadeIn 1s ease-in-out 5.5s forwards;
    -o-animation:fadeIn 1s ease-in-out 5.5s forwards;
    -webkit-animation:fadeIn 1s ease-in-out 5.5s forwards;
    -ms-animation:fadeIn 1s ease-in-out 5.5s forwards;
}
.active .fadeIn6 {
    animation:fadeIn 1s ease-in-out 6.5s forwards;
    -moz-animation:fadeIn 1s ease-in-out 6.5s forwards;
    -o-animation:fadeIn 1s ease-in-out 6.5s forwards;
    -webkit-animation:fadeIn 1s ease-in-out 6.5s forwards;
    -ms-animation:fadeIn 1s ease-in-out 6.5s forwards;
}
.active .fadeIn9 {
    opacity: 0;
    animation:fadeIn 1s ease-in-out 3s forwards;
    -moz-animation:fadeIn 1s ease-in-out 3s forwards;
    -o-animation:fadeIn 1s ease-in-out 3s forwards;
    -webkit-animation:fadeIn 1s ease-in-out 3s forwards;
    -ms-animation:fadeIn 1s ease-in-out 3s forwards;
}
.active .fadeIn10 {
    opacity: 0;
    animation:fadeIn 1s ease-in-out 4s forwards;
    -moz-animation:fadeIn 1s ease-in-out 4s forwards;
    -o-animation:fadeIn 1s ease-in-out 4s forwards;
    -webkit-animation:fadeIn 1s ease-in-out 4s forwards;
    -ms-animation:fadeIn 1s ease-in-out 4s forwards;
}
.active .fadeIn11 {
    opacity: 0;
    animation:fadeIn 1s ease-in-out 5s forwards;
    -moz-animation:fadeIn 1s ease-in-out 5s forwards;
    -o-animation:fadeIn 1s ease-in-out 5s forwards;
    -webkit-animation:fadeIn 1s ease-in-out 5s forwards;
    -ms-animation:fadeIn 1s ease-in-out 5s forwards;
}
.active .fadeIn12 {
    opacity: 0;
    animation:fadeIn 1s ease-in-out 6s forwards;
    -moz-animation:fadeIn 1s ease-in-out 6s forwards;
    -o-animation:fadeIn 1s ease-in-out 6s forwards;
    -webkit-animation:fadeIn 1s ease-in-out 6s forwards;
    -ms-animation:fadeIn 1s ease-in-out 6s forwards;
}
.active .fadeIn13 {
    opacity: 0;
    animation:fadeIn 1s ease-in-out 0s forwards;
    -moz-animation:fadeIn 1s ease-in-out 0s forwards;
    -o-animation:fadeIn 1s ease-in-out 0s forwards;
    -webkit-animation:fadeIn 1s ease-in-out 0s forwards;
    -ms-animation:fadeIn 1s ease-in-out 0s forwards;
}
@-webkit-keyframes title{
    from{
        transform:rotate(360deg) scale(0)
    }
    to{
        transform:rotate(0deg) scale(1)
    }
}
@-moz-keyframes title{
    from{
        transform:rotate(360deg) scale(0)
    }
    to{
        transform:rotate(0deg) scale(1)
    }
}
@-o-keyframes title{
    from{
        transform:rotate(360deg) scale(0)
    }
    to{
        transform:rotate(0deg) scale(1)
    }
}
@keyframes title{
    from{
        transform:rotate(360deg) scale(0)
    }
    to{
        transform:rotate(0deg) scale(1)
    }
}
.title-animate {
    animation: title 1.5s ease 0s;
    -moz-animation:title 1.5s ease 0s;
    -o-animation:title 1.5s ease 0s;
    -webkit-animation:title 1.5s ease 0s;
    -ms-animation:title 1.5s ease 0s;
}
@-webkit-keyframes rotateIn {
    0% {
        -webkit-transform-origin:center;
        transform-origin:center;
        -webkit-transform:rotate3d(0,0,1,-200deg);
        transform:rotate3d(0,0,1,-200deg);
        opacity:0
    }
    100% {
        -webkit-transform-origin:center;
        transform-origin:center;
        -webkit-transform:none;
        transform:none;
        opacity:1
    }
}
@keyframes rotateIn {
    0% {
        -webkit-transform-origin:center;
        transform-origin:center;
        -webkit-transform:rotate3d(0,0,1,-200deg);
        transform:rotate3d(0,0,1,-200deg);
        opacity:0
    }
    100% {
        -webkit-transform-origin:center;
        transform-origin:center;
        -webkit-transform:none;
        transform:none;
        opacity:1
    }
 }
.active .rotateIn {
    animation:rotateIn 1s ease-in-out 5.5s forwards;
    -moz-animation:rotateIn 1s ease-in-out 5.5s forwards;
    -o-animation:rotateIn 1s ease-in-out 5.5s forwards;
    -webkit-animation:rotateIn 1s ease-in-out 5.5s forwards;
    -ms-animation:rotateIn 1s ease-in-out 5.5s forwards;
  }
@keyframes rotateIn1 {
    0% {

        -webkit-transform-origin:center;
        transform-origin:center;
        -webkit-transform:rotate3d(0,0,1,-200deg);
        transform:rotate3d(0,0,1,-200deg);
        opacity:0;

    }
    100% {

        -webkit-transform-origin:center;
        transform-origin:center;
        -webkit-transform:none;
        transform:none;
        opacity:1;
    }
}
.active .rotateIn1 {
    animation:rotateIn1 0.5s linear 1.5s forwards;
    -moz-animation:rotateIn1 0.5s linear 1.5s forwards;
    -o-animation:rotateIn1 0.5s linear 1.5s forwards;
    -webkit-animation:rotateIn1 0.5s linear 1.5s forwards;
    -ms-animation:rotateIn1 0.5s linear 1.5s forwards;
}
@keyframes wheelchange{
    from{transform:rotate(-360deg);}
    to{transform:rotate(0deg);}
}
@-moz-keyframes wheelchange {
    from{-moz-transform:rotate(-360deg);}
    to{-moz-transform:rotate(0deg);}

}
@-webkit-keyframes wheelchange {
    from{-webkit-transform:rotate(-360deg);}
    to{-webkit-transform:rotate(0deg);}
}
.wheelchange {
    animation:wheelchange 1s ease-in-out infinite;
    -moz-animation:wheelchange 1s ease-in-out infinite;
    -o-animation:wheelchange 1s ease-in-out infinite;
    -webkit-animation:wheelchange 1s ease-in-out infinite;
    -ms-animation:wheelchange 1s ease-in-out infinite;
}
/*  动画  */
@-webkit-keyframes showColor {
    0%{
        opacity: 0;
    }
    50%{
        opacity: 0.5;
    }
    100%{
        opacity: 1;
    }
}
.showColor{
    animation:showColor 2s ease 0s;
    -moz-animation:showColor 2s ease 0s;
    -o-animation:showColor 2s ease;
    -webkit-animation:showColor 2s ease 0s;
    -ms-animation:showColor 2s ease 0s;
    height: 136px;
    background:#af6837;
    width: 100%;
    position: absolute;
    bottom: 0;
    left: 0;
}
@-webkit-keyframes showPerson {
    0%{
        opacity: 0;
    }
    50%{
        opacity: 0.2;
    }
    70%{
        opacity: 0.5;
    }
    100%{
        opacity: 1;
    }
}
.showPerson{
    animation:showPerson 4s ease-in-out 0s;
    -moz-animation:showPerson 4s ease-in-out 0s;
    -o-animation:showPerson 4s ease-in-out 0s;
    -webkit-animation:showPerson 4s ease-in-out 0s;
    -ms-animation:showPerson 4s ease-in-out 0s;
}
@-webkit-keyframes showOthers {
    0%{
        opacity: 0;
    }
    50%{
        opacity: 0.2;
    }
    70%{
        opacity: 0.5;
    }
    100%{
        opacity: 1;
    }
}
.showOthers{
    animation:showOthers 8s ease-in-out 0s;
    -moz-animation:showOthers 8s ease-in-out 0s;
    -o-animation:showOthers 8s ease-in-out 0s;
    -webkit-animation:showOthers 8s ease-in-out 0s;
    -ms-animation:showOthers 8s ease-in-out 0s;
}

@-webkit-keyframes bounceInDown {
    0%,100%,60%,75%,90% {
        -webkit-transition-timing-function:cubic-bezier(0.215,.61,.355,1);
        transition-timing-function:cubic-bezier(0.215,.61,.355,1)
    }
    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%,100%,60%,75%,90% {
        -webkit-transition-timing-function:cubic-bezier(0.215,.61,.355,1);
        transition-timing-function:cubic-bezier(0.215,.61,.355,1)
    }
    0% {
        opacity:0;
        -webkit-transform:translate3d(0,-3000px,0);
        -ms-transform:translate3d(0,-3000px,0);
        transform:translate3d(0,-3000px,0)
    }
    60% {
        opacity:1;
        -webkit-transform:translate3d(0,25px,0);
        -ms-transform:translate3d(0,25px,0);
        transform:translate3d(0,25px,0)
    }
    75% {
        -webkit-transform:translate3d(0,-10px,0);
        -ms-transform:translate3d(0,-10px,0);
        transform:translate3d(0,-10px,0)
    }
    90% {
        -webkit-transform:translate3d(0,5px,0);
        -ms-transform:translate3d(0,5px,0);
        transform:translate3d(0,5px,0)
    }
    100% {
        -webkit-transform:none;
        -ms-transform:none;
        transform:none
    }
}
.bounceInDown {
    animation:bounceInDown 3s ease-in-out 0s;
    -moz-animation:bounceInDown 3s ease-in-out 0s;
    -o-animation:bounceInDown 3s ease-in-out 0s;
    -webkit-animation:bounceInDown 3s ease-in-out 0s;
    -ms-animation:bounceInDown 3s ease-in-out 0s;
}
@-webkit-keyframes rubberBand {
    0% {
        -webkit-transform:scale3d(1,1,1);
        transform:scale3d(1,1,1);
        opacity: 0;
    }
    30% {
        -webkit-transform:scale3d(1.25,.75,1);
        transform:scale3d(1.25,.75,1);
        opacity: 0.3;
    }
    40% {
        -webkit-transform:scale3d(0.75,1.25,1);
        transform:scale3d(0.75,1.25,1);
        opacity: 0.4;
    }
    50% {
        -webkit-transform:scale3d(1.15,.85,1);
        transform:scale3d(1.15,.85,1);
        opacity: 0.5;
    }
    65% {
        -webkit-transform:scale3d(.95,1.05,1);
        transform:scale3d(.95,1.05,1);
        opacity: 0.65;
    }
    75% {
        -webkit-transform:scale3d(1.05,.95,1);
        transform:scale3d(1.05,.95,1);
        opacity: 0.75;
    }
    100% {
        -webkit-transform:scale3d(1,1,1);
        transform:scale3d(1,1,1);
        opacity: 1;
    }
}
@keyframes rubberBand {
    0% {
        -webkit-transform:scale3d(1,1,1);
        transform:scale3d(1,1,1);
        opacity: 0;
    }
    30% {
        -webkit-transform:scale3d(1.25,.75,1);
        transform:scale3d(1.25,.75,1);
        opacity: 0.3;
    }
    40% {
        -webkit-transform:scale3d(0.75,1.25,1);
        transform:scale3d(0.75,1.25,1);
        opacity: 0.4;
    }
    50% {
        -webkit-transform:scale3d(1.15,.85,1);
        transform:scale3d(1.15,.85,1);
        opacity: 0.5;
    }
    65% {
        -webkit-transform:scale3d(.95,1.05,1);
        transform:scale3d(.95,1.05,1);
        opacity: 0.65;
    }
    75% {
        -webkit-transform:scale3d(1.05,.95,1);
        transform:scale3d(1.05,.95,1);
        opacity: 0.75;
    }
    100% {
        -webkit-transform:scale3d(1,1,1);
        transform:scale3d(1,1,1);
        opacity: 1;
    }
}
.active .rubberBand {
    animation:rubberBand 2s ease-in-out 3.5s forwards;
    -moz-animation:rubberBand 2s ease-in-out 3.5s forwards;
    -o-animation:rubberBand 2s ease-in-out 3.5s;
    -webkit-animation:rubberBand 2s ease-in-out 3.5s forwards;
    -ms-animation:rubberBand 2s ease-in-out 3.5s forwards;
}
@-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);
        -ms-transform:translate3d(-100%,0,0);
        transform:translate3d(-100%,0,0)
    }
    100% {
        opacity:1;
        -webkit-transform:none;
        -ms-transform:none;
        transform:none
    }
}
.active .fadeInLeft {
    animation:fadeInLeft 1s ease-in-out 1.5s forwards;
    -moz-animation:fadeInLeft 1s ease-in-out 1.5s forwards;
    -o-animation:fadeInLeft 1s ease-in-out 1.5s forwards;
    -webkit-animation:fadeInLeft 1s ease-in-out 1.5s forwards;
    -ms-animation:fadeInLeft 1s ease-in-out 1.5s forwards;
}
.active .fadeInLeft2 {
    animation:fadeInLeft 1s ease-in-out 3.5s forwards;
    -moz-animation:fadeInLeft 1s ease-in-out 3.5s forwards;
    -o-animation:fadeInLeft 1s ease-in-out 3.5s forwards;
    -webkit-animation:fadeInLeft 1s ease-in-out 3.5s forwards;
    -ms-animation:fadeInLeft 1s ease-in-out 3.5s forwards;
}
.active .fadeInLeft3 {
    animation:fadeInLeft 1s ease-in-out 5.5s forwards;
    -moz-animation:fadeInLeft 1s ease-in-out 5.5s forwards;
    -o-animation:fadeInLeft 1s ease-in-out 5.5s forwards;
    -webkit-animation:fadeInLeft 1s ease-in-out 5.5s forwards;
    -ms-animation:fadeInLeft 1s ease-in-out 5.5s forwards;
}
.active .fadeInLeft4 {
    opacity: 0;
    animation:fadeInLeft 1s ease-in-out 2s forwards;
    -moz-animation:fadeInLeft 1s ease-in-out 2s forwards;
    -o-animation:fadeInLeft 1s ease-in-out 2s forwards;
    -webkit-animation:fadeInLeft 1s ease-in-out 2s forwards;
    -ms-animation:fadeInLeft 1s ease-in-out 2s forwards;
}
@-webkit-keyframes fadeInRight {
    0% {
        opacity:0;
        -webkit-transform:translate3d(100%,0,0);
        transform:translate3d(100%,0,0)
    }
    100% {
        opacity:1;
        -webkit-transform:none;
        transform:none
    }
}
@keyframes fadeInRight {
    0% {
        opacity:0;
        -webkit-transform:translate3d(100%,0,0);
        -ms-transform:translate3d(100%,0,0);
        transform:translate3d(100%,0,0)
    }
    100% {
        opacity:1;
        -webkit-transform:none;
        -ms-transform:none;
        transform:none
    }
}
.active .fadeInRight {
    animation:fadeInRight 1s ease-in-out 2.5s forwards;
    -moz-animation:fadeInRight 1s ease-in-out 2.5s forwards;
    -o-animation:fadeInRight 1s ease-in-out 2.5s forwards;
    -webkit-animation:fadeInRight 1s ease-in-out 2.5s forwards;
    -ms-animation:fadeInRight 1s ease-in-out 2.5s forwards;
}
.active .fadeInRight2 {
    animation:fadeInRight 1s ease-in-out 4.5s forwards;
    -moz-animation:fadeInRight 1s ease-in-out 4.5s forwards;
    -o-animation:fadeInRight 1s ease-in-out 4.5s forwards;
    -webkit-animation:fadeInRight 1s ease-in-out 4.5s forwards;
    -ms-animation:fadeInRight 1s ease-in-out 4.5s forwards;
}

@keyframes flipOutY {
    0% {
        /*-webkit-transform:perspective(1400px);*/
        /*-ms-transform:perspective(1400px);*/
        /*transform:perspective(1400px)*/
    }
    0% {
        -webkit-transform:rotate3d(0,1,0,0deg);
        -ms-transform:rotate3d(0,1,0,0deg);
        transform:rotate3d(0,1,0,0deg);
        opacity:1
    }
    100% {
        -webkit-transform: rotate3d(0,1,0,360deg);
        -ms-transform:rotate3d(0,1,0,360deg);
        transform:rotate3d(0,1,0,360deg);
        opacity:0
    }
}
.flipOutY {
    animation:flipOutY 1s ease infinite;
    -moz-animation:flipOutY 1s ease infinite;
    -o-animation:flipOutY 1s ease infinite;
    -webkit-animation:flipOutY 1s ease infinite;
    -ms-animation:flipOutY 1s ease infinite;
 }
@keyframes wheelchange{
    from{transform:rotate(-360deg);}
    to{transform:rotate(0deg);}
}
@-moz-keyframes wheelchange {
    from{-moz-transform:rotate(-360deg);}
    to{-moz-transform:rotate(0deg);}

}
@-webkit-keyframes wheelchange {
    from{-webkit-transform:rotate(-360deg);}
    to{-webkit-transform:rotate(0deg);}
}
@keyframes laugh{
    from{top:68px}
    to{top:66px}
}
.laugh{
    animation:laugh 0.3s ease infinite;
    -moz-animation:laugh 0.3s ease infinite;
    -o-animation:laugh 0.3s ease infinite;
    -webkit-animation:laugh 0.3s ease infinite;
    -ms-animation:laugh 0.3s ease infinite;
}
@keyframes dota{
    from{
        opacity:0;
    }
    to{
        opacity:0.5;
    }
}
@-webkit-keyframes dota{
    from{
        opacity:0;
    }
    to{
        opacity:0.5;
    }
}
.active .dota1{
    animation:dota 0.3s ease 2s forwards;
    -moz-animation:dota 0.3s ease 2s forwards;
    -o-animation:dota 0.3s ease 2s forwards;
    -webkit-animation:dota 0.3s ease 2s forwards;
    -ms-animation:dota 0.3s ease 2s forwards;
}
.active .dota2{
    animation:dota 0.3s ease 4s forwards;
    -moz-animation:dota 0.3s ease 4s forwards;
    -o-animation:dota 0.3s ease 4s forwards;
    -webkit-animation:dota 0.3s ease 4s forwards;
    -ms-animation:dota 0.3s ease 4s forwards;
}
.active .dota3{
    animation:dota 0.2s ease 5.8s forwards;
    -moz-animation:dota 0.2s ease 5.8s forwards;
    -o-animation:dota 0.2s ease 5.8s forwards;
    -webkit-animation:dota 0.2s ease 5.8s forwards;
    -ms-animation:dota 0.2s ease 5.8s forwards;
}
.active .dota4{
    animation:dota 0.2s ease 6.8s forwards;
    -moz-animation:dota 0.2s ease 6.8s forwards;
    -o-animation:dota 0.2s ease 6.8s forwards;
    -webkit-animation:dota 0.2s ease 6.8s forwards;
    -ms-animation:dota 0.2s ease 6.8s forwards;
}
@keyframes line1a{
    from{
        width: 0;
        opacity: 0;
        left: 200px;
    }
    to{
        width: 30px;
        opacity:0.5;
        left: 170px;
    }
}
@-webkit-keyframes line1a{
    from{
        width: 30px;
        opacity: 0;
        left: 200px;
    }
    to{
        width: 100px;
        opacity:0.5;
        left: 170px;
    }
}
.active .line1a{
    animation:line1a 0.3s ease  2.3s forwards;
    -moz-animation:line1a 0.3s ease 2.3s forwards;
    -o-animation:line1a 0.3s ease 2.3s forwards;
    -webkit-animation:line1a 0.3s ease 2.3s forwards;
    -ms-animation:line1a 0.3s ease 2.3s forwards;
}
@keyframes line1ab{
    from{
        width: 0;
        opacity: 0;
    }
    to{
        width: 100px;
        opacity: 0.5;
    }
}
@-webkit-keyframes line1ab{
    from{
        width: 0;
        opacity: 0;
    }
    to{
        width: 100px;
        opacity: 0.5;
    }
}
.active .line1ab{
    animation:line1ab 0.3s ease  4.3s forwards;
    -moz-animation:line1ab 0.3s ease 4.3s forwards;
    -o-animation:line1ab 0.3s ease 4.3s forwards;
    -webkit-animation:line1ab 0.3s 4.3s ease forwards;
    -ms-animation:line1ab 0.3s ease 4.3s forwards;
}
@keyframes line1ac{
     from{
         width: 0;
         opacity: 0;
         left: 170px;
     }
     to{
         width: 150px;
         opacity: 0.5;
         left: 20px;
     }
 }
@-webkit-keyframes line1ac{
    from{
        width: 0px;
        opacity: 0;
        left: 170px;
    }
    to{
        width: 150px;
        opacity: 0.5;
        left: 20px;
    }
}
.active .line1ac{
    animation:line1ac 0.3s ease  6s forwards;
    -moz-animation:line1ac 0.3s ease 6s forwards;
    -o-animation:line1ac 0.3s ease 6s forwards;
    -webkit-animation:line1ac 0.3s 6s ease forwards;
    -ms-animation:line1ac 0.3s ease 6s forwards;
}
@keyframes line1ad{
    from{
        width: 0;
        opacity: 0;

    }
    to{
        width: 150px;
        opacity: 0.5;

    }
}
@-webkit-keyframes line1ad{
    from{
        width: 0px;
        opacity: 0;
    }
    to{
        width: 150px;
        opacity: 0.5;
    }
}
.active .line1ad{
    animation:line1ad 0.3s ease  7s forwards;
    -moz-animation:line1ad 0.3s ease 7s forwards;
    -o-animation:line1ad 0.3s ease 7s forwards;
    -webkit-animation:line1ad 0.3s 7s ease forwards;
    -ms-animation:line1ad 0.3s ease 7s forwards;
}
@keyframes line2a{
    from{
        width: 0;
        opacity: 0;
    }
    to{
        width: 1px;
        opacity:0.5;
    }
}
@-webkit-keyframes line2a{
    from{
        width: 0;
        opacity: 0;
    }
    to{
        width: 1px;
        opacity:0.5;
    }
}
.active .line2a{
    animation:line2a 0.4s ease  2.6s forwards;
    -moz-animation:line2a 0.4s ease 2.6s forwards;
    -o-animation:line2a 0.4s ease 2.6s forwards;
    -webkit-animation:line2a 0.4s 2.6s ease forwards;
    -ms-animation:line2a 0.4s ease 2.6s forwards;
}
@keyframes line2ab{
    from{
        width: 0;
        opacity: 0;
    }
    to{
        width: 1px;
        opacity: 0.5;
    }
}
@-webkit-keyframes line2ab{
    from{
        width: 0;
        opacity: 0;
    }
    to{
        width: 1px;
        opacity: 0.51;
    }
}
.active .line2ab{
    animation:line2ab 0.4s ease  4.6s forwards;
    -moz-animation:line2ab 0.4s ease 4.6s forwards;
    -o-animation:line2ab 0.4s ease 4.6s forwards;
    -webkit-animation:line2ab 0.4s 4.6s ease forwards;
    -ms-animation:line2ab 0.4s ease 4.6s forwards;
}
@keyframes line2ad{
    from{
        width: 0;
        opacity: 0;
    }
    to{
        width: 1px;
        opacity: 0.5;
    }
}
@-webkit-keyframes line2ad{
    from{
        width: 0;
        opacity: 0;
    }
    to{
        width: 1px;
        opacity: 0.5;
    }
}
.active .line2ad{
    animation:line2ad 0.3s ease  7.3s forwards;
    -moz-animation:line2ad 0.3s ease 7.3s forwards;
    -o-animation:line2ad 0.3s ease 7.3s forwards;
    -webkit-animation:line2ad 0.3s 7.3s ease forwards;
    -ms-animation:line2ad 0.3s ease 7.3s forwards;
}
@keyframes line3a{
    from{
        width: 0;
        opacity: 0;
        left: 169px;
    }
    to{
        width: 150px;
        opacity:0.5;
        left: 19px;
    }
}
@-webkit-keyframes line3a{
    from{
        width: 0;
        opacity: 0;
        left: 169px;
    }
    to{
        width: 150px;
        opacity:0.5;
        left: 19px;
    }
}
.active .line3a{
    animation:line3a 0.3s ease 3s forwards;
    -moz-animation:line3a 0.3s ease 3s forwards;
    -o-animation:line3a 0.3s ease 3s forwards;
    -webkit-animation:line3a 0.3s ease 3s forwards;
    -ms-animation:line3a 0.3s ease 3s forwards;
}
@keyframes line3ab{
    from{
        width: 0;
        opacity: 0;
    }
    to{
        width: 60px;
        opacity: 0.5;
    }
}
@-webkit-keyframes line3ab{
    from{
        width: 0;
        opacity: 0;
    }
    to{
        width: 60px;
        opacity: 0.5;
    }
}
.active .line3ab{
    animation:line3ab 0.3s ease 5s forwards;
    -moz-animation:line3ab 0.3s ease 5s forwards;
    -o-animation:line3ab 0.3s ease 5s forwards;
    -webkit-animation:line3ab 0.3s 5s ease forwards;
    -ms-animation:line3ab 0.3s ease 5s forwards;
}

@keyframes line3ad{
    from{
        width: 0;
        opacity: 0;

    }
    to{
        width: 60px;
        opacity: 0.5;

    }
}
@-webkit-keyframes line3ad{
    from{
        width: 0;
        opacity: 0;

    }
    to{
        width: 60px;
        opacity: 0.5;

    }
}
.active .line3ad{
    animation:line3ad 0.4s ease 7.6s forwards;
    -moz-animation:line3ad 0.4s ease 7.6s forwards;
    -o-animation:line3ad 0.4s ease 7.6s forwards;
    -webkit-animation:line3ad 0.4s 7.6s ease forwards;
    -ms-animation:line3ad 0.4s ease 7.6s forwards;
}
@keyframes pos{
    from{

        height: 0;
        opacity: 0;
    }
    to{

        height: 100px;
        opacity: 1;
    }
}
@-webkit-keyframes pos{
    from{

        height: 0;
        opacity: 0;
    }
    to{

        height: 100px;
        opacity: 1;
    }
}
.active .pos2a{
    animation:pos 0.5s ease 5.3s forwards;
    -moz-animation:pos 0.5s ease 5.3s forwards;
    -o-animation:pos 0.5s ease 5.3s forwards;
    -webkit-animation:pos 0.5s 5.3s ease forwards;
    -ms-animation:pos 0.5s ease 5.3s forwards;
}
.active .pos1a{
    animation:pos 0.7s ease 3.3s forwards;
    -moz-animation:pos 0.7s ease 3.3s forwards;
    -o-animation:pos 0.7s ease 3.3s forwards;
    -webkit-animation:pos 0.7s 3.3s ease forwards;
    -ms-animation:pos 0.7s ease 3.3s forwards;
}
.active .pos3a{
    animation:pos 0.5s ease 6.3s forwards;
    -moz-animation:pos 0.5s ease 6.3s forwards;
    -o-animation:pos 0.5s ease 6.3s forwards;
    -webkit-animation:pos 0.5s 6.3s ease forwards;
    -ms-animation:pos 0.5s ease 6.3s forwards;
}
.active .pos4a{
    animation:pos 0.5s ease 8s forwards;
    -moz-animation:pos 0.5s ease 8s forwards;
    -o-animation:pos 0.5s ease 8s forwards;
    -webkit-animation:pos 0.5s 8s ease forwards;
    -ms-animation:pos 0.5s ease 8s forwards;
}

@keyframes showYii{
    from{
        height: 0;
        transform:scale(0);
        opacity: 0;
    }
    to{
        transform:scale(1);
        opacity: 1;
    }
}
@-webkit-keyframes showYii{
    from{
        height: 0;
        transform:scale(0);
        opacity: 0;
    }
    to{
        transform:scale(1);
        opacity: 1;
    }
}
.active .showYii{
    animate:showYii 1s ease-in-out 0s forwards;
    -moz-animation:showYii 1s ease-in-out 0s forwards;
    -o-animation:showYii 1s ease-in-out 0s forwards;
    -webkit-animation:showYii 1s ease-in-out 0s forwards;
    -ms-animation:showYii 1s ease-in-out 0s forwards;
}
@keyframes showOpacity{
    from{
        opacity: 0;
    }
    to{
        opacity: 0.9;
    }
}
@-webkit-keyframes showOpacity{
    from{
        opacity: 0;
    }
    to{
        opacity: 0.9;
    }
}
.active .fadeIn7 {
    animation:showOpacity 1s ease-in-out 1s forwards;
    -moz-animation:showOpacity 1s ease-in-out 1s forwards;
    -o-animation:showOpacity 1s ease-in-out 1s forwards;
    -webkit-animation:showOpacity 1s ease-in-out 1s forwards;
    -ms-animation:showOpacity 1s ease-in-out 1s forwards;
}

@keyframes phoneAnimate{
    0%{
        opacity: 0;
    }
    40%{
        opacity: 1;
        transform:rotate(0deg);
    }
    60%{
        transform:rotate(360deg);
    }
    80%{
        transform:scale(1.3);
    }
    100%{
        transform:scale(1.0);
    }
}
@-webkit-keyframes phoneAnimate{
    0%{
        opacity: 0;
    }
    40%{
        opacity: 1;
        transform:rotate(0deg);
    }
    60%{
        transform:rotate(360deg);
    }
    80%{
        transform:scale(1.5);
    }
    100%{
        transform:scale(1.0);
    }
}
.active .phoneAnimate{
    animation:phoneAnimate 2s ease-in-out 0s forwards;
    -moz-animation:phoneAnimate 2s ease-in-out 0s forwards;
    -o-animation:phoneAnimate 2s ease-in-out 0s forwards;
    -webkit-animation:phoneAnimate 2s ease-in-out 0s forwards;
    -ms-animation:phoneAnimate 2s ease-in-out 0s forwards;
}
.active .fadeInRight3 {
    opacity: 0;
    animation:fadeInRight 1s ease-in-out 2s forwards;
    -moz-animation:fadeInRight 1s ease-in-out 2s forwards;
    -o-animation:fadeInRight 1s ease-in-out 2s forwards;
    -webkit-animation:fadeInRight 1s ease-in-out 2s forwards;
    -ms-animation:fadeInRight 1s ease-in-out 2s forwards;
}
.active .fadeInDown1 {
    opacity: 0;
    animation:fadeInDown 1s ease-in-out 3s forwards;
    -moz-animation:fadeInDown 1s ease-in-out 3s forwards;
    -o-animation:fadeInDown 1s ease-in-out 3s forwards;
    -webkit-animation:fadeInDown 1s ease-in-out 3s forwards;
    -ms-animation:fadeInDown 1s ease-in-out 3s forwards;
}
.active .fadeInDown2 {
    opacity: 0;
    animation:fadeInDown 1s ease-in-out 4s forwards;
    -moz-animation:fadeInDown 1s ease-in-out 4s forwards;
    -o-animation:fadeInDown 1s ease-in-out 4s forwards;
    -webkit-animation:fadeInDown 1s ease-in-out 4s forwards;
    -ms-animation:fadeInDown 1s ease-in-out 4s forwards;
}
.active .fadeInDown3{
    opacity: 0;
    animation:fadeInDown 1s ease-in-out 5s forwards;
    -moz-animation:fadeInDown 1s ease-in-out 5s forwards;
    -o-animation:fadeInDown 1s ease-in-out 5s forwards;
    -webkit-animation:fadeInDown 1s ease-in-out 5s forwards;
    -ms-animation:fadeInDown 1s ease-in-out 5s forwards;
}
@keyframes icon-hot{
     0%{
         opacity: 0;
         left: 170px;
         top: -10px;
     }
     20%{
         opacity: 1;
         left: 170px;
         top: -10px;
     }
     100%{
         opacity: 1;
         left: 170px;
         top: 27px;
     }
 }
@-webkit-keyframes icon-hot{
    0%{
        opacity: 0;
        left: 170px;
        top: -10px;
    }
    20%{
        opacity: 1;
        left: 170px;
        top: -10px;
    }
    100%{
        opacity: 1;
        left: 170px;
        top: 27px;
    }
}
.active .icon-effect1{
    animation:icon-hot 2s ease-in-out 0s  infinite;
    -moz-animation:icon-hot 2s ease-in-out 0s infinite;
    -o-animation:icon-hot 2s ease-in-out 0s infinite;
    -webkit-animation:icon-hot 2s ease-in-out 0s infinite;
    -ms-animation:icon-hot 2s ease-in-out 0s infinite;
}
.active .fadeIn14 {
    animation:fadeIn 1s ease-in-out 1s forwards;
    -moz-animation:fadeIn 1s ease-in-out 1s forwards;
    -o-animation:fadeIn 1s ease-in-out 1s forwards;
    -webkit-animation:fadeIn 1s ease-in-out 1s forwards;
    -ms-animation:fadeIn 1s ease-in-out 1s forwards;
}
.active .fadeIn15 {
    animation:fadeIn 1s ease-in-out 2s forwards;
    -moz-animation:fadeIn 1s ease-in-out 2s forwards;
    -o-animation:fadeIn 1s ease-in-out 2s forwards;
    -webkit-animation:fadeIn 1s ease-in-out 2s forwards;
    -ms-animation:fadeIn 1s ease-in-out 2s forwards;
}
.active .bounce2 {
    animation:bounce 1s ease-in-out 2s forwards;
    -moz-animation:bounce 1s ease-in-out 2s forwards;
    -o-animation:bounce 1s ease-in-out 2s forwards;
    -webkit-animation:bounce 1s ease-in-out 2s forwards;
    -ms-animation:bounce 1s ease-in-out 2s forwards;
}
.active .bounce3 {
     animation:bounce 1s ease-in-out 3s forwards;
     -moz-animation:bounce 1s ease-in-out 3s forwards;
     -o-animation:bounce 1s ease-in-out 3s forwards;
     -webkit-animation:bounce 1s ease-in-out 3s forwards;
     -ms-animation:bounce 1s ease-in-out 3s forwards;
 }
.active .bounce4 {
    animation:bounce 1s ease-in-out 4s forwards;
    -moz-animation:bounce 1s ease-in-out 4s forwards;
    -o-animation:bounce 1s ease-in-out 4s forwards;
    -webkit-animation:bounce 1s ease-in-out 4s forwards;
    -ms-animation:bounce 1s ease-in-out 4s forwards;
}
@keyframes icon-person{
     0%{
         right: 80px;
     }
    50%{
        right: 50px;
    }
    100%{
        right: 80px;
    }
}
@-webkit-keyframes icon-person{
    0%{
        right: 80px;
    }
    50%{
        right: 50px;
    }
    100%{
        right: 80px;
    }
}
.active .icon-person{
    animation:icon-person 2s ease-in-out 1s infinite;
    -moz-animation:icon-person 2s ease-in-out 1s infinite;
    -o-animation:icon-person 2s ease-in-out 1s infinite;
    -webkit-animation:icon-person 2s ease-in-out 1s infinite;
    -ms-animation:icon-person 2s ease-in-out 1s infinite;
}