﻿* {
    margin: 0;
    padding: 0
}

body {
    font-family: '微软雅黑','黑体',serif,'宋体';
    color: #4d6287;
    font-size: 12px;
    background: #191c2c;
    overflow: hidden
}

dd, div, dt, li, span {
    font-family: '微软雅黑'
}

li {
    list-style-type: none
}

a, a:active {
    text-decoration: none;
    font-family: '微软雅黑';
    outline: 0
}

img {
    border: none
}

* html, * html body {
    background-image: url(style/images/about:blank);
    background-attachment: fixed
}

* html .btnlistpar {
    position: absolute;
    bottom: auto;
    top: expression(eval(document.documentElement.scrollTop))
}

body, html {
    _height: 100%
}

.mar-t-0 {
    margin-top: 0 !important
}

.btn-down, .btn-up {
    position: fixed;
    top: 40px;
    left: 50%;
    width: 69px;
    height: 41px;
    background: url(style/images/com_0.png) no-repeat -250px -450px;
    margin-left: -34px;
    display: none;
    z-index: 1
}

.btn-down {
    background: url(style/images/com_0.png) no-repeat -150px -450px;
    top: auto;
    bottom: 40px
}

.btnlistpar {
    padding: 20px 0 !important;
    margin: 0;
    margin-top: -131px;
    top: 50%;
    right: 40px;
    position: fixed;
    _position: absolute;
    _margin-top: 200px;
    line-height: 18px;
    *width: 76px;
    clear: both;
    border-right: 1px dashed #4c4b57
}

    .btnlistpar a {
        right: -14px;
        display: block;
        margin-top: 4px;
        padding-right: 36px;
        text-align: right;
        cursor: pointer;
        overflow: hidden;
        height: 28px;
        line-height: 30px;
        font-size: 12px;
        color: #4c4b57;
        position: relative;
        clear: both;
        *float: right !important;
        *width: 48px
    }

        .btnlistpar .sel, .btnlistpar a:hover {
            color: #aae4ff;
            background: url(style/images/com_0.png) no-repeat 56px -450px
        }

    .btnlistpar #bdshare {
        background: 0 0;
        text-align: right !important
    }

        .btnlistpar #bdshare em {
            position: absolute;
            top: 0;
            right: 0;
            width: 100%;
            height: 100%;
            background: none !important;
            _width: 74px
        }

.btnlistparPhone {
    margin-top: -215px;
    right: 50px
}

    .btnlistparPhone a {
        height: 36px;
        line-height: 36px;
        padding-right: 50px;
        font-size: 24px;
        margin-top: 20px
    }

        .btnlistparPhone a:not(.share):before {
            content: '';
            width: 30px;
            height: 30px;
            background: #c1c7d0;
            border-radius: 18px;
            position: absolute;
            top: 3px;
            right: 3px
        }

        .btnlistparPhone a.sel:not(.share):before {
            width: 36px;
            height: 36px;
            top: 0;
            right: 0
        }

        .btnlistparPhone a.sel:before {
            background-color: #2365d3
        }

.cont {
    overflow: hidden;
    position: relative
}

.btn {
    width: 230px;
    height: 70px;
    line-height: 68px;
    background: url(style/images/com_0.png) no-repeat -370px 0;
    text-align: center;
    font-size: 24px;
    letter-spacing: 1px;
    color: #fff;
    z-index: 1;
    margin: 240px 0 0 -115px
}

    .btn:hover {
        color: #fff;
        background: url(style/images/com_0.png) no-repeat -370px -70px
    }

.cont_0 .btn {
    opacity: 0;
    margin-top: -100px
}

.cont_2 .btn {
    opacity: 0;
    margin-top: 600px
}

#page0 {
    background: #0d1021
}

    #page0 .img0, #page0 .img1, #page0 .img2, #page0 .img3, #page0 .img4, #page0 .img5, #page0 .img6, #page0 .img7, #page0 .imgGroug, #page1 .img0, #page1 .img1, #page1 .img2, #page1 .img3, #page1 .img4, #page1 .img5, #page1 .img6,
    #page1 .imgGroug,
    #page2 .imgGroug,
    #page3 .img0, #page3 .img1,
    #page4 .imgDel, .btn, .makenews,
    .title0, .title1 {
        position: absolute;
        top: 50%;
        left: 50%
    }

.makenews {
    width: 320px;
    line-height: 30px;
    text-align: center;
    cursor: pointer;
    z-index: 1;
    color: #575661;
    margin: 303px 0 0 -160px
}

    .makenews span {
        color: #7f8087
    }

.logo {
    height: 26px;
    line-height: 31px;
    position: absolute;
    top: 35px;
    left: 40px;
    padding: 0 10px 0 32px;
    z-index: 1;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    -o-border-radius: 4px;
    border-radius: 4px;
    background: url(style/images/com_0.png) no-repeat -573px -447px;
    color: #1ab1ff;
    border: 1px solid #1ab1ff
}

    .logo:hover {
        background: url(style/images/com_0.png) no-repeat -573px -497px;
        color: #14e1ff;
        border: 1px solid #14e1ff
    }

.keymouse {
    background: url(style/images/com_0.png) no-repeat -50px -450px;
    width: 95px;
    height: 33px;
    position: absolute;
    bottom: 20px;
    right: 20px;
    line-height: 0
}

    .keymouse img {
        -webkit-animation: keymouse 6s linear infinite;
        -moz-animation: keymouse 6s linear infinite;
        -o-animation: keymouse 6s linear infinite;
        animation: keymouse 6s linear infinite;
        opacity: 0
    }

@-webkit-keyframes keymouse {
    30% {
        opacity: 0
    }

    40% {
        opacity: 1
    }

    50% {
        opacity: 0
    }

    60% {
        opacity: 1
    }

    70% {
        opacity: 0
    }
}

@-moz-keyframes keymouse {
    30% {
        opacity: 0
    }

    40% {
        opacity: 1
    }

    50% {
        opacity: 0
    }

    60% {
        opacity: 1
    }

    70% {
        opacity: 0
    }
}

@-o-keyframes keymouse {
    30% {
        opacity: 0
    }

    40% {
        opacity: 1
    }

    50% {
        opacity: 0
    }

    60% {
        opacity: 1
    }

    70% {
        opacity: 0
    }
}

@keyframes keymouse {
    30% {
        opacity: 0
    }

    40% {
        opacity: 1
    }

    50% {
        opacity: 0
    }

    60% {
        opacity: 1
    }

    70% {
        opacity: 0
    }
}

#page0 .img0 {
    width: 600px;
    height: 274px;
    line-height: 0;
    margin: -470px 0 0 -300px;
    background: url(style/images/com_0.png) no-repeat 0 -150px;
    z-index: 1;
    transform-origin: 50% bottom;
    -webkit-transform-origin: 50% bottom;
    -moz-transform-origin: 50% bottom;
    -o-transform-origin: 50% bottom
}

#page0 .imgGroug {
    z-index: 0;
    width: 1394px;
    height: 1048px;
    margin: -546px 0 0 -715px
}

#page0 .img1, #page0 .img2 {
    line-height: 0;
    width: 100%;
    height: 100%;
    margin: 100px 0 0 -715px
}

#page0 .img2 {
    z-index: 0;
    -webkit-animation: star 2.5s linear infinite;
    -moz-animation: star 2.5s linear infinite;
    -o-animation: star 2.5s linear infinite;
    animation: star 2.5s linear infinite
}

#page0 .img3, #page0 .img4 {
    z-index: 1;
    width: 134px;
    height: 126px;
    background: url(style/images/com_0.png) no-repeat;
    margin: 134px 0 0 -378px
}

#page0 .img4 {
    background: url(style/images/com_0.png) no-repeat -150px 0;
    margin: 35px 0 0 253px
}

#page0 .img5 {
    z-index: 1;
    width: 64px;
    height: 60px;
    background: url(style/images/com_0.png) no-repeat -300px 0;
    margin: -65px 0 0 -249px
}

#page0 .img6, #page0 .img7 {
    z-index: 1;
    width: 570px;
    height: 450px;
    background: url(style/images/com_0_star.png) no-repeat;
    margin: -158px 0 0 -290px;
    -webkit-animation: star_dian0 4s linear infinite;
    -moz-animation: star_dian0 4s linear infinite;
    -o-animation: star_dian0 4s linear infinite;
    animation: star_dian0 4s linear infinite
}

#page0 .img7 {
    background: url(style/images/com_0_star.png) no-repeat 0 -450px;
    -webkit-animation: star_dian1 4s linear infinite;
    -moz-animation: star_dian1 4s linear infinite;
    -o-animation: star_dian1 4s linear infinite;
    animation: star_dian1 4s linear infinite
}

#page0 .btn, #page0 .img0, #page0 .imgGroug, #page0 .makenews {
    transition: margin .2s ease,transform .2s ease;
    -webkit-transition: margin .2s ease,-webkit-transform .2s ease;
    -moz-transition: margin .2s ease,-moz-transform .2s ease;
    -o-transition: margin .2s ease,-o-transform .2s ease
}

#page0 .btn {
    margin-top: 290px
}

#page0 .makenews {
    margin-top: 370px
}

#page0.resp0 .img0 {
    transform: scale(0.7);
    -webkit-transform: scale(0.7);
    -moz-transform: scale(0.7);
    -o-transform: scale(0.7);
    margin-top: -400px
}

#page0.resp0 .imgGroug {
    transform: scale(0.6);
    -webkit-transform: scale(0.6);
    -moz-transform: scale(0.6);
    -o-transform: scale(0.6)
}

#page0.resp0 .btn {
    margin-top: 196px
}

#page0.resp0 .makenews {
    margin-top: 278px
}

#page0.resp1 .img0, #page0.resp1 .imgGroug {
    transform: scale(0.8);
    -webkit-transform: scale(0.8);
    -moz-transform: scale(0.8);
    -o-transform: scale(0.8)
}

#page0.resp1 .btn {
    margin-top: 245px
}

#page0.resp1 .makenews {
    margin-top: 325px
}

#page0.cont_0 .btn, #page0.cont_2 .btn {
    opacity: 1;
    margin-top: 290px
}

#page0.cont_0.resp0 .btn, #page0.cont_2.resp0 .btn {
    margin-top: 196px
}

#page0.cont_0.resp1 .btn, #page0.cont_2.resp1 .btn {
    margin-top: 245px
}

@-webkit-keyframes star {
    0% {
        opacity: 0
    }

    50% {
        opacity: 1
    }

    100% {
        opacity: 0
    }
}

@-moz-keyframes star {
    0% {
        opacity: 0
    }

    50% {
        opacity: 1
    }

    100% {
        opacity: 0
    }
}

@-o-keyframes star {
    0% {
        opacity: 0
    }

    50% {
        opacity: 1
    }

    100% {
        opacity: 0
    }
}

@keyframes star {
    0% {
        opacity: 0
    }

    50% {
        opacity: 1
    }

    100% {
        opacity: 0
    }
}

@-webkit-keyframes star_dian0 {
    0%,24% {
        opacity: 0
    }

    25%,75% {
        opacity: 1
    }

    100%,76% {
        opacity: 0
    }
}

@-moz-keyframes star_dian0 {
    0%,24% {
        opacity: 0
    }

    25%,75% {
        opacity: 1
    }

    100%,76% {
        opacity: 0
    }
}

@-o-keyframes star_dian0 {
    0%,24% {
        opacity: 0
    }

    25%,75% {
        opacity: 1
    }

    100%,76% {
        opacity: 0
    }
}

@keyframes star_dian0 {
    0%,24% {
        opacity: 0
    }

    25%,75% {
        opacity: 1
    }

    100%,76% {
        opacity: 0
    }
}

@-webkit-keyframes star_dian1 {
    0%,39% {
        opacity: 0
    }

    40%,90% {
        opacity: 1
    }

    100%,91% {
        opacity: 0
    }
}

@-moz-keyframes star_dian1 {
    0%,39% {
        opacity: 0
    }

    40%,90% {
        opacity: 1
    }

    100%,91% {
        opacity: 0
    }
}

@-o-keyframes star_dian1 {
    0%,39% {
        opacity: 0
    }

    40%,90% {
        opacity: 1
    }

    100%,91% {
        opacity: 0
    }
}

@keyframes star_dian1 {
    0%,39% {
        opacity: 0
    }

    40%,90% {
        opacity: 1
    }

    100%,91% {
        opacity: 0
    }
}

#page1 .img0, #page1 .img1, #page1 .img2, #page1 .img3,
#page2 .imgGroug, #page3 .img0, #page3 .img1, .btn, .title0, .title1 {
    transition: margin .5s ease,opacity .5s ease;
    -webkit-transition: margin .5s ease,opacity .5s ease;
    -moz-transition: margin .5s ease,opacity .5s ease;
    -o-transition: margin .5s ease,opacity .5s ease
}

@media screen and (max-width: 1400px)and (min-width: 768px) {
    .title0, .title1 {
        left: 0;
        width: 703px;
        text-align: center;
        color: #2ec0f6;
        font-size: 40px;
        height: 70px;
        line-height: 70px;
        margin: -300px 0 0 17%;
        z-index: 1
    }

    .title1 {
        color: #fff;
        font-size: 20px;
        height: 30px;
        line-height: 30px;
        margin: -230px 0 0 0
    }

    #page1 .img3 {
        margin-top: -370px;
        margin-bottom: -315px;
        left: 0;
        margin-left: 17%;
        z-index: 0
    }

    .tyg-div-denglv {
        z-index: 1000;
        float: right;
        position: absolute;
        right: 3%;
        top: 0%;
    }

    .cont > .login_body > .login_form {
        width: 300px;
        /* background: #fff; */
    }
}

@media screen and (max-width: 768px) {
    .title0, .title1 {
        left: 0;
        width: 703px;
        text-align: left;
        color: #2ec0f6;
        font-size: 40px;
        height: 70px;
        line-height: 70px;
        margin: -300px 0 0 17%;
        z-index: 1
    }

    .title1 {
        color: #fff;
        font-size: 20px;
        height: 30px;
        line-height: 30px;
        margin: -230px 0 0 0
    }

    #page1 .img3 {
        margin-top: -370px;
        margin-bottom: -315px;
        left: 0;
        margin-left: 17%;
        z-index: 0
    }

    .tyg-div-denglv {
        z-index: 1000;
        float: right;
        position: absolute;
        right: 3%;
        top: 0%;
    }

    .cont > .login_body > .login_form {
        width: 300px;
        /* background: #fff; */
    }
}

@media screen and (min-width: 1400px) {
    .title0, .title1 {
        left: 0;
        width: 703px;
        text-align: center;
        color: #2ec0f6;
        font-size: 40px;
        height: 70px;
        line-height: 70px;
        margin: -360px 0 0 22%;
        z-index: 1
    }

    .title1 {
        color: #fff;
        font-size: 20px;
        height: 30px;
        line-height: 30px;
        margin: -260px 0 0 0
    }

    #page1 .img3 {
        margin-top: -330px;
        margin-bottom: -315px;
        left: 0;
        margin-left: 22%;
        z-index: 0
    }

    .tyg-div-denglv {
        z-index: 1000;
        float: right;
        position: absolute;
        right: 13%;
        top: 14%;
    }

    .cont > .login_body > .login_form {
        width: 350px;
        /* background: #fff; */
    }
}

input:-webkit-autofill {
    -webkit-box-shadow: 0 0 0px 1000px #2E3748 inset;
    -webkit-text-fill-color: #fff;
    outline: none;
    border: none;
    border-bottom: 2px solid #085aa0;
    color: #fff !important;
}

.cont_0 .title0 {
    opacity: 0;
    margin: -620px 0 0 0
}

.cont_2 .title0 {
    opacity: 0;
    margin: -120px 0 0 0
}

.cont_0 .title1 {
    opacity: 0;
    margin: -450px 0 0 0
}

.cont_2 .title1 {
    opacity: 0;
    margin: 50px 0 0
}

#page1 .img0, #page1 .img1, #page1 .img2, #page1 .imgGroug {
    z-index: 1
}

#page1 .imgGroug {
    width: 170px;
    height: 170px;
    left: 0;
    margin-top: -126px;
    margin-bottom: -85px;
    margin-left: 35%;
}

    #page1 .imgGroug ul {
        position: relative;
        width: 170px;
        height: 170px
    }

#page1 .img0, #page1 .img1, #page1 .img2 {
    margin: -85px 0 0 -85px;
    width: 100%;
    height: 100%
}

#page1.cont_1 .img0 {
    -webkit-transform: rotateY(240deg) translateZ(150px) scale(.925);
    -moz-transform: rotateY(240deg) translateZ(150px) scale(.925);
    -o-transform: rotateY(240deg) translateZ(150px) scale(.925);
    transform: rotateY(240deg) translateZ(150px) scale(.925);
    -webkit-animation: rotate_0 10s linear .5s infinite;
    -moz-animation: rotate_0 10s linear .5s infinite;
    -o-animation: rotate_0 10s linear .5s infinite;
    animation: rotate_0 10s linear .5s infinite
}

#page1.cont_1 .img1 {
    -webkit-transform: rotateY(0deg) translateZ(150px);
    -moz-transform: rotateY(0deg) translateZ(150px);
    -o-transform: rotateY(0deg) translateZ(150px);
    transform: rotateY(0deg) translateZ(150px);
    -webkit-animation: rotate_1 10s linear .5s infinite;
    -moz-animation: rotate_1 10s linear .5s infinite;
    -o-animation: rotate_1 10s linear .5s infinite;
    animation: rotate_1 10s linear .5s infinite
}

#page1.cont_1 .img2 {
    -webkit-transform: rotateY(120deg) translateZ(150px) scale(.925);
    -moz-transform: rotateY(120deg) translateZ(150px) scale(.925);
    -o-transform: rotateY(120deg) translateZ(150px) scale(.925);
    transform: rotateY(120deg) translateZ(150px) scale(.925);
    -webkit-animation: rotate_2 10s linear .5s infinite;
    -moz-animation: rotate_2 10s linear .5s infinite;
    -o-animation: rotate_2 10s linear .5s infinite;
    animation: rotate_2 10s linear .5s infinite
}

@-webkit-keyframes rotate_0 {
    0% {
        -webkit-transform: rotateY(240deg) translateZ(150px) scale(.85);
        z-index: 1
    }

    12.4% {
        z-index: 1
    }

    12.5% {
        -webkit-transform: rotateY(285deg) translateZ(150px) scale(.9);
        z-index: 2
    }

    37.5% {
        -webkit-transform: rotateY(375deg) translateZ(150px) scale(1);
        z-index: 2
    }

    62.5% {
        -webkit-transform: rotateY(465deg) translateZ(150px) scale(.9);
        z-index: 2
    }

    62.6% {
        z-index: 1
    }

    87.5% {
        -webkit-transform: rotateY(555deg) translateZ(150px) scale(.8)
    }

    100% {
        -webkit-transform: rotateY(600deg) translateZ(150px) scale(.85)
    }
}

@-moz-keyframes rotate_0 {
    0% {
        -moz-transform: rotateY(240deg) translateZ(150px) scale(.85);
        z-index: 1
    }

    12.4% {
        z-index: 1
    }

    12.5% {
        -moz-transform: rotateY(285deg) translateZ(150px) scale(.9);
        z-index: 2
    }

    37.5% {
        -moz-transform: rotateY(375deg) translateZ(150px) scale(1);
        z-index: 2
    }

    62.5% {
        -moz-transform: rotateY(465deg) translateZ(150px) scale(.9);
        z-index: 2
    }

    62.6% {
        z-index: 1
    }

    87.5% {
        -moz-transform: rotateY(555deg) translateZ(150px) scale(.8)
    }

    100% {
        -moz-transform: rotateY(600deg) translateZ(150px) scale(.85)
    }
}

@-o-keyframes rotate_0 {
    0% {
        -o-transform: rotateY(240deg) translateZ(150px) scale(.85);
        z-index: 1
    }

    12.4% {
        z-index: 1
    }

    12.5% {
        -o-transform: rotateY(285deg) translateZ(150px) scale(.9);
        z-index: 2
    }

    37.5% {
        -o-transform: rotateY(375deg) translateZ(150px) scale(1);
        z-index: 2
    }

    62.5% {
        -o-transform: rotateY(465deg) translateZ(150px) scale(.9);
        z-index: 2
    }

    62.6% {
        z-index: 1
    }

    87.5% {
        -o-transform: rotateY(555deg) translateZ(150px) scale(.8)
    }

    100% {
        -o-transform: rotateY(600deg) translateZ(150px) scale(.85)
    }
}

@keyframes rotate_0 {
    0% {
        transform: rotateY(240deg) translateZ(150px) scale(.85);
        z-index: 1
    }

    12.4% {
        z-index: 1
    }

    12.5% {
        transform: rotateY(285deg) translateZ(150px) scale(.9);
        z-index: 2
    }

    37.5% {
        transform: rotateY(375deg) translateZ(150px) scale(1);
        z-index: 2
    }

    62.5% {
        transform: rotateY(465deg) translateZ(150px) scale(.9);
        z-index: 2
    }

    62.6% {
        z-index: 1
    }

    87.5% {
        transform: rotateY(555deg) translateZ(150px) scale(.8)
    }

    100% {
        transform: rotateY(600deg) translateZ(150px) scale(.85)
    }
}

@-webkit-keyframes rotate_1 {
    0% {
        -webkit-transform: rotateY(0deg) translateZ(150px) scale(1);
        z-index: 2
    }

    25% {
        -webkit-transform: rotateY(90deg) translateZ(150px) scale(.9);
        z-index: 2
    }

    25.1% {
        -webkit-transform: rotateY(91deg) translateZ(150px) scale(.9);
        z-index: 1
    }

    50% {
        -webkit-transform: rotateY(180deg) translateZ(150px) scale(.8)
    }

    74.9% {
        -webkit-transform: rotateY(269deg) translateZ(150px) scale(.9);
        z-index: 1
    }

    75% {
        -webkit-transform: rotateY(270deg) translateZ(150px) scale(.9);
        z-index: 2
    }

    100% {
        -webkit-transform: rotateY(360deg) translateZ(150px) scale(1);
        z-index: 2
    }
}

@-moz-keyframes rotate_1 {
    0% {
        -moz-transform: rotateY(0deg) translateZ(150px) scale(1);
        z-index: 2
    }

    25% {
        -moz-transform: rotateY(90deg) translateZ(150px) scale(.9);
        z-index: 2
    }

    25.1% {
        -moz-transform: rotateY(91deg) translateZ(150px) scale(.9);
        z-index: 1
    }

    50% {
        -moz-transform: rotateY(180deg) translateZ(150px) scale(.8)
    }

    74.9% {
        -moz-transform: rotateY(269deg) translateZ(150px) scale(.9);
        z-index: 1
    }

    75% {
        -moz-transform: rotateY(270deg) translateZ(150px) scale(.9);
        z-index: 2
    }

    100% {
        -moz-transform: rotateY(360deg) translateZ(150px) scale(1);
        z-index: 2
    }
}

@-o-keyframes rotate_1 {
    0% {
        -o-transform: rotateY(0deg) translateZ(150px) scale(1);
        z-index: 2
    }

    25% {
        -o-transform: rotateY(90deg) translateZ(150px) scale(.9);
        z-index: 2
    }

    25.1% {
        -o-transform: rotateY(91deg) translateZ(150px) scale(.9);
        z-index: 1
    }

    50% {
        -o-transform: rotateY(180deg) translateZ(150px) scale(.8)
    }

    74.9% {
        -o-transform: rotateY(269deg) translateZ(150px) scale(.9);
        z-index: 1
    }

    75% {
        -o-transform: rotateY(270deg) translateZ(150px) scale(.9);
        z-index: 2
    }

    100% {
        -o-transform: rotateY(360deg) translateZ(150px) scale(1);
        z-index: 2
    }
}

@keyframes rotate_1 {
    0% {
        transform: rotateY(0deg) translateZ(150px) scale(1);
        z-index: 2
    }

    25% {
        transform: rotateY(90deg) translateZ(150px) scale(.9);
        z-index: 2
    }

    25.1% {
        transform: rotateY(91deg) translateZ(150px) scale(.9);
        z-index: 1
    }

    50% {
        transform: rotateY(180deg) translateZ(150px) scale(.8)
    }

    74.9% {
        transform: rotateY(269deg) translateZ(150px) scale(.9);
        z-index: 1
    }

    75% {
        transform: rotateY(270deg) translateZ(150px) scale(.9);
        z-index: 2
    }

    100% {
        transform: rotateY(360deg) translateZ(150px) scale(1);
        z-index: 2
    }
}

@-webkit-keyframes rotate_2 {
    0% {
        -webkit-transform: rotateY(120deg) translateZ(150px) scale(.85);
        z-index: 1
    }

    12.5% {
        -webkit-transform: rotateY(165deg) translateZ(150px) scale(.8)
    }

    37.4% {
        z-index: 1
    }

    37.5% {
        -webkit-transform: rotateY(255deg) translateZ(150px) scale(.9);
        z-index: 2
    }

    62.5% {
        -webkit-transform: rotateY(345deg) translateZ(150px) scale(1);
        z-index: 2
    }

    87.5% {
        -webkit-transform: rotateY(435deg) translateZ(150px) scale(.9);
        z-index: 2
    }

    100% {
        -webkit-transform: rotateY(480deg) translateZ(150px) scale(.85);
        z-index: 1
    }
}

@-moz-keyframes rotate_2 {
    0% {
        -moz-transform: rotateY(120deg) translateZ(150px) scale(.85);
        z-index: 1
    }

    12.5% {
        -moz-transform: rotateY(165deg) translateZ(150px) scale(.8)
    }

    37.4% {
        z-index: 1
    }

    37.5% {
        -moz-transform: rotateY(255deg) translateZ(150px) scale(.9);
        z-index: 2
    }

    62.5% {
        -moz-transform: rotateY(345deg) translateZ(150px) scale(1);
        z-index: 2
    }

    87.5% {
        -moz-transform: rotateY(435deg) translateZ(150px) scale(.9);
        z-index: 2
    }

    100% {
        -moz-transform: rotateY(480deg) translateZ(150px) scale(.85);
        z-index: 1
    }
}

@-o-keyframes rotate_2 {
    0% {
        -o-transform: rotateY(120deg) translateZ(150px) scale(.85);
        z-index: 1
    }

    12.5% {
        -o-transform: rotateY(165deg) translateZ(150px) scale(.8)
    }

    37.4% {
        z-index: 1
    }

    37.5% {
        -o-transform: rotateY(255deg) translateZ(150px) scale(.9);
        z-index: 2
    }

    62.5% {
        -o-transform: rotateY(345deg) translateZ(150px) scale(1);
        z-index: 2
    }

    87.5% {
        -o-transform: rotateY(435deg) translateZ(150px) scale(.9);
        z-index: 2
    }

    100% {
        -o-transform: rotateY(480deg) translateZ(150px) scale(.85);
        z-index: 1
    }
}

@keyframes rotate_2 {
    0% {
        transform: rotateY(120deg) translateZ(150px) scale(.85);
        z-index: 1
    }

    12.5% {
        transform: rotateY(165deg) translateZ(150px) scale(.8)
    }

    37.4% {
        z-index: 1
    }

    37.5% {
        transform: rotateY(255deg) translateZ(150px) scale(.9);
        z-index: 2
    }

    62.5% {
        transform: rotateY(345deg) translateZ(150px) scale(1);
        z-index: 2
    }

    87.5% {
        transform: rotateY(435deg) translateZ(150px) scale(.9);
        z-index: 2
    }

    100% {
        transform: rotateY(480deg) translateZ(150px) scale(.85);
        z-index: 1
    }
}

#page1.cont_0 .img0 {
    margin: -316px 0 0 -258px;
    opacity: 0
}

#page1.cont_2 .img0 {
    margin: 284px 0 0 -258px;
    opacity: 0
}

#page1.cont_0 .img1 {
    margin: -413px 0 0 -85px;
    opacity: 0
}

#page1.cont_2 .img1 {
    margin: 330px 0 0 -85px;
    opacity: 0
}

#page1.cont_0 .img2 {
    margin: -316px 0 0 91px;
    opacity: 0
}

#page1.cont_2 .img2 {
    margin: 284px 0 0 91px;
    opacity: 0
}

/*rgin: -410px 0 0 -351px;*/

#page2 .imgGroug {
    z-index: 0;
    width: 790px;
    height: 722px;
    margin: -361px 0 0 -395px
}

#page2 .img1 {
    position: absolute;
    top: 0;
    left: 0;
    -webkit-animation: star 2s linear infinite;
    -moz-animation: star 2s linear infinite;
    -o-animation: star 2s linear infinite;
    animation: star 2s linear infinite
}

#page2.cont_0 .imgGroug {
    opacity: 0;
    margin: -600px 0 0 -395px
}

#page2.cont_2 .imgGroug {
    opacity: 0;
    margin: 100px 0 0 -395px
}

#page3 .img0 {
    margin: -4px 0 0 -230px;
    z-index: 1;
    opacity: 0;
    transform-origin: 50% bottom;
    -webkit-transform-origin: 50% bottom;
    -moz-transform-origin: 50% bottom;
    -o-transform-origin: 50% bottom
}

#page3.cont_1 .img0 {
    -webkit-animation: scale_y .3s linear .5s;
    -moz-animation: scale_y .3s linear .5s;
    -o-animation: scale_y .3s linear .5s;
    animation: scale_y .3s linear .5s
}

#page3.cont_0 .img0 {
    margin-top: -304px
}

#page3.cont_2 .img0 {
    margin-top: 496px
}

#page3.cont_0 .img0, #page3.cont_2 .img0 {
    opacity: 0;
    -webkit-animation: scale_y1 .3s linear;
    -moz-animation: scale_y1 .3s linear;
    -o-animation: scale_y1 .3s linear;
    animation: scale_y1 .3s linear
}

@-webkit-keyframes scale_y {
    0% {
        -webkit-transform: scaleY(.1)
    }

    100% {
        -webkit-transform: scaleY(1)
    }
}

@-moz-keyframes scale_y {
    0% {
        -moz-transform: scaleY(.1)
    }

    100% {
        -moz-transform: scaleY(1)
    }
}

@-o-keyframes scale_y {
    0% {
        -o-transform: scaleY(.1)
    }

    100% {
        -o-transform: scaleY(1)
    }
}

@keyframes scale_y {
    0% {
        transform: scaleY(.1)
    }

    100% {
        transform: scaleY(1)
    }
}

@ -webkit-keyframes scale_y1 {
    0% {
        -webkit-transform: scaleY(1)
    }

    100% {
        -webkit-transform: scaleY(.1)
    }
}

@-moz-keyframes scale_y1 {
    0% {
        -moz-transform: scaleY(1)
    }

    100% {
        -moz-transform: scaleY(.1)
    }
}

@-o-keyframes scale_y1 {
    0% {
        -o-transform: scaleY(1)
    }

    100% {
        -o-transform: scaleY(.1)
    }
}

@keyframes scale_y1 {
    0% {
        transform: scaleY(1)
    }

    100% {
        transform: scaleY(.1)
    }
}
