@charset "UTF-8"; /*!
Animate.css - http://daneden.me/animate
Licensed under the MIT license - http://opensource.org/licenses/MIT

Copyright (c) 2014 Daniel Eden
*/
.animated {
    -webkit-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both
}

.animated.infinite {
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite
}

.animated.hinge {
    -webkit-animation-duration: 2s;
    animation-duration: 2s
}

@-webkit-keyframes bounce {
    0%,100%,20%,53%,80% {
        -webkit-transition-timing-function: cubic-bezier(.215,.61,.355,1);
        transition-timing-function: cubic-bezier(.215,.61,.355,1);
        -webkit-transform: translate3d(0,0,0);
        transform: translate3d(0,0,0)
    }

    40%,43% {
        -webkit-transition-timing-function: cubic-bezier(.755,.05,.855,.06);
        transition-timing-function: cubic-bezier(.755,.05,.855,.06);
        -webkit-transform: translate3d(0,-30px,0);
        transform: translate3d(0,-30px,0)
    }

    70% {
        -webkit-transition-timing-function: cubic-bezier(.755,.05,.855,.06);
        transition-timing-function: cubic-bezier(.755,.05,.855,.06);
        -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(.215,.61,.355,1);
        transition-timing-function: cubic-bezier(.215,.61,.355,1);
        -webkit-transform: translate3d(0,0,0);
        transform: translate3d(0,0,0)
    }

    40%,43% {
        -webkit-transition-timing-function: cubic-bezier(.755,.05,.855,.06);
        transition-timing-function: cubic-bezier(.755,.05,.855,.06);
        -webkit-transform: translate3d(0,-30px,0);
        transform: translate3d(0,-30px,0)
    }

    70% {
        -webkit-transition-timing-function: cubic-bezier(.755,.05,.855,.06);
        transition-timing-function: cubic-bezier(.755,.05,.855,.06);
        -webkit-transform: translate3d(0,-15px,0);
        transform: translate3d(0,-15px,0)
    }

    90% {
        -webkit-transform: translate3d(0,-4px,0);
        transform: translate3d(0,-4px,0)
    }
}

.bounce {
    -webkit-animation-name: bounce;
    animation-name: bounce;
    -webkit-transform-origin: center bottom;
    -ms-transform-origin: center bottom;
    transform-origin: center bottom
}

@-webkit-keyframes flash {
    0%,100%,50% {
        opacity: 1
    }

    25%,75% {
        opacity: 0
    }
}

@keyframes flash {
    0%,100%,50% {
        opacity: 1
    }

    25%,75% {
        opacity: 0
    }
}

.flash {
    -webkit-animation-name: flash;
    animation-name: flash
}

@-webkit-keyframes pulse {
    0% {
        -webkit-transform: scale3d(1,1,1);
        transform: scale3d(1,1,1)
    }

    50% {
        -webkit-transform: scale3d(1.05,1.05,1.05);
        transform: scale3d(1.05,1.05,1.05)
    }

    100% {
        -webkit-transform: scale3d(1,1,1);
        transform: scale3d(1,1,1)
    }
}

@keyframes pulse {
    0% {
        -webkit-transform: scale3d(1,1,1);
        transform: scale3d(1,1,1)
    }

    50% {
        -webkit-transform: scale3d(1.05,1.05,1.05);
        transform: scale3d(1.05,1.05,1.05)
    }

    100% {
        -webkit-transform: scale3d(1,1,1);
        transform: scale3d(1,1,1)
    }
}

.pulse {
    -webkit-animation-name: pulse;
    animation-name: pulse
}

@-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)
    }
}

.rubberBand {
    -webkit-animation-name: rubberBand;
    animation-name: rubberBand
}

@-webkit-keyframes shake {
    0%,100% {
        -webkit-transform: translate3d(0,0,0);
        transform: translate3d(0,0,0)
    }

    10%,30%,50%,70%,90% {
        -webkit-transform: translate3d(-10px,0,0);
        transform: translate3d(-10px,0,0)
    }

    20%,40%,60%,80% {
        -webkit-transform: translate3d(10px,0,0);
        transform: translate3d(10px,0,0)
    }
}

@keyframes shake {
    0%,100% {
        -webkit-transform: translate3d(0,0,0);
        transform: translate3d(0,0,0)
    }

    10%,30%,50%,70%,90% {
        -webkit-transform: translate3d(-10px,0,0);
        transform: translate3d(-10px,0,0)
    }

    20%,40%,60%,80% {
        -webkit-transform: translate3d(10px,0,0);
        transform: translate3d(10px,0,0)
    }
}

.shake {
    -webkit-animation-name: shake;
    animation-name: shake
}

@-webkit-keyframes swing {
    20% {
        -webkit-transform: rotate3d(0,0,1,15deg);
        transform: rotate3d(0,0,1,15deg)
    }

    40% {
        -webkit-transform: rotate3d(0,0,1,-10deg);
        transform: rotate3d(0,0,1,-10deg)
    }

    60% {
        -webkit-transform: rotate3d(0,0,1,5deg);
        transform: rotate3d(0,0,1,5deg)
    }

    80% {
        -webkit-transform: rotate3d(0,0,1,-5deg);
        transform: rotate3d(0,0,1,-5deg)
    }

    100% {
        -webkit-transform: rotate3d(0,0,1,0deg);
        transform: rotate3d(0,0,1,0deg)
    }
}

@keyframes swing {
    20% {
        -webkit-transform: rotate3d(0,0,1,15deg);
        transform: rotate3d(0,0,1,15deg)
    }

    40% {
        -webkit-transform: rotate3d(0,0,1,-10deg);
        transform: rotate3d(0,0,1,-10deg)
    }

    60% {
        -webkit-transform: rotate3d(0,0,1,5deg);
        transform: rotate3d(0,0,1,5deg)
    }

    80% {
        -webkit-transform: rotate3d(0,0,1,-5deg);
        transform: rotate3d(0,0,1,-5deg)
    }

    100% {
        -webkit-transform: rotate3d(0,0,1,0deg);
        transform: rotate3d(0,0,1,0deg)
    }
}

.swing {
    -webkit-transform-origin: top center;
    -ms-transform-origin: top center;
    transform-origin: top center;
    -webkit-animation-name: swing;
    animation-name: swing
}

@-webkit-keyframes tada {
    0% {
        -webkit-transform: scale3d(1,1,1);
        transform: scale3d(1,1,1)
    }

    10%,20% {
        -webkit-transform: scale3d(.9,.9,.9) rotate3d(0,0,1,-3deg);
        transform: scale3d(.9,.9,.9) rotate3d(0,0,1,-3deg)
    }

    30%,50%,70%,90% {
        -webkit-transform: scale3d(1.1,1.1,1.1) rotate3d(0,0,1,3deg);
        transform: scale3d(1.1,1.1,1.1) rotate3d(0,0,1,3deg)
    }

    40%,60%,80% {
        -webkit-transform: scale3d(1.1,1.1,1.1) rotate3d(0,0,1,-3deg);
        transform: scale3d(1.1,1.1,1.1) rotate3d(0,0,1,-3deg)
    }

    100% {
        -webkit-transform: scale3d(1,1,1);
        transform: scale3d(1,1,1)
    }
}

@keyframes tada {
    0% {
        -webkit-transform: scale3d(1,1,1);
        transform: scale3d(1,1,1)
    }

    10%,20% {
        -webkit-transform: scale3d(.9,.9,.9) rotate3d(0,0,1,-3deg);
        transform: scale3d(.9,.9,.9) rotate3d(0,0,1,-3deg)
    }

    30%,50%,70%,90% {
        -webkit-transform: scale3d(1.1,1.1,1.1) rotate3d(0,0,1,3deg);
        transform: scale3d(1.1,1.1,1.1) rotate3d(0,0,1,3deg)
    }

    40%,60%,80% {
        -webkit-transform: scale3d(1.1,1.1,1.1) rotate3d(0,0,1,-3deg);
        transform: scale3d(1.1,1.1,1.1) rotate3d(0,0,1,-3deg)
    }

    100% {
        -webkit-transform: scale3d(1,1,1);
        transform: scale3d(1,1,1)
    }
}

.tada {
    -webkit-animation-name: tada;
    animation-name: tada
}

@-webkit-keyframes wobble {
    0% {
        -webkit-transform: none;
        transform: none
    }

    15% {
        -webkit-transform: translate3d(-25%,0,0) rotate3d(0,0,1,-5deg);
        transform: translate3d(-25%,0,0) rotate3d(0,0,1,-5deg)
    }

    30% {
        -webkit-transform: translate3d(20%,0,0) rotate3d(0,0,1,3deg);
        transform: translate3d(20%,0,0) rotate3d(0,0,1,3deg)
    }

    45% {
        -webkit-transform: translate3d(-15%,0,0) rotate3d(0,0,1,-3deg);
        transform: translate3d(-15%,0,0) rotate3d(0,0,1,-3deg)
    }

    60% {
        -webkit-transform: translate3d(10%,0,0) rotate3d(0,0,1,2deg);
        transform: translate3d(10%,0,0) rotate3d(0,0,1,2deg)
    }

    75% {
        -webkit-transform: translate3d(-5%,0,0) rotate3d(0,0,1,-1deg);
        transform: translate3d(-5%,0,0) rotate3d(0,0,1,-1deg)
    }

    100% {
        -webkit-transform: none;
        transform: none
    }
}

@keyframes wobble {
    0% {
        -webkit-transform: none;
        transform: none
    }

    15% {
        -webkit-transform: translate3d(-25%,0,0) rotate3d(0,0,1,-5deg);
        transform: translate3d(-25%,0,0) rotate3d(0,0,1,-5deg)
    }

    30% {
        -webkit-transform: translate3d(20%,0,0) rotate3d(0,0,1,3deg);
        transform: translate3d(20%,0,0) rotate3d(0,0,1,3deg)
    }

    45% {
        -webkit-transform: translate3d(-15%,0,0) rotate3d(0,0,1,-3deg);
        transform: translate3d(-15%,0,0) rotate3d(0,0,1,-3deg)
    }

    60% {
        -webkit-transform: translate3d(10%,0,0) rotate3d(0,0,1,2deg);
        transform: translate3d(10%,0,0) rotate3d(0,0,1,2deg)
    }

    75% {
        -webkit-transform: translate3d(-5%,0,0) rotate3d(0,0,1,-1deg);
        transform: translate3d(-5%,0,0) rotate3d(0,0,1,-1deg)
    }

    100% {
        -webkit-transform: none;
        transform: none
    }
}

.wobble {
    -webkit-animation-name: wobble;
    animation-name: wobble
}

@-webkit-keyframes bounceIn {
    0%,100%,20%,40%,60%,80% {
        -webkit-transition-timing-function: cubic-bezier(.215,.61,.355,1);
        transition-timing-function: cubic-bezier(.215,.61,.355,1)
    }

    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%,100%,20%,40%,60%,80% {
        -webkit-transition-timing-function: cubic-bezier(.215,.61,.355,1);
        transition-timing-function: cubic-bezier(.215,.61,.355,1)
    }

    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)
    }
}

.bounceIn {
    -webkit-animation-name: bounceIn;
    animation-name: bounceIn;
    -webkit-animation-duration: .75s;
    animation-duration: .75s
}

@-webkit-keyframes bounceInDown {
    0%,100%,60%,75%,90% {
        -webkit-transition-timing-function: cubic-bezier(.215,.61,.355,1);
        transition-timing-function: cubic-bezier(.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(.215,.61,.355,1);
        transition-timing-function: cubic-bezier(.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
    }
}

.bounceInDown {
    -webkit-animation-name: bounceInDown;
    animation-name: bounceInDown
}

@-webkit-keyframes bounceInLeft {
    0%,100%,60%,75%,90% {
        -webkit-transition-timing-function: cubic-bezier(.215,.61,.355,1);
        transition-timing-function: cubic-bezier(.215,.61,.355,1)
    }

    0% {
        opacity: 0;
        -webkit-transform: translate3d(-3000px,0,0);
        transform: translate3d(-3000px,0,0)
    }

    60% {
        opacity: 1;
        -webkit-transform: translate3d(25px,0,0);
        transform: translate3d(25px,0,0)
    }

    75% {
        -webkit-transform: translate3d(-10px,0,0);
        transform: translate3d(-10px,0,0)
    }

    90% {
        -webkit-transform: translate3d(5px,0,0);
        transform: translate3d(5px,0,0)
    }

    100% {
        -webkit-transform: none;
        transform: none
    }
}

@keyframes bounceInLeft {
    0%,100%,60%,75%,90% {
        -webkit-transition-timing-function: cubic-bezier(.215,.61,.355,1);
        transition-timing-function: cubic-bezier(.215,.61,.355,1)
    }

    0% {
        opacity: 0;
        -webkit-transform: translate3d(-3000px,0,0);
        transform: translate3d(-3000px,0,0)
    }

    60% {
        opacity: 1;
        -webkit-transform: translate3d(25px,0,0);
        transform: translate3d(25px,0,0)
    }

    75% {
        -webkit-transform: translate3d(-10px,0,0);
        transform: translate3d(-10px,0,0)
    }

    90% {
        -webkit-transform: translate3d(5px,0,0);
        transform: translate3d(5px,0,0)
    }

    100% {
        -webkit-transform: none;
        transform: none
    }
}

.bounceInLeft {
    -webkit-animation-name: bounceInLeft;
    animation-name: bounceInLeft
}

@-webkit-keyframes bounceInRight {
    0%,100%,60%,75%,90% {
        -webkit-transition-timing-function: cubic-bezier(.215,.61,.355,1);
        transition-timing-function: cubic-bezier(.215,.61,.355,1)
    }

    0% {
        opacity: 0;
        -webkit-transform: translate3d(3000px,0,0);
        transform: translate3d(3000px,0,0)
    }

    60% {
        opacity: 1;
        -webkit-transform: translate3d(-25px,0,0);
        transform: translate3d(-25px,0,0)
    }

    75% {
        -webkit-transform: translate3d(10px,0,0);
        transform: translate3d(10px,0,0)
    }

    90% {
        -webkit-transform: translate3d(-5px,0,0);
        transform: translate3d(-5px,0,0)
    }

    100% {
        -webkit-transform: none;
        transform: none
    }
}

@keyframes bounceInRight {
    0%,100%,60%,75%,90% {
        -webkit-transition-timing-function: cubic-bezier(.215,.61,.355,1);
        transition-timing-function: cubic-bezier(.215,.61,.355,1)
    }

    0% {
        opacity: 0;
        -webkit-transform: translate3d(3000px,0,0);
        transform: translate3d(3000px,0,0)
    }

    60% {
        opacity: 1;
        -webkit-transform: translate3d(-25px,0,0);
        transform: translate3d(-25px,0,0)
    }

    75% {
        -webkit-transform: translate3d(10px,0,0);
        transform: translate3d(10px,0,0)
    }

    90% {
        -webkit-transform: translate3d(-5px,0,0);
        transform: translate3d(-5px,0,0)
    }

    100% {
        -webkit-transform: none;
        transform: none
    }
}

.bounceInRight {
    -webkit-animation-name: bounceInRight;
    animation-name: bounceInRight
}

@-webkit-keyframes bounceInUp {
    0%,100%,60%,75%,90% {
        -webkit-transition-timing-function: cubic-bezier(.215,.61,.355,1);
        transition-timing-function: cubic-bezier(.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,-20px,0);
        transform: translate3d(0,-20px,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: translate3d(0,0,0);
        transform: translate3d(0,0,0)
    }
}

@keyframes bounceInUp {
    0%,100%,60%,75%,90% {
        -webkit-transition-timing-function: cubic-bezier(.215,.61,.355,1);
        transition-timing-function: cubic-bezier(.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,-20px,0);
        transform: translate3d(0,-20px,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: translate3d(0,0,0);
        transform: translate3d(0,0,0)
    }
}

.bounceInUp {
    -webkit-animation-name: bounceInUp;
    animation-name: bounceInUp
}

@-webkit-keyframes bounceOut {
    20% {
        -webkit-transform: scale3d(.9,.9,.9);
        transform: scale3d(.9,.9,.9)
    }

    50%,55% {
        opacity: 1;
        -webkit-transform: scale3d(1.1,1.1,1.1);
        transform: scale3d(1.1,1.1,1.1)
    }

    100% {
        opacity: 0;
        -webkit-transform: scale3d(.3,.3,.3);
        transform: scale3d(.3,.3,.3)
    }
}

@keyframes bounceOut {
    20% {
        -webkit-transform: scale3d(.9,.9,.9);
        transform: scale3d(.9,.9,.9)
    }

    50%,55% {
        opacity: 1;
        -webkit-transform: scale3d(1.1,1.1,1.1);
        transform: scale3d(1.1,1.1,1.1)
    }

    100% {
        opacity: 0;
        -webkit-transform: scale3d(.3,.3,.3);
        transform: scale3d(.3,.3,.3)
    }
}

.bounceOut {
    -webkit-animation-name: bounceOut;
    animation-name: bounceOut;
    -webkit-animation-duration: .75s;
    animation-duration: .75s
}

@-webkit-keyframes bounceOutDown {
    20% {
        -webkit-transform: translate3d(0,10px,0);
        transform: translate3d(0,10px,0)
    }

    40%,45% {
        opacity: 1;
        -webkit-transform: translate3d(0,-20px,0);
        transform: translate3d(0,-20px,0)
    }

    100% {
        opacity: 0;
        -webkit-transform: translate3d(0,2000px,0);
        transform: translate3d(0,2000px,0)
    }
}

@keyframes bounceOutDown {
    20% {
        -webkit-transform: translate3d(0,10px,0);
        transform: translate3d(0,10px,0)
    }

    40%,45% {
        opacity: 1;
        -webkit-transform: translate3d(0,-20px,0);
        transform: translate3d(0,-20px,0)
    }

    100% {
        opacity: 0;
        -webkit-transform: translate3d(0,2000px,0);
        transform: translate3d(0,2000px,0)
    }
}

.bounceOutDown {
    -webkit-animation-name: bounceOutDown;
    animation-name: bounceOutDown
}

@-webkit-keyframes bounceOutLeft {
    20% {
        opacity: 1;
        -webkit-transform: translate3d(20px,0,0);
        transform: translate3d(20px,0,0)
    }

    100% {
        opacity: 0;
        -webkit-transform: translate3d(-2000px,0,0);
        transform: translate3d(-2000px,0,0)
    }
}

@keyframes bounceOutLeft {
    20% {
        opacity: 1;
        -webkit-transform: translate3d(20px,0,0);
        transform: translate3d(20px,0,0)
    }

    100% {
        opacity: 0;
        -webkit-transform: translate3d(-2000px,0,0);
        transform: translate3d(-2000px,0,0)
    }
}

.bounceOutLeft {
    -webkit-animation-name: bounceOutLeft;
    animation-name: bounceOutLeft
}

@-webkit-keyframes bounceOutRight {
    20% {
        opacity: 1;
        -webkit-transform: translate3d(-20px,0,0);
        transform: translate3d(-20px,0,0)
    }

    100% {
        opacity: 0;
        -webkit-transform: translate3d(2000px,0,0);
        transform: translate3d(2000px,0,0)
    }
}

@keyframes bounceOutRight {
    20% {
        opacity: 1;
        -webkit-transform: translate3d(-20px,0,0);
        transform: translate3d(-20px,0,0)
    }

    100% {
        opacity: 0;
        -webkit-transform: translate3d(2000px,0,0);
        transform: translate3d(2000px,0,0)
    }
}

.bounceOutRight {
    -webkit-animation-name: bounceOutRight;
    animation-name: bounceOutRight
}

@-webkit-keyframes bounceOutUp {
    20% {
        -webkit-transform: translate3d(0,-10px,0);
        transform: translate3d(0,-10px,0)
    }

    40%,45% {
        opacity: 1;
        -webkit-transform: translate3d(0,20px,0);
        transform: translate3d(0,20px,0)
    }

    100% {
        opacity: 0;
        -webkit-transform: translate3d(0,-2000px,0);
        transform: translate3d(0,-2000px,0)
    }
}

@keyframes bounceOutUp {
    20% {
        -webkit-transform: translate3d(0,-10px,0);
        transform: translate3d(0,-10px,0)
    }

    40%,45% {
        opacity: 1;
        -webkit-transform: translate3d(0,20px,0);
        transform: translate3d(0,20px,0)
    }

    100% {
        opacity: 0;
        -webkit-transform: translate3d(0,-2000px,0);
        transform: translate3d(0,-2000px,0)
    }
}

.bounceOutUp {
    -webkit-animation-name: bounceOutUp;
    animation-name: bounceOutUp
}

@-webkit-keyframes fadeIn {
    0% {
        opacity: 0
    }

    100% {
        opacity: 1
    }
}

@keyframes fadeIn {
    0% {
        opacity: 0
    }

    100% {
        opacity: 1
    }
}

.fadeIn {
    -webkit-animation-name: fadeIn;
    animation-name: fadeIn
}

@-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);
        transform: translate3d(0,-100%,0)
    }

    100% {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

.fadeInDown {
    -webkit-animation-name: fadeInDown;
    animation-name: fadeInDown
}

@-webkit-keyframes fadeInDownBig {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0,-2000px,0);
        transform: translate3d(0,-2000px,0)
    }

    100% {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

@keyframes fadeInDownBig {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0,-2000px,0);
        transform: translate3d(0,-2000px,0)
    }

    100% {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

.fadeInDownBig {
    -webkit-animation-name: fadeInDownBig;
    animation-name: fadeInDownBig
}

@-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 {
    -webkit-animation-name: fadeInLeft;
    animation-name: fadeInLeft
}

@-webkit-keyframes fadeInLeftBig {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(-2000px,0,0);
        transform: translate3d(-2000px,0,0)
    }

    100% {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

@keyframes fadeInLeftBig {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(-2000px,0,0);
        transform: translate3d(-2000px,0,0)
    }

    100% {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

.fadeInLeftBig {
    -webkit-animation-name: fadeInLeftBig;
    animation-name: fadeInLeftBig
}

@-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);
        transform: translate3d(100%,0,0)
    }

    100% {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

.fadeInRight {
    -webkit-animation-name: fadeInRight;
    animation-name: fadeInRight
}

@-webkit-keyframes fadeInRightBig {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(2000px,0,0);
        transform: translate3d(2000px,0,0)
    }

    100% {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

@keyframes fadeInRightBig {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(2000px,0,0);
        transform: translate3d(2000px,0,0)
    }

    100% {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

.fadeInRightBig {
    -webkit-animation-name: fadeInRightBig;
    animation-name: fadeInRightBig
}

@-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);
        transform: translate3d(0,100%,0)
    }

    100% {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

.fadeInUp {
    -webkit-animation-name: fadeInUp;
    animation-name: fadeInUp
}

@-webkit-keyframes fadeInUpBig {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0,2000px,0);
        transform: translate3d(0,2000px,0)
    }

    100% {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

@keyframes fadeInUpBig {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0,2000px,0);
        transform: translate3d(0,2000px,0)
    }

    100% {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

.fadeInUpBig {
    -webkit-animation-name: fadeInUpBig;
    animation-name: fadeInUpBig
}

@-webkit-keyframes fadeOut {
    0% {
        opacity: 1
    }

    100% {
        opacity: 0
    }
}

@keyframes fadeOut {
    0% {
        opacity: 1
    }

    100% {
        opacity: 0
    }
}

.fadeOut {
    -webkit-animation-name: fadeOut;
    animation-name: fadeOut
}

@-webkit-keyframes fadeOutDown {
    0% {
        opacity: 1
    }

    100% {
        opacity: 0;
        -webkit-transform: translate3d(0,100%,0);
        transform: translate3d(0,100%,0)
    }
}

@keyframes fadeOutDown {
    0% {
        opacity: 1
    }

    100% {
        opacity: 0;
        -webkit-transform: translate3d(0,100%,0);
        transform: translate3d(0,100%,0)
    }
}

.fadeOutDown {
    -webkit-animation-name: fadeOutDown;
    animation-name: fadeOutDown
}

@-webkit-keyframes fadeOutDownBig {
    0% {
        opacity: 1
    }

    100% {
        opacity: 0;
        -webkit-transform: translate3d(0,2000px,0);
        transform: translate3d(0,2000px,0)
    }
}

@keyframes fadeOutDownBig {
    0% {
        opacity: 1
    }

    100% {
        opacity: 0;
        -webkit-transform: translate3d(0,2000px,0);
        transform: translate3d(0,2000px,0)
    }
}

.fadeOutDownBig {
    -webkit-animation-name: fadeOutDownBig;
    animation-name: fadeOutDownBig
}

@-webkit-keyframes fadeOutLeft {
    0% {
        opacity: 1
    }

    100% {
        opacity: 0;
        -webkit-transform: translate3d(-100%,0,0);
        transform: translate3d(-100%,0,0)
    }
}

@keyframes fadeOutLeft {
    0% {
        opacity: 1
    }

    100% {
        opacity: 0;
        -webkit-transform: translate3d(-100%,0,0);
        transform: translate3d(-100%,0,0)
    }
}

.fadeOutLeft {
    -webkit-animation-name: fadeOutLeft;
    animation-name: fadeOutLeft
}

@-webkit-keyframes fadeOutLeftBig {
    0% {
        opacity: 1
    }

    100% {
        opacity: 0;
        -webkit-transform: translate3d(-2000px,0,0);
        transform: translate3d(-2000px,0,0)
    }
}

@keyframes fadeOutLeftBig {
    0% {
        opacity: 1
    }

    100% {
        opacity: 0;
        -webkit-transform: translate3d(-2000px,0,0);
        transform: translate3d(-2000px,0,0)
    }
}

.fadeOutLeftBig {
    -webkit-animation-name: fadeOutLeftBig;
    animation-name: fadeOutLeftBig
}

@-webkit-keyframes fadeOutRight {
    0% {
        opacity: 1
    }

    100% {
        opacity: 0;
        -webkit-transform: translate3d(100%,0,0);
        transform: translate3d(100%,0,0)
    }
}

@keyframes fadeOutRight {
    0% {
        opacity: 1
    }

    100% {
        opacity: 0;
        -webkit-transform: translate3d(100%,0,0);
        transform: translate3d(100%,0,0)
    }
}

.fadeOutRight {
    -webkit-animation-name: fadeOutRight;
    animation-name: fadeOutRight
}

@-webkit-keyframes fadeOutRightBig {
    0% {
        opacity: 1
    }

    100% {
        opacity: 0;
        -webkit-transform: translate3d(2000px,0,0);
        transform: translate3d(2000px,0,0)
    }
}

@keyframes fadeOutRightBig {
    0% {
        opacity: 1
    }

    100% {
        opacity: 0;
        -webkit-transform: translate3d(2000px,0,0);
        transform: translate3d(2000px,0,0)
    }
}

.fadeOutRightBig {
    -webkit-animation-name: fadeOutRightBig;
    animation-name: fadeOutRightBig
}

@-webkit-keyframes fadeOutUp {
    0% {
        opacity: 1
    }

    100% {
        opacity: 0;
        -webkit-transform: translate3d(0,-100%,0);
        transform: translate3d(0,-100%,0)
    }
}

@keyframes fadeOutUp {
    0% {
        opacity: 1
    }

    100% {
        opacity: 0;
        -webkit-transform: translate3d(0,-100%,0);
        transform: translate3d(0,-100%,0)
    }
}

.fadeOutUp {
    -webkit-animation-name: fadeOutUp;
    animation-name: fadeOutUp
}

@-webkit-keyframes fadeOutUpBig {
    0% {
        opacity: 1
    }

    100% {
        opacity: 0;
        -webkit-transform: translate3d(0,-2000px,0);
        transform: translate3d(0,-2000px,0)
    }
}

@keyframes fadeOutUpBig {
    0% {
        opacity: 1
    }

    100% {
        opacity: 0;
        -webkit-transform: translate3d(0,-2000px,0);
        transform: translate3d(0,-2000px,0)
    }
}

.fadeOutUpBig {
    -webkit-animation-name: fadeOutUpBig;
    animation-name: fadeOutUpBig
}

@-webkit-keyframes flip {
    0% {
        -webkit-transform: perspective(400px) rotate3d(0,1,0,-360deg);
        transform: perspective(400px) rotate3d(0,1,0,-360deg);
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out
    }

    40% {
        -webkit-transform: perspective(400px) translate3d(0,0,150px) rotate3d(0,1,0,-190deg);
        transform: perspective(400px) translate3d(0,0,150px) rotate3d(0,1,0,-190deg);
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out
    }

    50% {
        -webkit-transform: perspective(400px) translate3d(0,0,150px) rotate3d(0,1,0,-170deg);
        transform: perspective(400px) translate3d(0,0,150px) rotate3d(0,1,0,-170deg);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in
    }

    80% {
        -webkit-transform: perspective(400px) scale3d(.95,.95,.95);
        transform: perspective(400px) scale3d(.95,.95,.95);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in
    }

    100% {
        -webkit-transform: perspective(400px);
        transform: perspective(400px);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in
    }
}

@keyframes flip {
    0% {
        -webkit-transform: perspective(400px) rotate3d(0,1,0,-360deg);
        transform: perspective(400px) rotate3d(0,1,0,-360deg);
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out
    }

    40% {
        -webkit-transform: perspective(400px) translate3d(0,0,150px) rotate3d(0,1,0,-190deg);
        transform: perspective(400px) translate3d(0,0,150px) rotate3d(0,1,0,-190deg);
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out
    }

    50% {
        -webkit-transform: perspective(400px) translate3d(0,0,150px) rotate3d(0,1,0,-170deg);
        transform: perspective(400px) translate3d(0,0,150px) rotate3d(0,1,0,-170deg);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in
    }

    80% {
        -webkit-transform: perspective(400px) scale3d(.95,.95,.95);
        transform: perspective(400px) scale3d(.95,.95,.95);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in
    }

    100% {
        -webkit-transform: perspective(400px);
        transform: perspective(400px);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in
    }
}

.animated.flip {
    -webkit-backface-visibility: visible;
    backface-visibility: visible;
    -webkit-animation-name: flip;
    animation-name: flip
}

@-webkit-keyframes flipInX {
    0% {
        -webkit-transform: perspective(400px) rotate3d(1,0,0,90deg);
        transform: perspective(400px) rotate3d(1,0,0,90deg);
        -webkit-transition-timing-function: ease-in;
        transition-timing-function: ease-in;
        opacity: 0
    }

    40% {
        -webkit-transform: perspective(400px) rotate3d(1,0,0,-20deg);
        transform: perspective(400px) rotate3d(1,0,0,-20deg);
        -webkit-transition-timing-function: ease-in;
        transition-timing-function: ease-in
    }

    60% {
        -webkit-transform: perspective(400px) rotate3d(1,0,0,10deg);
        transform: perspective(400px) rotate3d(1,0,0,10deg);
        opacity: 1
    }

    80% {
        -webkit-transform: perspective(400px) rotate3d(1,0,0,-5deg);
        transform: perspective(400px) rotate3d(1,0,0,-5deg)
    }

    100% {
        -webkit-transform: perspective(400px);
        transform: perspective(400px)
    }
}

@keyframes flipInX {
    0% {
        -webkit-transform: perspective(400px) rotate3d(1,0,0,90deg);
        transform: perspective(400px) rotate3d(1,0,0,90deg);
        -webkit-transition-timing-function: ease-in;
        transition-timing-function: ease-in;
        opacity: 0
    }

    40% {
        -webkit-transform: perspective(400px) rotate3d(1,0,0,-20deg);
        transform: perspective(400px) rotate3d(1,0,0,-20deg);
        -webkit-transition-timing-function: ease-in;
        transition-timing-function: ease-in
    }

    60% {
        -webkit-transform: perspective(400px) rotate3d(1,0,0,10deg);
        transform: perspective(400px) rotate3d(1,0,0,10deg);
        opacity: 1
    }

    80% {
        -webkit-transform: perspective(400px) rotate3d(1,0,0,-5deg);
        transform: perspective(400px) rotate3d(1,0,0,-5deg)
    }

    100% {
        -webkit-transform: perspective(400px);
        transform: perspective(400px)
    }
}

.flipInX {
    -webkit-backface-visibility: visible!important;
    backface-visibility: visible!important;
    -webkit-animation-name: flipInX;
    animation-name: flipInX
}

@-webkit-keyframes flipInY {
    0% {
        -webkit-transform: perspective(400px) rotate3d(0,1,0,90deg);
        transform: perspective(400px) rotate3d(0,1,0,90deg);
        -webkit-transition-timing-function: ease-in;
        transition-timing-function: ease-in;
        opacity: 0
    }

    40% {
        -webkit-transform: perspective(400px) rotate3d(0,1,0,-20deg);
        transform: perspective(400px) rotate3d(0,1,0,-20deg);
        -webkit-transition-timing-function: ease-in;
        transition-timing-function: ease-in
    }

    60% {
        -webkit-transform: perspective(400px) rotate3d(0,1,0,10deg);
        transform: perspective(400px) rotate3d(0,1,0,10deg);
        opacity: 1
    }

    80% {
        -webkit-transform: perspective(400px) rotate3d(0,1,0,-5deg);
        transform: perspective(400px) rotate3d(0,1,0,-5deg)
    }

    100% {
        -webkit-transform: perspective(400px);
        transform: perspective(400px)
    }
}

@keyframes flipInY {
    0% {
        -webkit-transform: perspective(400px) rotate3d(0,1,0,90deg);
        transform: perspective(400px) rotate3d(0,1,0,90deg);
        -webkit-transition-timing-function: ease-in;
        transition-timing-function: ease-in;
        opacity: 0
    }

    40% {
        -webkit-transform: perspective(400px) rotate3d(0,1,0,-20deg);
        transform: perspective(400px) rotate3d(0,1,0,-20deg);
        -webkit-transition-timing-function: ease-in;
        transition-timing-function: ease-in
    }

    60% {
        -webkit-transform: perspective(400px) rotate3d(0,1,0,10deg);
        transform: perspective(400px) rotate3d(0,1,0,10deg);
        opacity: 1
    }

    80% {
        -webkit-transform: perspective(400px) rotate3d(0,1,0,-5deg);
        transform: perspective(400px) rotate3d(0,1,0,-5deg)
    }

    100% {
        -webkit-transform: perspective(400px);
        transform: perspective(400px)
    }
}

.flipInY {
    -webkit-backface-visibility: visible!important;
    backface-visibility: visible!important;
    -webkit-animation-name: flipInY;
    animation-name: flipInY
}

@-webkit-keyframes flipOutX {
    0% {
        -webkit-transform: perspective(400px);
        transform: perspective(400px)
    }

    30% {
        -webkit-transform: perspective(400px) rotate3d(1,0,0,-20deg);
        transform: perspective(400px) rotate3d(1,0,0,-20deg);
        opacity: 1
    }

    100% {
        -webkit-transform: perspective(400px) rotate3d(1,0,0,90deg);
        transform: perspective(400px) rotate3d(1,0,0,90deg);
        opacity: 0
    }
}

@keyframes flipOutX {
    0% {
        -webkit-transform: perspective(400px);
        transform: perspective(400px)
    }

    30% {
        -webkit-transform: perspective(400px) rotate3d(1,0,0,-20deg);
        transform: perspective(400px) rotate3d(1,0,0,-20deg);
        opacity: 1
    }

    100% {
        -webkit-transform: perspective(400px) rotate3d(1,0,0,90deg);
        transform: perspective(400px) rotate3d(1,0,0,90deg);
        opacity: 0
    }
}

.flipOutX {
    -webkit-animation-name: flipOutX;
    animation-name: flipOutX;
    -webkit-animation-duration: .75s;
    animation-duration: .75s;
    -webkit-backface-visibility: visible!important;
    backface-visibility: visible!important
}

@-webkit-keyframes flipOutY {
    0% {
        -webkit-transform: perspective(400px);
        transform: perspective(400px)
    }

    30% {
        -webkit-transform: perspective(400px) rotate3d(0,1,0,-15deg);
        transform: perspective(400px) rotate3d(0,1,0,-15deg);
        opacity: 1
    }

    100% {
        -webkit-transform: perspective(400px) rotate3d(0,1,0,90deg);
        transform: perspective(400px) rotate3d(0,1,0,90deg);
        opacity: 0
    }
}

@keyframes flipOutY {
    0% {
        -webkit-transform: perspective(400px);
        transform: perspective(400px)
    }

    30% {
        -webkit-transform: perspective(400px) rotate3d(0,1,0,-15deg);
        transform: perspective(400px) rotate3d(0,1,0,-15deg);
        opacity: 1
    }

    100% {
        -webkit-transform: perspective(400px) rotate3d(0,1,0,90deg);
        transform: perspective(400px) rotate3d(0,1,0,90deg);
        opacity: 0
    }
}

.flipOutY {
    -webkit-backface-visibility: visible!important;
    backface-visibility: visible!important;
    -webkit-animation-name: flipOutY;
    animation-name: flipOutY;
    -webkit-animation-duration: .75s;
    animation-duration: .75s
}

@-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
    }
}

@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
    }
}

.lightSpeedIn {
    -webkit-animation-name: lightSpeedIn;
    animation-name: lightSpeedIn;
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out
}

@-webkit-keyframes lightSpeedOut {
    0% {
        opacity: 1
    }

    100% {
        -webkit-transform: translate3d(100%,0,0) skewX(30deg);
        transform: translate3d(100%,0,0) skewX(30deg);
        opacity: 0
    }
}

@keyframes lightSpeedOut {
    0% {
        opacity: 1
    }

    100% {
        -webkit-transform: translate3d(100%,0,0) skewX(30deg);
        transform: translate3d(100%,0,0) skewX(30deg);
        opacity: 0
    }
}

.lightSpeedOut {
    -webkit-animation-name: lightSpeedOut;
    animation-name: lightSpeedOut;
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in
}

@-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
    }
}

.rotateIn {
    -webkit-animation-name: rotateIn;
    animation-name: rotateIn
}

@-webkit-keyframes rotateInDownLeft {
    0% {
        -webkit-transform-origin: left bottom;
        transform-origin: left bottom;
        -webkit-transform: rotate3d(0,0,1,-45deg);
        transform: rotate3d(0,0,1,-45deg);
        opacity: 0
    }

    100% {
        -webkit-transform-origin: left bottom;
        transform-origin: left bottom;
        -webkit-transform: none;
        transform: none;
        opacity: 1
    }
}

@keyframes rotateInDownLeft {
    0% {
        -webkit-transform-origin: left bottom;
        transform-origin: left bottom;
        -webkit-transform: rotate3d(0,0,1,-45deg);
        transform: rotate3d(0,0,1,-45deg);
        opacity: 0
    }

    100% {
        -webkit-transform-origin: left bottom;
        transform-origin: left bottom;
        -webkit-transform: none;
        transform: none;
        opacity: 1
    }
}

.rotateInDownLeft {
    -webkit-animation-name: rotateInDownLeft;
    animation-name: rotateInDownLeft
}

@-webkit-keyframes rotateInDownRight {
    0% {
        -webkit-transform-origin: right bottom;
        transform-origin: right bottom;
        -webkit-transform: rotate3d(0,0,1,45deg);
        transform: rotate3d(0,0,1,45deg);
        opacity: 0
    }

    100% {
        -webkit-transform-origin: right bottom;
        transform-origin: right bottom;
        -webkit-transform: none;
        transform: none;
        opacity: 1
    }
}

@keyframes rotateInDownRight {
    0% {
        -webkit-transform-origin: right bottom;
        transform-origin: right bottom;
        -webkit-transform: rotate3d(0,0,1,45deg);
        transform: rotate3d(0,0,1,45deg);
        opacity: 0
    }

    100% {
        -webkit-transform-origin: right bottom;
        transform-origin: right bottom;
        -webkit-transform: none;
        transform: none;
        opacity: 1
    }
}

.rotateInDownRight {
    -webkit-animation-name: rotateInDownRight;
    animation-name: rotateInDownRight
}

@-webkit-keyframes rotateInUpLeft {
    0% {
        -webkit-transform-origin: left bottom;
        transform-origin: left bottom;
        -webkit-transform: rotate3d(0,0,1,45deg);
        transform: rotate3d(0,0,1,45deg);
        opacity: 0
    }

    100% {
        -webkit-transform-origin: left bottom;
        transform-origin: left bottom;
        -webkit-transform: none;
        transform: none;
        opacity: 1
    }
}

@keyframes rotateInUpLeft {
    0% {
        -webkit-transform-origin: left bottom;
        transform-origin: left bottom;
        -webkit-transform: rotate3d(0,0,1,45deg);
        transform: rotate3d(0,0,1,45deg);
        opacity: 0
    }

    100% {
        -webkit-transform-origin: left bottom;
        transform-origin: left bottom;
        -webkit-transform: none;
        transform: none;
        opacity: 1
    }
}

.rotateInUpLeft {
    -webkit-animation-name: rotateInUpLeft;
    animation-name: rotateInUpLeft
}

@-webkit-keyframes rotateInUpRight {
    0% {
        -webkit-transform-origin: right bottom;
        transform-origin: right bottom;
        -webkit-transform: rotate3d(0,0,1,-90deg);
        transform: rotate3d(0,0,1,-90deg);
        opacity: 0
    }

    100% {
        -webkit-transform-origin: right bottom;
        transform-origin: right bottom;
        -webkit-transform: none;
        transform: none;
        opacity: 1
    }
}

@keyframes rotateInUpRight {
    0% {
        -webkit-transform-origin: right bottom;
        transform-origin: right bottom;
        -webkit-transform: rotate3d(0,0,1,-90deg);
        transform: rotate3d(0,0,1,-90deg);
        opacity: 0
    }

    100% {
        -webkit-transform-origin: right bottom;
        transform-origin: right bottom;
        -webkit-transform: none;
        transform: none;
        opacity: 1
    }
}

.rotateInUpRight {
    -webkit-animation-name: rotateInUpRight;
    animation-name: rotateInUpRight
}

@-webkit-keyframes rotateOut {
    0% {
        -webkit-transform-origin: center;
        transform-origin: center;
        opacity: 1
    }

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

@keyframes rotateOut {
    0% {
        -webkit-transform-origin: center;
        transform-origin: center;
        opacity: 1
    }

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

.rotateOut {
    -webkit-animation-name: rotateOut;
    animation-name: rotateOut
}

@-webkit-keyframes rotateOutDownLeft {
    0% {
        -webkit-transform-origin: left bottom;
        transform-origin: left bottom;
        opacity: 1
    }

    100% {
        -webkit-transform-origin: left bottom;
        transform-origin: left bottom;
        -webkit-transform: rotate3d(0,0,1,45deg);
        transform: rotate3d(0,0,1,45deg);
        opacity: 0
    }
}

@keyframes rotateOutDownLeft {
    0% {
        -webkit-transform-origin: left bottom;
        transform-origin: left bottom;
        opacity: 1
    }

    100% {
        -webkit-transform-origin: left bottom;
        transform-origin: left bottom;
        -webkit-transform: rotate3d(0,0,1,45deg);
        transform: rotate3d(0,0,1,45deg);
        opacity: 0
    }
}

.rotateOutDownLeft {
    -webkit-animation-name: rotateOutDownLeft;
    animation-name: rotateOutDownLeft
}

@-webkit-keyframes rotateOutDownRight {
    0% {
        -webkit-transform-origin: right bottom;
        transform-origin: right bottom;
        opacity: 1
    }

    100% {
        -webkit-transform-origin: right bottom;
        transform-origin: right bottom;
        -webkit-transform: rotate3d(0,0,1,-45deg);
        transform: rotate3d(0,0,1,-45deg);
        opacity: 0
    }
}

@keyframes rotateOutDownRight {
    0% {
        -webkit-transform-origin: right bottom;
        transform-origin: right bottom;
        opacity: 1
    }

    100% {
        -webkit-transform-origin: right bottom;
        transform-origin: right bottom;
        -webkit-transform: rotate3d(0,0,1,-45deg);
        transform: rotate3d(0,0,1,-45deg);
        opacity: 0
    }
}

.rotateOutDownRight {
    -webkit-animation-name: rotateOutDownRight;
    animation-name: rotateOutDownRight
}

@-webkit-keyframes rotateOutUpLeft {
    0% {
        -webkit-transform-origin: left bottom;
        transform-origin: left bottom;
        opacity: 1
    }

    100% {
        -webkit-transform-origin: left bottom;
        transform-origin: left bottom;
        -webkit-transform: rotate3d(0,0,1,-45deg);
        transform: rotate3d(0,0,1,-45deg);
        opacity: 0
    }
}

@keyframes rotateOutUpLeft {
    0% {
        -webkit-transform-origin: left bottom;
        transform-origin: left bottom;
        opacity: 1
    }

    100% {
        -webkit-transform-origin: left bottom;
        transform-origin: left bottom;
        -webkit-transform: rotate3d(0,0,1,-45deg);
        transform: rotate3d(0,0,1,-45deg);
        opacity: 0
    }
}

.rotateOutUpLeft {
    -webkit-animation-name: rotateOutUpLeft;
    animation-name: rotateOutUpLeft
}

@-webkit-keyframes rotateOutUpRight {
    0% {
        -webkit-transform-origin: right bottom;
        transform-origin: right bottom;
        opacity: 1
    }

    100% {
        -webkit-transform-origin: right bottom;
        transform-origin: right bottom;
        -webkit-transform: rotate3d(0,0,1,90deg);
        transform: rotate3d(0,0,1,90deg);
        opacity: 0
    }
}

@keyframes rotateOutUpRight {
    0% {
        -webkit-transform-origin: right bottom;
        transform-origin: right bottom;
        opacity: 1
    }

    100% {
        -webkit-transform-origin: right bottom;
        transform-origin: right bottom;
        -webkit-transform: rotate3d(0,0,1,90deg);
        transform: rotate3d(0,0,1,90deg);
        opacity: 0
    }
}

.rotateOutUpRight {
    -webkit-animation-name: rotateOutUpRight;
    animation-name: rotateOutUpRight
}

@-webkit-keyframes hinge {
    0% {
        -webkit-transform-origin: top left;
        transform-origin: top left;
        -webkit-animation-timing-function: ease-in-out;
        animation-timing-function: ease-in-out
    }

    20%,60% {
        -webkit-transform: rotate3d(0,0,1,80deg);
        transform: rotate3d(0,0,1,80deg);
        -webkit-transform-origin: top left;
        transform-origin: top left;
        -webkit-animation-timing-function: ease-in-out;
        animation-timing-function: ease-in-out
    }

    40%,80% {
        -webkit-transform: rotate3d(0,0,1,60deg);
        transform: rotate3d(0,0,1,60deg);
        -webkit-transform-origin: top left;
        transform-origin: top left;
        -webkit-animation-timing-function: ease-in-out;
        animation-timing-function: ease-in-out;
        opacity: 1
    }

    100% {
        -webkit-transform: translate3d(0,700px,0);
        transform: translate3d(0,700px,0);
        opacity: 0
    }
}

@keyframes hinge {
    0% {
        -webkit-transform-origin: top left;
        transform-origin: top left;
        -webkit-animation-timing-function: ease-in-out;
        animation-timing-function: ease-in-out
    }

    20%,60% {
        -webkit-transform: rotate3d(0,0,1,80deg);
        transform: rotate3d(0,0,1,80deg);
        -webkit-transform-origin: top left;
        transform-origin: top left;
        -webkit-animation-timing-function: ease-in-out;
        animation-timing-function: ease-in-out
    }

    40%,80% {
        -webkit-transform: rotate3d(0,0,1,60deg);
        transform: rotate3d(0,0,1,60deg);
        -webkit-transform-origin: top left;
        transform-origin: top left;
        -webkit-animation-timing-function: ease-in-out;
        animation-timing-function: ease-in-out;
        opacity: 1
    }

    100% {
        -webkit-transform: translate3d(0,700px,0);
        transform: translate3d(0,700px,0);
        opacity: 0
    }
}

.hinge {
    -webkit-animation-name: hinge;
    animation-name: hinge
}

@-webkit-keyframes rollIn {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(-100%,0,0) rotate3d(0,0,1,-120deg);
        transform: translate3d(-100%,0,0) rotate3d(0,0,1,-120deg)
    }

    100% {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

@keyframes rollIn {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(-100%,0,0) rotate3d(0,0,1,-120deg);
        transform: translate3d(-100%,0,0) rotate3d(0,0,1,-120deg)
    }

    100% {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

.rollIn {
    -webkit-animation-name: rollIn;
    animation-name: rollIn
}

@-webkit-keyframes rollOut {
    0% {
        opacity: 1
    }

    100% {
        opacity: 0;
        -webkit-transform: translate3d(100%,0,0) rotate3d(0,0,1,120deg);
        transform: translate3d(100%,0,0) rotate3d(0,0,1,120deg)
    }
}

@keyframes rollOut {
    0% {
        opacity: 1
    }

    100% {
        opacity: 0;
        -webkit-transform: translate3d(100%,0,0) rotate3d(0,0,1,120deg);
        transform: translate3d(100%,0,0) rotate3d(0,0,1,120deg)
    }
}

.rollOut {
    -webkit-animation-name: rollOut;
    animation-name: rollOut
}

@-webkit-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);
        transform: scale3d(.3,.3,.3)
    }

    50% {
        opacity: 1
    }
}

.zoomIn {
    -webkit-animation-name: zoomIn;
    animation-name: zoomIn
}

@-webkit-keyframes zoomInDown {
    0% {
        opacity: 0;
        -webkit-transform: scale3d(.1,.1,.1) translate3d(0,-1000px,0);
        transform: scale3d(.1,.1,.1) translate3d(0,-1000px,0);
        -webkit-animation-timing-function: cubic-bezier(.55,.055,.675,.19);
        animation-timing-function: cubic-bezier(.55,.055,.675,.19)
    }

    60% {
        opacity: 1;
        -webkit-transform: scale3d(.475,.475,.475) translate3d(0,60px,0);
        transform: scale3d(.475,.475,.475) translate3d(0,60px,0);
        -webkit-animation-timing-function: cubic-bezier(.175,.885,.32,1);
        animation-timing-function: cubic-bezier(.175,.885,.32,1)
    }
}

@keyframes zoomInDown {
    0% {
        opacity: 0;
        -webkit-transform: scale3d(.1,.1,.1) translate3d(0,-1000px,0);
        transform: scale3d(.1,.1,.1) translate3d(0,-1000px,0);
        -webkit-animation-timing-function: cubic-bezier(.55,.055,.675,.19);
        animation-timing-function: cubic-bezier(.55,.055,.675,.19)
    }

    60% {
        opacity: 1;
        -webkit-transform: scale3d(.475,.475,.475) translate3d(0,60px,0);
        transform: scale3d(.475,.475,.475) translate3d(0,60px,0);
        -webkit-animation-timing-function: cubic-bezier(.175,.885,.32,1);
        animation-timing-function: cubic-bezier(.175,.885,.32,1)
    }
}

.zoomInDown {
    -webkit-animation-name: zoomInDown;
    animation-name: zoomInDown
}

@-webkit-keyframes zoomInLeft {
    0% {
        opacity: 0;
        -webkit-transform: scale3d(.1,.1,.1) translate3d(-1000px,0,0);
        transform: scale3d(.1,.1,.1) translate3d(-1000px,0,0);
        -webkit-animation-timing-function: cubic-bezier(.55,.055,.675,.19);
        animation-timing-function: cubic-bezier(.55,.055,.675,.19)
    }

    60% {
        opacity: 1;
        -webkit-transform: scale3d(.475,.475,.475) translate3d(10px,0,0);
        transform: scale3d(.475,.475,.475) translate3d(10px,0,0);
        -webkit-animation-timing-function: cubic-bezier(.175,.885,.32,1);
        animation-timing-function: cubic-bezier(.175,.885,.32,1)
    }
}

@keyframes zoomInLeft {
    0% {
        opacity: 0;
        -webkit-transform: scale3d(.1,.1,.1) translate3d(-1000px,0,0);
        transform: scale3d(.1,.1,.1) translate3d(-1000px,0,0);
        -webkit-animation-timing-function: cubic-bezier(.55,.055,.675,.19);
        animation-timing-function: cubic-bezier(.55,.055,.675,.19)
    }

    60% {
        opacity: 1;
        -webkit-transform: scale3d(.475,.475,.475) translate3d(10px,0,0);
        transform: scale3d(.475,.475,.475) translate3d(10px,0,0);
        -webkit-animation-timing-function: cubic-bezier(.175,.885,.32,1);
        animation-timing-function: cubic-bezier(.175,.885,.32,1)
    }
}

.zoomInLeft {
    -webkit-animation-name: zoomInLeft;
    animation-name: zoomInLeft
}

@-webkit-keyframes zoomInRight {
    0% {
        opacity: 0;
        -webkit-transform: scale3d(.1,.1,.1) translate3d(1000px,0,0);
        transform: scale3d(.1,.1,.1) translate3d(1000px,0,0);
        -webkit-animation-timing-function: cubic-bezier(.55,.055,.675,.19);
        animation-timing-function: cubic-bezier(.55,.055,.675,.19)
    }

    60% {
        opacity: 1;
        -webkit-transform: scale3d(.475,.475,.475) translate3d(-10px,0,0);
        transform: scale3d(.475,.475,.475) translate3d(-10px,0,0);
        -webkit-animation-timing-function: cubic-bezier(.175,.885,.32,1);
        animation-timing-function: cubic-bezier(.175,.885,.32,1)
    }
}

@keyframes zoomInRight {
    0% {
        opacity: 0;
        -webkit-transform: scale3d(.1,.1,.1) translate3d(1000px,0,0);
        transform: scale3d(.1,.1,.1) translate3d(1000px,0,0);
        -webkit-animation-timing-function: cubic-bezier(.55,.055,.675,.19);
        animation-timing-function: cubic-bezier(.55,.055,.675,.19)
    }

    60% {
        opacity: 1;
        -webkit-transform: scale3d(.475,.475,.475) translate3d(-10px,0,0);
        transform: scale3d(.475,.475,.475) translate3d(-10px,0,0);
        -webkit-animation-timing-function: cubic-bezier(.175,.885,.32,1);
        animation-timing-function: cubic-bezier(.175,.885,.32,1)
    }
}

.zoomInRight {
    -webkit-animation-name: zoomInRight;
    animation-name: zoomInRight
}

@-webkit-keyframes zoomInUp {
    0% {
        opacity: 0;
        -webkit-transform: scale3d(.1,.1,.1) translate3d(0,1000px,0);
        transform: scale3d(.1,.1,.1) translate3d(0,1000px,0);
        -webkit-animation-timing-function: cubic-bezier(.55,.055,.675,.19);
        animation-timing-function: cubic-bezier(.55,.055,.675,.19)
    }

    60% {
        opacity: 1;
        -webkit-transform: scale3d(.475,.475,.475) translate3d(0,-60px,0);
        transform: scale3d(.475,.475,.475) translate3d(0,-60px,0);
        -webkit-animation-timing-function: cubic-bezier(.175,.885,.32,1);
        animation-timing-function: cubic-bezier(.175,.885,.32,1)
    }
}

@keyframes zoomInUp {
    0% {
        opacity: 0;
        -webkit-transform: scale3d(.1,.1,.1) translate3d(0,1000px,0);
        transform: scale3d(.1,.1,.1) translate3d(0,1000px,0);
        -webkit-animation-timing-function: cubic-bezier(.55,.055,.675,.19);
        animation-timing-function: cubic-bezier(.55,.055,.675,.19)
    }

    60% {
        opacity: 1;
        -webkit-transform: scale3d(.475,.475,.475) translate3d(0,-60px,0);
        transform: scale3d(.475,.475,.475) translate3d(0,-60px,0);
        -webkit-animation-timing-function: cubic-bezier(.175,.885,.32,1);
        animation-timing-function: cubic-bezier(.175,.885,.32,1)
    }
}

.zoomInUp {
    -webkit-animation-name: zoomInUp;
    animation-name: zoomInUp
}

@-webkit-keyframes zoomOut {
    0% {
        opacity: 1
    }

    50% {
        opacity: 0;
        -webkit-transform: scale3d(.3,.3,.3);
        transform: scale3d(.3,.3,.3)
    }

    100% {
        opacity: 0
    }
}

@keyframes zoomOut {
    0% {
        opacity: 1
    }

    50% {
        opacity: 0;
        -webkit-transform: scale3d(.3,.3,.3);
        transform: scale3d(.3,.3,.3)
    }

    100% {
        opacity: 0
    }
}

.zoomOut {
    -webkit-animation-name: zoomOut;
    animation-name: zoomOut
}

@-webkit-keyframes zoomOutDown {
    40% {
        opacity: 1;
        -webkit-transform: scale3d(.475,.475,.475) translate3d(0,-60px,0);
        transform: scale3d(.475,.475,.475) translate3d(0,-60px,0);
        -webkit-animation-timing-function: cubic-bezier(.55,.055,.675,.19);
        animation-timing-function: cubic-bezier(.55,.055,.675,.19)
    }

    100% {
        opacity: 0;
        -webkit-transform: scale3d(.1,.1,.1) translate3d(0,2000px,0);
        transform: scale3d(.1,.1,.1) translate3d(0,2000px,0);
        -webkit-transform-origin: center bottom;
        transform-origin: center bottom;
        -webkit-animation-timing-function: cubic-bezier(.175,.885,.32,1);
        animation-timing-function: cubic-bezier(.175,.885,.32,1)
    }
}

@keyframes zoomOutDown {
    40% {
        opacity: 1;
        -webkit-transform: scale3d(.475,.475,.475) translate3d(0,-60px,0);
        transform: scale3d(.475,.475,.475) translate3d(0,-60px,0);
        -webkit-animation-timing-function: cubic-bezier(.55,.055,.675,.19);
        animation-timing-function: cubic-bezier(.55,.055,.675,.19)
    }

    100% {
        opacity: 0;
        -webkit-transform: scale3d(.1,.1,.1) translate3d(0,2000px,0);
        transform: scale3d(.1,.1,.1) translate3d(0,2000px,0);
        -webkit-transform-origin: center bottom;
        transform-origin: center bottom;
        -webkit-animation-timing-function: cubic-bezier(.175,.885,.32,1);
        animation-timing-function: cubic-bezier(.175,.885,.32,1)
    }
}

.zoomOutDown {
    -webkit-animation-name: zoomOutDown;
    animation-name: zoomOutDown
}

@-webkit-keyframes zoomOutLeft {
    40% {
        opacity: 1;
        -webkit-transform: scale3d(.475,.475,.475) translate3d(42px,0,0);
        transform: scale3d(.475,.475,.475) translate3d(42px,0,0)
    }

    100% {
        opacity: 0;
        -webkit-transform: scale(.1) translate3d(-2000px,0,0);
        transform: scale(.1) translate3d(-2000px,0,0);
        -webkit-transform-origin: left center;
        transform-origin: left center
    }
}

@keyframes zoomOutLeft {
    40% {
        opacity: 1;
        -webkit-transform: scale3d(.475,.475,.475) translate3d(42px,0,0);
        transform: scale3d(.475,.475,.475) translate3d(42px,0,0)
    }

    100% {
        opacity: 0;
        -webkit-transform: scale(.1) translate3d(-2000px,0,0);
        transform: scale(.1) translate3d(-2000px,0,0);
        -webkit-transform-origin: left center;
        transform-origin: left center
    }
}

.zoomOutLeft {
    -webkit-animation-name: zoomOutLeft;
    animation-name: zoomOutLeft
}

@-webkit-keyframes zoomOutRight {
    40% {
        opacity: 1;
        -webkit-transform: scale3d(.475,.475,.475) translate3d(-42px,0,0);
        transform: scale3d(.475,.475,.475) translate3d(-42px,0,0)
    }

    100% {
        opacity: 0;
        -webkit-transform: scale(.1) translate3d(2000px,0,0);
        transform: scale(.1) translate3d(2000px,0,0);
        -webkit-transform-origin: right center;
        transform-origin: right center
    }
}

@keyframes zoomOutRight {
    40% {
        opacity: 1;
        -webkit-transform: scale3d(.475,.475,.475) translate3d(-42px,0,0);
        transform: scale3d(.475,.475,.475) translate3d(-42px,0,0)
    }

    100% {
        opacity: 0;
        -webkit-transform: scale(.1) translate3d(2000px,0,0);
        transform: scale(.1) translate3d(2000px,0,0);
        -webkit-transform-origin: right center;
        transform-origin: right center
    }
}

.zoomOutRight {
    -webkit-animation-name: zoomOutRight;
    animation-name: zoomOutRight
}

@-webkit-keyframes zoomOutUp {
    40% {
        opacity: 1;
        -webkit-transform: scale3d(.475,.475,.475) translate3d(0,60px,0);
        transform: scale3d(.475,.475,.475) translate3d(0,60px,0);
        -webkit-animation-timing-function: cubic-bezier(.55,.055,.675,.19);
        animation-timing-function: cubic-bezier(.55,.055,.675,.19)
    }

    100% {
        opacity: 0;
        -webkit-transform: scale3d(.1,.1,.1) translate3d(0,-2000px,0);
        transform: scale3d(.1,.1,.1) translate3d(0,-2000px,0);
        -webkit-transform-origin: center bottom;
        transform-origin: center bottom;
        -webkit-animation-timing-function: cubic-bezier(.175,.885,.32,1);
        animation-timing-function: cubic-bezier(.175,.885,.32,1)
    }
}

@keyframes zoomOutUp {
    40% {
        opacity: 1;
        -webkit-transform: scale3d(.475,.475,.475) translate3d(0,60px,0);
        transform: scale3d(.475,.475,.475) translate3d(0,60px,0);
        -webkit-animation-timing-function: cubic-bezier(.55,.055,.675,.19);
        animation-timing-function: cubic-bezier(.55,.055,.675,.19)
    }

    100% {
        opacity: 0;
        -webkit-transform: scale3d(.1,.1,.1) translate3d(0,-2000px,0);
        transform: scale3d(.1,.1,.1) translate3d(0,-2000px,0);
        -webkit-transform-origin: center bottom;
        transform-origin: center bottom;
        -webkit-animation-timing-function: cubic-bezier(.175,.885,.32,1);
        animation-timing-function: cubic-bezier(.175,.885,.32,1)
    }
}

.zoomOutUp {
    -webkit-animation-name: zoomOutUp;
    animation-name: zoomOutUp
}

@-webkit-keyframes slideInDown {
    0% {
        -webkit-transform: translateY(-100%);
        transform: translateY(-100%);
        visibility: visible
    }

    100% {
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }
}

@keyframes slideInDown {
    0% {
        -webkit-transform: translateY(-100%);
        transform: translateY(-100%);
        visibility: visible
    }

    100% {
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }
}

.slideInDown {
    -webkit-animation-name: slideInDown;
    animation-name: slideInDown
}

@-webkit-keyframes slideInLeft {
    0% {
        -webkit-transform: translateX(-100%);
        transform: translateX(-100%);
        visibility: visible
    }

    100% {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }
}

@keyframes slideInLeft {
    0% {
        -webkit-transform: translateX(-100%);
        transform: translateX(-100%);
        visibility: visible
    }

    100% {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }
}

.slideInLeft {
    -webkit-animation-name: slideInLeft;
    animation-name: slideInLeft
}

@-webkit-keyframes slideInRight {
    0% {
        -webkit-transform: translateX(100%);
        transform: translateX(100%);
        visibility: visible
    }

    100% {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }
}

@keyframes slideInRight {
    0% {
        -webkit-transform: translateX(100%);
        transform: translateX(100%);
        visibility: visible
    }

    100% {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }
}

.slideInRight {
    -webkit-animation-name: slideInRight;
    animation-name: slideInRight
}

@-webkit-keyframes slideInUp {
    0% {
        -webkit-transform: translateY(100%);
        transform: translateY(100%);
        visibility: visible
    }

    100% {
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }
}

@keyframes slideInUp {
    0% {
        -webkit-transform: translateY(100%);
        transform: translateY(100%);
        visibility: visible
    }

    100% {
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }
}

.slideInUp {
    -webkit-animation-name: slideInUp;
    animation-name: slideInUp
}

@-webkit-keyframes slideOutDown {
    0% {
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }

    100% {
        visibility: hidden;
        -webkit-transform: translateY(100%);
        transform: translateY(100%)
    }
}

@keyframes slideOutDown {
    0% {
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }

    100% {
        visibility: hidden;
        -webkit-transform: translateY(100%);
        transform: translateY(100%)
    }
}

.slideOutDown {
    -webkit-animation-name: slideOutDown;
    animation-name: slideOutDown
}

@-webkit-keyframes slideOutLeft {
    0% {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }

    100% {
        visibility: hidden;
        -webkit-transform: translateX(-100%);
        transform: translateX(-100%)
    }
}

@keyframes slideOutLeft {
    0% {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }

    100% {
        visibility: hidden;
        -webkit-transform: translateX(-100%);
        transform: translateX(-100%)
    }
}

.slideOutLeft {
    -webkit-animation-name: slideOutLeft;
    animation-name: slideOutLeft
}

@-webkit-keyframes slideOutRight {
    0% {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }

    100% {
        visibility: hidden;
        -webkit-transform: translateX(100%);
        transform: translateX(100%)
    }
}

@keyframes slideOutRight {
    0% {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }

    100% {
        visibility: hidden;
        -webkit-transform: translateX(100%);
        transform: translateX(100%)
    }
}

.slideOutRight {
    -webkit-animation-name: slideOutRight;
    animation-name: slideOutRight
}

@-webkit-keyframes slideOutUp {
    0% {
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }

    100% {
        visibility: hidden;
        -webkit-transform: translateY(-100%);
        transform: translateY(-100%)
    }
}

@keyframes slideOutUp {
    0% {
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }

    100% {
        visibility: hidden;
        -webkit-transform: translateY(-100%);
        transform: translateY(-100%)
    }
}

.slideOutUp {
    -webkit-animation-name: slideOutUp;
    animation-name: slideOutUp
}

@font-face {
    font-family: "iconfont";
    src: url('font/iconfont.woff2?t=1653484678945') format('woff2'),url('font/iconfont.woff?t=1653484678945') format('woff'),url('font/iconfont.ttf?t=1653484678945') format('truetype')
}

.iconfont {
    font-family: "iconfont" !important;
    font-size: 16px;
    font-style: normal;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale
}

.icon-hudongshequ:before {
    content: ""
}

.icon-gengduo:before {
    content: ""
}

.icon-yuming:before {
    content: ""
}

.icon-android:before {
    content: ""
}

.icon-dianshang:before {
    content: ""
}

.icon-ios:before {
    content: ""
}

.icon-beijingyinle:before {
    content: ""
}

.icon-yanfaxietong:before {
    content: ""
}

.icon-zhihuiyunwei:before {
    content: ""
}

.icon-xuanzhuanshouji:before {
    content: ""
}

.icon-zengzhifuwu:before {
    content: ""
}

.icon-crm:before {
    content: ""
}

.icon-OAxitong:before {
    content: ""
}

.icon-zhanqunguanlixitong:before {
    content: ""
}

.icon-vehicles:before {
    content: ""
}

.icon-BB:before {
    content: ""
}

.icon-BC:before {
    content: ""
}

.icon-weixin:before {
    content: ""
}

.icon-fenxiao:before {
    content: ""
}

.icon-xiaochengxu:before {
    content: ""
}

.icon-jiudian:before {
    content: ""
}

.icon-xiangshang:before {
    content: ""
}

.icon-xiangxia:before {
    content: ""
}

.icon-SSL:before {
    content: ""
}

.icon-xianshiqianggou:before {
    content: ""
}

.icon-paimai-paimaichui-paimaihang-paimaichui:before {
    content: ""
}

.icon-xiangyingshi:before {
    content: ""
}

.icon-icon_xinyong_xianxing_jijin-188:before {
    content: ""
}

.icon-canyin:before {
    content: ""
}

.icon-pinpaituan:before {
    content: ""
}

.icon-iconset0129:before {
    content: ""
}

.icon-pinpai:before {
    content: ""
}

.icon-saasguanli86:before {
    content: ""
}

.icon-gexingdingzhi:before {
    content: ""
}

.icon-app1:before {
    content: ""
}

.icon-brand:before {
    content: ""
}

.icon-h5e:before {
    content: ""
}

.icon-chuanzhongjianzhan:before {
    content: ""
}

.icon-APPku:before {
    content: ""
}

.icon-gongzhonghao:before {
    content: ""
}

.fyt-wall {
    position: relative;
    min-height: 480px
}

.fyt_tip {
    position: absolute;
    top: 0;
    left: 0;
    padding-left: 51px;
    border: none;
    border-bottom: 1px solid rgba(58,58,58,.68);
    padding-top: 50px
}

.fyt_tip .title {
    vertical-align: baseline;
    font-size: 20px;
    line-height: 22px
}

.fyt_tip .subtitle {
    vertical-align: baseline;
    font-size: 12px;
    line-height: 14px;
    color: #7a7b7b;
    font-family: Times New Roman
}

.fyt-category {
    position: absolute;
    top: 20px;
    right: 0;
    z-index: 10;
    padding-top: 50px;
    margin: 0;
    height: 26px;
    line-height: 26px;
    text-align: right
}

.fyt-category a {
    color: #404040;
    display: inline-block;
    margin-right: 5px;
    padding: 3px 35px;
    transition: all .3s ease-out 0s;
    font-size: 12px
}

.fyt-category a:last-child {
    margin-right: 0
}

.fyt-category a.active,.fyt-category a:hover {
    background-color: #614498;
    color: #fff
}

.case-wall {
    position: relative;
    top: 140px
}

.case-wall .bx-wrapper .bx-pager {
    display: none
}

.case-wall .item_img {
    display: block;
    position: relative;
    overflow: hidden
}

.case-wall .item_img img {
    width: 100%;
    height: auto;
    transition: all ease-out .3s .1s
}

.case-wall .item_img .item_mask {
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0);
    position: absolute;
    left: 0;
    top: 0;
    opacity: 0;
    -webkit-transform: rotateX(180deg) scale(.5,.5);
    transform: rotateX(180deg) scale(.2,.2);
    transition: all ease-out .5s
}

.case-wall .item_img .item_link_icon {
    display: block;
    width: 38px;
    height: 38px;
    text-align: center;
    font-size: 22px;
    line-height: 38px;
    border: 1px solid rgba(255,255,255,.5);
    border-radius: 50%;
    position: absolute;
    left: 50%;
    top: 50%;
    margin-left: -21px;
    margin-top: -21px
}

.case-wall .item_img .item_link_icon i {
    color: #fff;
    font-size: 25px
}

.case-wall .slide:hover .item_img img {
    transform: scale(1.1,1.1)
}

.case-wall .slide:hover .item_mask {
    opacity: 1;
    -webkit-transform: rotateX(0deg) scale(1,1);
    transform: rotateX(0deg) scale(1,1);
    transition: all 1s cubic-bezier(.23,1,.38,1) 0s;
    background: rgba(2,31,75,.3)
}

.case-wall .slide:hover .item_link_icon {
    border: 1px solid rgba(255,255,255,1)
}

.service {
    min-height: 750px;
    background-color: #f7f7f7
}

.service .wrapper {
    position: relative
}

.service-wall {
    padding-top: 170px
}

.service-wall .bx-wrapper {
    margin: 0
}

.service-wall .ser-img {
    width: 450px;
    height: 300px;
    margin: 0;
    position: relative;
    float: left
}

.service-wall .ser-img img {
    width: 100%;
    height: 100%
}

.sel-left {
    width: 1200px;
    float: left;
    background: #fff;
    padding: 70px 30px
}

.service-wall .ser-info {
    width: 680px;
    float: left;
    padding-left: 50px
}

.service-wall .ser-info-title {
    font-size: 20px;
    color: #404040;
    margin-top: 30px;
    color: #e83828;
    font-size: 22px
}

.service-wall .ser-info-subtitle {
    color: #333;
    margin-top: 10px;
    font-size: 15px
}

.service-wall .description {
    font-size: 13px;
    line-height: 27px;
    color: #666;
    margin-top: 20px
}

.sel-left .bx-pager {
    display: none
}

.sel-left .bx-controls-direction a.bx-next {
    width: 200px;
    top: inherit;
    bottom: -210px;
    left: inherit;
    right: -230px;
    height: 140px;
    text-align: center;
    line-height: 147px;
    border-left: 1px solid #e6e7e8;
    z-index: 9
}

.sel-left .bx-controls-direction a.bx-next i {
    transform: rotate(90deg)
}

.sel-left .bx-controls-direction a.bx-prev {
    width: 200px;
    top: -193px;
    left: inherit;
    right: -230px;
    height: 140px;
    text-align: center;
    line-height: 147px;
    border-left: 1px solid #e6e7e8;
    z-index: 9;
    border-bottom: 1px solid #e6e7e8
}

.sel-left .bx-controls-direction a.bx-prev i {
    transform: rotate(90deg)
}

.sel-right {
    width: 200px;
    float: right;
    min-height: 440px;
    border-left: 1px solid #e6e7e8
}

.sel-right .tab-wall {
    text-align: center;
    padding: 59px 0;
    border-bottom: 1px solid #e6e7e8;
    cursor: pointer
}

.sel-right .bx-pager {
    display: none
}

.sel-right .slide.active .tab-wall {
    background: #07aefc;
    color: #fff;
    border-bottom: none
}

.sel-right .bx-wrapper .bx-controls-direction a {
    display: none
}

.case-wrapper {
    min-height: 850px;
    margin-top: 50px
}

.case-list {
    padding-top: 170px
}

.case-list .case-row {
    width: 20%;
    float: left;
    position: relative
}

.case-list .case-row a {
    display: block;
    overflow: hidden
}

.case-list .case-row a:before {
    position: absolute;
    content: "";
    top: 15px;
    left: 15px;
    right: 15px;
    bottom: 105px;
    z-index: 10;
    border: 1px solid transparent;
    transition: all .6s cubic-bezier(.215,.61,.355,1) 0s
}

.case-list .case-row a:after {
    content: '';
    width: 40px;
    height: 40px;
    line-height: 40px;
    background: url(../img/jia.png);
    margin: 0 auto;
    display: inline-block;
    position: absolute;
    top: 0;
    left: 50%;
    margin-left: -20px;
    z-index: 10;
    transition: all .6s cubic-bezier(.215,.61,.355,1) 0s;
    opacity: 0
}

.case-list .case-row .case-row-img {
    width: 100%
}

.case-list .case-row .case-row-img img {
    width: 100%;
    transition: all .6s cubic-bezier(.215,.61,.355,1) 0s
}

.case-list .case-row .case-row-info {
    height: 89px;
    position: relative;
    background-color: #fff
}

.case-list .case-row .case-row-info:before {
    position: absolute;
    width: 20px;
    height: 20px;
    margin-top: 6px;
    background-color: #f8f8f8;
    left: 50%;
    margin-left: -10px;
    transition: all .6s cubic-bezier(.215,.61,.355,1) 0s;
    content: "";
    transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    opacity: 0
}

.case-list .case-row .title {
    color: #1c1c1c;
    margin-top: 0;
    height: 40px;
    line-height: 40px;
    padding: 10px 20px 0 20px;
    text-align: left;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis
}

.case-list .case-row .subtitle {
    margin-top: 0;
    color: #8d8d8d;
    text-align: left;
    padding: 0 20px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    padding-bottom: 20px
}

.case-list .case-row .description {
    font-size: 12px;
    color: #8d8d8d;
    padding: 0 20px
}

.case-list .case-row:hover a:after {
    top: 28%;
    opacity: 1
}

.case-list .case-row:hover a:before {
    border: 1px solid #fff
}

.case-list .case-row:hover .case-row-info:before {
    margin-top: -10px;
    background-color: #fff;
    opacity: 1
}

.case-list .case-row:hover img {
    transform: scale(1.2,1.2);
    -moz-transform: scale(1.2,1.2);
    -webkit-transform: scale(1.2,1.2);
    -o-transform: scale(1.2,1.2)
}

.case-list .fyt-more {
    padding: 20px 0 0 0
}

.news {
    margin-top: 0;
    min-height: 830px
}

.news-wall {
    padding-top: 170px
}

.news-wall li {
    height: 520px;
    margin-bottom: 50px;
    padding-bottom: 0;
    background: #fff;
    float: left;
    min-height: 460px
}

.news-wall li a {
    display: block;
    width: 100%;
    height: 100%;
    display: block;
    overflow: hidden
}

.news-wall li a.details {
    width: 35px;
    height: 35px;
    text-align: center;
    border-radius: 0;
    transition: all .6s cubic-bezier(.215,.61,.355,1) 0s;
    margin: 0 auto;
    overflow: hidden;
    position: relative;
    top: -50px;
    display: block;
    font-size: 0;
    opacity: 0;
    margin-left: -9px;
    left: 50%
}

.news-wall li a.details i {
    font-size: 24px;
    color: #fff
}

.news-wall li .news-img img {
    transition: all .6s cubic-bezier(.215,.61,.355,1) 0s;
    width: 100%;
    height: 260px
}

.news-wall li .news-info {
    text-align: center;
    position: relative;
    margin: 0;
    transition: all .3s ease-out 0s;
    top: 50px
}

.news-wall li .news-info p.title {
    height: 40px;
    line-height: 40px;
    font-size: 20px;
    transition: all .6s cubic-bezier(.215,.61,.355,1) 0s;
    color: #595959;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1
}

.news-wall li .news-info:after {
    position: absolute;
    content: "";
    left: 50%;
    width: 35px;
    height: 1px;
    background: rgba(0,0,0,.15);
    margin-left: -17px;
    top: 48px;
    transition: all .3s ease-out 0s
}

.news-wall li .news-info .description {
    margin-top: 25px;
    padding: 0 45px;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    line-height: 26px;
    color: #8d8d8d;
    transition: all .6s cubic-bezier(.215,.61,.355,1) 0s
}

.news-wall li#item_0 {
    width: 40%;
    background: #fff;
    transition: all .6s cubic-bezier(.215,.61,.355,1) 0s
}

.news-wall li#item_1 {
    width: 30%;
    background: #fff;
    transition: all .6s cubic-bezier(.215,.61,.355,1) 0s
}

.news-wall li#item_1 .news-info,.news-wall li#item_3 .news-info {
    top: -470px
}

.news-wall li#item_1 img,.news-wall li#item_3 img {
    height: 260px;
    margin-top: 260px;
    position: relative;
    transition: all .6s cubic-bezier(.215,.61,.355,1) 0s
}

.news-wall li#item_2 {
    width: 30%;
    background: #fff;
    transition: all .6s cubic-bezier(.215,.61,.355,1) 0s
}

.news-wall li#item_3 {
    width: 22%;
    background: #fff;
    transition: all .6s cubic-bezier(.215,.61,.355,1) 0s
}

.news-wall li#item_1 a.details {
    top: -310px
}

.news-wall li:hover div {
    margin-top: -10px
}

.news-wall li:hover {
    background: #b9ab77 !important
}

.news-wall li:hover p.title {
    color: #fff
}

.news-wall li:hover p.description {
    color: #fff
}

.news-wall li:hover .news-info:after {
    background: rgba(255,255,255,1)
}

.news-wall li:hover img {
    transform: scale(1.1,1.1)
}

.news-wall li:hover a.details {
    margin-top: -30px;
    border-color: #fff;
    opacity: 1;
    border: none
}

.news-wall li:hover a.details i {
    color: #fff
}

.lxindex {
    min-height: 550px
}

.lx-us {
    padding-top: 100px
}

.lx-left {
    width: 30%;
    float: left
}

.lx-left .com-p {
    line-height: 30px
}

.blank {
    width: 25%
}

.lx-left .com-p i {
    font-size: 16px;
    margin-right: 5px;
    color: #07aefc
}

.lx-left .com-p.x {
    font-size: 14px;
    font-weight: bold;
    border-bottom: 1px dotted #e8e8e8;
    line-height: 40px;
    width: 80%;
    color: #07aefc
}

.bottom-b {
    width: 45%;
    float: right
}

.bottom-b li {
    float: left;
    margin-right: 8px;
    width: 48%;
    margin-bottom: 30px
}

.bottom-list li span {
    color: #f00;
    width: 20px;
    text-align: center;
    display: block;
    float: left;
    font-size: 16px;
    line-height: 40px
}

.bottom-list li input {
    width: 100%;
    height: 40px;
    border: 0;
    border-bottom: 1px solid #bfbfbf;
    outline: none
}

.bottom-list textarea {
    height: 50px;
    width: 100%;
    border: 0;
    border-bottom: 1px solid #bfbfbf;
    outline: none;
    margin-bottom: 20px;
    resize: none
}

.bottom-list p {
    font-size: 12px;
    color: #4c4c4c;
    margin-top: 10px;
    margin-left: 20px
}

.bottom-list p img {
    margin-bottom: -2px;
    margin-right: 3px
}

.bottom-list button {
    border: 0;
    width: 140px;
    height: 40px;
    border: 1px solid #ff9000;
    display: block;
    text-align: center;
    line-height: 36px;
    color: #ff9000;
    float: right;
    font-size: 16px;
    background-color: #fff;
    outline: none;
    transition: all ease-out .3s
}

.bottom-list button:hover {
    background-color: #ff9000;
    color: #fff
}

.demand-bottom {
    position: relative
}

.bottom-b li {
    float: left;
    margin-right: 8px
}

.bottom-b li:last-child {
    margin-right: 0
}

.bottom-b li:nth-child(2n) {
    float: right
}

.xcy-fyt {
    padding: 60px;
    text-align: center;
    background-color: #edf3f5;
    color: #555;
    font-size: 22px;
    margin: 0 0 40px 0
}

.xcy-fyt p span {
    display: inline-block
}

.xcy-fyt a {
    border: 1px solid #07aefc;
    display: inline-block;
    margin-left: 150px;
    color: #555;
    font-size: 16px;
    position: relative;
    width: 180px;
    height: 50px;
    line-height: 50px;
    overflow: hidden;
    vertical-align: middle;
    transition: all .5s;
    margin-top: 0
}

.xcy-fyt a span {
    display: block;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 10;
    text-align: center;
    width: 180px;
    transition: left .5s
}

.xcy-fyt a i {
    position: absolute;
    color: #fff;
    font-size: 26px;
    top: 0;
    line-height: 50px;
    left: -113px;
    transition: left .5s
}

.xcy-fyt a:hover {
    background-color: #07aefc
}

.lx-info {
    text-align: center;
    margin-bottom: 50px
}

.lx-info .tit {
    font-size: 32px;
    color: #555;
    font-family: Times New Roman;
    font-weight: bold
}

.lx-info .tit span {
    font-size: 15px;
    margin-left: 10px;
    display: inline-block
}

.ic-infor .brief,.lx-info .brief {
    font-size: 14px;
    line-height: 24px;
    color: #363636;
    margin: 10px 0 20px 0;
    color: #666
}

.ic-infor .fyt-gb,.lx-info .fyt-gb {
    color: #27ae61;
    font-size: 16px;
    margin-bottom: 30px
}

.fyt-more {
    padding: 0 0 30px 0;
    text-align: center
}

.fyt-more a {
    display: inline-block;
    width: 220px;
    height: 40px;
    line-height: 40px;
    color: #fff;
    background-color: #383838;
    font-size: 15px;
    font-family: Times New Roman;
    transition: all ease-out .3s;
    text-indent: 0
}

.fyt-more a i {
    vertical-align: middle;
    color: rgba(255,255,255,0);
    transition: all ease-out .3s;
    position: relative;
    top: -1px
}

.fyt-more a:hover i {
    color: rgba(255,255,255,.8)
}

.fyt-more a:hover {
    text-indent: 18px
}

.content_list {
    width: 100%;
    position: relative;
    padding-bottom: 40px
}

.content_list>li {
    width: 24%;
    height: 360px;
    margin-right: 1%;
    margin-bottom: 20px;
    float: left;
    transition: all ease-out .3s;
    background-color: #f8f8f8;
    position: relative;
    overflow: hidden
}

.content_list>li>a {
    position: relative;
    display: block
}

.content_list .item_wrapper {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    margin: 0 10px 0 0;
    padding: 60px 30px 0 26px;
    border-bottom: none;
    transition: all .6s ease 0s
}

.content_list li:hover .item_wrapper {
    padding-top: 30px
}

.content_list li:hover .item_wrapper .title {
    color: #07aefc
}

.content_list li:hover .item_mask,.content_list li:hover a.details {
    opacity: .85
}

.content_list .item_img {
    width: 100%;
    position: relative;
    display: block
}

.content_list .item_img img {
    width: 100%;
    height: 360px
}

.content_list .item_img .item_mask {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #f8f8f8;
    -webkit-transition: all .36s ease;
    transition: all .6s ease 0s;
    opacity: .85
}

.content_list .item_wrapper .date_wrap {
    padding: 15px 0
}

.content_list .item_wrapper .date_wrap .year {
    font-size: 20px
}

.content_list .item_wrapper .date_wrap .md {
    padding-left: 4px;
    font-size: 12px
}

.content_list .item_wrapper .title {
    font-size: 16px
}

.content_list .item_wrapper .item_des {
    font-size: 12px;
    margin-top: 15px;
    overflow: hidden;
    white-space: nowrap;
    line-height: 20px
}

.content_list .item_wrapper .item_des p {
    font-size: 12px;
    line-height: 20px;
    height: 42px;
    white-space: normal;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    color: #878787
}

.content_list a.details {
    display: block;
    box-sizing: border-box;
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 90px;
    padding-left: 26px;
    line-height: 90px;
    background-color: #f8f8f8
}

.content_list a.details::before {
    content: "";
    display: block;
    width: 0%;
    height: 1px;
    background: linear-gradient(to right,#f9223e 8%,#ab2c71 68%,#ab2ca1);
    -webkit-transition: all .6s ease 0s;
    transition: all .6s ease 0s;
    z-index: 2;
    position: absolute;
    top: -1px;
    left: 31px
}

.content_list a.details::after {
    content: "";
    position: absolute;
    top: -1px;
    left: 0;
    right: 0;
    height: 0;
    -webkit-transition: all .36s ease;
    transition: all .36s ease;
    width: 85%;
    margin-left: 31px;
    height: 1px;
    background-color: #fff;
    -webkit-transition: all .3s ease 0s;
    transition: all .3s ease 0s
}

.content_list a.details i {
    -webkit-transition: all .36s ease;
    transition: all .36s ease;
    position: absolute;
    top: 24px;
    right: -42px;
    width: 44px;
    height: 44px;
    border: 1px solid #07aefc;
    border-radius: 100%;
    -webkit-transition: all .3s ease 0s;
    transition: all .3s ease 0s;
    opacity: 0;
    color: #07aefc;
    text-align: center;
    line-height: 44px
}

.content_list>li:hover a.details::before {
    width: 85%
}

.content_list>li:hover a.details i {
    opacity: 1;
    right: 30px
}

.bdshare-button-style2-24 .bds_tsina {
    width: 27px;
    height: 27px;
    background: url(../../cdns/img/share.png) 0 0 no-repeat !important;
    padding-left: 0 !important;
    opacity: .2
}

.bdshare-button-style2-24 .bds_weixin {
    width: 29px;
    height: 27px;
    background: url(../../cdns/img/share.png) -30px 0 no-repeat !important;
    padding-left: 0 !important;
    opacity: .2
}

.bdshare-button-style2-24 .bds_more {
    width: 27px !important;
    height: 27px !important;
    background: url(../../cdns/img/share.png) -63px 0 no-repeat !important;
    padding-left: 0 !important;
    opacity: .4
}

.bd_weixin_popup {
    height: 300px !important
}

.page {
    padding: 50px;
    text-align: center;
    width: 100%
}

.page a {
    width: 36px;
    height: 36px;
    background-color: #fff;
    display: inline-block;
    color: #a9a9a9;
    line-height: 36px;
    text-align: center;
    font-family: Arial;
    margin-right: 5px;
    transition: background-color .2s ease-out
}

.page a.active,.page a:hover {
    color: #fff;
    background-color: #07aefc
}

#pageTarget {
    background: #f8f8f8;
    border-bottom: #ededed 1px solid;
    border-top: #ededed 1px solid;
    position: relative;
    overflow: hidden;
    padding: 0 10%
}

.module .module_container {
    padding-left: 5px;
    padding-right: 5px;
    padding-bottom: 0;
    margin: 0 auto
}

.container_target {
    padding: 14px 0;
    color: #a6a6a6;
    float: right
}

.container_target a {
    color: #6e6e6e;
    position: relative
}

.container_target i {
    margin: 0 10px
}

.nlist-wall {
    background-color: #fff;
    position: relative;
    z-index: 10
}

.tabs a {
    border: #e0e0e0 1px solid;
    transition: all .2s ease-out;
    margin-right: 2px;
    padding: 5px 10px;
    display: inline-block;
    font-size: 12px;
    line-height: 18px;
    color: #6e6e6e;
    margin-bottom: 6px
}

.case-banner {
    height: 320px;
    width: 100%;
}

.case-banner>div {
    height: 320px;
    width: 100%;
    position: fixed
}

.casemodel {
    position: relative;
    min-height: 600px;
    background-color: #fff
}

.casemodel .category {
    position: relative;
    z-index: 3;
    padding: 40px 0;
    width: 100%;
    text-align: center
}

.casemodel .category a {
    position: relative;
    display: inline-block;
    margin: 0 15px;
    padding: 8px 20px;
    color: #898989;
    transition: all .3s ease-out 0s
}

.casemodel .category a:after {
    position: absolute;
    margin-top: 9px;
    margin-left: 30px;
    width: 10px;
    height: 1px;
    background-color: #dbdbdb;
    content: ''
}

.casemodel .category a:last-child:after {
    display: none
}

.casemodel .category a.active,.casemodel .category a:hover {
    background-color: #333;
    color: #fff
}

.case-content {
    top: 0
}

.case-content ul li {
    width: 25%;
    float: left
}

.case-content ul li a {
    display: block;
    overflow: hidden;
    position: relative
}

.case-content ul li a img {
    width: 100%
}

.case-content ul li:hover .item_img img {
    transform: scale(1.1,1.1)
}

.case-content ul li:hover .item_mask {
    opacity: 1;
    -webkit-transform: rotateX(0deg) scale(1,1);
    transform: rotateX(0deg) scale(1,1);
    transition: all 1s cubic-bezier(.23,1,.38,1) 0s;
    background: rgba(2,31,75,.3)
}

.case-content ul li:hover .item_link_icon {
    border: 1px solid rgba(255,255,255,1)
}

.case-content .item-title {
    position: absolute;
    bottom: -40px;
    line-height: 40px;
    height: 40px;
    display: -webkit-box;
    transition: all .3s ease-out 0s;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
    overflow: hidden;
    text-overflow: ellipsis;
    padding: 0 15px;
    width: 100%;
    z-index: 10;
    color: #fff;
    background: rgba(0,0,0,.5)
}

.case-content .item-title:before {
    position: absolute;
    bottom: 0;
    left: 0;
    height: 4px;
    content: "";
    width: 0;
    background: #07aefc;
    transition: width .6s ease-out
}

.case-content .item-title p {
    color: #fff
}

.case-content ul li:hover .item-title {
    bottom: 0
}

.case-content ul li:hover .item-title:before {
    width: 100%
}

.case-left {
    width: 75%;
    float: left;
    padding-top: 30px;
    padding-bottom: 50px
}

.case-left img {
    max-width: 100% !important;
    height: auto !important
}

.case-right {
    width: 22%;
    float: right;
    padding-top: 30px
}

.case-right h4 {
    font-size: 22px;
    line-height: 24px;
    font-weight: normal;
    margin: 10px 0
}

.case-right .detail-slide {
    position: relative
}

.case-right .detail-slide h6 {
    cursor: pointer;
    height: 34px;
    line-height: 34px;
    font-size: 15px;
    padding: 0;
    border-bottom: 1px solid #e6e6e6;
    font-weight: normal
}

.case-right .detail-slide li.on h6 {
    background-position: 280px 15px
}

.case-right .detail-slide>li {
    display: block;
    line-height: 35px;
    overflow: hidden
}

.case-right .detail-slide .scroll {
    display: block;
    overflow: hidden
}

.case-right .detail-slide .scroll p {
    font-size: 12px;
    color: #8e9398;
    padding-bottom: 10px
}

.case-right .detail-slide .detail {
    line-height: 24px;
    color: #8e9398;
    border-bottom: 1px solid #e6e6e6;
    margin-bottom: 10px;
    padding-bottom: 10px;
    font-size: 12px;
    padding: 10px 0
}

.operate {
    margin-bottom: 20px
}

.operate a {
    display: inline-block;
    height: 28px;
    line-height: 26px;
    color: #07aefc;
    text-align: center;
    margin-right: 25px;
    border: 1px solid #07aefc;
    padding: 0 15px;
    font-size: 12px;
    transition: all .3s ease-out 0s
}

.operate a:hover {
    border: 1px solid #07aefc;
    background-color: #07aefc;
    color: #fff
}

.operate a:last-child {
    float: right
}

.case-right .tabs {
    border-bottom: 1px solid #e6e6e6;
    margin-bottom: 20px;
    padding-bottom: 5px
}

.case-right .tabs a {
    background-color: #f3f3f3;
    border: 1px solid #f3f3f3;
    margin-right: 5px;
    margin-bottom: 5px;
    transition: all .6s cubic-bezier(.215,.61,.355,1) 0s;
    padding: 5px 15px
}

.case-right .tabs a:hover {
    background-color: #07aefc;
    color: #fff
}

.case-key {
    margin-top: 30px
}

.case-key li {
    width: 48%;
    float: left;
    margin-bottom: 10px;
    margin-right: 4%
}

.case-key li:nth-child(2n) {
    margin-right: 0
}

.case-key li a {
    display: block
}

.case-key li a img {
    width: 100%
}

.case-key li p {
    line-height: 30px;
    text-align: center
}

.el-page {
    background-color: #fff;
    position: relative;
    z-index: 10
}

.el-header {
    padding: 50px 0
}

.el-header .title {
    color: #444;
    font-size: 22px;
    text-align: center
}

.el-header .subtitle {
    font-size: 14px;
    color: #999;
    text-align: center;
    line-height: 24px
}

.ellipsis {
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    display: block
}

#contactinfo {
    width: 1140px;
    margin: auto
}

#contactinfo h3 {
    font-size: 16px;
    color: #444;
    line-height: 24px;
    margin-bottom: 25px;
    font-weight: 100
}

#contactinfo p {
    padding-right: 60px;
    margin-top: 14px;
    height: auto;
    font-size: 12px;
    line-height: inherit;
    display: inline-block;
    color: #a7a7a7
}

#contactinfo div a {
    background-color: transparent;
    color: #9b9b9b;
    font-size: 16px;
    width: 36px;
    height: 36px;
    border-radius: 0;
    margin-right: 10px;
    transition: all .3s ease 0s
}

#contactinfo div a i {
    font-size: 35px
}

#contactinfo div a:hover i {
    color: #07aefc
}

#contactform {
    margin: 80px auto 80px;
    width: 1140px;
    max-width: 1140px;
    position: relative
}

#contactform p .inputtxt {
    background: #f5f5f5;
    border-bottom: 1px solid #f5f5f5;
    padding: 12px 16px;
    width: calc(29% - 32px);
    float: none;
    margin: 0 2% 3px 0
}

#contactform p textarea.inputtxt {
    background: #f5f5f5;
    border-bottom: 1px solid #f5f5f5;
    position: absolute;
    left: 31%;
    top: 0;
    height: 165px;
    width: calc(68% - 32px);
    border-color: transparent;
    float: none;
    margin: 0 2% 20px 0
}

#contactform input,#contactform textarea {
    font-family: "微软雅黑",Arial;
    outline: 0;
    font-size: 14px;
    -webkit-appearance: none;
    border: none;
    background: 0 0
}

#contactform p .inputtxt.submit {
    cursor: pointer;
    transition: all .6s cubic-bezier(.215,.61,.355,1) 0s;
    left: calc(-100% - 20px);
    left: -moz-calc(-100% - 20px);
    left: -webkit-calc(-100% - 20px);
    display: block;
    font-size: 15px;
    margin: 0 auto;
    margin-top: 50px;
    width: 265px;
    border-radius: 80px;
    padding: 0;
    line-height: 54px;
    height: 54px;
    border: 1px solid #e0e0e0;
    color: #cfcfcf
}

#contactform p .inputtxt.submit:hover {
    color: #fff;
    background-color: #07aefc;
    border-color: #07aefc
}

.f-fk {
    margin: 50px auto 50px
}

.f-fk .en span {
    font-size: 20px;
    display: inline-block;
    margin-left: 20px
}

.fkfs {
    margin-bottom: 40px;
    margin-top: 40px;
    border-top: 1px solid #dadada;
    padding-top: 20px;
    width: 1140px;
    margin: 0 auto 100px
}

.fkfs .left {
    width: 50%;
    float: left
}

.fkfs .rleft {
    border-left: 1px solid #ccc;
    padding-left: 30px
}

.fkfs .left .fkyh {
    width: 240px;
    padding-top: 30px;
    float: left
}

.fkfs .left .fktxt {
    width: 270px;
    padding-left: 20px;
    line-height: 30px;
    font-size: 14px;
    float: left
}

.fixed {
    position: fixed;
    z-index: 9999;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #000;
    background: rgba(0,0,0,.6);
    overflow-y: auto;
    z-index: 100;
    display: none
}

#fixed_mp .fixed-container {
    width: 258px;
    height: 298px;
    background: #fff;
    position: absolute;
    left: 50%;
    top: 50%;
    margin-left: -129px;
    margin-top: -149px
}

#fixed_mp .fixed-container p {
    padding: 0 20px;
    text-align: center;
    font-size: 14px;
    color: #000
}

.si-info {
    text-align: center
}

.si-info .en {
    text-transform: Uppercase;
    font-family: Times New Roman;
    font-size: 35px;
    font-weight: bold;
    text-align: center;
    color: #333;
    padding-top: 40px
}

.si-info .in-p {
    margin-top: 15px;
    font-size: 15px;
    text-align: center
}

.si-info .in-p.hui {
    font-size: 14px;
    color: #666;
    text-align: center
}

.team {
    background-color: #f7f7f7
}

.team_c {
    width: 1200px;
    padding: 0 0 100px 0;
    overflow: hidden;
    margin: auto
}

.team_c .h1 {
    height: 40px
}

.team_c .item {
    width: 170px;
    height: 170px;
    margin: 100px 61px 0 61px;
    border-radius: 50%;
    background: #3a90a2;
    float: left
}

.team_c .item img {
    width: 170px;
    height: 170px;
    border-radius: 50%;
    opacity: 0;
    transition: opacity 2s
}

.team_c .item p {
    color: #333;
    font-size: 20px;
    margin-top: 25px;
    text-align: center
}

.aboutbody {
    width: 1200px;
    margin: auto;
    line-height: 24px
}

.aboutbody hr {
    height: 1px;
    border: none;
    border-top: 1px dotted #d3d3d3;
    margin-top: 40px;
    margin-bottom: 40px
}

.partner:after {
    content: '';
    width: 100%;
    position: absolute;
    top: 60%;
    left: 0;
    border-bottom: 1px solid #e5e5e5
}

.partner-body {
    width: 896px !important;
    margin: 100px auto 0
}

.partner-body .slide a {
    width: 225px;
    height: 168px;
    overflow: hidden;
    float: left;
    margin: 0;
    border-left: 1px solid #efefef;
    border-right: 1px solid #efefef;
    position: relative;
    z-index: 10;
    transition: all .3s ease 0s;
    margin-left: -1px
}

.partner-body .slide a img {
    width: 100%;
    height: 100%
}

.partner-body .slide a:hover {
    box-shadow: 0 14px 40px #d6e0ff;
    border-color: #fff
}

.partner-body .bx-default-pager {
    display: none
}

.partner-body .bx-wrapper .bx-controls-direction a {
    width: 60px;
    height: 60px;
    border-radius: 0;
    text-align: center
}

.partner-body .bx-wrapper .bx-prev {
    left: inherit;
    right: 0;
    background: url(../../cdns/img/arrow-img001.png) no-repeat 0 0;
    margin-top: -86px;
    background-color: #868686;
    z-index: 2;
    transition: all ease-out .3s
}

.partner-body .bx-wrapper .bx-next {
    right: 0;
    background: url(../../cdns/img/arrow-img001.png) no-repeat -60px 0;
    margin-top: -27px;
    background-color: #868686;
    transition: all ease-out .3s
}

.partner-body .bx-wrapper .bx-controls-direction .bx-prev:hover {
    background: url(../../cdns/img/arrow-img001.png) no-repeat 0 -60px;
    background-color: #07aefc
}

.partner-body .bx-wrapper .bx-controls-direction .bx-next:hover {
    background: url(../../cdns/img/arrow-img001.png) no-repeat -60px -60px;
    background-color: #07aefc
}

.partner-body .bx-wrapper .bx-controls-direction a {
    top: 61%;
    right: -100px;
    padding-top: 18px
}

.partner-body .bx-wrapper .bx-controls-direction .bx-prev:hover i,.partner-body .bx-wrapper .bx-controls-direction .bx-next:hover i {
    color: #fff
}

.fyt-kf {
    position: fixed;
    z-index: 99999;
    width: 66px;
    height: 230px;
    background-color: #fff;
    right: 0;
    margin-top: -160px;
    bottom: 50px;
    box-shadow: 1px 1px 20px rgba(0,0,0,.3);
    transition: all .3s
}

.fyt-kf.cur {
    height: 300px
}

.fyt-kf .kflogo {
    width: 80px;
    position: absolute;
    top: -30px;
    left: -7px
}

.fyt-kf ul {
    padding-top: 60px
}

.fyt-kf ul li {
    border-bottom: 1px solid #e6e6fa;
    margin-bottom: 15px;
    position: relative;
    height: 48px;
    background-color: #fff
}

.fyt-kf ul li img {
    width: 36px;
    height: 36px
}

.fyt-kf ul li.tel img {
    width: 32px;
    height: 32px
}

.fyt-kf ul li.kcase img {
    width: 32px;
    height: 32px
}

.fyt-kf ul li:last-child {
    border-bottom: 0
}

.fyt-kf ul li>div {
    position: absolute;
    background-color: #fff;
    left: 0;
    width: 66px;
    text-align: center;
    top: 0;
    height: 41px;
    line-height: 42px;
    z-index: 9
}

.fyt-kf ul li>div.cur {
    box-shadow: 1px 1px 5px rgba(0,0,0,.3)
}

.fyt-kf ul li>div span {
    font-size: 13px
}

.fyt-kf ul li a {
    position: absolute;
    z-index: 10;
    display: block;
    width: 66px;
    height: 41px;
    text-align: center;
    background-color: #fff
}

.fyt-kf ul li:last-child div {
    height: 42px
}

.fyt-kf ul li#gotop {
    display: none;
    cursor: pointer
}

.nwall {
    margin-bottom: 50px
}

.postInfo {
    margin-bottom: 15px
}

.postInfo .title {
    color: #444;
    font-size: 16px
}

.postInfo .subtitle {
    color: #444;
    font-size: 16px;
    color: #9e9e9e;
    border-color: #eaeaea;
    border-bottom: 1px solid #eaeaea;
    padding-bottom: 10px;
    font-size: 12px;
    margin-top: 15px
}

.n-detail-text {
    line-height: 26px;
    padding-right: 100px
}

.n-detail-text img {
    max-width: 100% !important
}

.nwall .case-left {
    width: 78%
}

.nwall .case-right {
    border-left: 1px solid #eaeaea;
    padding: 50px 20px 0 0
}

.nwall .case-right .tabs {
    padding-left: 40px;
    border-bottom: 0
}

.n-detail-right ul li {
    width: 100%;
    padding: 30px 20px 20px 20px;
    margin-bottom: 0;
    margin-right: 0;
    border-top: none;
    border-bottom: none;
    position: relative
}

.n-detail-right ul li:after {
    width: calc(100% - 40px);
    height: 1px;
    background: #e7e7e7;
    position: absolute;
    bottom: 0;
    content: ''
}

.n-detail-right ul li:last-child:after {
    display: none
}

.n-detail-right ul li:last-child {
    border-bottom: 1px solid #e7e7e7
}

.n-detail-right ul li a {
    font-size: 15px;
    display: inline-block;
    margin-bottom: 10px;
    color: #07aefc
}

.n-detail-right ul li .description {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    overflow: hidden;
    text-overflow: ellipsis;
    line-height: 23px;
    font-size: 12px;
    color: #73777a
}

.n-detail-right ul li .time {
    margin-top: 20px;
    color: #73777a;
    font-size: 12px
}

.n-detail-right ul li::before {
    position: absolute;
    bottom: 0;
    content: '';
    left: -1px;
    width: 1px;
    background-color: #07aefc;
    height: 0;
    top: 33px;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out
}

.n-detail-right ul li:hover::before {
    height: 100px
}

.footer {
    background: #0f1e2b
}

.footer-wall {
    padding: 60px 0;
    width: 1280px;
    margin: 0 auto;
    position: relative
}

.footer-wall .foot-nav-list a:first-child {
    padding-left: 0
}

.footer-wall .foot-nav-list a {
    color: #9b9ea0;
    padding: 0 12px
}

.footer-wall .foot-nav-list span {
    color: #9b9ea0
}

.footer-wall .foot-left {
    width: 550px
}

.footer-wall .foot-left p {
    margin-top: 15px;
    color: #73777a;
    font-size: 12px
}

.footer-wall .foot-right {
    width: 300px;
    float: right;
    position: absolute;
    right: 0;
    top: 40px;
    text-align: right
}

.footer-wall .foot-right img {
    width: 100px
}

.footer-wall .cus-tel {
    position: absolute;
    width: 300px;
    right: 130px;
    top: 30px;
    color: #9b9ea0;
    text-align: left
}

@media screen and (max-width: 1440px) {
    .sel-left {
        width:1100px
    }

    .service-wall .ser-info {
        width: 590px
    }

    .service-wall .ser-img {
        width: 450px
    }

    .case-list {
        overflow: hidden
    }

    .case-list .case-row:first-child {
        padding: 0
    }

    .case-list .case-row {
        width: 30%;
        box-sizing: border-box
    }

    .case {
        min-height: 400px;
        width: 1240px
    }
}

@media screen and (max-width: 1366px) {
    .sel-left {
        width:1000px
    }

    .service-wall .ser-info {
        width: 540px
    }

    .service-wall .ser-img {
        width: 400px
    }

    .case-list {
        height: 806px;
        overflow: hidden
    }

    .case-list .case-row:first-child {
        padding: 0
    }

    .case-list .case-row {
        width: 30%;
        box-sizing: border-box;
        padding: 0 50px
    }

    .case-list .case-row:nth-child(n+6) {
        display: none
    }

    .case {
        min-height: 400px;
        width: 1150px
    }
}

@media screen and (max-width: 1280px) {
    .sel-left {
        width:920px
    }

    .service-wall .ser-info {
        width: 510px
    }

    .service-wall .ser-img {
        width: 350px
    }

    .case-list {
        height: 806px;
        overflow: hidden
    }

    .case-list .case-row:first-child {
        padding: 0
    }

    .case-list .case-row {
        width: 30%;
        box-sizing: border-box;
        padding: 0 50px
    }

    .case-list .case-row:nth-child(n+6) {
        display: none
    }

    .case {
        min-height: 400px;
        width: 1070px
    }
}

@media screen and (max-width: 1024px) {
    .sel-left {
        width:660px
    }

    .service-wall .ser-info {
        width: 350px
    }

    .service-wall .ser-img {
        width: 250px
    }

    .case-list {
        height: 806px;
        overflow: hidden
    }

    .case-list .case-row:first-child {
        padding: 0
    }

    .case-list .case-row {
        width: 30%;
        box-sizing: border-box;
        padding: 0 0
    }

    .case-list .case-row:nth-child(n+6) {
        display: none
    }

    .case {
        min-height: 400px;
        width: 810px
    }
}

.bx-wrapper {
    position: relative;
    margin: 0 auto 40px;
    padding: 0;
    *zoom:1}

.bx-wrapper img {
    max-width: 100%;
    display: block
}

.bx-wrapper .bx-viewport {
    -webkit-transform: translatez(0);
    -moz-transform: translatez(0);
    -ms-transform: translatez(0);
    -o-transform: translatez(0);
    transform: translatez(0)
}

.bx-wrapper .bx-pager,.bx-wrapper .bx-controls-auto {
    position: absolute;
    bottom: -30px;
    width: 100%
}

.bx-wrapper .bx-loading {
    min-height: 50px;
    background: url(../../cdns/img/bx_loader.gif) center center no-repeat #fff;
    height: 100%;
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 2000
}

.bx-wrapper .bx-pager {
    text-align: center;
    font-size: .85em;
    font-family: Arial;
    font-weight: bold;
    color: #666;
    padding-top: 20px
}

.bx-wrapper .bx-pager .bx-pager-item,.bx-wrapper .bx-controls-auto .bx-controls-auto-item {
    display: inline-block;
    *zoom:1;*display: inline
}

.bx-wrapper .bx-pager.bx-default-pager a {
    background: #666;
    text-indent: -9999px;
    display: block;
    width: 10px;
    height: 10px;
    margin: 0 5px;
    outline: 0;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px
}

.bx-wrapper .bx-pager.bx-default-pager a:hover,.bx-wrapper .bx-pager.bx-default-pager a.active {
    background: #000
}

.bx-wrapper .bx-prev {
    left: -40px
}

.bx-wrapper .bx-next {
    right: -40px
}

.bx-wrapper .bx-prev:hover {
    background-position: 0 0
}

.bx-wrapper .bx-next:hover {
    background-position: -43px 0
}

.bx-wrapper .bx-controls-direction a {
    position: absolute;
    top: 50%;
    margin-top: -16px;
    outline: 0;
    width: 32px;
    height: 32px;
    z-index: 9999
}

.bx-wrapper .bx-controls-direction a i {
    color: #07aefc;
    font-size: 30px;
    margin-top: 20px
}

.bx-wrapper .bx-controls-direction a.disabled {
    display: none
}

.bx-wrapper .bx-controls-auto {
    text-align: center
}

.bx-wrapper .bx-controls-auto .bx-start {
    display: block;
    text-indent: -9999px;
    width: 10px;
    height: 11px;
    outline: 0;
    background: url(../../cdns/img/controls.png) -86px -11px no-repeat;
    margin: 0 3px
}

.bx-wrapper .bx-controls-auto .bx-start:hover,.bx-wrapper .bx-controls-auto .bx-start.active {
    background-position: -86px 0
}

.bx-wrapper .bx-controls-auto .bx-stop {
    display: block;
    text-indent: -9999px;
    width: 9px;
    height: 11px;
    outline: 0;
    background: url(../../cdns/img/controls.png) -86px -44px no-repeat;
    margin: 0 3px
}

.bx-wrapper .bx-controls-auto .bx-stop:hover,.bx-wrapper .bx-controls-auto .bx-stop.active {
    background-position: -86px -33px
}

.bx-wrapper .bx-controls.bx-has-controls-auto.bx-has-pager .bx-pager {
    text-align: left;
    width: 80%
}

.bx-wrapper .bx-controls.bx-has-controls-auto.bx-has-pager .bx-controls-auto {
    right: 0;
    width: 35px
}

.bx-wrapper .bx-caption {
    position: absolute;
    bottom: 0;
    left: 0;
    background: #666\9;
    background: rgba(80,80,80,.75);
    width: 100%
}

.bx-wrapper .bx-caption span {
    color: #fff;
    font-family: Arial;
    display: block;
    font-size: .85em;
    padding: 10px
}

.search-wrapper {
    position: relative
}

.search-wrapper .input-holder {
    overflow: hidden;
    height: 60px;
    position: relative;
    width: 60px;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
    width: 300px;
    left: -245px
}

.search-wrapper.active .input-holder {
    border-radius: 50px;
    width: 300px;
    background: #0f1e2b;
    -webkit-transition: all .5s cubic-bezier(0,.105,.035,1.57);
    -moz-transition: all .5s cubic-bezier(0,.105,.035,1.57);
    transition: all .5s cubic-bezier(0,.105,.035,1.57);
    left: -300px
}

.search-wrapper .input-holder .search-input {
    width: 100%;
    height: 35px;
    padding: 0 70px 0 20px;
    opacity: 0;
    position: absolute;
    top: 2px;
    border-radius: 50px;
    right: 0;
    background: #4f5356;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    border: none;
    outline: none;
    font-family: "Open Sans",Arial,Verdana;
    font-size: 14px;
    font-weight: 400;
    line-height: 20px;
    color: #fff;
    -webkit-transform: translate(0,60px);
    -moz-transform: translate(0,60px);
    transform: translate(0,60px);
    -webkit-transition-delay: .3s;
    -moz-transition-delay: .3s;
    transition-delay: .3s
}

.search-wrapper.active .input-holder .search-input {
    opacity: 1;
    -webkit-transform: translate(0,10px);
    -moz-transform: translate(0,10px);
    transform: translate(0,10px)
}

.search-wrapper .input-holder .search-icon {
    width: 60px;
    height: 60px;
    border: none;
    padding: 0;
    outline: none;
    position: relative;
    z-index: 2;
    float: right;
    cursor: pointer;
    background: #0f1e2b
}

.search-wrapper.active .input-holder .search-icon {
    width: 30px;
    height: 30px;
    margin: 10px;
    border-radius: 30px;
    top: 5px;
    right: -5px
}

.search-wrapper .input-holder .search-icon span {
    display: inline-block;
    vertical-align: middle;
    position: relative;
    font-size: 20px;
    color: #767676
}

.search-wrapper.active .input-holder .search-icon span {
    top: -15px;
    font-size: 16px
}

.search-wrapper .close {
    position: absolute;
    z-index: 1;
    top: 16px;
    right: 20px;
    width: 25px;
    height: 25px;
    cursor: pointer;
    -webkit-transform: rotate(-180deg);
    -moz-transform: rotate(-180deg);
    transform: rotate(-180deg);
    -webkit-transition: all .3s cubic-bezier(.285,-.45,.935,.11);
    -moz-transition: all .3s cubic-bezier(.285,-.45,.935,.11);
    transition: all .3s cubic-bezier(.285,-.45,.935,.11);
    -webkit-transition-delay: .2s;
    -moz-transition-delay: .2s;
    transition-delay: .2s
}

.search-wrapper.active .close {
    right: 20px;
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    transform: rotate(45deg);
    -webkit-transition: all .6s cubic-bezier(0,.105,.035,1.57);
    -moz-transition: all .6s cubic-bezier(0,.105,.035,1.57);
    transition: all .6s cubic-bezier(0,.105,.035,1.57);
    -webkit-transition-delay: .5s;
    -moz-transition-delay: .5s;
    transition-delay: .5s
}

.search-wrapper .close::before,.search-wrapper .close::after {
    position: absolute;
    content: '';
    background: #fff;
    border-radius: 2px
}

.search-wrapper .close::before {
    width: 3px;
    height: 20px;
    left: 12px;
    top: 2px
}

.search-wrapper .close::after {
    width: 20px;
    height: 3px;
    left: 4px;
    top: 11px
}

.search-wrapper .result-container {
    width: 100%;
    position: absolute;
    top: 80px;
    left: 0;
    text-align: center;
    font-family: "Open Sans",Arial,Verdana;
    font-size: 14px;
    display: none;
    color: #b7b7b7
}

@media screen and (max-width: 560px) {
    .search-wrapper.active .input-holder {
        width:200px
    }
}

@-webkit-keyframes runspin {
    100% {
        -webkit-transform-origin: center center;
        -webkit-transform: rotate(360deg)
    }
}

@-moz-keyframes runspin {
    100% {
        -moz-transform-origin: center center;
        -moz-transform: rotate(360deg)
    }
}

@-ms-keyframes runspin {
    100% {
        -ms-transform-origin: center center;
        -ms-transform: rotate(360deg)
    }
}

@-o-keyframes runspin {
    100% {
        -o-transform-origin: center center;
        -o-transform: rotate(360deg);
    }
}

@keyframes runspin {
    100% {
        transform-origin: center center;
        transform: rotate(360deg)
    }
}

.delay {
    -webkit-animation-delay: 1s;
    -moz-animation-delay: 1s;
    -ms-animation-delay: 1s;
    -o-animation-delay: 1s;
    animation-delay: 1s
}

.runspin {
    -webkit-animation-name: runspin;
    -moz-animation-name: runspin;
    -ms-animation-name: runspin;
    -o-animation-name: runspin;
    animation-name: runspin
}

@-webkit-keyframes turnspin {
    100% {
        -webkit-transform-origin: center center;
        -webkit-transform: rotate(-360deg)
    }
}

@-moz-keyframes turnspin {
    100% {
        -moz-transform-origin: center center;
        -moz-transform: rotate(-360deg)
    }
}

@-ms-keyframes turnspin {
    100% {
        -ms-transform-origin: center center;
        -ms-transform: rotate(-360deg)
    }
}

@-o-keyframes turnspin {
    100% {
        -o-transform-origin: center center;
        -o-transform: rotate(-360deg);
    }
}

@keyframes turnspin {
    100% {
        transform-origin: center center;
        transform: rotate(-360deg)
    }
}

.turnspin {
    -webkit-animation-name: turnspin;
    -moz-animation-name: turnspin;
    -ms-animation-name: turnspin;
    -o-animation-name: turnspin;
    animation-name: turnspin
}

@-webkit-keyframes centerturn {
    30%,70% {
        -webkit-transform-origin: center;
        -webkit-transform: rotateX(-30deg)
    }

    0%,20%,40%,60% {
        -webkit-transform-origin: center;
        -webkit-transform: rotateX(0deg)
    }

    10%,50% {
        -webkit-transform-origin: center;
        -webkit-transform: rotateX(30deg)
    }
}

@-moz-keyframes centerturn {
    30%,70% {
        -moz-transform-origin: center;
        -moz-transform: rotateX(-30deg)
    }

    0%,20%,40%,60% {
        -moz-transform-origin: center;
        -moz-transform: rotateX(0deg)
    }

    10%,50% {
        -moz-transform-origin: center;
        -moz-transform: rotateX(30deg)
    }
}

@-ms-keyframes centerturn {
    30%,70% {
        -ms-transform-origin: center;
        -ms-transform: rotateX(-30deg)
    }

    0%,20%,40%,60% {
        -ms-transform-origin: center;
        -ms-transform: rotateX(0deg)
    }

    10%,50% {
        -ms-transform-origin: center;
        -ms-transform: rotateX(30deg)
    }
}

@-o-keyframes centerturn {
    30%,70% {
        -o-transform-origin: center;
        -o-transform: rotateX(-30deg);
    }

    0%,20%,40%,60% {
        -o-transform-origin: center;
        -o-transform: rotateX(0deg);
    }

    10%,50% {
        -o-transform-origin: center;
        -o-transform: rotateX(30deg);
    }
}

@keyframes centerturn {
    30%,70% {
        transform-origin: center;
        transform: rotateX(-30deg)
    }

    0%,20%,40%,60% {
        transform-origin: center;
        transform: rotateX(0deg)
    }

    10%,50% {
        transform-origin: center;
        transform: rotateX(30deg)
    }
}

.centerturn {
    -webkit-animation-name: centerturn;
    -moz-animation-name: centerturn;
    -ms-animation-name: centerturn;
    -o-animation-name: centerturn;
    animation-name: centerturn
}

@-webkit-keyframes xyspin {
    0%,50% {
        -webkit-transform: skew(10deg,10deg)
    }

    100% {
        -webkit-transform: skew(0deg,0deg)
    }

    25%,75% {
        -webkit-transform: skew(-10deg,-10deg)
    }
}

@-moz-keyframes xyspin {
    0%,50% {
        -moz-transform: skew(10deg,10deg)
    }

    100% {
        -moz-transform: skew(0deg,0deg)
    }

    25%,75% {
        -moz-transform: skew(-10deg,-10deg)
    }
}

@-ms-keyframes xyspin {
    0%,50% {
        -ms-transform: skew(10deg,10deg)
    }

    100% {
        -ms-transform: skew(0deg,0deg)
    }

    25%,75% {
        -ms-transform: skew(-10deg,-10deg)
    }
}

@-o-keyframes xyspin {
    0%,50% {
        -o-transform: skew(10deg,10deg);
    }

    100% {
        -o-transform: skew(0deg,0deg);
    }

    25%,75% {
        -o-transform: skew(-10deg,-10deg);
    }
}

@keyframes xyspin {
    0%,50% {
        transform: skew(10deg,10deg)
    }

    100% {
        transform: skew(0deg,0deg)
    }

    25%,75% {
        transform: skew(-10deg,-10deg)
    }
}

.xyspin {
    -webkit-animation-name: xyspin;
    -moz-animation-name: xyspin;
    -ms-animation-name: xyspin;
    -o-animation-name: xyspin;
    animation-name: xyspin
}

@-webkit-keyframes kuailai {
    0% {
        -webkit-transform: translateX(-1000px);
        opacity: 0
    }

    50% {
        -webkit-transform: rotateX(70deg) rotateY(40deg);
        opacity: .7
    }

    100% {
        -webkit-transform: rotateX(0deg) rotateY(0deg);
        opacity: 1
    }
}

@-moz-keyframes kuailai {
    0% {
        -moz-transform: translateX(-1000px);
        opacity: 0
    }

    50% {
        -moz-transform: rotateX(70deg) rotateY(40deg);
        opacity: .7
    }

    100% {
        -moz-transform: rotateX(0deg) rotateY(0deg);
        opacity: 1
    }
}

@-ms-keyframes kuailai {
    0% {
        -ms-transform: translateX(-1000px);
        opacity: 0
    }

    50% {
        -ms-transform: rotateX(70deg) rotateY(40deg);
        opacity: .7
    }

    100% {
        -ms-transform: rotateX(0deg) rotateY(0deg);
        opacity: 1
    }
}

@-o-keyframes kuailai {
    0% {
        -o-transform: translateX(-1000px);
        opacity: 0;
    }

    50% {
        -o-transform: rotateX(70deg)rotateY(40deg);
        opacity: .7;
    }

    100% {
        -o-transform: rotateX(0deg)rotateY(0deg);
        opacity: 1;
    }
}

@keyframes kuailai {
    0% {
        transform: translateX(-1000px);
        opacity: 0
    }

    50% {
        transform: rotateX(70deg) rotateY(40deg);
        opacity: .7
    }

    100% {
        transform: rotateX(0deg) rotateY(0deg);
        opacity: 1
    }
}

.kuailai {
    -webkit-animation-name: kuailai;
    -moz-animation-name: kuailai;
    -ms-animation-name: kuailai;
    -o-animation-name: kuailai;
    animation-name: kuailai
}

@-webkit-keyframes zoukai {
    50% {
        -webkit-transform: rotateX(70deg) rotateY(40deg);
        opacity: .7
    }

    100% {
        -webkit-transform: translateX(-1000px);
        opacity: 0
    }
}

@-o-keyframes zoukai {
    50% {
        -o-transform: rotateX(70deg)rotateY(40deg);
        opacity: .7;
    }

    100% {
        -o-transform: translateX(-1000px);
        opacity: 0;
    }
}

@-ms-keyframes zoukai {
    50% {
        -ms-transform: rotateX(70deg) rotateY(40deg);
        opacity: .7
    }

    100% {
        -ms-transform: translateX(-1000px);
        opacity: 0
    }
}

@-moz-keyframes zoukai {
    50% {
        -moz-transform: rotateX(70deg) rotateY(40deg);
        opacity: .7
    }

    100% {
        -moz-transform: translateX(-1000px);
        opacity: 0
    }
}

@keyframes zoukai {
    50% {
        transform: rotateX(70deg) rotateY(40deg);
        opacity: .7
    }

    100% {
        transform: translateX(-1000px);
        opacity: 0
    }
}

.zoukai {
    -webkit-animation-name: zoukai;
    -moz-animation-name: zoukai;
    -ms-animation-name: zoukai;
    -m-animation-name: zoukai;
    animation-name: zoukai
}

@-webkit-keyframes kuxuan {
    0% {
        -webkit-transform: rotateX(-90deg) rotateY(-90deg)
    }

    50% {
        -webkit-transform: rotateX(90deg) rotateY(90deg)
    }

    100% {
        -webkit-transform: rotateY(0deg) rotateX(0deg)
    }
}

@-moz-keyframes kuxuan {
    0% {
        -moz-transform: rotateX(-90deg) rotateY(-90deg)
    }

    50% {
        -moz-transform: rotateX(90deg) rotateY(90deg)
    }

    100% {
        -moz-transform: rotateY(0deg) rotateX(0deg)
    }
}

@-ms-keyframes kuxuan {
    0% {
        -ms-transform: rotateX(-90deg) rotateY(-90deg)
    }

    50% {
        -ms-transform: rotateX(90deg) rotateY(90deg)
    }

    100% {
        -ms-transform: rotateY(0deg) rotateX(0deg)
    }
}

@-o-keyframes kuxuan {
    0% {
        -o-transform: rotateX(-90deg)rotateY(-90deg);
    }

    50% {
        -o-transform: rotateX(90deg)rotateY(90deg);
    }

    100% {
        -o-transform: rotateY(0deg)rotateX(0deg);
    }
}

@keyframes kuxuan {
    0% {
        transform: rotateX(-90deg) rotateY(-90deg)
    }

    50% {
        transform: rotateX(90deg) rotateY(90deg)
    }

    100% {
        transform: rotateY(0deg) rotateX(0deg)
    }
}

.kuxuan {
    -webkit-animation-name: kuxuan;
    -moz-animation-name: kuxuan;
    -ms-animation-name: kuxuan;
    -m-animation-name: kuxuan;
    animation-name: kuxuan
}

@-webkit-keyframes righttopgo {
    0% {
        -webkit-transform: translateY(-180px) translateX(540px)
    }

    100% {
        -webkit-transform: translateY(0) translateX(0)
    }
}

@-moz-keyframes righttopgo {
    0% {
        -moz-transform: translateY(-180px) translateX(540px)
    }

    100% {
        -moz-transform: translateY(0) translateX(0)
    }
}

@-ms-keyframes righttopgo {
    0% {
        -ms-transform: translateY(-180px) translateX(540px)
    }

    100% {
        -ms-transform: translateY(0) translateX(0)
    }
}

@-o-keyframes righttopgo {
    0% {
        -o-transform: translateY(-180px)translateX(540px);
    }

    100% {
        -o-transform: translateY(0)translateX(0);
    }
}

@keyframes righttopgo {
    0% {
        transform: translateY(-180px) translateX(540px)
    }

    100% {
        transform: translateY(0) translateX(0)
    }
}

.righttopgo {
    -webkit-animation-name: righttopgo;
    -moz-animation-name: righttopgo;
    -ms-animation-name: righttopgo;
    -m-animation-name: righttopgo;
    animation-name: righttopgo
}

@-webkit-keyframes lefttopgo {
    0% {
        -webkit-transform: translateY(-180px) translateX(-540px)
    }

    100% {
        -webkit-transform: translateY(0) translateX(0)
    }
}

@-moz-keyframes lefttopgo {
    0% {
        -moz-transform: translateY(-180px) translateX(-540px)
    }

    100% {
        -moz-transform: translateY(0) translateX(0)
    }
}

@-ms-keyframes lefttopgo {
    0% {
        -ms-transform: translateY(-180px) translateX(-540px)
    }

    100% {
        -ms-transform: translateY(0) translateX(0)
    }
}

@-o-keyframes lefttopgo {
    0% {
        -o-transform: translateY(-180px)translateX(-540px);
    }

    100% {
        -o-transform: translateY(0)translateX(0);
    }
}

@keyframes lefttopgo {
    0% {
        transform: translateY(-180px) translateX(-540px)
    }

    100% {
        transform: translateY(0) translateX(0)
    }
}

.lefttopgo {
    -webkit-animation-name: lefttopgo;
    -moz-animation-name: lefttopgo;
    -ms-animation-name: lefttopgo;
    -m-animation-name: lefttopgo;
    animation-name: lefttopgo
}

@-webkit-keyframes updown {
    0% {
        -webkit-transform: translateY(-180px)
    }

    40% {
        -webkit-transform: translateY(-90px)
    }

    80% {
        -webkit-transform: translateY(-45px)
    }

    20%,60%,100% {
        -webkit-transform: translateY(0)
    }
}

@-moz-keyframes updown {
    0% {
        -moz-transform: translateY(-180px)
    }

    40% {
        -moz-transform: translateY(-90px)
    }

    80% {
        -moz-transform: translateY(-45px)
    }

    20%,60%,100% {
        -moz-transform: translateY(0)
    }
}

@-ms-keyframes updown {
    0% {
        -ms-transform: translateY(-180px)
    }

    40% {
        -ms-transform: translateY(-90px)
    }

    80% {
        -ms-transform: translateY(-45px)
    }

    20%,60%,100% {
        -ms-transform: translateY(0)
    }
}

@-o-keyframes updown {
    0% {
        -o-transform: translateY(-180px);
    }

    40% {
        -o-transform: translateY(-90px);
    }

    80% {
        -o-transform: translateY(-45px);
    }

    20%,60%,100% {
        -o-transform: translateY(0);
    }
}

@keyframes updown {
    0% {
        transform: translateY(-180px)
    }

    40% {
        transform: translateY(-90px)
    }

    80% {
        transform: translateY(-45px)
    }

    20%,60%,100% {
        transform: translateY(0)
    }
}

.updown {
    transform-style: perserve-3d;
    -webkit-animation-name: updown;
    -moz-animation-name: updown;
    -ms-animation-name: updown;
    -m-animation-name: updown;
    animation-name: updown
}

.animated {
    -webkit-animation-duration: 1s;
    -moz-animation-duration: 1s;
    -ms-animation-duration: 1s;
    -o-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-fill-mode: both;
    -moz-animation-fill-mode: both;
    -ms-animation-fill-mode: both;
    -o-animation-fill-mode: both;
    animation-fill-mode: both
}

.animated2 {
    -webkit-animation-duration: 2s;
    -moz-animation-duration: 2s;
    -ms-animation-duration: 2s;
    -o-animation-duration: 2s;
    animation-duration: 2s
}

@-webkit-keyframes flash {
    0%,50%,100% {
        opacity: 1
    }

    25%,75% {
        opacity: 0
    }
}

@-moz-keyframes flash {
    0%,50%,100% {
        opacity: 1
    }

    25%,75% {
        opacity: 0
    }
}

@-ms-keyframes flash {
    0%,50%,100% {
        opacity: 1
    }

    25%,75% {
        opacity: 0
    }
}

@-o-keyframes flash {
    0%,50%,100% {
        opacity: 1;
    }

    25%,75% {
        opacity: 0;
    }
}

@keyframes flash {
    0%,50%,100% {
        opacity: 1
    }

    25%,75% {
        opacity: 0
    }
}

.flash {
    -webkit-animation-name: flash;
    -moz-animation-name: flash;
    -ms-animation-name: flash;
    -m-animation-name: flash;
    animation-name: flash
}

@-webkit-keyframes shake {
    0%,100% {
        transform: translateX(0)
    }

    10%,30%,50%,70%,90% {
        transform: translateX(-10px)
    }

    20%,40%,60%,80% {
        transform: translateX(10px)
    }
}

@-moz-keyframes shake {
    0%,100% {
        transform: translateX(0)
    }

    10%,30%,50%,70%,90% {
        transform: translateX(-10px)
    }

    20%,40%,60%,80% {
        transform: translateX(10px)
    }
}

@-ms-keyframes shake {
    0%,100% {
        transform: translateX(0)
    }

    10%,30%,50%,70%,90% {
        transform: translateX(-10px)
    }

    20%,40%,60%,80% {
        transform: translateX(10px)
    }
}

@-o-keyframes shake {
    0%,100% {
        transform: translateX(0);
    }

    10%,30%,50%,70%,90% {
        transform: translateX(-10px);
    }

    20%,40%,60%,80% {
        transform: translateX(10px);
    }
}

@keyframes shake {
    0%,100% {
        transform: translateX(0)
    }

    10%,30%,50%,70%,90% {
        transform: translateX(-10px)
    }

    20%,40%,60%,80% {
        transform: translateX(10px)
    }
}

.shake {
    -webkit-animation-name: shake;
    -moz-animation-name: shake;
    -ms-animation-name: shake;
    -o-animation-name: shake;
    animation-name: shake
}

@-webkit-keyframes bounce {
    0%,20%,50%,80%,100% {
        -webkit-transform: translateY(0)
    }

    40% {
        -webkit-transform: translateY(-30px)
    }

    60% {
        -webkit-transform: translateY(-15px)
    }
}

@-moz-keyframes bounce {
    0%,20%,50%,80%,100% {
        -moz-transform: translateY(0)
    }

    40% {
        -moz-transform: translateY(-30px)
    }

    60% {
        -moz-transform: translateY(-15px)
    }
}

@-ms-keyframes bounce {
    0%,20%,50%,80%,100% {
        -ms-transform: translateY(0)
    }

    40% {
        -ms-transform: translateY(-30px)
    }

    60% {
        -ms-transform: translateY(-15px)
    }
}

@-o-keyframes bounce {
    0%,20%,50%,80%,100% {
        -o-transform: translateY(0);
    }

    40% {
        -o-transform: translateY(-30px);
    }

    60% {
        -o-transform: translateY(-15px);
    }
}

@keyframes bounce {
    0%,20%,50%,80%,100% {
        transform: translateY(0)
    }

    40% {
        transform: translateY(-30px)
    }

    60% {
        transform: translateY(-15px)
    }
}

.bounce {
    -webkit-animation-name: bounce;
    -moz-animation-name: bounce;
    -ms-animation-name: bounce;
    -o-animation-name: bounce;
    animation-name: bounce
}

@-webkit-keyframes centerspin {
    0% {
        -webkit-transform-origin: center;
        -webkit-transform: rotateY(180deg)
    }

    100% {
        -webkit-transform-origin: center;
        -webkit-transform: rotateY(0deg)
    }
}

@-moz-keyframes centerspin {
    0% {
        -moz-transform-origin: center;
        -moz-transform: rotateY(180deg)
    }

    100% {
        -moz-transform-origin: center;
        -moz-transform: rotateY(0deg)
    }
}

@-ms-keyframes centerspin {
    0% {
        -ms-transform-origin: center;
        -ms-transform: rotateY(180deg)
    }

    100% {
        -ms-transform-origin: center;
        -ms-transform: rotateY(0deg)
    }
}

@-o-keyframes centerspin {
    0% {
        -o-transform-origin: center;
        -o-transform: rotateY(180deg);
    }

    100% {
        -o-transform-origin: center;
        -o-transform: rotateY(0deg);
    }
}

@keyframes centerspin {
    0% {
        transform-origin: center;
        transform: rotateY(180deg)
    }

    100% {
        transform-origin: center;
        transform: rotateY(0deg)
    }
}

.centerspin {
    transform-style: perserve-3d;
    -webkit-animation-name: centerspin;
    -moz-animation-name: centerspin;
    -ms-animation-name: centerspin;
    -o-animation-name: centerspin;
    animation-name: centerspin
}

@-webkit-keyframes topturn {
    30%,70% {
        -webkit-transform-origin: top;
        -webkit-transform: rotateX(-30deg)
    }

    0%,20%,40%,60% {
        -webkit-transform-origin: top;
        -webkit-transform: rotateX(0deg)
    }

    10%,50% {
        -webkit-transform-origin: top;
        -webkit-transform: rotateX(30deg)
    }
}

@-moz-keyframes topturn {
    30%,70% {
        -moz-transform-origin: top;
        -moz-transform: rotateX(-10deg)
    }

    0%,20%,40%,60% {
        -moz-transform-origin: top;
        -moz-transform: rotateX(0deg)
    }

    10%,50% {
        -moz-transform-origin: top;
        -moz-transform: rotateX(10deg)
    }
}

@-ms-keyframes topturn {
    30%,70% {
        -ms-transform-origin: top;
        -ms-transform: rotateX(-10deg)
    }

    0%,20%,40%,60% {
        -ms-transform-origin: top;
        -ms-transform: rotateX(0deg)
    }

    10%,50% {
        -ms-transform-origin: top;
        -ms-transform: rotateX(10deg)
    }
}

@-o-keyframes topturn {
    30%,70% {
        -o-transform-origin: top;
        -o-transform: rotateX(-10deg);
    }

    0%,20%,40%,60% {
        -o-transform-origin: top;
        -o-transform: rotateX(0deg);
    }

    10%,50% {
        -o-transform-origin: top;
        -o-transform: rotateX(10deg);
    }
}

@keyframes topturn {
    30%,70% {
        transform-origin: top;
        transform: rotateX(-10deg)
    }

    0%,20%,40%,60% {
        transform-origin: top;
        transform: rotateX(0deg)
    }

    10%,50% {
        transform-origin: top;
        transform: rotateX(10deg)
    }
}

.topturn {
    transform-style: perserve-3d;
    -webkit-animation-name: topturn;
    -moz-animation-name: topturn;
    -ms-animation-name: topturn;
    -o-animation-name: topturn;
    animation-name: topturn
}

@-webkit-keyframes topspin {
    30%,70% {
        -webkit-transform-origin: top;
        -webkit-transform: rotate(-30deg)
    }

    0%,20%,40%,60%,80% {
        -webkit-transform-origin: top;
        -webkit-transform: rotate(0deg)
    }

    10%,50% {
        -webkit-transform-origin: top;
        -webkit-transform: rotate(30deg)
    }
}

@-moz-keyframes topspin {
    30%,70% {
        -moz-transform-origin: top;
        -moz-transform: rotate(-30deg)
    }

    0%,20%,40%,60%,80% {
        -moz-transform-origin: top;
        -moz-transform: rotate(0deg)
    }

    10%,50% {
        -moz-transform-origin: top;
        -moz-transform: rotate(30deg)
    }
}

@-ms-keyframes topspin {
    30%,70% {
        -ms-transform-origin: top;
        -ms-transform: rotate(-30deg)
    }

    0%,20%,40%,60%,80% {
        -ms-transform-origin: top;
        -ms-transform: rotate(0deg)
    }

    10%,50% {
        -ms-transform-origin: top;
        -ms-transform: rotate(30deg)
    }
}

@-o-keyframes topspin {
    30%,70% {
        -o-transform-origin: top;
        -o-transform: rotate(-30deg);
    }

    0%,20%,40%,60%,80% {
        -o-transform-origin: top;
        -o-transform: rotate(0deg);
    }

    10%,50% {
        -o-transform-origin: top;
        -o-transform: rotate(30deg);
    }
}

@keyframes topspin {
    30%,70% {
        transform-origin: top;
        transform: rotate(-30deg)
    }

    0%,20%,40%,60%,80% {
        transform-origin: top;
        transform: rotate(0deg)
    }

    10%,50% {
        transform-origin: top;
        transform: rotate(30deg)
    }
}

.topspin {
    -webkit-animation-name: topspin;
    -moz-animation-name: topspin;
    -ms-animation-name: topspin;
    -o-animation-name: topspin;
    animation-name: topspin
}

@-webkit-keyframes leftfall {
    0% {
        -webkit-transform-origin: left top;
        -webkit-transform: rotate(-60deg)
    }

    40%,80%,100% {
        -webkit-transform-origin: left top;
        -webkit-transform: rotate(0deg)
    }

    60% {
        -webkit-transform-origin: left top;
        -webkit-transform: rotate(-10deg)
    }

    90% {
        -webkit-transform-origin: left top;
        -webkit-transform: rotate(-5deg)
    }
}

@-moz-keyframes leftfall {
    0% {
        -moz-transform-origin: left top;
        -moz-transform: rotate(-60deg)
    }

    40%,80%,100% {
        -moz-transform-origin: left top;
        -moz-transform: rotate(0deg)
    }

    60% {
        -moz-transform-origin: left top;
        -moz-transform: rotate(-10deg)
    }

    90% {
        -moz-transform-origin: left top;
        -moz-transform: rotate(-5deg)
    }
}

@-ms-keyframes leftfall {
    0% {
        -ms-transform-origin: left top;
        -ms-transform: rotate(-60deg)
    }

    40%,80%,100% {
        -ms-transform-origin: left top;
        -ms-transform: rotate(0deg)
    }

    60% {
        -ms-transform-origin: left top;
        -ms-transform: rotate(-10deg)
    }

    90% {
        -ms-transform-origin: left top;
        -ms-transform: rotate(-5deg)
    }
}

@-o-keyframes leftfall {
    0% {
        -o-transform-origin: left top;
        -o-transform: rotate(-60deg);
    }

    40%,80%,100% {
        -o-transform-origin: left top;
        -o-transform: rotate(0deg);
    }

    60% {
        -o-transform-origin: left top;
        -o-transform: rotate(-10deg);
    }

    90% {
        -o-transform-origin: left top;
        -o-transform: rotate(-5deg);
    }
}

@keyframes leftfall {
    0% {
        transform-origin: left top;
        transform: rotate(-60deg)
    }

    40%,80%,100% {
        transform-origin: left top;
        transform: rotate(0deg)
    }

    60% {
        transform-origin: left top;
        transform: rotate(-10deg)
    }

    90% {
        transform-origin: left top;
        transform: rotate(-5deg)
    }
}

.leftfall {
    -webkit-animation-name: leftfall;
    -moz-animation-name: leftfall;
    -ms-animation-name: leftfall;
    -o-animation-name: leftfall;
    animation-name: leftfall
}

@-webkit-keyframes bigsmall {
    0%,50%,100% {
        -webkit-transform: scale(1,1)
    }

    25%,75% {
        -webkit-transform: scale(.9,.9)
    }
}

@-moz-keyframes bigsmall {
    0%,50%,100% {
        -moz-transform: scale(1,1)
    }

    25%,75% {
        -moz-transform: scale(.9,.9)
    }
}

@-ms-keyframes bigsmall {
    0%,50%,100% {
        -ms-transform: scale(1,1)
    }

    25%,75% {
        -ms-transform: scale(.9,.9)
    }
}

@-o-keyframes bigsmall {
    0%,50%,100% {
        -o-transform: scale(1,1);
    }

    25%,75% {
        -o-transform: scale(.9,.9);
    }
}

@keyframes bigsmall {
    0%,50%,100% {
        transform: scale(1,1)
    }

    25%,75% {
        transform: scale(.9,.9)
    }
}

.bigsmall {
    -webkit-animation-name: bigsmall;
    -moz-animation-name: bigsmall;
    -ms-animation-name: bigsmall;
    -o-animation-name: bigsmall;
    animation-name: bigsmall
}

@-webkit-keyframes putin {
    0% {
        -webkit-transform: translateX(-100%)
    }

    25%,100% {
        -webkit-transform: translateX(0)
    }

    50% {
        -webkit-transform: skew(-20deg)
    }

    75% {
        -webkit-transform: skew(0deg,0deg)
    }
}

@-moz-keyframes putin {
    0% {
        -moz-transform: translateX(-100%)
    }

    25%,100% {
        -moz-transform: translateX(0)
    }

    50% {
        -moz-transform: skew(-20deg)
    }

    75% {
        -moz-transform: skew(0deg,0deg)
    }
}

@-ms-keyframes putin {
    0% {
        -ms-transform: translateX(-100%)
    }

    25%,100% {
        -ms-transform: translateX(0)
    }

    50% {
        -ms-transform: skew(-20deg)
    }

    75% {
        -ms-transform: skew(0deg,0deg)
    }
}

@-o-keyframes putin {
    0% {
        -o-transform: translateX(-100%);
    }

    25%,100% {
        -o-transform: translateX(0);
    }

    50% {
        -o-transform: skew(-20deg);
    }

    75% {
        -o-transform: skew(0deg,0deg);
    }
}

@keyframes putin {
    0% {
        transform: translateX(-100%)
    }

    25%,100% {
        transform: translateX(0)
    }

    50% {
        transform: skew(-20deg)
    }

    75% {
        transform: skew(0deg,0deg)
    }
}

.putin {
    -webkit-animation-name: putin;
    -moz-animation-name: putin;
    -ms-animation-name: putin;
    -o-animation-name: putin;
    animation-name: putin
}

.fyt-ation {
    width: 500px;
    height: 255px;
    position: fixed;
    top: 50%;
    margin-top: -123px;
    left: 50%;
    margin-left: -255px;
    z-index: 123456;
    background: rgba(97,68,152,.9);
    padding: 15px;
    display: none
}

.fyt-action-wrap {
    border: 1px solid #fff;
    width: 470px;
    height: 225px;
    text-align: center;
    position: relative;
    color: #fff
}

.fyt-action-close {
    width: 30px;
    height: 30px;
    text-align: center;
    line-height: 30px;
    color: #fff;
    position: absolute;
    right: 0;
    top: 0;
    font-size: 22px;
    cursor: pointer
}

.fyt-action-text {
    padding-top: 20px
}

.fyt-action-text h3 {
    margin-bottom: 15px;
    font-size: 30px;
    margin-bottom: 20px
}

.fyt-action-text .tel {
    margin-top: 10px
}

.fyt-action-text a {
    color: #fff;
    font-size: 20px;
    display: inline-block;
    margin: 0 20px
}

.fyt-action-btn {
    position: absolute;
    bottom: 20px;
    text-align: center;
    width: 100%
}

.fyt-action-btn a {
    display: inline-block;
    text-align: center;
    color: #fff;
    padding: 7px 35px;
    border: 1px solid #fff;
    border-radius: 30px;
    margin: 0 20px
}

.fyt-action-btn a:first-child {
    background-color: #fff;
    color: #4b0082
}

#newBridge .nb-middle {
    display: none !important
}

.fyt-service {
    overflow-x: hidden;
    min-height: 500px
}

.fyt-s-wrap {
    position: relative;
    background-color: #fff;
    position: relative;
    z-index: 10
}

.fyt-s-left {
    width: 50%;
    float: left
}

.fyt-s-right {
    width: 50%;
    float: right
}

.fyt-service .fs-img {
    padding: 20px 0;
    position: relative
}

.fyt-service .fs-img img {
    max-width: 100%
}

.fs-text {
    float: right;
    width: 600px;
    padding-top: 80px;
    padding-bottom: 80px
}

.fs-text.fs-t-l {
    float: left;
    padding-left: 66px
}

.fs-text h3 {
    font-size: 30px;
    font-weight: normal
}

.fs-text h4 {
    font-size: 25px;
    font-family: Times New Roman;
    color: #999;
    border-bottom: 1px solid #999;
    display: inline-block;
    padding-bottom: 10px
}

.fs-text .summary {
    font-size: 15px;
    padding: 15px 50px 15px 0;
    color: #666;
    line-height: 26px
}

.fs-text .types {
    margin-top: 30px
}

.fs-text .types em {
    display: inline-block;
    width: 55px;
    height: 55px;
    display: inline-block;
    text-align: center
}

.fs-text .types em i {
    font-size: 45px;
    color: #999
}

.fs-text .types a {
    display: inline-block;
    margin-right: 80px;
    margin-bottom: 40px;
    text-align: center;
    color: #333
}

.fs-text .types a span {
    display: block;
    margin-top: 10px;
    font-size: 15px
}

.fs-text .link {
    margin-top: 20px
}

.fs-text .link a {
    display: inline-block;
    margin-right: 66px;
    border: 1px solid #425075;
    padding: 12px 50px;
    color: #333;
    text-align: center;
    transition: all .5s
}

.fs-text .link a span {
    display: inline-block;
    margin-left: 5px
}

.fs-text .link a:hover {
    background-color: #07aefc;
    border: 1px solid #07aefc;
    color: #fff
}

.fyt-s-wrap.sbg1 {
    background-color: #07aefc;
    color: #fff !important
}

.fyt-s-wrap.sbg2 {
    background-color: #fff
}

.fyt-s-wrap.sbg3 {
    background-color: #0f1e2b;
    color: #fff
}

.fyt-s-wrap.sbg4 {
    background-color: #fff
}

.fyt-s-wrap.sbg5 {
    background-color: #f5f5f5
}

.fyt-s-wrap.sbg1 h3,.fyt-s-wrap.sbg3 h3 {
    color: #fff
}

.fyt-s-water a,.fyt-s-water .types a {
    color: #fff
}

.fyt-s-water .summary {
    color: #e6e7e8
}

.fyt-s-water .fs-text h4 {
    color: #e6e7e8
}

.fyt-s-water .fs-text .link a {
    border: 1px solid #fff;
    color: #fff
}

.fyt-s-water .fs-text .link a:hover {
    background-color: #fff;
    color: #333
}

.fyt-s-water .types em i {
    color: #fff
}

.fyt-service .fyt-s-wrap:nth-child(1) .fs-img img {
    position: absolute;
    right: 0;
    width: 90%
}

.fyt-service .fyt-s-wrap:nth-child(2) .fs-img img {
    position: absolute;
    top: 100px;
    left: 50px
}

.fyt-s-more {
    background-color: #fff;
    min-height: 400px;
    padding: 50px 0 80px 0;
    position: relative;
    z-index: 10
}

.more-title {
    text-align: center
}

.more-title h3 {
    font-size: 30px
}

.more-title h4 {
    font-size: 25px;
    font-family: Times New Roman;
    color: #999;
    border-bottom: 1px solid #999;
    display: inline-block;
    padding-bottom: 10px
}

.service-wrap {
    width: 1200px;
    margin: 50px auto 0
}

.service-item {
    text-align: center;
    width: 23%;
    margin-right: 2.6%;
    float: left;
    background-color: #fff;
    box-shadow: 5px 1px 25px 4px #e6e7e8;
    -moz-box-shadow: 5px 1px 25px 4px #e6e7e8;
    border: 1px solid #eaeaea;
    padding: 10px 15px
}

.service-item:last-child {
    margin-right: 0
}

.service-item h3 {
    font-size: 22px;
    font-weight: normal
}

.service-item h4 {
    font-size: 15px;
    color: #888;
    font-weight: normal
}

.service-item .sicon {
    padding: 10px 0
}

.service-item .sicon span {
    display: inline-block;
    width: 80px;
    height: 80px;
    border-radius: 50%;
    border: 1px solid #eaeaea;
    text-align: center;
    line-height: 80px
}

.service-item .sicon i {
    font-size: 60px;
    position: relative;
    color: #666
}

.service-item:nth-child(4) .sicon i {
    font-size: 46px
}

.service-item .tag {
    border-top: 1px solid #eaeaea;
    padding: 15px 0 0 0;
    margin-top: 20px
}

.service-item .tag span {
    display: inline-block;
    border: 1px solid #f1f1f1;
    padding: 8px 0;
    float: left;
    width: 45%;
    margin-right: 9%;
    text-align: center;
    margin-bottom: 15px;
    cursor: pointer
}

.service-item .tag span:nth-child(2n) {
    margin-right: 0
}

.service-item:nth-child(1) {
    border-top: 3px solid #27c9f8
}

.service-item:nth-child(2) {
    border-top: 3px solid #f65589
}

.service-item:nth-child(3) {
    border-top: 3px solid #38cf7a
}

.service-item:nth-child(4) {
    border-top: 3px solid #b376ff
}

.service-foot {
    margin-bottom: 8px;
    margin-top: 10px
}

.service-foot a {
    display: block;
    width: 100%;
    border: 1px solid #23b6f5;
    padding: 6px 0;
    border-radius: 3px;
    color: #23b6f5;
    position: relative;
    transition: background .2s,color .2s;
    -webkit-transition: background .2s,color .2s
}

.service-foot a em {
    position: absolute;
    right: 0;
    top: 0;
    display: block;
    line-height: 52px;
    width: 90px;
    text-align: center;
    font-weight: normal;
    font-size: 15px;
    font-style: normal
}

.service-foot a span {
    position: relative;
    left: 0;
    top: 0;
    display: block;
    width: 149px;
    padding-left: 15px;
    font-size: 14px;
    border-right: 1px solid #ededed
}

.service-foot a span i {
    font-size: 18px
}

.service-foot a span b {
    font-size: 28px;
    font-weight: normal
}

.service-foot a:hover {
    color: #fff;
    background-color: #27c9f8
}

.service-foot a:hover span {
    border-right: 1px solid #fff
}

@media screen and (max-width: 1920px) {
    .fyt-s-wrap:nth-child(3) .fs-img {
        padding-top:60px
    }
}

@media screen and (max-width: 1366px) {
    .fs-text {
        padding-top:30px;
        padding-bottom: 50px
    }

    .fs-text .types,.fs-text .link {
        margin-top: 10px
    }

    .fyt-s-wrap:nth-child(2) .fs-img img {
        max-width: 90%
    }

    .fyt-s-wrap:nth-child(4) .fs-img {
        padding-top: 40px
    }
}

* {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box
}

body,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,legend,input,button,textarea,p,blockquote,th,td,div {
    color: #333;
    padding: 0;
    margin: 0;
    box-sizing: border-box;
    font-size: 14px
}

img {
    vertical-align: middle
}

*:before,*:after {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box
}

.clearfix:before,.clearfix:after {
    content: "";
    display: block;
    clear: both
}

.clearfix {
    zoom:1}

a {
    color: #333;
    -webkit-transition: all .2s ease-in-out;
    -moz-transition: all .2s ease-in-out;
    -o-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out;
    text-decoration: none
}

a:hover {
    text-decoration: none;
    color: #07aefc
}

ul,li {
    list-style: none;
    margin: 0;
    padding: 0
}

.ellipsis {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    display: block
}

.wrapper {
    padding: 0 10%;
    position: relative
}

.header {
    height: 80px;
    background-color: #fff;
    box-shadow: 0 0 10px rgba(0,0,0,.1);
    transition: height .36s ease;
    position: fixed;
    z-index: 1000;
    width: 100%;
    top: 0
}

.header .logo {
    padding-top: 10px;
    float: left
}

.header .logo img {
    height: 60px
}

.header nav {
    float: right
}

.header nav li {
    float: left
}

.header nav li>a {
    display: block;
    font-size: 16px;
    line-height: 80px;
    padding: 0 35px;
    position: relative
}

.header nav li>a::after {
    content: '';
    position: absolute;
    width: 0%;
    background: linear-gradient(to right,#f9223e 8%,#ab2c71 68%,#ab2ca1);
    left: 50%;
    transition: all .3s ease 0s;
    z-index: -1;
    height: 2px;
    bottom: 0
}

.header nav li.active>a {
    color: #07aefc
}

.header nav li:hover>a::after,.header nav li.active>a::after {
    left: 20%;
    width: 60%;
    background: linear-gradient(to right,#f9223e 8%,#ab2c71 68%,#ab2ca1)
}

.L-banner {
    position: relative;
    height: 750px;
    z-index: 1;
    overflow: hidden
}

.banner_item_cont {
    position: relative;
    top: 80px
}

.L-banner .banner_item {
    position: absolute;
    left: 0;
    width: 100%;
    opacity: 0;
    display: none\9;
    height: 793px;
    overflow: hidden
}

.L-banner .banner_item .awrap {
    position: absolute;
    z-index: 5;
    display: block;
    width: 100%;
    height: 100%
}

.L-banner .banner_item .hover-image {
    position: absolute;
    height: 100%;
    width: 100%;
    bottom: -10px;
    right: 0
}

.L-banner .banner-one .hover-image .dot {
    transform: translateZ(150px);
    width: 580px;
    bottom: -20px;
    right: 480px
}

.L-banner .banner_item .land-bom {
    position: absolute;
    width: 800px;
    right: -12px;
    bottom: -9px;
    overflow: hidden
}

.banner-row {
    position: relative;
    height: 100%;
    zoom:1;overflow: hidden
}

.banner-row img {
    position: absolute;
    bottom: -5px
}

.banner-one .banner-row img {
    width: 800px;
    position: absolute;
    right: 0;
    bottom: -5px
}

.left-header {
    width: 500px;
    position: absolute;
    top: 50%;
    margin-top: -120px;
    left: 50%;
    margin-left: -595px
}

.left-header .tit {
    font-size: 32px;
    color: #333;
    font-weight: 500;
    margin-bottom: 10px
}

.left-header .txt {
    font-size: 18px;
    color: #666
}

.left-header .understand {
    margin-top: 20px
}

.left-header .bannerList {
    margin-top: 30px
}

.left-header .bannerList .List-Item {
    color: #555;
    font-size: 18px;
    border-right: 1px dashed #333;
    padding: 5px 20px;
    text-align: center;
    display: inline-block
}

.left-header .bannerList .List-Item:first-child {
    padding: 5px 20px 5px 0
}

.left-header .bannerList .List-Item:last-child {
    border: 0
}

.L-banner .banner_item.animation-top {
    opacity: 1;
    display: block\9
}

.left-header .bannerList .linkbtn {
    display: block;
    width: 150px;
    height: 40px;
    text-align: center;
    line-height: 40px;
    border-radius: 5px;
    color: #fff;
    background: #108cee;
    font-size: 16px
}

.animation-top .hover-image {
    -webkit-animation: re-banner-slide-20 .8s cubic-bezier(.4,0,.2,1) 0s 1;
    animation: re-banner-slide-20 .8s cubic-bezier(.4,0,.2,1) 0s 1
}

.animation-top .land-bom {
    -webkit-animation: re-banner-slide-60 .8s cubic-bezier(.4,0,.2,1) 0s 1;
    animation: re-banner-slide-60 .8s cubic-bezier(.4,0,.2,1) 0s 1
}

.L-banner .banner_item.animation-top .left-header {
    -webkit-animation: re-banner-slide-20 .8s cubic-bezier(.4,0,.2,1) 0s 1;
    animation: re-banner-slide-20 .8s cubic-bezier(.4,0,.2,1) 0s 1
}

.banner_bg {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    width: 100%;
    height: 100%;
    z-index: 2
}

.num1 {
    position: absolute;
    bottom: 20px;
    left: 0;
    right: 0;
    z-index: 10;
    text-align: center;
    width: 100%
}

.num1 span {
    display: inline-block;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    border: 2px solid #999;
    box-sizing: border-box;
    margin-right: 15px;
    cursor: pointer
}

.num1 .active {
    background-color: #24b7ec;
    border: 2px solid #24b7ec
}

.banner_bg img {
    position: absolute
}

.animation-top .banner_bg img.btop {
    right: -245px;
    top: -500px;
    animation: re-banner-btop .8s cubic-bezier(.4,0,.2,1) 0s 1;
    -webkit-animation: re-banner-btop .8s cubic-bezier(.4,0,.2,1) 0s 1
}

.animation-top .banner_bg img.bleft {
    left: -118px;
    top: 50px;
    animation: re-banner-bleft 1s cubic-bezier(.4,0,.2,1) 0s 1;
    -webkit-animation: re-banner-bleft 1s cubic-bezier(.4,0,.2,1) 0s 1
}

.animation-top .banner_bg img.bcenter {
    right: 400px;
    top: 180px;
    animation: re-banner-bcenter .8s cubic-bezier(.4,0,.2,1) 0s 1;
    -webkit-animation: re-banner-bcenter .8s cubic-bezier(.4,0,.2,1) 0s 1
}

.animation-top .banner_bg img.bright {
    right: -300px;
    top: 130px;
    animation: re-banner-bright 1s cubic-bezier(.4,0,.2,1) 0s 1;
    -webkit-animation: re-banner-bright 1s cubic-bezier(.4,0,.2,1) 0s 1
}

.animation-top.banner-two .banner_bg img.btop {
    right: 0;
    top: 0;
    animation: re-banner2-top .8s cubic-bezier(.4,0,.2,1) 0s 1;
    -webkit-animation: re-banner2-top .8s cubic-bezier(.4,0,.2,1) 0s 1
}

.L-banner .banner-two .hover-image img {
    width: auto;
    right: 100px
}

.banner-three .hover-image img,.banner-four .hover-image img,.banner-five .hover-image img {
    width: 100% !important;
    height: 100%;
    right: auto !important;
    left: auto !important;
    top: auto !important;
    bottom: auto !important
}

.banner-five .hover-image img.normal {
    width: auto !important;
    height: auto !important;
    top: 0;
    right: 0 !important
}

.banner_item.banner-six .hover-image img {
    width: 700px;
    bottom: -80px;
    right: 260px
}

@keyframes re-banner-btop {
    0% {
        opacity: 0;
        right: -300px;
        top: -900px
    }

    to {
        opacity: 1;
        right: -245px;
        top: -500px
    }
}

@keyframes re-banner-bleft {
    0% {
        opacity: 0;
        left: -900px;
        top: -800px
    }

    to {
        opacity: 1;
        left: -118px;
        top: 50px
    }
}

@keyframes re-banner-bcenter {
    0% {
        opacity: 0;
        transform: scale(.8)
    }

    to {
        opacity: 1;
        transform: scale(1)
    }
}

@keyframes re-banner-bright {
    0% {
        opacity: 0;
        right: -900px;
        top: 800px
    }

    to {
        opacity: 1;
        right: -300px;
        top: 130px
    }
}

@keyframes re-banner2-top {
    0% {
        opacity: 0;
        right: -300px;
        top: -300px
    }

    to {
        opacity: 1;
        right: 0;
        top: 0
    }
}

@-webkit-keyframes re-banner-slide-20 {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0,60px,0)
    }

    to {
        opacity: 1;
        -webkit-transform: translateZ(0)
    }
}

@keyframes re-banner-slide-20 {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0,60px,0);
        transform: translate3d(0,60px,0)
    }

    to {
        opacity: 1;
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

@-webkit-keyframes re-banner-slide-left {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(448px,0,0)
    }

    to {
        opacity: 1;
        -webkit-transform: translateZ(0)
    }
}

@keyframes re-banner-slide-left {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(448px,0,0);
        transform: translate3d(448px,0,0)
    }

    to {
        opacity: 1;
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

@-webkit-keyframes re-banner-slide-top {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0,-165px,0)
    }

    to {
        opacity: 1;
        -webkit-transform: translateZ(0)
    }
}

@keyframes re-banner-slide-top {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0,-165px,0);
        transform: translate3d(0,-165px,0)
    }

    to {
        opacity: 1;
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

@-webkit-keyframes re-banner-slide-60 {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0,60px,0)
    }

    to {
        opacity: 1;
        -webkit-transform: translateZ(0)
    }
}

@keyframes re-banner-slide-60 {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0,60px,0);
        transform: translate3d(0,60px,0)
    }

    to {
        opacity: 1;
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

.fyt-product {
    box-shadow: 0 6px 40px rgba(128,128,128,.25)
}

.pro-item {
    border-right: 1px solid rgba(146,146,146,.22);
    width: 25%;
    float: left;
    padding: 25px 40px;
    position: relative
}

.pro-item a {
    display: block
}

.pro-item .pro-info {
    padding-left: 90px;
    transition: all .36s ease
}

.pro-item:hover .pro-info {
    padding-left: 100px
}

.pro-item span {
    float: left;
    display: block;
    padding-top: 20px
}

.pro-item span i {
    font-size: 55px;
    color: #666
}

.pro-item:hover span i {
    color: #07aefc
}

.pro-item .pro-info h4 {
    font-weight: normal;
    font-size: 18px;
    margin-bottom: 5px
}

.pro-item .pro-info p {
    font-size: 13px;
    color: #b1b1b1;
    line-height: 24px
}

.ht-server .ht-bg {
    background: #1e1e1e;
    overflow: hidden;
    position: absolute;
    z-index: 1;
    overflow: hidden;
    width: 100%;
    height: 750px
}

.pro-item.active h4 {
    color: #f00
}

.pro-item.active p {
    color: #777
}

.ht-server .ht-bg img {
    opacity: .3;
    min-width: 100%;
    filter: blur(1px);
    -webkit-filter: blur(1px);
    -moz-filter: blur(1px);
    -ms-filter: blur(1px);
    -o-filter: blur(1px)
}

.ht-server .wrapper {
    z-index: 100;
    padding-top: 50px
}

.server-title {
    text-align: center
}

.server-title h4 {
    height: 66px;
    line-height: 66px;
    font-size: 40px;
    color: #fff;
    font-weight: normal;
    letter-spacing: 1px;
    font-family: "华文细黑"
}

.server-title p {
    color: #fff;
    font-size: 18px
}

.ht-server-list {
    padding: 60px 0 90px 0
}

.ht-server-list .server-item a {
    display: block;
    position: relative
}

.ht-server-list .server-item {
    width: 20%;
    float: left;
    text-align: center;
    padding: 80px 30px;
    position: relative;
    border-right: 1px solid rgba(255,255,255,.06);
    transition: all .6s cubic-bezier(.215,.61,.355,1) 0s
}

.ht-server-list .server-item i {
    font-size: 55px;
    color: #fff
}

.ht-server-list .server-item::after {
    color: inherit;
    position: absolute;
    display: block;
    visibility: hidden;
    width: 0;
    height: 0;
    content: ' ';
    border: 1px solid #07aefc;
    right: 1px;
    bottom: 0;
    transition: background-size .1s linear 0s,height .1s linear .1s,width .1s linear .2s,visibility 0s .3s;
    border-top: 0;
    border-right: 0;
    background-image: linear-gradient(#07aefc,#07aefc);
    background-repeat: no-repeat;
    background-position: 0 0;
    background-size: 0 1px;
    z-index: 5;
    margin: 10px
}

.ht-server-list .server-item::before {
    color: inherit;
    position: absolute;
    display: block;
    visibility: hidden;
    width: 0;
    height: 0;
    content: ' ';
    border: 1px solid #07aefc;
    top: 2px;
    left: 50%;
    transition: height .1s linear .3s,width .1s linear .4s,visibility 0s .51s;
    border-bottom: 0;
    border-left: 0;
    margin: 10px;
    margin-left: 4px;
    z-index: 5
}

.ht-server-list .server-item:hover::after {
    width: calc(100% - 24px);
    height: calc(100% - 22px);
    transition: visibility 0s .2s,width .1s linear .2s,height .1s linear .3s,background-size .1s linear .4s;
    background-size: 51% 1px;
    visibility: visible
}

.ht-server-list .server-item:hover::before {
    width: calc(52% - 21px);
    height: calc(100% - 22px);
    visibility: visible;
    transition: width .1s linear 0s,height .1s linear .1s
}

.ht-server-list .server-item:hover p::before {
    height: 2px;
    background: #f00
}

.ht-server-list .server-item:hover ul li {
    color: #fff
}

.ht-server-list .server-item h1 {
    color: #fff;
    font-weight: normal;
    margin-top: 20px
}

.ht-server-list .server-item p {
    font-size: 16px;
    margin: 10px 0;
    color: #fff;
    position: relative;
    padding-bottom: 10px
}

.ht-server-list .server-item p::before {
    position: absolute;
    content: "";
    left: 50%;
    top: 50px;
    width: 35px;
    height: 1px;
    background: rgba(255,255,255,.15);
    margin-left: -17px;
    bottom: 64px;
    transition: all .3s ease-out 0s
}

.ht-server-list .server-item ul {
    margin-top: 40px
}

.ht-server-list .server-item ul li {
    color: #999;
    font-size: 16px;
    line-height: 30px
}

.ht-server-list .server-item ul li.active {
    color: #f00
}

.fyt_tip {
    position: absolute;
    top: 0;
    left: 10%;
    padding-left: 51px;
    border: none;
    border-bottom: 1px solid rgba(58,58,58,.68);
    padding-top: 50px
}

.fyt_tip .title {
    vertical-align: baseline;
    font-size: 25px;
    line-height: 35px;
    color: #000
}

.fyt_tip .subtitle {
    vertical-align: baseline;
    font-size: 16px;
    line-height: 30px;
    color: #000;
    font-family: Times New Roman;
    font-weight: bold
}

.fyt-category {
    position: absolute;
    top: 20px;
    right: 10%;
    z-index: 10;
    padding-top: 50px;
    margin: 0;
    height: 26px;
    line-height: 26px;
    text-align: right
}

.fyt-category a {
    display: inline-block;
    margin-right: 5px;
    padding: 3px 35px;
    transition: all .3s ease-out 0s;
    font-size: 12px
}

.fyt-category a:last-child {
    margin-right: 0
}

.fyt-category a.active,.fyt-category a:hover {
    background-color: #07aefc;
    color: #fff
}

.case-wrapper {
    min-height: 850px
}

.case-list {
    padding-top: 170px
}

.case-list .case-row {
    width: 20%;
    float: left;
    position: relative
}

.case-list .case-row a {
    display: block;
    overflow: hidden
}

.case-list .case-row a:before {
    position: absolute;
    content: "";
    top: 15px;
    left: 15px;
    right: 15px;
    bottom: 105px;
    z-index: 10;
    border: 1px solid transparent;
    transition: all .6s cubic-bezier(.215,.61,.355,1) 0s
}

.case-list .case-row a:after {
    content: '';
    width: 40px;
    height: 40px;
    line-height: 40px;
    background: url(../img/jia.png);
    margin: 0 auto;
    display: inline-block;
    position: absolute;
    top: 0;
    left: 50%;
    margin-left: -20px;
    z-index: 10;
    transition: all .6s cubic-bezier(.215,.61,.355,1) 0s;
    opacity: 0
}

.case-list .case-row .case-row-img {
    width: 100%;
    overflow: hidden;
    height: 215px
}

.case-list .case-row .case-row-img img {
    width: 100%;
    transition: all .6s cubic-bezier(.215,.61,.355,1) 0s;
    height: 215px
}

.case-list .case-row .case-row-info {
    height: 89px;
    position: relative;
    background-color: #f8f8f8
}

.case-list .case-row .case-row-info:before {
    position: absolute;
    width: 20px;
    height: 20px;
    margin-top: 6px;
    background-color: #f8f8f8;
    left: 50%;
    margin-left: -10px;
    transition: all .6s cubic-bezier(.215,.61,.355,1) 0s;
    content: "";
    transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    opacity: 0
}

.case-list .case-row .title {
    color: #1c1c1c;
    margin-top: 0;
    height: 40px;
    line-height: 40px;
    padding: 10px 20px 0 20px;
    text-align: left;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis
}

.case-list .case-row .subtitle {
    margin-top: 0;
    color: #8d8d8d;
    text-align: left;
    padding: 0 20px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    padding-bottom: 10px
}

.case-list .case-row .description {
    font-size: 12px;
    color: #8d8d8d;
    padding: 15px 20px;
    line-height: 24px
}

.case-list .case-row:first-child:hover a:after {
    top: 35%;
    opacity: 1
}

.case-list .case-row:hover a:after {
    top: 28%;
    opacity: 1
}

.case-list .case-row:hover a:before {
    border: 1px solid #fff
}

.case-list .case-row:hover .case-row-info:before {
    margin-top: -10px;
    background-color: #fff;
    opacity: 1
}

.case-list .case-row:hover .case-row-info {
    background-color: #fff
}

.case-list .case-row:hover img {
    transform: scale(1.2,1.2);
    -moz-transform: scale(1.2,1.2);
    -webkit-transform: scale(1.2,1.2);
    -o-transform: scale(1.2,1.2)
}

.fyt-more {
    padding: 0 0 30px 0;
    text-align: center
}

.fyt-more {
    padding: 30px 0
}

.fyt-more a {
    display: inline-block;
    width: 220px;
    height: 40px;
    line-height: 40px;
    color: #fff;
    background-color: #383838;
    font-size: 15px;
    font-family: Times New Roman;
    transition: all ease-out .3s;
    text-indent: 0
}

.fyt-more a i {
    vertical-align: middle;
    color: rgba(255,255,255,0);
    transition: all ease-out .3s;
    position: relative;
    top: -1px
}

.fyt-more a:hover i {
    color: rgba(255,255,255,.8)
}

.fyt-more a:hover {
    text-indent: 18px
}

.fnews-wall {
    background-color: #f8f8f8;
    min-height: 630px
}

.fnews-list {
    padding-top: 170px
}

.fnews-list .red-hot {
    width: 470px;
    float: left
}

.fnews-list .red-hot a {
    display: block
}

.fnews-list .red-hot .rh-img {
    height: 235px;
    overflow: hidden
}

.fnews-list .red-hot .rh-img img {
    width: 100%;
    height: 235px;
    transition: all .36s ease
}

.fnews-list .red-hot a:hover {
    box-shadow: 5px 8px 20px rgba(0,0,0,.08)
}

.fnews-list .red-hot a:hover .rh-img img {
    transform: scale(1.18)
}

.fnews-list .red-hot .rh-info {
    background-color: #07aefc;
    padding: 28px 20px;
    position: relative;
    height: 155px
}

.fnews-list .red-hot .rh-info h5 {
    color: #fff;
    font-size: 16px;
    border-bottom: 1px solid rgba(255,255,255,.2);
    margin-left: 100px;
    padding-bottom: 15px;
    font-weight: normal
}

.fnews-list .red-hot .rh-info p {
    color: rgba(255,255,255,.7);
    margin-left: 100px;
    height: 52px;
    font-size: 13px;
    line-height: 26px;
    margin-top: 15px;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2
}

.fnews-list .red-hot .rh-info .time {
    width: 80px;
    height: 100px;
    position: absolute;
    left: 20px;
    top: 30px;
    color: #fff;
    text-align: center
}

.fnews-list .red-hot .rh-info .time span {
    display: block;
    font-size: 36px;
    font-weight: bold
}

.hot-list {
    width: 30%;
    float: left;
    margin-left: 50px
}

.hot-list .hot-top {
    position: relative
}

.hot-list .hot-top a {
    display: block;
    padding-right: 100px
}

.hot-list .hot-top .time {
    position: absolute;
    right: 0;
    top: 8px;
    font-size: 13px;
    line-height: 26px;
    color: #888;
    text-align: center
}

.hot-list .hot-top .time span {
    display: block;
    font-size: 36px;
    font-weight: bold
}

.hot-list .hot-top h5 {
    font-size: 16px;
    border-bottom: 1px solid rgba(0,0,0,.2);
    padding-bottom: 15px;
    font-weight: normal
}

.hot-list .hot-top h5:hover {
    color: #07aefc
}

.hot-list .hot-top p {
    color: #999;
    height: 52px;
    font-size: 13px;
    line-height: 26px;
    margin-top: 15px;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2
}

.hot-list ul {
    margin-top: 50px
}

.hot-list ul li {
    height: 35px;
    border-bottom: 1px solid rgba(0,0,0,.2);
    margin-top: 15px
}

.hot-list ul li a {
    width: 75%;
    display: block;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    font-size: 14px;
    color: #555;
    float: left
}

.hot-list ul li a:hover {
    color: #07aefc;
    padding-left: 2%;
    width: 73%
}

.hot-list ul li span {
    float: right;
    display: block;
    width: 25%;
    font-size: 13px;
    color: #888;
    text-align: right
}

.home-cus-server {
    background-color: #112866;
    padding: 0;
    min-height: 185px
}

.server-tip {
    position: relative;
    width: 490px;
    overflow: hidden;
    height: 184px;
    float: left
}

.server-tip img {
    position: absolute;
    bottom: 0;
    left: 50%;
    margin-left: -95px
}

.server-tip .point {
    position: absolute;
    width: 100%;
    height: 487px;
    top: 0;
    left: 0
}

.server-tip .point-10:after {
    content: '';
    display: block;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    border-radius: 50%;
    border: 2px solid #00cdec;
    opacity: 0;
    -webkit-animation: ripple 4500ms ease-out 225ms infinite;
    -moz-animation: ripple 4500ms ease-out 225ms infinite;
    -o-animation: ripple 4500ms ease-out 225ms infinite;
    animation: ripple 4500ms ease-out 225ms infinite
}

.server-tip .point-60:after {
    content: '';
    display: block;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    border-radius: 50%;
    border: 2px solid #00cdec;
    opacity: 0;
    -webkit-animation: ripple 4500ms ease-out 1350ms infinite;
    -moz-animation: ripple 4500ms ease-out 1350ms infinite;
    -o-animation: ripple 4500ms ease-out 1350ms infinite;
    animation: ripple 4500ms ease-out 1350ms infinite
}

.server-tip .point-100:after {
    content: '';
    display: block;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    border-radius: 50%;
    border: 2px solid #00cdec;
    opacity: 0;
    -webkit-animation: ripple 4500ms ease-out 2250ms infinite;
    -moz-animation: ripple 4500ms ease-out 2250ms infinite;
    -o-animation: ripple 4500ms ease-out 2250ms infinite;
    animation: ripple 4500ms ease-out 2250ms infinite
}

.server-cus {
    position: relative;
    right: 0;
    text-align: right;
    width: 500px;
    float: right;
    padding-top: 40px
}

.server-cus h4,.server-cus p {
    color: #fff;
    font-size: 15px
}

.server-cus h4 {
    font-size: 20px;
    margin-bottom: 10px
}

.server-cus a {
    display: inline-block;
    padding: 8px 40px;
    background-color: #07aefc;
    color: #fff;
    font-size: 14px;
    margin-top: 15px
}

@-webkit-keyframes ripple {
    0% {
        opacity: 0;
        -webkit-transform: scale(.1,.1)
    }

    5% {
        opacity: 1
    }

    100% {
        opacity: 0;
        -webkit-transform: scale(1)
    }
}

@-moz-keyframes ripple {
    0% {
        opacity: 0;
        -moz-transform: scale(.1,.1)
    }

    5% {
        opacity: 1
    }

    100% {
        opacity: 0;
        -moz-transform: scale(1)
    }
}

@-o-keyframes ripple {
    0% {
        opacity: 0;
        -o-transform: scale(.1,.1);
    }

    5% {
        opacity: 1;
    }

    100% {
        opacity: 0;
        -o-transform: scale(1)
    }
}

@keyframes ripple {
    0% {
        opacity: 0;
        -webkit-transform: scale(.1,.1);
        -moz-transform: scale(.1,.1);
        -ms-transform: scale(.1,.1);
        transform: scale(.1,.1)
    }

    5% {
        opacity: 1
    }

    100% {
        opacity: 0;
        -webkit-transform: scale(1);
        -moz-transform: scale(1);
        -ms-transform: scale(1);
        transform: scale(1)
    }
}

.lxindex {
    min-height: 550px
}

.lx-us {
    padding-top: 100px
}

.lx-left {
    width: 30%;
    float: left
}

.lx-left .com-p {
    line-height: 30px;
    font-size: 14px
}

.blank {
    width: 25%
}

.lx-left .com-p i {
    font-size: 16px;
    margin-right: 5px;
    color: #614498
}

.lx-left .com-p.x {
    font-size: 14px;
    font-weight: bold;
    border-bottom: 1px dotted #e8e8e8;
    line-height: 40px;
    width: 80%;
    color: #614498
}

.bottom-b {
    width: 45%;
    float: right
}

.bottom-b li {
    float: left;
    margin-right: 8px;
    width: 48%;
    margin-bottom: 30px
}

.bottom-list li span {
    color: #f00;
    width: 20px;
    text-align: center;
    display: block;
    float: left;
    font-size: 16px;
    line-height: 40px
}

.bottom-list li input {
    width: 100%;
    height: 40px;
    border: 0;
    border-bottom: 1px solid #bfbfbf;
    outline: none
}

.bottom-list textarea {
    height: 50px;
    width: 100%;
    border: 0;
    border-bottom: 1px solid #bfbfbf;
    outline: none;
    margin-bottom: 20px;
    resize: none
}

.bottom-list p {
    font-size: 12px;
    color: #4c4c4c;
    margin-top: 10px;
    margin-left: 20px
}

.bottom-list p img {
    margin-bottom: -2px;
    margin-right: 3px
}

.bottom-list button {
    border: 0;
    width: 140px;
    height: 40px;
    border: 1px solid #07aefc;
    display: block;
    text-align: center;
    line-height: 36px;
    color: #07aefc;
    float: right;
    font-size: 16px;
    background-color: #fff;
    outline: none;
    transition: all ease-out .3s;
    cursor: pointer
}

.bottom-list button:hover {
    background-color: #07aefc;
    color: #fff
}

.bottom-list {
    position: relative;
    height: 190px
}

.bottom-list .mess-tip {
    position: absolute;
    bottom: 20px;
    right: 180px;
    color: #f9223e;
    font-size: 12px
}

.demand-bottom {
    position: relative
}

.bottom-b li {
    float: left;
    margin-right: 8px
}

.bottom-b li:last-child {
    margin-right: 0
}

.bottom-b li:nth-child(2n) {
    float: right
}

.xcy-fyt {
    padding: 60px;
    text-align: center;
    background-color: #edf3f5;
    color: #555;
    font-size: 22px;
    margin: 0 0 40px 0
}

.xcy-fyt p span {
    display: inline-block
}

.xcy-fyt a {
    border: 1px solid #614498;
    display: inline-block;
    margin-left: 150px;
    color: #555;
    font-size: 16px;
    position: relative;
    width: 180px;
    height: 50px;
    line-height: 50px;
    overflow: hidden;
    vertical-align: middle;
    transition: all .5s;
    margin-top: 0
}

.xcy-fyt a span {
    display: block;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 10;
    text-align: center;
    width: 180px;
    transition: left .5s
}

.xcy-fyt a i {
    position: absolute;
    color: #fff;
    font-size: 26px;
    top: 0;
    line-height: 50px;
    left: -113px;
    transition: left .5s
}

.xcy-fyt a:hover {
    background-color: #614498
}

.lx-info {
    text-align: center;
    margin-bottom: 50px;
    margin-top: 50px
}

.lx-info .tit {
    font-size: 32px;
    color: #555;
    font-family: Times New Roman;
    font-weight: bold
}

.lx-info .tit span {
    font-size: 15px;
    margin-left: 10px;
    display: inline-block
}

.ic-infor .brief,.lx-info .brief {
    font-size: 14px;
    line-height: 24px;
    color: #363636;
    margin: 10px 0 20px 0;
    color: #666
}

.ic-infor .fyt-gb,.lx-info .fyt-gb {
    color: #27ae61;
    font-size: 16px;
    margin-bottom: 30px
}

.link {
    margin-bottom: 30px
}

.link .title {
    border-bottom: 1px solid #ccc;
    padding: 15px 0
}

.link .title a {
    display: block;
    float: right;
    padding: 8px 30px;
    background-color: #07aefc;
    color: #fff;
    border-radius: 30px;
    font-size: 13px;
    position: relative;
    top: -5px
}

.link-wall {
    padding: 10px 0
}

.link-wall a {
    display: inline-block;
    margin-right: 15px;
    font-size: 13px;
    color: #999;
    margin-bottom: 10px
}

.footer {
    background: #0f1e2b
}

.footer-wall {
    padding: 60px 10%;
    margin: 0 auto;
    position: relative
}

.footer-wall .foot-nav-list a:first-child {
    padding-left: 0
}

.footer-wall .foot-nav-list a {
    color: #9b9ea0;
    padding: 0 12px;
    font-size: 13px
}

.footer-wall .foot-nav-list span {
    color: #9b9ea0
}

.footer-wall .foot-left {
    width: 550px
}

.footer-wall .foot-left p {
    margin-top: 15px;
    color: #73777a;
    font-size: 12px
}

.footer-wall .foot-right {
    width: 300px;
    float: right;
    position: absolute;
    right: 10%;
    top: 40px;
    text-align: right
}

.footer-wall .foot-right img {
    width: 100px
}

.footer-wall .cus-tel {
    position: absolute;
    width: 260px;
    right: 130px;
    top: 10px;
    font-size: 13px
}

.footer-wall .cus-tel p {
    color: #d1d1d1;
    margin: 15px 0
}

.go-top {
    position: fixed;
    z-index: 1001;
    right: 20px;
    bottom: 15px;
    width: 48px;
    cursor: pointer;
    display: none
}

.go-top img {
    width: 100%
}

@font-face {
    font-family: "iconfont";
    src: url('../../cdns/fonts/iconfont.eot?t=1541922499408');
    src: url('../../cdns/fonts/iconfont.eot?t=1541922499408#iefix') format('embedded-opentype'),url('data:application/x-font-woff;charset=utf-8;base64,d09GRgABAAAAAA9EAAsAAAAAFXgAAQAAAAAAAAAAAAAAAAAAAAAAAAAAAABHU1VCAAABCAAAADMAAABCsP6z7U9TLzIAAAE8AAAARAAAAFY8k0krY21hcAAAAYAAAACsAAACTOi/uxBnbHlmAAACLAAACqgAAA3wfwHzKWhlYWQAAAzUAAAALwAAADYTR0ODaGhlYQAADQQAAAAgAAAAJAfrA6dobXR4AAANJAAAABMAAAAwMBsAAGxvY2EAAA04AAAAGgAAABoVVhFSbWF4cAAADVQAAAAfAAAAIAEqAMhuYW1lAAANdAAAAUUAAAJtPlT+fXBvc3QAAA68AAAAhwAAAKvaWqlueJxjYGRgYOBikGPQYWB0cfMJYeBgYGGAAJAMY05meiJQDMoDyrGAaQ4gZoOIAgCKIwNPAHicY2BkYWKcwMDKwMHUyXSGgYGhH0IzvmYwYuRgYGBiYGVmwAoC0lxTGByeyTw3Y27438AQw9zI0AgUZgTJAQDkQQw6eJzlkjESgjAQRX8EEcHC0sKWzpqGgjswVByCM1B5Ak9i5Yk+wynwb9YSTuBmXmb2J7PZ+RsARwCJeIgUCB8EWLylhqgnKKKe4qn8hquUnHdWbNiyY8+BIycuc72uwP7JZgRV3FrAAaW6OyNDrluFXj3FDrOdSv8Ul7i/fllprjtyDaycqDeOzZmtI0/BzpG7YO/IZ3BwbPYcHZs/J8f+ChdH88BcO0i/eo1AP3icTVdrcBzFEZ6eud29x77u9nb3Trr36XYjztbjnpaEJVkk+CFsYxlc+ImxZcmEsiOwC78EOSghHLATY/MIJClIiJOiwKGKOIiyU8Q/UsaFDRVMVX7wSDkhiSsJIcQUFXD51uk9WaA5zXRP907Pbk/31yPiI+TqWQ+hl4lA/EQlGjFJE4mTHJlDCKQZGIUqcBrkysUEmDoL2tlqUQ+ydNEHWbsN2qGYLsqgQJbdWN95Av4eSClw4cp7p51jcHpvviRftC5u23uRpg6iYM0zPHCwcW/9uT1Wh198nF52vqxfVBQajTo1qM15Y8WGyBznJjg+543PXILClyTO4zm2aEhrIiSM7/oye5stJgzfNkCUxtvapJ1USDfpJQvJzeQWchtZRzaSCbKfHCBEK5azZew6dg1HvcHpRUjLIATxi9K9UA22AWQzlh0sBrVssFSpojqYLmPXwryQRXExiGPBMINZe5Yx5lLXkG4UC5X5gCvT7kPuIl4IGz0wbZxd23R/fnajifpUSwdARwtdjNQzt/6PW4NRGPfUItqtsMt5GVa4/Zc4G/eMuyrPqq9Xn59erPsDEY0uRmVEM8IQ8Bso5dredB+BWn5ffjzvvIfDeJ4uxp2mF3Vm6dKWOfX5EQ0k5wxsBhXX1zfBvDz01A8gD13OZzAPeiKa88nF/Dt5Z38e3sqDa8HQVZ/R2K4+5T4Z9ovuFyxBe9fnH8gTHs/oMXaSbSUySZDr8GRuI1sI4dLVNrDRHehydA9XzPVCGSXovAQk4WulDKwhM3tdIbOrvVCy2qEPzAQUKn34rCBD2ECCwZfhhWrBtEpVPmMbYaFCm51zxw++RLlLr776mWfhAmfuMQj09HneP3r0fQ/99aG24PbDjB3ePj2u28fYvnXr91G673yTqOm6JsuyYpS6S7oqyVIYm9ik6u58JBn3+eK9Cb8/vv2R1gtPTF3iuEtTq5+ff/qv8x4bOvqBx/PB0cPnm4UJemTbtPFtR+A9um/9Otc67uE8FZf1cldZVyRVcbdSVElpCKSE7M5X+ON97h59cT/xog9r7BSrEQ6jPIgxHidZ0opxTqpBHwShnAvmuGDOrhZNwa7aWcFks3huFt8Pp+CU0w87nIPOQbCWLj2ydKnY1bWzq+sXDV7q7t7T3Q2pWZMaJUCuEgf7ynfh+LvvOiv/XcMWHR0ZGXUuuGzTyOjoSNNXHMEm4zsf8IhsExExK7P4rsVrWTlAbiRLyDIyRO7BfOQNPMg+qFh4fEIvmIJVMQU+nEScQWmpHayMaSjAI4NzEwSOmXaVud+DXZjVZ+aAQyf+7AbNIuWNZAO2Gub4Ulsyy8vcYQ74zJ2yUkhtMNmrd4nS01JaXCaK90npPTxXErx7eH6J4IWf90H82fLayOioNTKG/e6RnNtHx7BPU2uEbvK9E3t28Lx1vvlfMPiOTwTxt1Jaoj8QkWZYobg1jUD3JCfzmdhQkDPuSBZy23G7PaJ0M5InxdcEoczztwvem3jekft/CNFXFkSpNmwN79hsD+8ctjbvaHSXx44yeo/vXOL5ZW/Z52KXlp7z4m5TokR/2qCA/vej/7/LXmMPYMzESZrk0f/Xk34ySFaQ1YjkerFQyubKJctuAJYLatPoV0bO1tNlCPN21pUXOCGrFbWsrWWsUqVghPkqYmF1RquHkUFjXJZXoGhb8L9IoRM6W2IOaW6BXbugpZmSWMuuKYfA+PVz413rNjtbtN5NAxt7w69LoVBzKHTJIZT0JlC3dnhbNFKoXwLwJBYmGfx51arvfIpm0MinzthVMs0CgUMXLlxw9rd2wnoIvD0fAs7n8507QrEQ/m08NRV1xbe2Dq1aRcXA+nVY09AL5Opz7E9sA8ZjFGvZILkJhRaxK6RqEJMnQnAWztisD7G6gHFTRBflEVjiwLmxqFDZhRw+CT0uBmFUVdqhitHbCVfPOYgCIJ87CzLHOZfOnvyC4744ecIdTyxncT6ainLpbMD7ujcALfe3MpW13u/l+OEWyjMP9WzdygTG09wWnvNu5EA5O2PnrPNfjj2JRr4y6Az6b1GCQWXDZW/A77ts03sF4V4KCje4W+AoXbiQUk7YPcgpgJWRXH2RPc0GEHu/6X5zLtMObpm2esFI0j5INyZYqRJ44tm0iRVLF9wCzgsZO+e6ArOygpBcMSuG6YIxx+e4nGZzOYECz5/wB0CAUEIH7pmf8c5jchgk0BV4RdE0xdnhgx2y7gMx8Hsem/MilocM5JqGJh9/aO8Sw8KJ6HOO8c5pKEJnsup86Xy44Ha60KPiF+o0JPf29DwBIfkPigGgJcKP6sr5gOpZSI+zCY8aoG82i3CtidF6CVUT7NSuXfQQUOqmQSMPvu8Bthkz4FtkMcb+EfJjcpT8ikyRk+6NBmuGG/kdnWk92/hso5guVFwf2dlyuqMT46GjE4t2toO58ZDGAtQDult85kNRDxsuxSeLOdd7Gavs3hfQl7pQqJQsNG64sIRoVKm69SmMNwMEKivrFq1CpWohbFVNXnDtYS7yCGNG1c0xN9e4mYRjM0xuRoVYb7IzV8YiSYBkBO7d79WEgYBfpt+WA4EbBE3YCaundX9jPlqpn6hQn2c/eEXfJPb45CQcUsUrO0VVFdkBUf1jzLLmWQC+A0PKwIQMYHVZVkxXJyZUHVVdqJInVgwd8KFmHmqi2iOPhqKqrqd0vf4f1TBShqFOExqcFjtfDgwMsE2pSH08koJR8PMDgWiT2M/7cZKK0IlI6sokR0slymmc18tp02NitNt9KfpgQAVQA2dylVyuOSQ/vEzurwXNWEvLvJy/VvMD0lzMDNaWL39Y1ppbWqqIDMrkpDocTup6MrzIfYWU7hyepktQhIqh/v5+jAlvAxu/QGyMkhhWph6ynKwhd5OHMTsSgFe3csk9/wwCGq83BH2IbHhQGd7UwwU8d6NSrZSwYmVNQ+DzUC5V8TaMyZLH+hKHWY98rQ0LLoiky42gcK2m3cipWI1ASmMgVaqoy16LR+A9il8x6Tin6Ro37gFD9ivUeGpve/s/jRT03x3OSk1NYlqLUdGnjInDsgYPSOlQzUj172joCn55LLBFDi+SQ/XdiLIAIYmekTTQ6nMkjU6mkqBJ9W5cB9pHPr+mCMLnfn/A97nXq2iib27P5s2/adb/kkgMgSonBxOKMhySAv0YG3pZVqBZ/ygev6ba0hCbyY9D8qnfIaRLFyRNwyEMzyL5MIStLmkh+SqRNTcnBXdgL9CP8b+KXrwHrCXDeBeoYTZi0s1cAvEWYPSB6/3qNCqbRi9tR1TOZWzLVhqg2wblmVuiEDY5vR1Ba9bNEWEMpvOsZJnuvdHNPzPTyD2zUHTFRXQ3HzYbh1yy2AvsvrXGi7tqUxz0d4a5RHCl2RmVpGRtpW6HFnhDMs8Uu1T/JKQ3xY04RzlvRzc7ctfGh/St32MMxkSjNb1mjNKxNbfsZDAXj9/R9FisNRb7id7cfF0s9gLH5FBIZhwmyx5R4xjjNDFoGBBbe7+65buU/mh3353fuEGL+Np4HwwsB4RbywOi6itnbgszzstU1Rfkc6s7Vt/P6IbF3gfvCKoHQGAi0C1LFo9QOrrIXpTgg3AO3G1bY5uu0UeZntCZkTGkgKAKAQk5PIX/A7HbsK94nGNgZGBgAOJ9i5LmxvPbfGXgZmEAgRu8/w8j6P/1LDzMjUAuBwMTSBQATMELegB4nGNgZGBgbvjfwBDDIs3A8P8/Cw8DUAQF8AAAdW4EmnicY2FgYGBBx9JYxKAYAAfpAEwAAAAAAABWASgBygIkAuQDbAPoBGgFcgYyBvgAAHicY2BkYGDgYdjDIMIAAkxAzAWEDAz/wXwGAB22AfMAeJxlj01OwzAQhV/6B6QSqqhgh+QFYgEo/RGrblhUavdddN+mTpsqiSPHrdQDcB6OwAk4AtyAO/BIJ5s2lsffvHljTwDc4Acejt8t95E9XDI7cg0XuBeuU38QbpBfhJto41W4Rf1N2MczpsJtdGF5g9e4YvaEd2EPHXwI13CNT+E69S/hBvlbuIk7/Aq30PHqwj7mXle4jUcv9sdWL5xeqeVBxaHJIpM5v4KZXu+Sha3S6pxrW8QmU4OgX0lTnWlb3VPs10PnIhVZk6oJqzpJjMqt2erQBRvn8lGvF4kehCblWGP+tsYCjnEFhSUOjDFCGGSIyujoO1Vm9K+xQ8Jee1Y9zed0WxTU/3OFAQL0z1xTurLSeTpPgT1fG1J1dCtuy56UNJFezUkSskJe1rZUQuoBNmVXjhF6XNGJPyhnSP8ACVpuyAAAAHicbYpRDoIwEER3gaKW8uNJxESjn96AK6xA2kWzbSwkhtNbwq8vmclkZiCDDQ3/MZhhjgUqLHGHezygxgoN1qADSyCeZpKKOy9xmE7N+V5utYlE0abtzbdrbYcvi+2TFscFhdCo54ekz91lOHYu3RbnxY68BhL1aNvXbKxf/8kceYAfCoMoLwA=') format('woff'),url('../../cdns/fonts/iconfont.ttf?t=1541922499408') format('truetype'),url('../../cdns/fonts/iconfont.svg?t=1541922499408#iconfont') format('svg')
}

.iconfont {
    font-family: "iconfont" !important;
    font-size: 16px;
    font-style: normal;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale
}

.icon-pinpaituan:before {
    content: ""
}

.icon-iconset0129:before {
    content: ""
}

.icon-pinpai:before {
    content: ""
}

.icon-saasguanli86:before {
    content: ""
}

.icon-gexingdingzhi:before {
    content: ""
}

.icon-app1:before {
    content: ""
}

.icon-brand:before {
    content: ""
}

.icon-h5e:before {
    content: ""
}

.icon-chuanzhongjianzhan:before {
    content: ""
}

.icon-APPku:before {
    content: ""
}

.icon-gongzhonghao:before {
    content: ""
}

.server-clear {
    display: none
}

@media screen and (max-width: 1600px) {
    .hot-list:nth-child(2) {
        width:50%
    }

    .hot-list:nth-child(3) {
        display: none
    }

    .case-list .case-row .case-row-img,.case-list .case-row .case-row-img img {
        height: 170px
    }
}

@media screen and (max-width: 960px) {
    .footer,.footer-wall,.footer,.footer-wall .foot-left,.server-tip,.server-cus {
        width:100%
    }

    .server-tip {
        height: auto
    }

    .footer-wall .foot-right,.footer-wall .cus-tel {
        position: initial;
        float: none;
        text-align: center;
        width: 100%
    }

    .footer-wall .foot-right img {
        margin: 15px 0
    }

    .fyt_tip {
        left: 0;
        position: initial;
        padding-left: 0
    }

    .lx-left {
        float: none;
        width: 100% !important
    }

    .bottom-b {
        display: none
    }

    .link {
        margin-top: 25px
    }

    .fyt-category {
        position: initial;
        height: auto;
        padding-top: 15px;
        text-align: left
    }

    .fyt-category a {
        padding: 3px 25px;
        margin-bottom: 10px
    }

    .fnews-list,.lx-us,.case-list {
        padding-top: 20px
    }

    .fnews-list .red-hot {
        display: none
    }

    .hot-list:nth-child(2) {
        width: 100%;
        float: none;
        margin-left: 0;
        display: block
    }

    .lx-info {
        margin-top: 20px
    }

    .case-list .case-row {
        width: 100%;
        float: none
    }

    .home-cus-server {
        margin-top: 20px
    }

    .ht-server .ht-bg {
        height: auto
    }

    .server-title h4 {
        height: auto;
        font-size: 26px;
        line-height: 44px
    }

    .ht-server {
        position: relative;
        overflow: hidden
    }

    .ht-server-list {
        padding: 20px 0 30px 0
    }

    .ht-server-list .server-item {
        width: 49.8%;
        padding: 30px 10px
    }

    .ht-server-list .server-item:nth-child(2n) {
        border-right: none
    }

    .ht-server-list .server-item:nth-child(5) {
        display: none
    }

    .pro-item {
        width: 100%;
        float: none;
        border-bottom: 1px solid rgba(146,146,146,.22);
        border-right: none
    }

    .L-banner {
        height: 320px
    }

    .L-banner .banner_item {
        height: 240px
    }

    .left-header {
        width: 92%;
        margin-left: 0;
        margin-top: 0;
        left: 5%
    }

    .left-header .tit {
        font-size: 18px
    }

    .left-header .txt {
        font-size: 15px;
        color: #333
    }

    .header {
        overflow: hidden
    }

    .bannerList {
        display: none
    }

    .wrapper {
        padding: 0 10px;
        position: relative
    }

    .container_target {
        float: none !important
    }

    .case-banner,.case-banner>div {
        height: 160px !important
    }

    .case-left,.case-right {
        width: 100% !important;
        float: none !important
    }

    .case-left img {
        height: auto !important
    }

    .n-detail-text {
        padding-right: 0 !important
    }

    .content_list>li {
        width: 100% !important;
        float: none !important
    }

    .casemodel .category {
        padding: 20px 0 !important
    }

    .case-content ul li {
        width: 100% !important;
        float: none !important
    }

    .aboutbody,.team_c,.partner-body,#contactinfo,#contactform,#contactform p .inputtxt,#contactform p textarea.inputtxt,.fkfs,.fkfs .left,.partner-body {
        width: 100% !important;
        overflow: hidden
    }

    #contactform p textarea.inputtxt {
        position: initial !important
    }

    .fkfs .rleft {
        border-left: none !important;
        padding-left: 0 !important
    }

    #contactform p .inputtxt.submit {
        margin-top: 10px !important
    }

    .server-clear {
        display: block !important;
        clear: both !important
    }
}