body {
    background-color: #f7f5f5
}

@-webkit-keyframes slide-in-top {
    0% {
        opacity: 0;
        -webkit-transform: translateY(-100%);
        transform: translateY(-100%)
    }

    to {
        opacity: 1;
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }
}

@keyframes slide-in-top {
    0% {
        opacity: 0;
        -webkit-transform: translateY(-100%);
        transform: translateY(-100%)
    }

    to {
        opacity: 1;
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }
}

.slide-in-top {
    -webkit-animation: slide-in-top 1s cubic-bezier(.25,.46,.45,.94) both;
    animation: slide-in-top 1s cubic-bezier(.25,.46,.45,.94) both
}

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

    to {
        opacity: 1
    }
}

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

    to {
        opacity: 1
    }
}

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

@-webkit-keyframes slide-fadeIn-leave {
    0% {
        opacity: 1
    }

    to {
        opacity: 0
    }
}

@keyframes slide-fadeIn-leave {
    0% {
        opacity: 1
    }

    to {
        opacity: 0
    }
}

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

@-webkit-keyframes footer-in-mouse {
    0% {
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }

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

@keyframes footer-in-mouse {
    0% {
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }

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

.footer-in-mouse {
    -webkit-animation: footer-in-mouse .6s ease-in-out infinite alternate;
    animation: footer-in-mouse .6s ease-in-out infinite alternate
}

@-webkit-keyframes heartbeat {
    0% {
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out;
        -webkit-transform: scale(1);
        transform: scale(1);
        -webkit-transform-origin: center center;
        transform-origin: center center
    }

    10% {
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
        -webkit-transform: scale(.91);
        transform: scale(.91)
    }

    17% {
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out;
        -webkit-transform: scale(.98);
        transform: scale(.98)
    }

    33% {
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
        -webkit-transform: scale(.87);
        transform: scale(.87)
    }

    45% {
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out;
        -webkit-transform: scale(1);
        transform: scale(1)
    }
}

@keyframes heartbeat {
    0% {
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out;
        -webkit-transform: scale(1);
        transform: scale(1);
        -webkit-transform-origin: center center;
        transform-origin: center center
    }

    10% {
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
        -webkit-transform: scale(.91);
        transform: scale(.91)
    }

    17% {
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out;
        -webkit-transform: scale(.98);
        transform: scale(.98)
    }

    33% {
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
        -webkit-transform: scale(.87);
        transform: scale(.87)
    }

    45% {
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out;
        -webkit-transform: scale(1);
        transform: scale(1)
    }
}

@-webkit-keyframes scale-up-center {
    0% {
        -webkit-transform: scale(1);
        transform: scale(1)
    }

    to {
        -webkit-transform: scale(1.1);
        transform: scale(1.1)
    }
}

@keyframes scale-up-center {
    0% {
        -webkit-transform: scale(1);
        transform: scale(1)
    }

    to {
        -webkit-transform: scale(1.1);
        transform: scale(1.1)
    }
}

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

.animated.bounceIn,.animated.bounceOut,.animated.flipOutX,.animated.flipOutY {
    -webkit-animation-duration: .75s;
    animation-duration: .75s
}

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

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

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

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

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

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

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

    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;
    transform-origin: center bottom
}

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

    25%,75% {
        opacity: 0
    }
}

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

    25%,75% {
        opacity: 0
    }
}

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

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

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

    to {
        -webkit-transform: scaleX(1);
        transform: scaleX(1)
    }
}

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

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

    to {
        -webkit-transform: scaleX(1);
        transform: scaleX(1)
    }
}

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

@-webkit-keyframes rubberBand {
    0% {
        -webkit-transform: scaleX(1);
        transform: scaleX(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)
    }

    to {
        -webkit-transform: scaleX(1);
        transform: scaleX(1)
    }
}

@keyframes rubberBand {
    0% {
        -webkit-transform: scaleX(1);
        transform: scaleX(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)
    }

    to {
        -webkit-transform: scaleX(1);
        transform: scaleX(1)
    }
}

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

@-webkit-keyframes shake {
    0%,to {
        -webkit-transform: translateZ(0);
        transform: translateZ(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%,to {
        -webkit-transform: translateZ(0);
        transform: translateZ(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: rotate(15deg);
        transform: rotate(15deg)
    }

    40% {
        -webkit-transform: rotate(-10deg);
        transform: rotate(-10deg)
    }

    60% {
        -webkit-transform: rotate(5deg);
        transform: rotate(5deg)
    }

    80% {
        -webkit-transform: rotate(-5deg);
        transform: rotate(-5deg)
    }

    to {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg)
    }
}

@keyframes swing {
    20% {
        -webkit-transform: rotate(15deg);
        transform: rotate(15deg)
    }

    40% {
        -webkit-transform: rotate(-10deg);
        transform: rotate(-10deg)
    }

    60% {
        -webkit-transform: rotate(5deg);
        transform: rotate(5deg)
    }

    80% {
        -webkit-transform: rotate(-5deg);
        transform: rotate(-5deg)
    }

    to {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg)
    }
}

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

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

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

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

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

    to {
        -webkit-transform: scaleX(1);
        transform: scaleX(1)
    }
}

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

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

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

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

    to {
        -webkit-transform: scaleX(1);
        transform: scaleX(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) rotate(-5deg);
        transform: translate3d(-25%,0,0) rotate(-5deg)
    }

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

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

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

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

    to {
        -webkit-transform: none;
        transform: none
    }
}

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

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

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

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

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

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

    to {
        -webkit-transform: none;
        transform: none
    }
}

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

@-webkit-keyframes bounceIn {
    0%,20%,40%,60%,80%,to {
        -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)
    }

    to {
        opacity: 1;
        -webkit-transform: scaleX(1);
        transform: scaleX(1)
    }
}

@keyframes bounceIn {
    0%,20%,40%,60%,80%,to {
        -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)
    }

    to {
        opacity: 1;
        -webkit-transform: scaleX(1);
        transform: scaleX(1)
    }
}

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

@-webkit-keyframes bounceInDown {
    0%,60%,75%,90%,to {
        -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)
    }

    to {
        -webkit-transform: none;
        transform: none
    }
}

@keyframes bounceInDown {
    0%,60%,75%,90%,to {
        -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)
    }

    to {
        -webkit-transform: none;
        transform: none
    }
}

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

@-webkit-keyframes bounceInLeft {
    0%,60%,75%,90%,to {
        -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)
    }

    to {
        -webkit-transform: none;
        transform: none
    }
}

@keyframes bounceInLeft {
    0%,60%,75%,90%,to {
        -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)
    }

    to {
        -webkit-transform: none;
        transform: none
    }
}

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

@-webkit-keyframes bounceInRight {
    0%,60%,75%,90%,to {
        -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)
    }

    to {
        -webkit-transform: none;
        transform: none
    }
}

@keyframes bounceInRight {
    0%,60%,75%,90%,to {
        -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)
    }

    to {
        -webkit-transform: none;
        transform: none
    }
}

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

@-webkit-keyframes bounceInUp {
    0%,60%,75%,90%,to {
        -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)
    }

    to {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

@keyframes bounceInUp {
    0%,60%,75%,90%,to {
        -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)
    }

    to {
        -webkit-transform: translateZ(0);
        transform: translateZ(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)
    }

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

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

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

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

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

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

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

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

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

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

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

    to {
        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
    }

    to {
        opacity: 1
    }
}

@keyframes fadeIn {
    0% {
        opacity: 0
    }

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

    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

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

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

    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

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

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

    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

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

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

    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

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

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

    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

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

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

    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

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

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

    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

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

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

    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

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

    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

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

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

    to {
        opacity: 0
    }
}

@keyframes fadeOut {
    0% {
        opacity: 1
    }

    to {
        opacity: 0
    }
}

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

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

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

@keyframes fadeOutDown {
    0% {
        opacity: 1
    }

    to {
        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
    }

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

@keyframes fadeOutDownBig {
    0% {
        opacity: 1
    }

    to {
        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
    }

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

@keyframes fadeOutLeft {
    0% {
        opacity: 1
    }

    to {
        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
    }

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

@keyframes fadeOutLeftBig {
    0% {
        opacity: 1
    }

    to {
        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
    }

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

@keyframes fadeOutRight {
    0% {
        opacity: 1
    }

    to {
        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
    }

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

@keyframes fadeOutRightBig {
    0% {
        opacity: 1
    }

    to {
        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
    }

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

@keyframes fadeOutUp {
    0% {
        opacity: 1
    }

    to {
        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
    }

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

@keyframes fadeOutUpBig {
    0% {
        opacity: 1
    }

    to {
        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-animation-timing-function: ease-out;
        animation-timing-function: ease-out;
        -webkit-transform: perspective(400px) rotateY(-1turn);
        transform: perspective(400px) rotateY(-1turn)
    }

    40% {
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out;
        -webkit-transform: perspective(400px) translateZ(150px) rotateY(-190deg);
        transform: perspective(400px) translateZ(150px) rotateY(-190deg)
    }

    50% {
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
        -webkit-transform: perspective(400px) translateZ(150px) rotateY(-170deg);
        transform: perspective(400px) translateZ(150px) rotateY(-170deg)
    }

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

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

@keyframes flip {
    0% {
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out;
        -webkit-transform: perspective(400px) rotateY(-1turn);
        transform: perspective(400px) rotateY(-1turn)
    }

    40% {
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out;
        -webkit-transform: perspective(400px) translateZ(150px) rotateY(-190deg);
        transform: perspective(400px) translateZ(150px) rotateY(-190deg)
    }

    50% {
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
        -webkit-transform: perspective(400px) translateZ(150px) rotateY(-170deg);
        transform: perspective(400px) translateZ(150px) rotateY(-170deg)
    }

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

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

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

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

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

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

    80% {
        -webkit-transform: perspective(400px) rotateX(-5deg);
        transform: perspective(400px) rotateX(-5deg)
    }

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

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

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

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

    80% {
        -webkit-transform: perspective(400px) rotateX(-5deg);
        transform: perspective(400px) rotateX(-5deg)
    }

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

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

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

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

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

    80% {
        -webkit-transform: perspective(400px) rotateY(-5deg);
        transform: perspective(400px) rotateY(-5deg)
    }

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

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

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

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

    80% {
        -webkit-transform: perspective(400px) rotateY(-5deg);
        transform: perspective(400px) rotateY(-5deg)
    }

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

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

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

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

    to {
        opacity: 0;
        -webkit-transform: perspective(400px) rotateX(90deg);
        transform: perspective(400px) rotateX(90deg)
    }
}

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

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

    to {
        opacity: 0;
        -webkit-transform: perspective(400px) rotateX(90deg);
        transform: perspective(400px) rotateX(90deg)
    }
}

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

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

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

    to {
        opacity: 0;
        -webkit-transform: perspective(400px) rotateY(90deg);
        transform: perspective(400px) rotateY(90deg)
    }
}

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

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

    to {
        opacity: 0;
        -webkit-transform: perspective(400px) rotateY(90deg);
        transform: perspective(400px) rotateY(90deg)
    }
}

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

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

    60% {
        opacity: 1;
        -webkit-transform: skewX(20deg);
        transform: skewX(20deg)
    }

    80% {
        opacity: 1;
        -webkit-transform: skewX(-5deg);
        transform: skewX(-5deg)
    }

    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

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

    60% {
        opacity: 1;
        -webkit-transform: skewX(20deg);
        transform: skewX(20deg)
    }

    80% {
        opacity: 1;
        -webkit-transform: skewX(-5deg);
        transform: skewX(-5deg)
    }

    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

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

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

@keyframes lightSpeedOut {
    0% {
        opacity: 1
    }

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

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

@-webkit-keyframes rotateIn {
    0% {
        opacity: 0;
        -webkit-transform: rotate(-200deg);
        transform: rotate(-200deg);
        -webkit-transform-origin: center;
        transform-origin: center
    }

    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none;
        -webkit-transform-origin: center;
        transform-origin: center
    }
}

@keyframes rotateIn {
    0% {
        opacity: 0;
        -webkit-transform: rotate(-200deg);
        transform: rotate(-200deg);
        -webkit-transform-origin: center;
        transform-origin: center
    }

    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none;
        -webkit-transform-origin: center;
        transform-origin: center
    }
}

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

    to {
        opacity: 0;
        -webkit-transform: rotate(200deg);
        transform: rotate(200deg);
        -webkit-transform-origin: center;
        transform-origin: center
    }
}

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

    to {
        opacity: 0;
        -webkit-transform: rotate(200deg);
        transform: rotate(200deg);
        -webkit-transform-origin: center;
        transform-origin: center
    }
}

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

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

    to {
        opacity: 0;
        -webkit-transform: rotate(45deg);
        transform: rotate(45deg);
        -webkit-transform-origin: left bottom;
        transform-origin: left bottom
    }
}

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

    to {
        opacity: 0;
        -webkit-transform: rotate(45deg);
        transform: rotate(45deg);
        -webkit-transform-origin: left bottom;
        transform-origin: left bottom
    }
}

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

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

    to {
        opacity: 0;
        -webkit-transform: rotate(-45deg);
        transform: rotate(-45deg);
        -webkit-transform-origin: right bottom;
        transform-origin: right bottom
    }
}

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

    to {
        opacity: 0;
        -webkit-transform: rotate(-45deg);
        transform: rotate(-45deg);
        -webkit-transform-origin: right bottom;
        transform-origin: right bottom
    }
}

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

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

    to {
        opacity: 0;
        -webkit-transform: rotate(-45deg);
        transform: rotate(-45deg);
        -webkit-transform-origin: left bottom;
        transform-origin: left bottom
    }
}

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

    to {
        opacity: 0;
        -webkit-transform: rotate(-45deg);
        transform: rotate(-45deg);
        -webkit-transform-origin: left bottom;
        transform-origin: left bottom
    }
}

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

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

    to {
        opacity: 0;
        -webkit-transform: rotate(90deg);
        transform: rotate(90deg);
        -webkit-transform-origin: right bottom;
        transform-origin: right bottom
    }
}

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

    to {
        opacity: 0;
        -webkit-transform: rotate(90deg);
        transform: rotate(90deg);
        -webkit-transform-origin: right bottom;
        transform-origin: right bottom
    }
}

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

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

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

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

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

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

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

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

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

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

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

    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

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

    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

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

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

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

@keyframes rollOut {
    0% {
        opacity: 1
    }

    to {
        opacity: 0;
        -webkit-transform: translate3d(100%,0,0) rotate(120deg);
        transform: translate3d(100%,0,0) rotate(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% {
        -webkit-animation-timing-function: cubic-bezier(.55,.055,.675,.19);
        animation-timing-function: cubic-bezier(.55,.055,.675,.19);
        opacity: 0;
        -webkit-transform: scale3d(.1,.1,.1) translate3d(0,-1000px,0);
        transform: scale3d(.1,.1,.1) translate3d(0,-1000px,0)
    }

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

    to {
        opacity: 0
    }
}

@keyframes zoomOut {
    0% {
        opacity: 1
    }

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

    to {
        opacity: 0
    }
}

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

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

    to {
        -webkit-animation-timing-function: cubic-bezier(.175,.885,.32,1);
        animation-timing-function: cubic-bezier(.175,.885,.32,1);
        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
    }
}

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

    to {
        -webkit-animation-timing-function: cubic-bezier(.175,.885,.32,1);
        animation-timing-function: cubic-bezier(.175,.885,.32,1);
        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
    }
}

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

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

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

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

    to {
        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% {
        -webkit-animation-timing-function: cubic-bezier(.55,.055,.675,.19);
        animation-timing-function: cubic-bezier(.55,.055,.675,.19);
        opacity: 1;
        -webkit-transform: scale3d(.475,.475,.475) translate3d(0,60px,0);
        transform: scale3d(.475,.475,.475) translate3d(0,60px,0)
    }

    to {
        -webkit-animation-timing-function: cubic-bezier(.175,.885,.32,1);
        animation-timing-function: cubic-bezier(.175,.885,.32,1);
        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
    }
}

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

    to {
        -webkit-animation-timing-function: cubic-bezier(.175,.885,.32,1);
        animation-timing-function: cubic-bezier(.175,.885,.32,1);
        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
    }
}

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

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

    to {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

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

    to {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

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

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

    to {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

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

    to {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

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

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

    to {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

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

    to {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

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

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

    to {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

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

    to {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

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

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

    to {
        -webkit-transform: translate3d(0,100%,0);
        transform: translate3d(0,100%,0);
        visibility: hidden
    }
}

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

    to {
        -webkit-transform: translate3d(0,100%,0);
        transform: translate3d(0,100%,0);
        visibility: hidden
    }
}

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

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

    to {
        -webkit-transform: translate3d(-100%,0,0);
        transform: translate3d(-100%,0,0);
        visibility: hidden
    }
}

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

    to {
        -webkit-transform: translate3d(-100%,0,0);
        transform: translate3d(-100%,0,0);
        visibility: hidden
    }
}

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

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

    to {
        -webkit-transform: translate3d(100%,0,0);
        transform: translate3d(100%,0,0);
        visibility: hidden
    }
}

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

    to {
        -webkit-transform: translate3d(100%,0,0);
        transform: translate3d(100%,0,0);
        visibility: hidden
    }
}

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

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

    to {
        -webkit-transform: translate3d(0,-100%,0);
        transform: translate3d(0,-100%,0);
        visibility: hidden
    }
}

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

    to {
        -webkit-transform: translate3d(0,-100%,0);
        transform: translate3d(0,-100%,0);
        visibility: hidden
    }
}

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

@-webkit-keyframes slide-in-left {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(-50%,0,0);
        transform: translate3d(-50%,0,0)
    }

    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

@keyframes slide-in-left {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(-50%,0,0);
        transform: translate3d(-50%,0,0)
    }

    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

.slide-in-left {
    -webkit-animation-name: slide-in-left;
    animation-name: slide-in-left
}

@-webkit-keyframes slide-in-left-leave {
    0% {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }

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

@keyframes slide-in-left-leave {
    0% {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }

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

.slide-in-left-leave {
    -webkit-animation-name: slide-in-left-leave;
    animation-name: slide-in-left-leave
}

@-webkit-keyframes slide-in-blue {
    0% {
        opacity: 0;
        -webkit-transform: rotate(-90deg);
        transform: rotate(-90deg);
        -webkit-transform-origin: center;
        transform-origin: center
    }

    to {
        opacity: 1;
        -webkit-transform: rotate(1deg);
        transform: rotate(1deg);
        -webkit-transform-origin: center;
        transform-origin: center
    }
}

@keyframes slide-in-blue {
    0% {
        opacity: 0;
        -webkit-transform: rotate(-90deg);
        transform: rotate(-90deg);
        -webkit-transform-origin: center;
        transform-origin: center
    }

    to {
        opacity: 1;
        -webkit-transform: rotate(1deg);
        transform: rotate(1deg);
        -webkit-transform-origin: center;
        transform-origin: center
    }
}

.slide-in-blue {
    -webkit-animation-name: slide-in-blue;
    animation-name: slide-in-blue
}

@-webkit-keyframes slide-in-blue-leave {
    0% {
        opacity: 1;
        -webkit-transform: rotate(1deg);
        transform: rotate(1deg);
        -webkit-transform-origin: center;
        transform-origin: center
    }

    to {
        opacity: 0;
        -webkit-transform: rotate(90deg);
        transform: rotate(90deg);
        -webkit-transform-origin: center;
        transform-origin: center
    }
}

@keyframes slide-in-blue-leave {
    0% {
        opacity: 1;
        -webkit-transform: rotate(1deg);
        transform: rotate(1deg);
        -webkit-transform-origin: center;
        transform-origin: center
    }

    to {
        opacity: 0;
        -webkit-transform: rotate(90deg);
        transform: rotate(90deg);
        -webkit-transform-origin: center;
        transform-origin: center
    }
}

.slide-in-blue-leave {
    -webkit-animation-name: slide-in-blue-leave;
    animation-name: slide-in-blue-leave
}

@-webkit-keyframes slide-in-yellow {
    0% {
        opacity: 0;
        -webkit-transform: rotate(-40deg);
        transform: rotate(-40deg);
        -webkit-transform-origin: center;
        transform-origin: center
    }

    to {
        opacity: 1;
        -webkit-transform: rotate(1deg);
        transform: rotate(1deg);
        -webkit-transform-origin: center;
        transform-origin: center
    }
}

@keyframes slide-in-yellow {
    0% {
        opacity: 0;
        -webkit-transform: rotate(-40deg);
        transform: rotate(-40deg);
        -webkit-transform-origin: center;
        transform-origin: center
    }

    to {
        opacity: 1;
        -webkit-transform: rotate(1deg);
        transform: rotate(1deg);
        -webkit-transform-origin: center;
        transform-origin: center
    }
}

.slide-in-yellow {
    -webkit-animation-name: slide-in-yellow;
    animation-name: slide-in-yellow
}

@-webkit-keyframes slide-in-yellow-leave {
    0% {
        opacity: 1;
        -webkit-transform: rotate(1deg);
        transform: rotate(1deg);
        -webkit-transform-origin: center;
        transform-origin: center
    }

    to {
        opacity: 0;
        -webkit-transform: rotate(40deg);
        transform: rotate(40deg);
        -webkit-transform-origin: center;
        transform-origin: center
    }
}

@keyframes slide-in-yellow-leave {
    0% {
        opacity: 1;
        -webkit-transform: rotate(1deg);
        transform: rotate(1deg);
        -webkit-transform-origin: center;
        transform-origin: center
    }

    to {
        opacity: 0;
        -webkit-transform: rotate(40deg);
        transform: rotate(40deg);
        -webkit-transform-origin: center;
        transform-origin: center
    }
}

.slide-in-yellow-leave {
    -webkit-animation-name: slide-in-yellow-leave;
    animation-name: slide-in-yellow-leave
}

@-webkit-keyframes slide-in-red {
    0% {
        opacity: 0;
        -webkit-transform: rotate(-50deg);
        transform: rotate(-50deg);
        -webkit-transform-origin: center;
        transform-origin: center
    }

    to {
        opacity: 1;
        -webkit-transform: rotate(1deg);
        transform: rotate(1deg);
        -webkit-transform-origin: center;
        transform-origin: center
    }
}

@keyframes slide-in-red {
    0% {
        opacity: 0;
        -webkit-transform: rotate(-50deg);
        transform: rotate(-50deg);
        -webkit-transform-origin: center;
        transform-origin: center
    }

    to {
        opacity: 1;
        -webkit-transform: rotate(1deg);
        transform: rotate(1deg);
        -webkit-transform-origin: center;
        transform-origin: center
    }
}

.slide-in-red {
    -webkit-animation-name: slide-in-red;
    animation-name: slide-in-red
}

@-webkit-keyframes slide-in-red-leave {
    0% {
        opacity: 1;
        -webkit-transform: rotate(1deg);
        transform: rotate(1deg);
        -webkit-transform-origin: center;
        transform-origin: center
    }

    to {
        opacity: 0;
        -webkit-transform: rotate(50deg);
        transform: rotate(50deg);
        -webkit-transform-origin: center;
        transform-origin: center
    }
}

@keyframes slide-in-red-leave {
    0% {
        opacity: 1;
        -webkit-transform: rotate(1deg);
        transform: rotate(1deg);
        -webkit-transform-origin: center;
        transform-origin: center
    }

    to {
        opacity: 0;
        -webkit-transform: rotate(50deg);
        transform: rotate(50deg);
        -webkit-transform-origin: center;
        transform-origin: center
    }
}

.slide-in-red-leave {
    -webkit-animation-name: slide-in-red-leave;
    animation-name: slide-in-red-leave
}

@-webkit-keyframes slide-in-home {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(10%,0,0);
        transform: translate3d(10%,0,0)
    }

    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

@keyframes slide-in-home {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(10%,0,0);
        transform: translate3d(10%,0,0)
    }

    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

.slide-in-home {
    -webkit-animation-name: slide-in-home;
    animation-name: slide-in-home
}

@-webkit-keyframes slide-in-home-leave {
    0% {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }

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

@keyframes slide-in-home-leave {
    0% {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }

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

.slide-in-home-leave {
    -webkit-animation-name: slide-in-home-leave;
    animation-name: slide-in-home-leave
}

@-webkit-keyframes slide-in-connect {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0,10%,0);
        transform: translate3d(0,10%,0)
    }

    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

@keyframes slide-in-connect {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0,10%,0);
        transform: translate3d(0,10%,0)
    }

    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

.slide-in-connect {
    -webkit-animation-name: slide-in-connect;
    animation-name: slide-in-connect
}

@-webkit-keyframes slide-in-connect-leave {
    0% {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }

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

@keyframes slide-in-connect-leave {
    0% {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }

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

.slide-in-connect-leave {
    -webkit-animation-name: slide-in-connect-leave;
    animation-name: slide-in-connect-leave
}

@-webkit-keyframes slide-in-line1 {
    0% {
        -webkit-transform: rotate(-15deg);
        transform: rotate(-15deg);
        -webkit-transform-origin: center;
        transform-origin: center
    }

    33% {
        -webkit-transform: rotate(105deg);
        transform: rotate(105deg);
        -webkit-transform-origin: center;
        transform-origin: center
    }

    67% {
        -webkit-transform: rotate(225deg);
        transform: rotate(225deg);
        -webkit-transform-origin: center;
        transform-origin: center
    }

    to {
        -webkit-transform: rotate(345deg);
        transform: rotate(345deg);
        -webkit-transform-origin: center;
        transform-origin: center
    }
}

@keyframes slide-in-line1 {
    0% {
        -webkit-transform: rotate(-15deg);
        transform: rotate(-15deg);
        -webkit-transform-origin: center;
        transform-origin: center
    }

    33% {
        -webkit-transform: rotate(105deg);
        transform: rotate(105deg);
        -webkit-transform-origin: center;
        transform-origin: center
    }

    67% {
        -webkit-transform: rotate(225deg);
        transform: rotate(225deg);
        -webkit-transform-origin: center;
        transform-origin: center
    }

    to {
        -webkit-transform: rotate(345deg);
        transform: rotate(345deg);
        -webkit-transform-origin: center;
        transform-origin: center
    }
}

.slide-in-line1 {
    -webkit-animation-name: slide-in-line1;
    animation-name: slide-in-line1
}

@-webkit-keyframes slide-in-line1-leave {
    0% {
        opacity: .1;
        -webkit-transform: rotate(45deg);
        transform: rotate(45deg);
        -webkit-transform-origin: center;
        transform-origin: center
    }

    to {
        opacity: 0;
        -webkit-transform: rotate(105deg);
        transform: rotate(105deg);
        -webkit-transform-origin: center;
        transform-origin: center
    }
}

@keyframes slide-in-line1-leave {
    0% {
        opacity: .1;
        -webkit-transform: rotate(45deg);
        transform: rotate(45deg);
        -webkit-transform-origin: center;
        transform-origin: center
    }

    to {
        opacity: 0;
        -webkit-transform: rotate(105deg);
        transform: rotate(105deg);
        -webkit-transform-origin: center;
        transform-origin: center
    }
}

.slide-in-line1-leave {
    -webkit-animation-name: slide-in-line1-leave;
    animation-name: slide-in-line1-leave
}

@-webkit-keyframes slide-in-line2 {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
        -webkit-transform-origin: center;
        transform-origin: center
    }

    33% {
        -webkit-transform: rotate(120deg);
        transform: rotate(120deg);
        -webkit-transform-origin: center;
        transform-origin: center
    }

    67% {
        -webkit-transform: rotate(240deg);
        transform: rotate(240deg);
        -webkit-transform-origin: center;
        transform-origin: center
    }

    to {
        -webkit-transform: rotate(1turn);
        transform: rotate(1turn);
        -webkit-transform-origin: center;
        transform-origin: center
    }
}

@keyframes slide-in-line2 {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
        -webkit-transform-origin: center;
        transform-origin: center
    }

    33% {
        -webkit-transform: rotate(120deg);
        transform: rotate(120deg);
        -webkit-transform-origin: center;
        transform-origin: center
    }

    67% {
        -webkit-transform: rotate(240deg);
        transform: rotate(240deg);
        -webkit-transform-origin: center;
        transform-origin: center
    }

    to {
        -webkit-transform: rotate(1turn);
        transform: rotate(1turn);
        -webkit-transform-origin: center;
        transform-origin: center
    }
}

.slide-in-line2 {
    -webkit-animation-name: slide-in-line2;
    animation-name: slide-in-line2
}

@-webkit-keyframes slide-in-line2-leave {
    0% {
        opacity: .2;
        -webkit-transform: rotate(60deg);
        transform: rotate(60deg);
        -webkit-transform-origin: center;
        transform-origin: center
    }

    to {
        opacity: 0;
        -webkit-transform: rotate(150deg);
        transform: rotate(150deg);
        -webkit-transform-origin: center;
        transform-origin: center
    }
}

@keyframes slide-in-line2-leave {
    0% {
        opacity: .2;
        -webkit-transform: rotate(60deg);
        transform: rotate(60deg);
        -webkit-transform-origin: center;
        transform-origin: center
    }

    to {
        opacity: 0;
        -webkit-transform: rotate(150deg);
        transform: rotate(150deg);
        -webkit-transform-origin: center;
        transform-origin: center
    }
}

.slide-in-line2-leave {
    -webkit-animation-name: slide-in-line2-leave;
    animation-name: slide-in-line2-leave
}

@-webkit-keyframes slide2-in-left {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(-50%,0,0);
        transform: translate3d(-50%,0,0)
    }

    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

@keyframes slide2-in-left {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(-50%,0,0);
        transform: translate3d(-50%,0,0)
    }

    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

.slide2-in-left {
    -webkit-animation-name: slide2-in-left;
    animation-name: slide2-in-left
}

@-webkit-keyframes slide2-in-left-next-start {
    0% {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }

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

@keyframes slide2-in-left-next-start {
    0% {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }

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

.slide2-in-left-next-start {
    -webkit-animation-name: slide2-in-left-next-start;
    animation-name: slide2-in-left-next-start
}

@-webkit-keyframes slide2-in-left-prev-start {
    0% {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }

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

@keyframes slide2-in-left-prev-start {
    0% {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }

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

.slide2-in-left-prev-start {
    -webkit-animation-name: slide2-in-left-prev-start;
    animation-name: slide2-in-left-prev-start
}

@-webkit-keyframes slide2-in-left-next-end {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(-50%,0,0);
        transform: translate3d(-50%,0,0)
    }

    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

@keyframes slide2-in-left-next-end {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(-50%,0,0);
        transform: translate3d(-50%,0,0)
    }

    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

.slide2-in-left-next-end {
    -webkit-animation-name: slide2-in-left-next-end;
    animation-name: slide2-in-left-next-end
}

@-webkit-keyframes slide2-in-left-prev-end {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(50%,0,0);
        transform: translate3d(50%,0,0)
    }

    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

@keyframes slide2-in-left-prev-end {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(50%,0,0);
        transform: translate3d(50%,0,0)
    }

    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

.slide2-in-left-prev-end {
    -webkit-animation-name: slide2-in-left-prev-end;
    animation-name: slide2-in-left-prev-end
}

@-webkit-keyframes slide2-in-left-leave {
    0% {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }

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

@keyframes slide2-in-left-leave {
    0% {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }

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

.slide2-in-left-leave {
    -webkit-animation-name: slide2-in-left-leave;
    animation-name: slide2-in-left-leave
}

@-webkit-keyframes slide2-in-blue {
    0% {
        opacity: 0;
        -webkit-transform: rotate(-90deg);
        transform: rotate(-90deg)
    }

    to {
        opacity: 1;
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg)
    }
}

@keyframes slide2-in-blue {
    0% {
        opacity: 0;
        -webkit-transform: rotate(-90deg);
        transform: rotate(-90deg)
    }

    to {
        opacity: 1;
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg)
    }
}

.slide2-in-blue {
    -webkit-animation-name: slide2-in-blue;
    animation-name: slide2-in-blue;
    -webkit-transform-origin: 55% 55%;
    transform-origin: 55% 55%
}

@-webkit-keyframes slide2-in-blue-next-start {
    0% {
        opacity: 1;
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg)
    }

    to {
        opacity: 0;
        -webkit-transform: rotate(90deg);
        transform: rotate(90deg)
    }
}

@keyframes slide2-in-blue-next-start {
    0% {
        opacity: 1;
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg)
    }

    to {
        opacity: 0;
        -webkit-transform: rotate(90deg);
        transform: rotate(90deg)
    }
}

.slide2-in-blue-next-start {
    -webkit-animation-name: slide2-in-blue-next-start;
    animation-name: slide2-in-blue-next-start;
    -webkit-transform-origin: 55% 55%;
    transform-origin: 55% 55%
}

@-webkit-keyframes slide2-in-blue-prev-start {
    0% {
        opacity: 1;
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg)
    }

    to {
        opacity: 0;
        -webkit-transform: rotate(-90deg);
        transform: rotate(-90deg)
    }
}

@keyframes slide2-in-blue-prev-start {
    0% {
        opacity: 1;
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg)
    }

    to {
        opacity: 0;
        -webkit-transform: rotate(-90deg);
        transform: rotate(-90deg)
    }
}

.slide2-in-blue-prev-start {
    -webkit-animation-name: slide2-in-blue-prev-start;
    animation-name: slide2-in-blue-prev-start;
    -webkit-transform-origin: 55% 55%;
    transform-origin: 55% 55%
}

@-webkit-keyframes slide2-in-blue-next-end {
    0% {
        opacity: 0;
        -webkit-transform: rotate(-90deg);
        transform: rotate(-90deg)
    }

    to {
        opacity: 1;
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg)
    }
}

@keyframes slide2-in-blue-next-end {
    0% {
        opacity: 0;
        -webkit-transform: rotate(-90deg);
        transform: rotate(-90deg)
    }

    to {
        opacity: 1;
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg)
    }
}

.slide2-in-blue-next-end {
    -webkit-animation-name: slide2-in-blue-next-end;
    animation-name: slide2-in-blue-next-end;
    -webkit-transform-origin: 55% 55%;
    transform-origin: 55% 55%
}

@-webkit-keyframes slide2-in-blue-prev-end {
    0% {
        opacity: 0;
        -webkit-transform: rotate(90deg);
        transform: rotate(90deg)
    }

    to {
        opacity: 1;
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg)
    }
}

@keyframes slide2-in-blue-prev-end {
    0% {
        opacity: 0;
        -webkit-transform: rotate(90deg);
        transform: rotate(90deg)
    }

    to {
        opacity: 1;
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg)
    }
}

.slide2-in-blue-prev-end {
    -webkit-animation-name: slide2-in-blue-prev-end;
    animation-name: slide2-in-blue-prev-end;
    -webkit-transform-origin: 55% 55%;
    transform-origin: 55% 55%
}

@-webkit-keyframes slide2-in-blue-leave {
    0% {
        opacity: 1;
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg)
    }

    to {
        opacity: 0;
        -webkit-transform: rotate(90deg);
        transform: rotate(90deg)
    }
}

@keyframes slide2-in-blue-leave {
    0% {
        opacity: 1;
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg)
    }

    to {
        opacity: 0;
        -webkit-transform: rotate(90deg);
        transform: rotate(90deg)
    }
}

.slide2-in-blue-leave {
    -webkit-animation-name: slide2-in-blue-leave;
    animation-name: slide2-in-blue-leave;
    -webkit-transform-origin: 55% 55%;
    transform-origin: 55% 55%
}

@-webkit-keyframes slide2-in-yellow {
    0% {
        opacity: 0;
        -webkit-transform: rotate(-40deg);
        transform: rotate(-40deg)
    }

    to {
        opacity: 1;
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg)
    }
}

@keyframes slide2-in-yellow {
    0% {
        opacity: 0;
        -webkit-transform: rotate(-40deg);
        transform: rotate(-40deg)
    }

    to {
        opacity: 1;
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg)
    }
}

.slide2-in-yellow {
    -webkit-animation-name: slide2-in-yellow;
    animation-name: slide2-in-yellow;
    -webkit-transform-origin: 55% 55%;
    transform-origin: 55% 55%
}

@-webkit-keyframes slide2-in-yellow-next-start {
    0% {
        opacity: 1;
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg)
    }

    to {
        opacity: 0;
        -webkit-transform: rotate(40deg);
        transform: rotate(40deg)
    }
}

@keyframes slide2-in-yellow-next-start {
    0% {
        opacity: 1;
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg)
    }

    to {
        opacity: 0;
        -webkit-transform: rotate(40deg);
        transform: rotate(40deg)
    }
}

.slide2-in-yellow-next-start {
    -webkit-animation-name: slide2-in-yellow-next-start;
    animation-name: slide2-in-yellow-next-start;
    -webkit-transform-origin: 55% 55%;
    transform-origin: 55% 55%
}

@-webkit-keyframes slide2-in-yellow-prev-start {
    0% {
        opacity: 1;
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg)
    }

    to {
        opacity: 0;
        -webkit-transform: rotate(-40deg);
        transform: rotate(-40deg)
    }
}

@keyframes slide2-in-yellow-prev-start {
    0% {
        opacity: 1;
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg)
    }

    to {
        opacity: 0;
        -webkit-transform: rotate(-40deg);
        transform: rotate(-40deg)
    }
}

.slide2-in-yellow-prev-start {
    -webkit-animation-name: slide2-in-yellow-prev-start;
    animation-name: slide2-in-yellow-prev-start;
    -webkit-transform-origin: 55% 55%;
    transform-origin: 55% 55%
}

@-webkit-keyframes slide2-in-yellow-next-end {
    0% {
        opacity: 0;
        -webkit-transform: rotate(-40deg);
        transform: rotate(-40deg)
    }

    to {
        opacity: 1;
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg)
    }
}

@keyframes slide2-in-yellow-next-end {
    0% {
        opacity: 0;
        -webkit-transform: rotate(-40deg);
        transform: rotate(-40deg)
    }

    to {
        opacity: 1;
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg)
    }
}

.slide2-in-yellow-next-end {
    -webkit-animation-name: slide2-in-yellow-next-end;
    animation-name: slide2-in-yellow-next-end;
    -webkit-transform-origin: 55% 55%;
    transform-origin: 55% 55%
}

@-webkit-keyframes slide2-in-yellow-prev-end {
    0% {
        opacity: 0;
        -webkit-transform: rotate(40deg);
        transform: rotate(40deg)
    }

    to {
        opacity: 1;
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg)
    }
}

@keyframes slide2-in-yellow-prev-end {
    0% {
        opacity: 0;
        -webkit-transform: rotate(40deg);
        transform: rotate(40deg)
    }

    to {
        opacity: 1;
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg)
    }
}

.slide2-in-yellow-prev-end {
    -webkit-animation-name: slide2-in-yellow-prev-end;
    animation-name: slide2-in-yellow-prev-end;
    -webkit-transform-origin: 55% 55%;
    transform-origin: 55% 55%
}

@-webkit-keyframes slide2-in-yellow-leave {
    0% {
        opacity: 1;
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg)
    }

    to {
        opacity: 0;
        -webkit-transform: rotate(40deg);
        transform: rotate(40deg)
    }
}

@keyframes slide2-in-yellow-leave {
    0% {
        opacity: 1;
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg)
    }

    to {
        opacity: 0;
        -webkit-transform: rotate(40deg);
        transform: rotate(40deg)
    }
}

.slide2-in-yellow-leave {
    -webkit-animation-name: slide2-in-yellow-leave;
    animation-name: slide2-in-yellow-leave;
    -webkit-transform-origin: 55% 55%;
    transform-origin: 55% 55%
}

@-webkit-keyframes slide2-in-red {
    0% {
        opacity: 0;
        -webkit-transform: rotate(-50deg);
        transform: rotate(-50deg)
    }

    to {
        opacity: 1;
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg)
    }
}

@keyframes slide2-in-red {
    0% {
        opacity: 0;
        -webkit-transform: rotate(-50deg);
        transform: rotate(-50deg)
    }

    to {
        opacity: 1;
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg)
    }
}

.slide2-in-red {
    -webkit-animation-name: slide2-in-red;
    animation-name: slide2-in-red;
    -webkit-transform-origin: 55% 55%;
    transform-origin: 55% 55%
}

@-webkit-keyframes slide2-in-red-next-start {
    0% {
        opacity: 1;
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg)
    }

    to {
        opacity: 0;
        -webkit-transform: rotate(50deg);
        transform: rotate(50deg)
    }
}

@keyframes slide2-in-red-next-start {
    0% {
        opacity: 1;
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg)
    }

    to {
        opacity: 0;
        -webkit-transform: rotate(50deg);
        transform: rotate(50deg)
    }
}

.slide2-in-red-next-start {
    -webkit-animation-name: slide2-in-red-next-start;
    animation-name: slide2-in-red-next-start;
    -webkit-transform-origin: 55% 55%;
    transform-origin: 55% 55%
}

@-webkit-keyframes slide2-in-red-prev-start {
    0% {
        opacity: 1;
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg)
    }

    to {
        opacity: 0;
        -webkit-transform: rotate(-50deg);
        transform: rotate(-50deg)
    }
}

@keyframes slide2-in-red-prev-start {
    0% {
        opacity: 1;
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg)
    }

    to {
        opacity: 0;
        -webkit-transform: rotate(-50deg);
        transform: rotate(-50deg)
    }
}

.slide2-in-red-prev-start {
    -webkit-animation-name: slide2-in-red-prev-start;
    animation-name: slide2-in-red-prev-start;
    -webkit-transform-origin: 55% 55%;
    transform-origin: 55% 55%
}

@-webkit-keyframes slide2-in-red-next-end {
    0% {
        opacity: 0;
        -webkit-transform: rotate(-50deg);
        transform: rotate(-50deg)
    }

    to {
        opacity: 1;
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg)
    }
}

@keyframes slide2-in-red-next-end {
    0% {
        opacity: 0;
        -webkit-transform: rotate(-50deg);
        transform: rotate(-50deg)
    }

    to {
        opacity: 1;
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg)
    }
}

.slide2-in-red-next-end {
    -webkit-animation-name: slide2-in-red-next-end;
    animation-name: slide2-in-red-next-end;
    -webkit-transform-origin: 55% 55%;
    transform-origin: 55% 55%
}

@-webkit-keyframes slide2-in-red-prev-end {
    0% {
        opacity: 0;
        -webkit-transform: rotate(50deg);
        transform: rotate(50deg)
    }

    to {
        opacity: 1;
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg)
    }
}

@keyframes slide2-in-red-prev-end {
    0% {
        opacity: 0;
        -webkit-transform: rotate(50deg);
        transform: rotate(50deg)
    }

    to {
        opacity: 1;
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg)
    }
}

.slide2-in-red-prev-end {
    -webkit-animation-name: slide2-in-red-prev-end;
    animation-name: slide2-in-red-prev-end;
    -webkit-transform-origin: 55% 55%;
    transform-origin: 55% 55%
}

@-webkit-keyframes slide2-in-red-leave {
    0% {
        opacity: 1;
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg)
    }

    to {
        opacity: 0;
        -webkit-transform: rotate(50deg);
        transform: rotate(50deg)
    }
}

@keyframes slide2-in-red-leave {
    0% {
        opacity: 1;
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg)
    }

    to {
        opacity: 0;
        -webkit-transform: rotate(50deg);
        transform: rotate(50deg)
    }
}

.slide2-in-red-leave {
    -webkit-animation-name: slide2-in-red-leave;
    animation-name: slide2-in-red-leave;
    -webkit-transform-origin: 55% 55%;
    transform-origin: 55% 55%
}

@-webkit-keyframes slide2-in-intro {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0,20%,0);
        transform: translate3d(0,20%,0)
    }

    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

@keyframes slide2-in-intro {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0,20%,0);
        transform: translate3d(0,20%,0)
    }

    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

.slide2-in-intro {
    -webkit-animation-name: slide2-in-intro;
    animation-name: slide2-in-intro
}

@-webkit-keyframes slide2-in-intro-next-start {
    0% {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }

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

@keyframes slide2-in-intro-next-start {
    0% {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }

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

.slide2-in-intro-next-start {
    -webkit-animation-name: slide2-in-intro-next-start;
    animation-name: slide2-in-intro-next-start
}

@-webkit-keyframes slide2-in-intro-prev-start {
    0% {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }

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

@keyframes slide2-in-intro-prev-start {
    0% {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }

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

.slide2-in-intro-prev-start {
    -webkit-animation-name: slide2-in-intro-prev-start;
    animation-name: slide2-in-intro-prev-start
}

@-webkit-keyframes slide2-in-intro-next-end {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(-20%,0,0);
        transform: translate3d(-20%,0,0)
    }

    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

@keyframes slide2-in-intro-next-end {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(-20%,0,0);
        transform: translate3d(-20%,0,0)
    }

    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

.slide2-in-intro-next-end {
    -webkit-animation-name: slide2-in-intro-next-end;
    animation-name: slide2-in-intro-next-end
}

@-webkit-keyframes slide2-in-intro-prev-end {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(20%,0,0);
        transform: translate3d(20%,0,0)
    }

    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

@keyframes slide2-in-intro-prev-end {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(20%,0,0);
        transform: translate3d(20%,0,0)
    }

    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

.slide2-in-intro-prev-end {
    -webkit-animation-name: slide2-in-intro-prev-end;
    animation-name: slide2-in-intro-prev-end
}

@-webkit-keyframes slide2-in-intro-leave {
    0% {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }

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

@keyframes slide2-in-intro-leave {
    0% {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }

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

.slide2-in-intro-leave {
    -webkit-animation-name: slide2-in-intro-leave;
    animation-name: slide2-in-intro-leave
}

@-webkit-keyframes slide2-in-icon {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(-20%,0,0);
        transform: translate3d(-20%,0,0)
    }

    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

@keyframes slide2-in-icon {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(-20%,0,0);
        transform: translate3d(-20%,0,0)
    }

    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

.slide2-in-icon {
    -webkit-animation-name: slide2-in-icon;
    animation-name: slide2-in-icon
}

@-webkit-keyframes slide2-in-icon-next-start {
    0% {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }

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

@keyframes slide2-in-icon-next-start {
    0% {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }

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

.slide2-in-icon-next-start {
    -webkit-animation-name: slide2-in-icon-next-start;
    animation-name: slide2-in-icon-next-start
}

@-webkit-keyframes slide2-in-icon-prev-start {
    0% {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }

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

@keyframes slide2-in-icon-prev-start {
    0% {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }

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

.slide2-in-icon-prev-start {
    -webkit-animation-name: slide2-in-icon-prev-start;
    animation-name: slide2-in-icon-prev-start
}

@-webkit-keyframes slide2-in-icon-next-end {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(-20%,0,0);
        transform: translate3d(-20%,0,0)
    }

    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

@keyframes slide2-in-icon-next-end {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(-20%,0,0);
        transform: translate3d(-20%,0,0)
    }

    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

.slide2-in-icon-next-end {
    -webkit-animation-name: slide2-in-icon-next-end;
    animation-name: slide2-in-icon-next-end
}

@-webkit-keyframes slide2-in-icon-prev-end {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(20%,0,0);
        transform: translate3d(20%,0,0)
    }

    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

@keyframes slide2-in-icon-prev-end {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(20%,0,0);
        transform: translate3d(20%,0,0)
    }

    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

.slide2-in-icon-prev-end {
    -webkit-animation-name: slide2-in-icon-prev-end;
    animation-name: slide2-in-icon-prev-end
}

@-webkit-keyframes slide2-in-icon-leave {
    0% {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }

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

@keyframes slide2-in-icon-leave {
    0% {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }

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

.slide2-in-icon-leave {
    -webkit-animation-name: slide2-in-icon-leave;
    animation-name: slide2-in-icon-leave
}

@-webkit-keyframes slide3-in-top {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0,50%,0);
        transform: translate3d(0,50%,0)
    }

    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

@keyframes slide3-in-top {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0,50%,0);
        transform: translate3d(0,50%,0)
    }

    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

.slide3-in-top {
    -webkit-animation-name: slide3-in-top;
    animation-name: slide3-in-top
}

@-webkit-keyframes slide3-in-top-next-start {
    0% {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }

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

@keyframes slide3-in-top-next-start {
    0% {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }

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

.slide3-in-top-next-start {
    -webkit-animation-name: slide3-in-top-next-start;
    animation-name: slide3-in-top-next-start
}

@-webkit-keyframes slide3-in-top-prev-start {
    0% {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }

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

@keyframes slide3-in-top-prev-start {
    0% {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }

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

.slide3-in-top-prev-start {
    -webkit-animation-name: slide3-in-top-prev-start;
    animation-name: slide3-in-top-prev-start
}

@-webkit-keyframes slide3-in-top-next-end {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0,50%,0);
        transform: translate3d(0,50%,0)
    }

    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

@keyframes slide3-in-top-next-end {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0,50%,0);
        transform: translate3d(0,50%,0)
    }

    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

.slide3-in-top-next-end {
    -webkit-animation-name: slide3-in-top-next-end;
    animation-name: slide3-in-top-next-end
}

@-webkit-keyframes slide3-in-top-prev-end {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0,50%,0);
        transform: translate3d(0,50%,0)
    }

    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

@keyframes slide3-in-top-prev-end {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0,50%,0);
        transform: translate3d(0,50%,0)
    }

    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

.slide3-in-top-prev-end {
    -webkit-animation-name: slide3-in-top-prev-end;
    animation-name: slide3-in-top-prev-end
}

@-webkit-keyframes slide3-in-top-leave {
    0% {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }

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

@keyframes slide3-in-top-leave {
    0% {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }

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

.slide3-in-top-leave {
    -webkit-animation-name: slide3-in-top-leave;
    animation-name: slide3-in-top-leave
}

@-webkit-keyframes slide3-in-left {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(-50%,0,0);
        transform: translate3d(-50%,0,0)
    }

    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

@keyframes slide3-in-left {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(-50%,0,0);
        transform: translate3d(-50%,0,0)
    }

    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

.slide3-in-left {
    -webkit-animation-name: slide3-in-left;
    animation-name: slide3-in-left
}

@-webkit-keyframes slide3-in-left-next-start {
    0% {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }

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

@keyframes slide3-in-left-next-start {
    0% {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }

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

.slide3-in-left-next-start {
    -webkit-animation-name: slide3-in-left-next-start;
    animation-name: slide3-in-left-next-start
}

@-webkit-keyframes slide3-in-left-prev-start {
    0% {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }

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

@keyframes slide3-in-left-prev-start {
    0% {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }

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

.slide3-in-left-prev-start {
    -webkit-animation-name: slide3-in-left-prev-start;
    animation-name: slide3-in-left-prev-start
}

@-webkit-keyframes slide3-in-left-next-end {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(-50%,0,0);
        transform: translate3d(-50%,0,0)
    }

    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

@keyframes slide3-in-left-next-end {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(-50%,0,0);
        transform: translate3d(-50%,0,0)
    }

    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

.slide3-in-left-next-end {
    -webkit-animation-name: slide3-in-left-next-end;
    animation-name: slide3-in-left-next-end
}

@-webkit-keyframes slide3-in-left-prev-end {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(-50%,0,0);
        transform: translate3d(-50%,0,0)
    }

    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

@keyframes slide3-in-left-prev-end {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(-50%,0,0);
        transform: translate3d(-50%,0,0)
    }

    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

.slide3-in-left-prev-end {
    -webkit-animation-name: slide3-in-left-prev-end;
    animation-name: slide3-in-left-prev-end
}

@-webkit-keyframes slide3-in-left-leave {
    0% {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }

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

@keyframes slide3-in-left-leave {
    0% {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }

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

.slide3-in-left-leave {
    -webkit-animation-name: slide3-in-left-leave;
    animation-name: slide3-in-left-leave
}

@-webkit-keyframes slide3-in-right {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(50%,0,0);
        transform: translate3d(50%,0,0)
    }

    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

@keyframes slide3-in-right {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(50%,0,0);
        transform: translate3d(50%,0,0)
    }

    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

.slide3-in-right {
    -webkit-animation-name: slide3-in-right;
    animation-name: slide3-in-right
}

@-webkit-keyframes slide3-in-right-next-start {
    0% {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }

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

@keyframes slide3-in-right-next-start {
    0% {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }

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

.slide3-in-right-next-start {
    -webkit-animation-name: slide3-in-right-next-start;
    animation-name: slide3-in-right-next-start
}

@-webkit-keyframes slide3-in-right-prev-start {
    0% {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }

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

@keyframes slide3-in-right-prev-start {
    0% {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }

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

.slide3-in-right-prev-start {
    -webkit-animation-name: slide3-in-right-prev-start;
    animation-name: slide3-in-right-prev-start
}

@-webkit-keyframes slide3-in-right-next-end {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(50%,0,0);
        transform: translate3d(50%,0,0)
    }

    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

@keyframes slide3-in-right-next-end {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(50%,0,0);
        transform: translate3d(50%,0,0)
    }

    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

.slide3-in-right-next-end {
    -webkit-animation-name: slide3-in-right-next-end;
    animation-name: slide3-in-right-next-end
}

@-webkit-keyframes slide3-in-right-prev-end {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(50%,0,0);
        transform: translate3d(50%,0,0)
    }

    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

@keyframes slide3-in-right-prev-end {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(50%,0,0);
        transform: translate3d(50%,0,0)
    }

    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

.slide3-in-right-prev-end {
    -webkit-animation-name: slide3-in-right-prev-end;
    animation-name: slide3-in-right-prev-end
}

@-webkit-keyframes slide3-in-right-leave {
    0% {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }

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

@keyframes slide3-in-right-leave {
    0% {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }

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

.slide3-in-right-leave {
    -webkit-animation-name: slide3-in-right-leave;
    animation-name: slide3-in-right-leave
}

@-webkit-keyframes slide4-in-bottom {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0,50%,0);
        transform: translate3d(0,50%,0)
    }

    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

@keyframes slide4-in-bottom {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0,50%,0);
        transform: translate3d(0,50%,0)
    }

    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

.slide4-in-bottom {
    -webkit-animation-name: slide4-in-bottom;
    animation-name: slide4-in-bottom
}

@-webkit-keyframes slide4-in-bottom-leave {
    0% {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }

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

@keyframes slide4-in-bottom-leave {
    0% {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }

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

.slide4-in-bottom-leave {
    animation-delay: .2s!important;
    animation-duration: 1s!important;
    -webkit-animation-name: slide4-in-bottom-leave;
    animation-name: slide4-in-bottom-leave
}

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

    to {
        opacity: 1
    }
}

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

    to {
        opacity: 1
    }
}

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

@-webkit-keyframes slide4-fadeIn-leave {
    0% {
        opacity: 1
    }

    to {
        opacity: 0
    }
}

@keyframes slide4-fadeIn-leave {
    0% {
        opacity: 1
    }

    to {
        opacity: 0
    }
}

.slide4-fadeIn-leave {
    animation-delay: .2s!important;
    animation-duration: 1s!important;
    -webkit-animation-name: slide4-fadeIn-leave;
    animation-name: slide4-fadeIn-leave
}

@-webkit-keyframes slide5-in-scale {
    0% {
        -webkit-transform: scale(1);
        transform: scale(1)
    }

    to {
        -webkit-transform: scale(1.2);
        transform: scale(1.2)
    }
}

@keyframes slide5-in-scale {
    0% {
        -webkit-transform: scale(1);
        transform: scale(1)
    }

    to {
        -webkit-transform: scale(1.2);
        transform: scale(1.2)
    }
}

.slide5-in-scale {
    -webkit-animation-name: slide5-in-scale;
    animation-name: slide5-in-scale
}

@-webkit-keyframes slide5-in-scale-leave {
    to {
        -webkit-transform: scale(1);
        transform: scale(1)
    }
}

@keyframes slide5-in-scale-leave {
    to {
        -webkit-transform: scale(1);
        transform: scale(1)
    }
}

.slide5-in-scale-leave {
    -webkit-animation-name: slide5-in-scale-leave;
    animation-name: slide5-in-scale-leave
}

@-webkit-keyframes slide5-in-top {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0,-50%,0);
        transform: translate3d(0,-50%,0)
    }

    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

@keyframes slide5-in-top {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0,-50%,0);
        transform: translate3d(0,-50%,0)
    }

    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

.slide5-in-top {
    -webkit-animation-name: slide5-in-top;
    animation-name: slide5-in-top
}

@-webkit-keyframes slide5-in-top-leave {
    0% {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }

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

@keyframes slide5-in-top-leave {
    0% {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }

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

.slide5-in-top-leave {
    -webkit-animation-name: slide5-in-top-leave;
    animation-name: slide5-in-top-leave
}

@-webkit-keyframes slide5-in-bottom {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0,50%,0);
        transform: translate3d(0,50%,0)
    }

    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

@keyframes slide5-in-bottom {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0,50%,0);
        transform: translate3d(0,50%,0)
    }

    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

.slide5-in-bottom {
    -webkit-animation-name: slide5-in-bottom;
    animation-name: slide5-in-bottom
}

@-webkit-keyframes slide5-in-bottom-leave {
    0% {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }

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

@keyframes slide5-in-bottom-leave {
    0% {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }

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

.slide5-in-bottom-leave {
    -webkit-animation-name: slide5-in-bottom-leave;
    animation-name: slide5-in-bottom-leave
}

@-webkit-keyframes slide5-in-rotate {
    0% {
        -webkit-transform: rotate(-90deg);
        transform: rotate(-90deg)
    }

    33% {
        -webkit-transform: rotate(30deg);
        transform: rotate(30deg)
    }

    67% {
        -webkit-transform: rotate(150deg);
        transform: rotate(150deg)
    }

    to {
        -webkit-transform: rotate(270deg);
        transform: rotate(270deg)
    }
}

@keyframes slide5-in-rotate {
    0% {
        -webkit-transform: rotate(-90deg);
        transform: rotate(-90deg)
    }

    33% {
        -webkit-transform: rotate(30deg);
        transform: rotate(30deg)
    }

    67% {
        -webkit-transform: rotate(150deg);
        transform: rotate(150deg)
    }

    to {
        -webkit-transform: rotate(270deg);
        transform: rotate(270deg)
    }
}

.slide5-in-rotate {
    -webkit-animation-name: slide5-in-rotate;
    animation-name: slide5-in-rotate
}

@-webkit-keyframes slide5-in-rotate-leave {
    0% {
        opacity: 1
    }

    to {
        opacity: 0
    }
}

@keyframes slide5-in-rotate-leave {
    0% {
        opacity: 1
    }

    to {
        opacity: 0
    }
}

.slide5-in-rotate-leave {
    -webkit-animation-name: slide5-in-rotate-leave;
    animation-name: slide5-in-rotate-leave
}

.body {
    font-family: Segoe UI,PingFang SC,Microsoft YaHei,sans-serif;
    font-size: 12px
}

.slide-leave-reverse {
    animation-direction: reverse
}

.footer {
    align-items: center;
    bottom: 0;
    color: #fff;
    display: flex;
    font-size: calc(10px*var(--radio));
    font-weight: 500;
    justify-content: center;
    left: 0;
    line-height: calc(10px*var(--radio));
    margin-bottom: calc(46px*var(--radio));
    position: fixed;
    text-align: center;
    text-transform: uppercase;
    width: 100%;
    z-index: 2
}

.footer>img:first-child {
    height: calc(6px*var(--radio));
    left: calc(43px*var(--radio));
    position: absolute;
    top: calc(5px*var(--radio));
    width: calc(52px*var(--radio))
}

.footer>img:nth-child(2) {
    height: calc(8.5px*var(--radioF));
    width: calc(450px*var(--radioF))
}

.footer div {
    position: absolute;
    right: calc(34px*var(--radio));
    top: calc(-20px*var(--radio))
}

.footer div,.footer div>img:first-child {
    height: calc(28px*var(--radio));
    width: calc(21px*var(--radio))
}

.footer div>img:nth-child(2) {
    height: calc(7px*var(--radio));
    left: calc(50% - 3.5px*var(--radio)*.5);
    position: absolute;
    top: calc(6px*var(--radio));
    width: calc(3.5px*var(--radio))
}

.header {
    display: flex;
    height: calc(32px*var(--radio));
    justify-content: space-between;
    left: 0;
    line-height: calc(32px*var(--radio));
    margin-top: calc(45px*var(--radio));
    padding: 0 calc(52px*var(--radio));
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 2
}

.logo .logo-link {
    align-items: center;
    color: #fff;
    display: flex;
    font-size: calc(30px*var(--radio));
    font-weight: 700;
    text-decoration: none
}

.logo .logo-link img {
    height: calc(32px*var(--radio));
    margin-right: calc(14px*var(--radio));
    width: calc(154px*var(--radio))
}

.links a {
    border-bottom: calc(3px*var(--radio)) solid transparent;
    box-sizing: border-box;
    color: #fff;
    cursor: pointer;
    font-size: calc(14px*var(--radio));
    font-style: normal;
    font-weight: 600;
    letter-spacing: -.03em;
    line-height: calc(14px*var(--radio));
    opacity: .5;
    padding-bottom: calc(6px*var(--radio));
    position: relative;
    text-decoration: none;
    transition: all .2s linear
}

.links a+a {
    margin-left: calc(38px*var(--radio))
}

.links a.active {
    border-bottom: calc(3px*var(--radio)) solid #fff;
    opacity: 1
}

.links a:hover {
    opacity: 1
}

.little-code>img {
    height: calc(24px*var(--radio));
    width: calc(120px*var(--radio))
}

.slide1-container {
    display: flex;
    height: 100%;
    padding: calc(80px*var(--radio)) 0 calc(60px*var(--radio));
    width: 100%
}

.slide1-container .left-part {
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding-left: calc(100px*var(--radio));
    width: 50vw
}

.slide1-container .left-part-title {
    color: #fff;
    font-family: Segoe UI,PingFang SC,Microsoft YaHei,sans-serif;
    font-size: calc(52px*var(--radio));
    font-weight: 900;
    line-height: calc(52px*var(--radio));
    margin-top: calc(21px*var(--radio))
}

.slide1-container .left-part-title+.slide1-container .left-part-title-title {
    margin-top: calc(23px*var(--radio))
}

.slide1-container .left-part-desc {
    color: #fff;
    font-family: Segoe UI,PingFang SC,Microsoft YaHei,sans-serif;
    font-size: calc(14px*var(--radio));
    font-style: normal;
    font-weight: 400;
    line-height: calc(21px*var(--radio));
    margin-top: calc(40px*var(--radio));
    opacity: .6;
    padding-right: calc(150px*var(--radio))
}

.slide1-container .left-part-download {
    background: linear-gradient(102.51deg,#ff3d00 9.6%,rgba(255,0,153,.68) 95.98%);
    border-radius: calc(100px*var(--radio));
    box-shadow: 0 21px 51px -18px rgba(227,37,59,.68);
    color: #fff;
    cursor: pointer;
    font-size: calc(24px*var(--radio));
    font-weight: 500;
    height: calc(60px*var(--radio));
    line-height: calc(60px*var(--radio));
    margin-top: calc(40px*var(--radio));
    text-align: center;
    transition: transform .15s ease;
    width: calc(260px*var(--radio));
    z-index: 2
}

.slide1-container .left-part-download:hover {
    transform: scale(1.1)
}

.slide1-container .left-part-download:active {
    -webkit-animation: heartbeat 1.5s ease-in-out infinite both;
    animation: heartbeat 1.5s ease-in-out infinite both
}

.slide1-container .left-part-download__eol {
    align-items: center;
    color: hsla(0,0%,100%,.9);
    cursor: pointer;
    display: flex;
    font-size: 12px;
    justify-content: center;
    line-height: 12px;
    margin-top: 12px;
    width: calc(260px*var(--radio))
}

.slide1-container .left-part-download__eol img {
    margin-left: 4px
}

.slide1-container .left-part-download__eol:hover {
    opacity: .6
}

.slide1-container .left-part-tips {
    color: #fff;
    font-family: Segoe UI,PingFang SC,Microsoft YaHei,sans-serif;
    font-size: calc(14px*var(--radio));
    font-weight: 400;
    line-height: calc(21px*var(--radio));
    margin-top: calc(12px*var(--radio));
    opacity: .6;
    padding: calc(2px*var(--radio));
    text-align: center;
    width: calc(260px*var(--radio));
    z-index: 2
}

.slide1-container .left-part-tips:focus,.slide1-container .left-part-tips:hover {
    cursor: pointer;
    opacity: .9
}

.slide1-container .left-part a {
    text-decoration: none
}

.slide1-container .right-part {
    display: flex;
    justify-content: center;
    position: relative;
    width: 50vw
}

.slide1-container .right-part .round-line1 {
    border: .890928px solid #4897ff;
    border-radius: 45%;
    height: 105vh;
    opacity: .1;
    position: absolute;
    right: calc(75px*var(--radio));
    top: calc(-88px*var(--radio));
    transform: rotate(45deg);
    width: 40vw
}

.slide1-container .right-part .round-line2 {
    border: .890928px solid #4897ff;
    border-radius: 60%;
    height: 98vh;
    opacity: .2;
    position: absolute;
    right: calc(120px*var(--radio));
    top: calc(0px*var(--radio));
    transform: rotate(60deg);
    width: 36vw
}

.slide1-container .right-part img:first-child,.slide1-container .right-part img:nth-child(2),.slide1-container .right-part img:nth-child(3) {
    align-self: center;
    display: flex;
    position: absolute
}

.slide1-container .right-part .blue,.slide1-container .right-part .red,.slide1-container .right-part .yellow {
    height: calc(727px*var(--radio));
    width: calc(727px*var(--radio))
}

.slide1-container .right-part .right-part-content {
    display: flex;
    justify-content: center;
    position: relative;
    width: 50vw
}

.slide1-container .right-part .right-part-content img:first-child {
    align-self: center;
    display: flex;
    height: calc(456px*var(--radio));
    margin-left: calc(-68px*var(--radio));
    margin-top: calc(-20px*var(--radio));
    width: calc(681px*var(--radio))
}

.slide1-container .right-part .right-part-content img:nth-child(2) {
    align-self: center;
    display: flex;
    height: calc(275.5px*var(--radio));
    position: absolute;
    right: calc(45% + 70px);
    top: calc(50% - 38px);
    width: calc(216.5px*var(--radio))
}

.slide2-container {
    display: flex;
    height: 100%;
    padding: calc(80px*var(--radio)) 0 calc(60px*var(--radio));
    width: 100%
}

.slide2-container .swiper-button-next:after,.slide2-container .swiper-button-prev:after {
    content: none
}

.slide2-container .swiper-button-prev {
    background: url(/2024/left.png) no-repeat;
    background-size: calc(40px*var(--radio)) calc(40px*var(--radio));
    height: calc(40px*var(--radio));
    left: calc(88px*var(--radio));
    transition: transform .15s ease;
    width: calc(40px*var(--radio))
}

.slide2-container .swiper-button-prev:hover {
    transform: scale(1.1)
}

.slide2-container .swiper-button-next {
    background: url(/2024/right.png) no-repeat;
    background-size: calc(40px*var(--radio)) calc(40px*var(--radio));
    height: calc(40px*var(--radio));
    right: calc(110px*var(--radio));
    transition: transform .15s ease;
    width: calc(40px*var(--radio))
}

.slide2-container .swiper-button-next:hover {
    transform: scale(1.1)
}

.slide2-container .sub-swiper {
    width: 100%
}

.slide2-container .item-container {
    display: flex;
    height: 100%;
    position: relative;
    width: 100%
}

.slide2-container .left-part {
    left: calc(108px*var(--radio));
    position: absolute;
    top: 10vh
}

.slide2-container .left-part .left-part-title {
    color: #fff;
    font-size: calc(44px*var(--radio));
    font-weight: 900;
    line-height: calc(44px*var(--radio));
    margin-top: calc(18px*var(--radio));
    text-transform: uppercase;
    width: calc(443px*var(--radio))
}

.slide2-container .left-part .left-part-desc {
    color: #fff;
    font-size: calc(23px*var(--radio));
    font-weight: 900;
    line-height: calc(35px*var(--radio));
    margin-top: calc(14px*var(--radio));
    width: calc(443px*var(--radio))
}

.slide2-container .center-part {
    display: flex;
    justify-content: center;
    width: 100%
}

.slide2-container .center-part .colours-round {
    align-self: center;
    bottom: 0;
    display: flex;
    left: 0;
    margin: auto;
    position: absolute;
    right: 0;
    top: 0
}

.slide2-container .center-part .blue,.slide2-container .center-part .center-icon,.slide2-container .center-part .red,.slide2-container .center-part .yellow {
    height: calc(900px*var(--radio));
    width: calc(1440px*var(--radio))
}

.slide2-container .center-part .center-icon {
    align-self: center;
    bottom: 0;
    display: flex;
    left: 0;
    margin: auto;
    position: absolute;
    right: 0;
    top: 0
}

.slide2-container .center-part .pico-name {
    height: calc(154.75px*var(--radio));
    margin-bottom: calc(-24px*var(--radio));
    margin-left: calc(-24px*var(--radio));
    width: calc(382px*var(--radio))
}

.slide2-container .center-part .scene-intro {
    align-items: center;
    bottom: 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    left: 0;
    margin: auto;
    position: absolute;
    right: calc(340px*var(--radio));
    top: calc(120px*var(--radio))
}

.slide2-container .center-part .scene-intro .scene-name {
    color: #fff;
    font-size: calc(86px*var(--radio));
    font-weight: 900;
    height: calc(86px*var(--radio));
    line-height: calc(86px*var(--radio));
    text-align: left;
    text-indent: 0;
    text-transform: uppercase
}

.slide2-container .center-part .scene-intro .scene-tips {
    color: #fff;
    font-size: calc(14px*var(--radio));
    font-weight: 400;
    line-height: 1.5;
    margin-top: calc(13px*var(--radio));
    width: calc(94px*var(--radio)*3 + 8px)
}

.slide3-container {
    display: flex;
    height: 100%;
    padding: calc(80px*var(--radio)) 0 calc(60px*var(--radio));
    width: 100%
}

.slide3-container .slide3-bg {
    background: url(/2024/slide3Bg.png) 50% no-repeat;
    background-size: cover;
    height: calc(721px*var(--radio));
    left: 50%;
    position: absolute;
    top: calc(200px*var(--radio));
    transform: translateX(-50%);
    width: calc(961px*var(--radio))
}

.slide3-container .slide3-grid {
    background: url(/2024/gridBg.png) 50% no-repeat;
    background-size: cover;
    height: 100vh;
    left: 0;
    opacity: 1;
    position: absolute;
    top: 0;
    width: 100vw
}

.slide3-container .sub-swiper {
    width: 100%
}

.slide3-container .swiper-button-next:after,.slide3-container .swiper-button-prev:after {
    content: none
}

.slide3-container .swiper-button-prev {
    background: url(/2024/left.png) no-repeat;
    background-size: calc(40px*var(--radio)) calc(40px*var(--radio));
    height: calc(40px*var(--radio));
    left: calc(88px*var(--radio));
    transition: transform .15s ease;
    width: calc(40px*var(--radio))
}

.slide3-container .swiper-button-prev:hover {
    transform: scale(1.1)
}

.slide3-container .swiper-button-next {
    background: url(/2024/right.png) no-repeat;
    background-size: calc(40px*var(--radio)) calc(40px*var(--radio));
    height: calc(40px*var(--radio));
    right: calc(110px*var(--radio));
    transition: transform .15s ease;
    width: calc(40px*var(--radio))
}

.slide3-container .swiper-button-next:hover {
    transform: scale(1.1)
}

.slide3-container .item-container {
    display: flex;
    flex-direction: column;
    height: 100%;
    position: relative;
    width: 100%
}

.slide3-container .top-part {
    align-items: center;
    display: flex;
    flex-direction: column;
    justify-content: center;
    margin-top: 6vh;
    width: 100%
}

.slide3-container .top-part .top-part-title {
    color: #fff;
    font-size: calc(44px*var(--radio));
    font-weight: 900;
    line-height: calc(44px*var(--radio));
    margin-top: calc(23px*var(--radio));
    text-transform: uppercase;
    width: calc(444px*var(--radio))
}

.slide3-container .top-part .top-part-desc {
    color: #fff;
    font-size: calc(24px*var(--radio));
    font-weight: 600;
    line-height: calc(34px*var(--radio));
    margin-top: calc(14px*var(--radio));
    opacity: .6;
    text-align: center;
    width: calc(443px*var(--radio))
}

.slide3-container .bottom-part {
    display: flex;
    justify-content: center;
    margin-left: 50%;
    position: absolute;
    top: 36%;
    transform: translate(-50%);
    width: 100%
}

.slide3-container .bottom-part .left-icon {
    filter: drop-shadow(0 21px 39px rgba(16,5,5,.44));
    height: calc(382px*var(--radio));
    margin-right: calc(-10px*var(--radio));
    width: calc(443px*var(--radio))
}

.slide3-container .bottom-part .right-icon {
    border-radius: calc(6px*var(--radio));
    box-shadow: 0 45px 21px -21px rgba(0,0,0,.34);
    height: calc(304px*var(--radio));
    margin-top: calc(18px*var(--radio));
    position: relative;
    width: calc(171px*var(--radio))
}

.slide3-container .bottom-part .right-icon img:first-child {
    filter: drop-shadow(0 21px 39px rgba(16,5,5,.44));
    height: calc(349px*var(--radio));
    width: calc(172px*var(--radio))
}

.slide3-container .bottom-part .right-icon img:nth-child(2) {
    bottom: calc(3px*var(--radio));
    filter: drop-shadow(0 13px 14px rgba(0,0,0,.25));
    height: calc(122px*var(--radio));
    position: absolute;
    right: calc(-43px*var(--radio));
    width: calc(157px*var(--radio))
}

.slide3-container .bottom-part .home-icon {
    position: relative
}

.slide3-container .bottom-part .home-icon img:first-child {
    height: calc(375px*var(--radio));
    width: calc(609px*var(--radio))
}

.slide3-container .bottom-part .home-icon img:nth-child(2) {
    bottom: calc(-75px*var(--radio));
    height: calc(335px*var(--radio));
    left: 50%;
    position: absolute;
    transform: translateX(-50%);
    width: calc(391px*var(--radio))
}

.slide3-container .bottom-part .preview-icon {
    height: calc(356px*var(--radio));
    margin-left: calc(-30px*var(--radio));
    width: calc(395px*var(--radio))
}

.slide4-container {
    display: flex;
    flex-direction: column;
    height: 100%;
    padding: calc(80px*var(--radio)) 0 calc(60px*var(--radio));
    width: 100%
}

.slide4-container .top-part {
    align-items: center;
    display: flex;
    flex-direction: column;
    margin-top: 6vh;
    text-align: center
}

.slide4-container .top-part .top-part-title {
    color: #fff;
    font-family: Segoe UI,PingFang SC,Microsoft YaHei,sans-serif;
    font-size: calc(44px*var(--radio));
    font-weight: 900;
    line-height: calc(44px*var(--radio));
    margin-top: calc(23px*var(--radio));
    text-transform: uppercase
}

.slide4-container .bottom-part {
    display: flex;
    justify-content: space-between;
    margin: 12vh 13.6vw 0
}

.slide4-container .bottom-part .douyin-live {
    position: relative;
    width: calc(296px*var(--radio))
}

.slide4-container .bottom-part .douyin-live img:first-child {
    height: calc(384px*var(--radio));
    width: calc(296px*var(--radio))
}

.slide4-container .bottom-part .douyin-live img:nth-child(2) {
    height: calc(150px*var(--radio));
    position: absolute;
    right: calc(75px*var(--radio));
    top: calc(52px*var(--radio));
    width: calc(150px*var(--radio))
}

.slide4-container .bottom-part .douyin-live img:nth-child(3) {
    height: calc(150px*var(--radio));
    position: absolute;
    right: calc(57px*var(--radio));
    top: calc(213px*var(--radio));
    width: calc(150px*var(--radio))
}

.slide4-container .bottom-part .douyin-live .live-step img {
    height: calc(35px*var(--radio))!important;
    width: calc(29px*var(--radio))!important
}

.slide4-container .bottom-part .download-live {
    position: relative;
    width: calc(296px*var(--radio))
}

.slide4-container .bottom-part .download-live img:first-child {
    height: calc(384px*var(--radio));
    width: calc(296px*var(--radio))
}

.slide4-container .bottom-part .download-live img:nth-child(2) {
    height: calc(150px*var(--radio));
    left: calc(-15px*var(--radio));
    position: absolute;
    top: calc(52px*var(--radio));
    width: calc(150px*var(--radio))
}

.slide4-container .bottom-part .download-live .live-step img {
    height: calc(35px*var(--radio))!important;
    width: calc(38px*var(--radio))!important
}

.slide4-container .bottom-part .applyAuth-live {
    position: relative;
    width: calc(296px*var(--radio))
}

.slide4-container .bottom-part .applyAuth-live img:first-child {
    height: calc(384px*var(--radio));
    width: calc(296px*var(--radio))
}

.slide4-container .bottom-part .applyAuth-live img:nth-child(2) {
    bottom: calc(15px*var(--radio));
    height: calc(150px*var(--radio));
    position: absolute;
    right: calc(70px*var(--radio));
    width: calc(150px*var(--radio))
}

.slide4-container .bottom-part .applyAuth-live .live-step img {
    height: calc(36px*var(--radio))!important;
    width: calc(38px*var(--radio))!important
}

.slide4-container .bottom-part .live-step {
    align-items: flex-end;
    display: flex;
    justify-content: center;
    margin-top: calc(-34px*var(--radio))
}

.slide4-container .bottom-part .live-step img {
    transform: scale(calc(var(--radio)*1))
}

.slide4-container .bottom-part .live-step span:last-child {
    color: #fff;
    font-family: Segoe UI,PingFang SC,Microsoft YaHei,sans-serif;
    font-size: calc(16px*var(--radio));
    font-style: normal;
    font-weight: 400;
    line-height: calc(16px*var(--radio))
}

.record {
    background: #171725;
    bottom: -90px;
    color: #fff;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    flex-direction: column;
    font-size: 12px;
    height: 90px;
    justify-content: center;
    position: absolute;
    text-align: center;
    width: 100%
}

.record-nav {
    margin-bottom: 4px;
    text-shadow: 1px 1px 2px rgba(0,0,0,1);
    transform: scale(1)
}

.record-nav a {
    border-left: 1px solid;
    padding: 0 calc(15px*var(--radio))
}

.record-nav a:last-child {
    border-right: 1px solid
}

.record-info {
    line-height: 1.5;
    text-shadow: 1px 1px 2px rgba(0,0,0,1);
    transform: scale(1);
	
}

.record-info>div>:not(img) {
    padding: 0 calc(10px*var(--radio))
}

.record-info>div>:not(:first-child):not(img):not(a) {
    border-left: 1px solid #fff
}

.record-info>div {
    align-items: center;
    display: flex;
    justify-content: center
}

.record a {
    color: #fff;
    text-decoration: none;

}

.slide5-container {
    align-items: center;
    display: flex;
    flex-direction: column;
    height: calc(100vh - 90px);
    justify-content: center;
    padding-top: calc(80px*var(--radio));
    position: relative;
    width: 100vw
}

.slide5-container .bg {
    animation-timing-function: linear;
    background: url(/2024/slide5Bg.jpg) 50% no-repeat;
    background-size: cover;
    opacity: .3;
    transform: scale(1.2);
    transition: all .5s linear
}

.slide5-container .bg,.slide5-container .bg-black {
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%
}

.slide5-container .bg-black {
    background: url(/2024/bg.png) no-repeat;
    background-size: cover;
    opacity: .5
}

.slide5-container .center-part {
    align-items: center;
    display: flex;
    flex-direction: column;
    z-index: 2
}

.slide5-container .center-part>div {
    text-align: center
}

.slide5-container .center-part-title {
    color: #fff;
    font-family: Segoe UI,PingFang SC,Microsoft YaHei,sans-serif;
    font-size: calc(44px*var(--radio));
    font-weight: 900;
    line-height: calc(44px*var(--radio));
    margin-top: calc(26px*var(--radio));
    text-transform: uppercase
}

.slide5-container .center-part-download {
    background: linear-gradient(102.51deg,#ff3d00 9.6%,rgba(255,0,153,.68) 95.98%);
    border-radius: calc(100px*var(--radio));
    box-shadow: 0 21px 51px -18px rgba(227,37,59,.68);
    color: #fff;
    cursor: pointer;
    font-size: calc(24px*var(--radio));
    font-weight: 500;
    height: calc(60px*var(--radio));
    line-height: calc(60px*var(--radio));
    margin-top: calc(56px*var(--radio));
    text-align: center;
    transition: transform .15s ease;
    width: calc(260px*var(--radio))
}

.slide5-container .center-part-download:hover {
    transform: scale(1.1)
}

.slide5-container .center-part-download:active {
    -webkit-animation: heartbeat 1.5s ease-in-out infinite both;
    animation: heartbeat 1.5s ease-in-out infinite both
}

.slide5-container .center-part-download__eol {
    align-items: center;
    color: hsla(0,0%,100%,.9);
    cursor: pointer;
    display: flex;
    font-size: 12px;
    justify-content: center;
    line-height: 12px;
    margin-top: 12px;
    width: calc(260px*var(--radio))
}

.slide5-container .center-part-download__eol img {
    margin-left: 4px
}

.slide5-container .center-part-download__eol:hover {
    opacity: .6
}

.slide5-container .center-part a {
    cursor: pointer;
    text-decoration: none
}

.slide5-container .center-part-tips {
    color: #fff;
    font-size: calc(14px*var(--radio));
    font-weight: 400;
    line-height: calc(21px*var(--radio));
    margin-top: calc(12px*var(--radio));
    opacity: .6;
    padding: calc(2px*var(--radio));
    text-align: center;
    width: calc(260px*var(--radio))
}

.slide5-container .center-part-tips:focus,.slide5-container .center-part-tips:hover {
    cursor: pointer;
    opacity: .9
}

.slide5-container>img {
    position: absolute
}

.slide5-container>img:nth-child(3),.slide5-container>img:nth-child(4) {
    animation-timing-function: linear;
    height: calc(554px*var(--radio));
    width: calc(734px*var(--radio))
}

.slide5-container>img:nth-child(5) {
    animation-timing-function: linear;
    height: calc(651px*var(--radio));
    width: calc(862px*var(--radio))
}

.slide5-container>img:nth-child(6) {
    animation-timing-function: linear;
    height: calc(1107px*var(--radio));
    width: calc(1130px*var(--radio))
}

* {
    box-sizing: border-box
}

.container {
    align-items: center;
    background: url(/2024/bg.png) no-repeat;
    display: flex;
    flex-direction: column;
    height: 100vh;
    justify-content: center;
    min-height: 100vh;
    min-width: 1024px;
    padding: 0;
    z-index: 3
}

.container .main-swiper {
    height: 100%;
    width: 100%
}

.container .main-swiper .swiper-slide {
    color: #fff
}

.container .main-swiper .swiper-pagination-bullet {
    border: 2px solid #fff;
    height: 8px;
    margin: 10px 0;
    opacity: .6;
    width: 8px
}

.container .main-swiper .swiper-pagination-bullet-active {
    background: #fff;
    opacity: 1
}

.no_showing {
    display: none
}

.bg-line {
    transition: all 1.5s linear
}

.bg-round1-slide1 {
    animation-duration: 18s;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
    border: .890928px solid #4897ff;
    border-radius: 45%;
    display: block;
    height: 105vh;
    opacity: .1;
    position: fixed;
    right: calc(75px*var(--radio));
    top: calc(-88px*var(--radio));
    transform: rotate(45deg);
    width: 40vw
}

.bg-round2-slide1 {
    animation-duration: 24s;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
    border: .890928px solid #4897ff;
    border-radius: 60%;
    height: 98vh;
    right: calc(120px*var(--radio));
    top: calc(0px*var(--radio));
    transform: rotate(60deg);
    width: 36vw
}

.bg-round1-slide2,.bg-round2-slide1 {
    display: block;
    opacity: .2;
    position: fixed
}

.bg-round1-slide2 {
    animation-duration: 18s;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
    border: .890928px solid #449bff;
    border-radius: 60%;
    height: calc(815px*var(--radio));
    transform: rotate(45deg);
    width: calc(531px*var(--radio))
}

.bg-round1-slide2,.bg-round2-slide2 {
    bottom: 0;
    left: calc(180px*var(--radio));
    margin: auto;
    right: 0;
    top: 0
}

.bg-round2-slide2 {
    animation-duration: 24s;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
    border: .890928px solid #77495b;
    border-radius: 55%;
    display: block;
    height: calc(826px*var(--radio));
    opacity: .5;
    position: fixed;
    transform: rotate(40deg);
    width: calc(541px*var(--radio))
}

.bg-round1-slide3 {
    animation-duration: 18s;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
    border: 1px solid #449bff;
    border-radius: 60%;
    display: block;
    height: calc(1437px*var(--radio));
    left: calc(50% - 470px*var(--radio)*.5);
    opacity: .1;
    position: fixed;
    top: calc(-150px*var(--radio));
    transform: rotate(55deg);
    width: calc(937px*var(--radio))
}

.bg-round2-slide3 {
    animation-duration: 24s;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
    border: 1px solid #77495b;
    border-radius: 55%;
    height: calc(1457px*var(--radio));
    top: calc(-170px*var(--radio));
    transform: rotate(50deg);
    width: calc(955px*var(--radio))
}

.bg-round1-slide4,.bg-round2-slide3 {
    display: block;
    left: calc(48% - 480px*var(--radio)*.5);
    opacity: .2;
    position: fixed
}

.bg-round1-slide4 {
    animation-duration: 18s;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
    border: 1px solid #449bff;
    border-radius: 60%;
    height: calc(1474px*var(--radio));
    top: 40%;
    transform: rotate(75deg);
    width: calc(962px*var(--radio))
}

.bg-round2-slide4 {
    animation-duration: 24s;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
    border: 1px solid #77495b;
    border-radius: 55%;
    display: block;
    height: calc(1495px*var(--radio));
    left: calc(48% - 480px*var(--radio)*.5);
    opacity: .2;
    position: fixed;
    top: 40%;
    transform: rotate(70deg);
    width: calc(980px*var(--radio))
}

.rc-dialog-content {
    background: #fff;
    border-radius: 12px
}

.rc-dialog-content .rc-dialog-close {
    font-size: calc(23px*var(--radio));
    font-weight: 400;
    height: calc(24px*var(--radio));
    opacity: .5;
    right: calc(13px*var(--radio));
    width: calc(24px*var(--radio))
}

.rc-dialog-content .rc-dialog-close:hover {
    opacity: 1
}

.rc-dialog-content .rc-dialog-header {
    background-color: hsla(0,0%,85%,.2);
    color: #000
}

.rc-dialog-content .rc-dialog-header .rc-dialog-title {
    font-size: calc(16px*var(--radio));
    font-style: normal;
    font-weight: 400;
    line-height: normal
}

.rc-dialog-content .rc-dialog-body {
    height: calc(350px*var(--radio));
    width: 100%
}

.rc-dialog-content .rc-dialog-body .model-download-content {
    align-items: center;
    display: flex;
    height: 100%;
    justify-content: space-around
}

.rc-dialog-content .rc-dialog-body .model-download-content-item {
    align-items: center;
    display: flex;
    flex-direction: column
}

.rc-dialog-content .rc-dialog-body .model-download-content img {
    flex-shrink: 0;
    height: calc(100px*var(--radio));
    width: calc(100px*var(--radio))
}

.rc-dialog-content .rc-dialog-body .model-download-content .item-text {
    color: #000;
    font-size: calc(14px*var(--radio));
    font-style: normal;
    font-weight: 500;
    letter-spacing: -.42px;
    line-height: calc(14px*var(--radio));
    margin-top: calc(10px*var(--radio))
}

.rc-dialog-content .rc-dialog-body .model-download-content .item-btn {
    background: linear-gradient(127deg,#ff3d00,rgba(255,0,153,.68));
    border-radius: calc(100px*var(--radio));
    box-shadow: 0 21px 51px -18px rgba(227,37,59,.68);
    color: #fff;
    cursor: pointer;
    font-size: calc(14px*var(--radio));
    font-weight: 500;
    height: calc(40px*var(--radio));
    line-height: calc(40px*var(--radio));
    margin-top: calc(20px*var(--radio));
    text-align: center;
    transition: transform .15s ease;
    width: calc(140px*var(--radio))
}

.rc-dialog-content .rc-dialog-body .model-download-content .item-btn:hover {
    transform: scale(1.1)
}

.rc-dialog-content .rc-dialog-body .model-download-content .item-btn:active {
    -webkit-animation: heartbeat 1.5s ease-in-out infinite both;
    animation: heartbeat 1.5s ease-in-out infinite both
}

.eden {
    align-items: center;
    display: flex;
    flex-direction: column;
    font-size: calc(10px + 2vmin);
    justify-content: center;
    margin: 1rem auto 0
}

body {
    min-width: 1040px;
    position: relative
}

article,aside,blockquote,body,button,dd,details,div,dl,dt,fieldset,figcaption,figure,footer,form,h1,h2,h3,h4,h5,h6,header,hgroup,hr,input,legend,li,menu,nav,ol,p,pre,section,td,textarea,th,ul {
    margin: 0;
    padding: 0;
    vertical-align: baseline
}

.center {
    align-items: center;
    display: flex;
    justify-content: center
}