html, body {
height: 100%;
overflow: hidden;
}
body {
background: #1b40ad;
}
.starWrap{width:100%;height:100%;position:absolute;left:0;top:0;perspective: 340px;-webkit-perspective: 340px;}
.stars {
position: absolute;
top: 50%;
left: 50%;
width: 2px;
height: 2px;
box-shadow: -447px 387px #c4c4c4, -401px 118px #fafafa, -109px 217px #d9d9d9, -680px -436px #e3e3e3, 514px 360px #cccccc, -708px 298px #e8e8e8, -696px -270px #ededed, 116px -128px #f7f7f7, 179px 35px white, -404px -90px whitesmoke, -331px -309px #c4c4c4, -363px -24px #d1d1d1, 277px 416px #fafafa, -145px -244px whitesmoke, 123px 62px #d4d4d4, -407px 418px #d9d9d9, 535px 237px #d9d9d9, -466px -78px #f7f7f7, 257px 287px #dedede, 327px -398px #e0e0e0, -602px -38px #c2c2c2, 128px 398px #e6e6e6, 274px -446px #d1d1d1, -602px -298px #c7c7c7, 526px -5px #c4c4c4, -90px -158px #fcfcfc, 5px 294px whitesmoke, -633px 229px #c4c4c4, -475px 427px #dedede, 586px -453px #f2f2f2, 180px -432px #c7c7c7, -637px -88px #cfcfcf, -453px 308px #d6d6d6, -111px 1px #d9d9d9, 573px -450px #ededed, 198px 300px #d6d6d6, -355px 166px #dedede, -715px 13px #e3e3e3, 262px -104px #d1d1d1, 147px 325px #dbdbdb, 1px 399px #dbdbdb, 286px -100px white, 43px -329px #e8e8e8, 617px 55px #d9d9d9, -168px -392px #cccccc, 84px 219px #c9c9c9, 507px -226px #d9d9d9, -327px -70px #e6e6e6, 386px -212px #c4c4c4, -717px 4px #cfcfcf, 502px -231px #e3e3e3, 302px 56px #ededed, 649px 341px #c7c7c7, 569px 350px #c9c9c9, 516px -31px #e6e6e6, 689px 447px #c2c2c2, 591px -206px #fafafa, 422px -137px #e6e6e6, -510px -324px #cccccc, -649px 287px #c2c2c2, -194px -48px #f7f7f7, -279px -329px #d1d1d1, -406px 478px #dbdbdb, -735px -87px #c9c9c9, 30px -197px #dedede, -564px 233px #e6e6e6, -486px -324px #ededed, -54px -7px #ededed, -441px -194px #e3e3e3, -133px -95px #e0e0e0, -722px -73px #d6d6d6, 595px 423px #ededed, 568px -39px #ededed, 370px 377px #d1d1d1, -419px -102px #fcfcfc, -450px 109px #c4c4c4, -57px -119px #d1d1d1, -582px 150px #e6e6e6, 206px -263px #cfcfcf, 582px -461px #c9c9c9, -268px -141px #d9d9d9, -148px 291px #c7c7c7, 254px -179px #c9c9c9, 725px 424px #f0f0f0, 391px -150px #ebebeb, 89px -299px #d4d4d4, 170px 1px #c9c9c9, 243px 209px #c7c7c7, 27px 460px #c9c9c9, -465px -380px #d4d4d4, 530px -360px whitesmoke, -626px 53px #e0e0e0, 706px 218px #d9d9d9, 40px -82px #cccccc, -5px -212px #e6e6e6, -742px 33px #ebebeb, -714px 478px #e0e0e0, -585px -125px #cccccc, -216px 348px #cfcfcf, 601px 332px #ededed, 344px -88px #c4c4c4, 659px -22px #d1d1d1, -411px 188px #d6d6d6, -423px -206px #fcfcfc, -359px -136px #cfcfcf, 612px 406px whitesmoke, 725px 96px whitesmoke, 363px -446px white, -204px 325px #c9c9c9, 740px 176px #fafafa, -489px -352px white, -638px 64px #dbdbdb, 537px -65px #dbdbdb, 151px -32px #ebebeb, 681px 212px #fcfcfc, 604px -149px #e6e6e6, -542px -398px #c4c4c4, -707px 66px whitesmoke, -381px 258px #cfcfcf, -30px 332px #d6d6d6, 512px -381px #c9c9c9, 195px 288px #cccccc, -278px 479px #c7c7c7, 27px -208px #d6d6d6, -288px 15px white, -680px 248px #dedede, 433px 31px #c9c9c9, 150px -206px #d4d4d4, -79px 247px white, -594px 115px #e0e0e0, 99px 292px #e0e0e0, 673px -269px #dedede, -257px -64px #d1d1d1, 449px 81px #f2f2f2, 18px -99px #d1d1d1, -694px 415px #f7f7f7, 240px 264px #e0e0e0, 450px -172px white, 383px 7px #e8e8e8, 338px -73px #c9c9c9, 291px -19px #ebebeb, 659px 137px #d1d1d1, 602px -6px #fcfcfc, 554px 249px #ebebeb, 625px 356px #d9d9d9, 579px -183px #d6d6d6, -20px 250px white, -401px 431px #c4c4c4, -645px -232px #cccccc, -265px -148px white, 553px 258px #d1d1d1, 166px -360px #ebebeb, 719px 51px #ededed, 612px -129px #ebebeb, -465px -104px #f2f2f2, -154px -121px #d9d9d9, -1px 330px #f2f2f2, -666px 248px #f7f7f7, -720px 264px #ededed, 148px -365px #e6e6e6, -388px -349px #c4c4c4, 128px -88px #e3e3e3, -683px -274px #fafafa, -341px 41px #c9c9c9, -59px -471px #f0f0f0, -3px -427px #c2c2c2, 418px 167px #d6d6d6, 343px 247px #c7c7c7, 623px -347px #d1d1d1, 716px -217px white, 243px -409px whitesmoke, -75px -126px #d6d6d6, -730px -91px #c9c9c9, -210px -397px #cfcfcf, -349px 180px #c9c9c9, -567px -281px #e0e0e0, -460px 381px #fcfcfc, -310px -22px #ededed, 450px -1px #dbdbdb, -405px -328px #e3e3e3, 5px 332px #d6d6d6, -294px 302px #fcfcfc, -398px 97px whitesmoke, -696px 325px #cfcfcf, -589px 110px #d6d6d6, 353px -411px #dbdbdb, -697px -318px #ebebeb, -114px -72px #f0f0f0, 259px -193px #fcfcfc, 60px 26px #e6e6e6, -63px -232px white, 205px -372px #f7f7f7, -464px -333px #f2f2f2, -374px 123px white, -377px -386px #c7c7c7, -80px 337px #cccccc, 478px -178px #dbdbdb, 222px 420px #ebebeb, -707px 99px #c4c4c4, 716px -132px #fafafa, -253px -286px #e3e3e3, 646px 178px #f0f0f0, 201px 24px #d1d1d1, 178px -58px #c7c7c7, -557px 368px #ededed, 0px 219px #d9d9d9, -266px -269px #cccccc, 242px -197px #c9c9c9, -419px 193px #c2c2c2, -47px 91px #c7c7c7, -109px 75px #c2c2c2, -146px -453px #d6d6d6, 671px -350px #f2f2f2, 421px -91px #d9d9d9, 738px 19px #ededed, -316px -155px #dedede, 419px 244px #fcfcfc, -278px -418px #d6d6d6, -581px -181px #fcfcfc, 139px 264px #d9d9d9, 691px -11px #ebebeb, -622px 402px #c2c2c2, 219px 396px #f0f0f0, -149px -423px white, -716px -78px #d9d9d9, -590px 341px #e6e6e6, -208px 79px #d6d6d6, -227px -24px #f7f7f7, 239px 262px #d1d1d1, 740px 443px #f7f7f7, 509px 134px #d6d6d6, -555px 232px #e8e8e8, -67px -427px #cfcfcf, -368px 250px #f7f7f7, 715px -415px #fafafa, 411px -301px #f0f0f0, -322px 287px #d9d9d9, -429px -90px #f2f2f2, -327px -387px #f0f0f0, -491px 183px #c2c2c2, -133px 250px #d4d4d4, 538px 139px #e3e3e3, -417px -125px #f0f0f0, 653px -351px #e6e6e6, -549px 38px #d4d4d4, 602px 110px whitesmoke, 415px 105px #e0e0e0, -733px -371px #cfcfcf, 286px 403px #d4d4d4, 11px 320px #c4c4c4, -597px 158px whitesmoke, 716px -350px whitesmoke, 321px 67px #fafafa, -237px -300px #cfcfcf, 74px 152px #c9c9c9, 587px -123px #fcfcfc, 699px -332px whitesmoke, 399px 355px #f7f7f7, -323px 314px #dbdbdb, 89px 416px #c7c7c7, 445px 38px #e3e3e3, 572px 122px #c4c4c4, -258px 372px white, 49px 306px #d9d9d9, 437px -35px #dedede, 566px 174px #f2f2f2, 732px -299px whitesmoke, -410px 394px #ededed, 131px -415px white, 19px -326px #e8e8e8, -700px -188px #d1d1d1, 96px -1px #e0e0e0, -328px -396px #f0f0f0, -117px -214px #fcfcfc, -53px 261px #ebebeb, 80px 134px #d6d6d6, -364px -216px white, -636px -125px #dbdbdb, -639px -265px #e3e3e3, 208px 98px #c7c7c7, 172px 467px #e0e0e0, 435px 309px #e3e3e3, 194px -259px #f0f0f0, 209px -186px #c9c9c9, -312px 418px #fafafa, 229px 407px #c9c9c9, -449px -357px #fafafa, 674px 121px #e8e8e8, 608px -429px #ebebeb, -431px -428px #cfcfcf, 105px 462px #e3e3e3, -179px -372px #e3e3e3, 143px -317px #d6d6d6, -449px -149px #fafafa, -544px 250px #dedede, -220px -323px whitesmoke, 658px 8px whitesmoke, -656px -244px #e8e8e8, 347px 11px whitesmoke, 694px -230px #f7f7f7, -317px 1px #c4c4c4, 28px 23px #fcfcfc, -382px 321px #dbdbdb, 632px -74px #c4c4c4, 154px -245px #c2c2c2, -553px 337px #d6d6d6, -48px -243px #d1d1d1, 92px -391px #cccccc, -71px -256px #cfcfcf, -372px 57px #d9d9d9, 369px -140px #fcfcfc, 675px 81px #c2c2c2, -663px 254px #cccccc, 703px -203px #ededed, 74px -363px #c2c2c2, 643px -458px #d1d1d1, 198px 359px #cccccc, 265px 309px #d4d4d4, -353px -368px #e8e8e8, -465px 439px whitesmoke, 693px 360px #c9c9c9, 634px -397px #d1d1d1, 467px 25px whitesmoke, -558px -272px #e6e6e6, 671px 69px #dbdbdb, 407px 357px #cfcfcf, 379px 80px white, 10px -203px #c9c9c9, 104px -292px #f0f0f0, -667px -29px #d1d1d1, 557px -155px #e6e6e6, -505px 115px #cfcfcf, -605px 164px #f2f2f2, -108px -223px #e0e0e0, 523px -156px #ebebeb, 691px 230px white, -507px -13px #d1d1d1, -349px 332px #dedede, 520px 266px whitesmoke, -66px -250px #e6e6e6, -496px -449px #ebebeb, 414px -170px #dedede, -649px 230px #ebebeb, 598px -92px #c7c7c7, -638px 113px #c2c2c2, 151px 363px #f7f7f7, -445px -241px #f0f0f0, 527px -14px #dedede, 203px -61px #cfcfcf, -716px -284px #ebebeb, -525px 134px #c2c2c2;
animation: fly 3s linear infinite;
transform-style: preserve-3d;
}
.stars:before, .stars:after {
content: "";
position: absolute;
width: inherit;
height: inherit;
box-shadow: inherit;
}
.stars:before {
transform: translateZ(-300px);
opacity: .6;
}
.stars:after {
transform: translateZ(-600px);
opacity: .4;
}
@keyframes fly {
from {
transform: translateZ(0px);
opacity: .6;
}
to {
transform: translateZ(300px);
opacity: 1;
}
}
.logoBg{
width:1457px;
height: 1551px;
position: absolute;
z-index: 2;
background:url(../img/logo-bg.png);
left:50%;
margin-left: -728.5px;
top:50%;
margin-top: -775.5px;
}
.text1{
width:1092px;
height: 228px;
position: absolute;
z-index: 3;
left:50%;
top:45%;
margin-top: -114px;
text-align: center;
margin-left: -546px;
overflow: hidden;
}
.text1.textTop{
margin-top: -244px;
}
.text1.textTop2{
margin-top: -284px;
}
.text1 .txt{
width:950px;
height: 190px;
display: inline-block;
background:url(../img/page1-2.png) no-repeat left top;
vertical-align: top;
}
.text1 .line{
width:1092px;
height: 5px;
display: inline-block;
background: url(../img/page1-4.png) no-repeat left top;
margin-top: 30px;
vertical-align: top;
}
.text1 .dot{
width:819px;
height: 41px;
display: inline-block;
background: url(../img/page1-3.png) no-repeat left top;
position: absolute;
left:50%;
margin-left: -409.5px;
top:204px;
}
.map{
width:1114px;
height: 656px;
position: absolute;
left:50%;
top:50%;
margin-left: -557px;
margin-top: -328px;
}
.map1{
background: url(../img/map.png) no-repeat left top;
}
.map2{
background: url(../img/map2.png) no-repeat left top;
}
.mapNew{
width:2000px;
height: 1178px;
position: absolute;
left:50%;
top:50%;
margin-left: -1000px;
margin-top: -589px;
background: url(../img/map3.png) no-repeat left top;
}
.light,.light ul,.light li{
-webkit-transition: All 1s 0s;
-moz-transition: All 1s 0s;
-ms-transition: All 1s 0s;
transition: All 1s 0s;
}
div, ul, span, li, img {
-webkit-transform-style: preserve-3d;
-moz-transform-style: preserve-3d;
-ms-transform-style: preserve-3d;
transform-style: preserve-3d;
}
.light img{
border: none!important;
}
.light{
-webkit-transform: translateX(30px) translateY(-20px) translateZ(200px) rotateX(75deg) rotateY(0deg) rotateZ(15deg) scaleX(1) scaleY(1) scaleZ(1);
-moz-transform: translateX(30px) translateY(-20px) translateZ(200px) rotateX(75deg) rotateY(0deg) rotateZ(15deg) scaleX(1) scaleY(1) scaleZ(1);
-ms-transform: translateX(30px) translateY(-20px) translateZ(200px) rotateX(75deg) rotateY(0deg) rotateZ(15deg) scaleX(1) scaleY(1) scaleZ(1);
transform: translateX(30px) translateY(-20px) translateZ(200px) rotateX(75deg) rotateY(0deg) rotateZ(15deg) scaleX(1) scaleY(1) scaleZ(1);
position: absolute;
width: 500px;
height: 500px;
left: 50%;
top: 50%;
margin-left: -250px;
margin-top: -250px;
z-index: 5;
}
.light ul {
position: absolute;
width: 500px;
height: 500px;
left: 50%;
top: 50%;
margin-left: -250px;
margin-top: -250px;
-webkit-animation: y 20s linear 0s infinite;
-moz-animation: y 20s linear 0s infinite;
-ms-animation: y 20s linear 0s infinite;
animation: y 20s linear 0s infinite;
}
.light ul li {
position: absolute;
width: 500px;
height: 500px;
left: 50%;
top: 50%;
margin-left: -250px;
margin-top: -250px;
-webkit-border-radius: 1000px;
-moz-border-radius: 1000px;
-o-border-radius: 1000px;
-ms-border-radius: 1000px;
border-radius: 1000px;
-webkit-transition: All 1.4s 0s;
-moz-transition: All 1.4s 0s;
-ms-transition: All 1.4s 0s;
transition: All 1.4s 0s;
border: 2px solid #5ec0ff;
}
.light ul li div {
position: absolute;
width: 160px;
height: 160px;
left: 50%;
top: 50%;
margin-left: -80px;
margin-top: -80px;
-webkit-transform: translateX(300px) translateY(0) translateZ(0) rotateX(0deg) rotateY(60deg) rotateZ(0deg) scaleX(1) scaleY(1) scaleZ(1);
-moz-transform: translateX(300px) translateY(0) translateZ(0) rotateX(0deg) rotateY(60deg) rotateZ(0deg) scaleX(1) scaleY(1) scaleZ(1);
-ms-transform: translateX(300px) translateY(0) translateZ(0) rotateX(0deg) rotateY(60deg) rotateZ(0deg) scaleX(1) scaleY(1) scaleZ(1);
transform: translateX(300px) translateY(0) translateZ(0) rotateX(0deg) rotateY(60deg) rotateZ(0deg) scaleX(1) scaleY(1) scaleZ(1);
}
.light ul li div .part {
position: absolute;
width: 100px;
height: 100px;
left: 50%;
top: 50%;
margin-left: -50px;
margin-top: -50px;
-webkit-transform: translateX(0) translateY(0) translateZ(0) rotateX(90deg) rotateY(0deg) rotateZ(180deg) scaleX(1) scaleY(1) scaleZ(1);
-moz-transform: translateX(0) translateY(0) translateZ(0) rotateX(90deg) rotateY(0deg) rotateZ(180deg) scaleX(1) scaleY(1) scaleZ(1);
-ms-transform: translateX(0) translateY(0) translateZ(0) rotateX(90deg) rotateY(0deg) rotateZ(180deg) scaleX(1) scaleY(1) scaleZ(1);
transform: translateX(0) translateY(0) translateZ(0) rotateX(90deg) rotateY(0deg) rotateZ(180deg) scaleX(1) scaleY(1) scaleZ(1);
-webkit-transform-style: preserve-3d;
-moz-transform-style: preserve-3d;
-ms-transform-style: preserve-3d;
transform-style: preserve-3d;
opacity: 1;
}
.light ul li div .part:nth-of-type(2) {
-webkit-transform: translateX(0) translateY(10px) translateZ(0) rotateX(90deg) rotateY(0deg) rotateZ(180deg) scaleX(1) scaleY(1) scaleZ(1);
-moz-transform: translateX(0) translateY(10px) translateZ(0) rotateX(90deg) rotateY(0deg) rotateZ(180deg) scaleX(1) scaleY(1) scaleZ(1);
-ms-transform: translateX(0) translateY(10px) translateZ(0) rotateX(90deg) rotateY(0deg) rotateZ(180deg) scaleX(1) scaleY(1) scaleZ(1);
transform: translateX(0) translateY(10px) translateZ(0) rotateX(90deg) rotateY(0deg) rotateZ(180deg) scaleX(1) scaleY(1) scaleZ(1);
}
.light ul li:nth-of-type(1) {
-webkit-transform: translateX(0) translateY(0) translateZ(0) rotateX(0deg) rotateY(0deg) rotateZ(0deg) scaleX(1) scaleY(1) scaleZ(1);
-moz-transform: translateX(0) translateY(0) translateZ(0) rotateX(0deg) rotateY(0deg) rotateZ(0deg) scaleX(1) scaleY(1) scaleZ(1);
-ms-transform: translateX(0) translateY(0) translateZ(0) rotateX(0deg) rotateY(0deg) rotateZ(0deg) scaleX(1) scaleY(1) scaleZ(1);
transform: translateX(0) translateY(0) translateZ(0) rotateX(0deg) rotateY(0deg) rotateZ(0deg) scaleX(1) scaleY(1) scaleZ(1);
}
.light ul li:nth-of-type(1) span {
position: absolute;
width: 500px;
height: 500px;
left: 50%;
top: 50%;
margin-left: -250px;
margin-top: -250px;
-webkit-perspective: 1000px;
-moz-perspective: 1000px;
-ms-perspective: 1000px;
perspective: 1000px;
-webkit-transform-style: preserve-3d;
-moz-transform-style: preserve-3d;
-ms-transform-style: preserve-3d;
transform-style: preserve-3d;
-webkit-animation: z 12s linear 0s infinite;
-moz-animation: z 12s linear 0s infinite;
-ms-animation: z 12s linear 0s infinite;
animation: z 12s linear 0s infinite;
}
.light ul li:nth-of-type(1) span .round {
position: absolute;
width: 500px;
height: 500px;
left: 50%;
top: 50%;
margin-left: -250px;
margin-top: -250px;
-webkit-animation: z 3s linear 0s infinite;
-moz-animation: z 3s linear 0s infinite;
-ms-animation: z 3s linear 0s infinite;
animation: z 3s linear 0s infinite;
}
.light ul li:nth-of-type(2) {
-webkit-transform: translateX(0) translateY(0) translateZ(0) rotateX(0deg) rotateY(60deg) rotateZ(0deg) scaleX(1) scaleY(1) scaleZ(1);
-moz-transform: translateX(0) translateY(0) translateZ(0) rotateX(0deg) rotateY(60deg) rotateZ(0deg) scaleX(1) scaleY(1) scaleZ(1);
-ms-transform: translateX(0) translateY(0) translateZ(0) rotateX(0deg) rotateY(60deg) rotateZ(0deg) scaleX(1) scaleY(1) scaleZ(1);
transform: translateX(0) translateY(0) translateZ(0) rotateX(0deg) rotateY(60deg) rotateZ(0deg) scaleX(1) scaleY(1) scaleZ(1);
}
.light ul li:nth-of-type(2) span {
position: absolute;
width: 500px;
height: 500px;
left: 50%;
top: 50%;
margin-left: -250px;
margin-top: -250px;
-webkit-animation: z 12s linear 0s infinite;
-moz-animation: z 12s linear 0s infinite;
-ms-animation: z 12s linear 0s infinite;
animation: z 12s linear 0s infinite;
}
.light ul li:nth-of-type(2) span .round {
position: absolute;
width: 500px;
height: 500px;
left: 50%;
top: 50%;
margin-left: -250px;
margin-top: -250px;
-webkit-animation: z 4s linear 0s infinite;
-moz-animation: z 4s linear 0s infinite;
-ms-animation: z 4s linear 0s infinite;
animation: z 4s linear 0s infinite;
}
.light ul li:nth-of-type(3) {
-webkit-transform: translateX(0) translateY(0) translateZ(0) rotateX(0deg) rotateY(-60deg) rotateZ(0deg) scaleX(1) scaleY(1) scaleZ(1);
-moz-transform: translateX(0) translateY(0) translateZ(0) rotateX(0deg) rotateY(-60deg) rotateZ(0deg) scaleX(1) scaleY(1) scaleZ(1);
-ms-transform: translateX(0) translateY(0) translateZ(0) rotateX(0deg) rotateY(-60deg) rotateZ(0deg) scaleX(1) scaleY(1) scaleZ(1);
transform: translateX(0) translateY(0) translateZ(0) rotateX(0deg) rotateY(-60deg) rotateZ(0deg) scaleX(1) scaleY(1) scaleZ(1);
}
.light ul li:nth-of-type(3) span {
position: absolute;
width: 500px;
height: 500px;
left: 50%;
top: 50%;
margin-left: -250px;
margin-top: -250px;
-webkit-animation: z 12s linear 0s infinite;
-moz-animation: z 12s linear 0s infinite;
-ms-animation: z 12s linear 0s infinite;
animation: z 12s linear 0s infinite;
}
.light ul li:nth-of-type(3) span .round {
position: absolute;
width: 500px;
height: 500px;
left: 50%;
top: 50%;
margin-left: -250px;
margin-top: -250px;
-webkit-animation: z 5s linear 0s infinite;
-moz-animation: z 5s linear 0s infinite;
-ms-animation: z 5s linear 0s infinite;
animation: z 5s linear 0s infinite;
}
.light2{
-webkit-transform: translateX(30px) translateY(-20px) translateZ(200px) rotateX(75deg) rotateY(0deg) rotateZ(15deg) scaleX(1) scaleY(1) scaleZ(1);
-moz-transform: translateX(30px) translateY(-20px) translateZ(200px) rotateX(75deg) rotateY(0deg) rotateZ(15deg) scaleX(1) scaleY(1) scaleZ(1);
-ms-transform: translateX(30px) translateY(-20px) translateZ(200px) rotateX(75deg) rotateY(0deg) rotateZ(15deg) scaleX(1) scaleY(1) scaleZ(1);
transform: translateX(30px) translateY(-20px) translateZ(200px) rotateX(75deg) rotateY(0deg) rotateZ(15deg) scaleX(1) scaleY(1) scaleZ(1);
position: absolute;
width: 1000px;
height: 1000px;
left: 50%;
top: 50%;
margin-left: -500px;
margin-top: -500px;
z-index: 5;
}
.light2 ul {
position: absolute;
width: 1000px;
height: 1000px;
left: 50%;
top: 50%;
margin-left: -500px;
margin-top: -500px;
-webkit-animation: y 20s linear 0s infinite;
-moz-animation: y 20s linear 0s infinite;
-ms-animation: y 20s linear 0s infinite;
animation: y 20s linear 0s infinite;
}
.light2 ul li {
position: absolute;
width: 1000px;
height: 1000px;
left: 50%;
top: 50%;
margin-left: -500px;
margin-top: -500px;
-webkit-border-radius: 1000px;
-moz-border-radius: 1000px;
-o-border-radius: 1000px;
-ms-border-radius: 1000px;
border-radius: 1000px;
-webkit-transition: All 1.4s 0s;
-moz-transition: All 1.4s 0s;
-ms-transition: All 1.4s 0s;
transition: All 1.4s 0s;
border: 2px solid #5ec0ff;
}
.light2 ul li div {
position: absolute;
width: 160px;
height: 160px;
left: 50%;
top: 50%;
margin-left: -80px;
margin-top: -80px;
-webkit-transform: translateX(300px) translateY(0) translateZ(0) rotateX(0deg) rotateY(60deg) rotateZ(0deg) scaleX(1) scaleY(1) scaleZ(1);
-moz-transform: translateX(300px) translateY(0) translateZ(0) rotateX(0deg) rotateY(60deg) rotateZ(0deg) scaleX(1) scaleY(1) scaleZ(1);
-ms-transform: translateX(300px) translateY(0) translateZ(0) rotateX(0deg) rotateY(60deg) rotateZ(0deg) scaleX(1) scaleY(1) scaleZ(1);
transform: translateX(300px) translateY(0) translateZ(0) rotateX(0deg) rotateY(60deg) rotateZ(0deg) scaleX(1) scaleY(1) scaleZ(1);
}
.light2 ul li div .part {
position: absolute;
width: 100px;
height: 100px;
left: 50%;
top: 50%;
margin-left: -50px;
margin-top: -50px;
-webkit-transform: translateX(0) translateY(0) translateZ(0) rotateX(90deg) rotateY(0deg) rotateZ(180deg) scaleX(1) scaleY(1) scaleZ(1);
-moz-transform: translateX(0) translateY(0) translateZ(0) rotateX(90deg) rotateY(0deg) rotateZ(180deg) scaleX(1) scaleY(1) scaleZ(1);
-ms-transform: translateX(0) translateY(0) translateZ(0) rotateX(90deg) rotateY(0deg) rotateZ(180deg) scaleX(1) scaleY(1) scaleZ(1);
transform: translateX(0) translateY(0) translateZ(0) rotateX(90deg) rotateY(0deg) rotateZ(180deg) scaleX(1) scaleY(1) scaleZ(1);
-webkit-transform-style: preserve-3d;
-moz-transform-style: preserve-3d;
-ms-transform-style: preserve-3d;
transform-style: preserve-3d;
opacity: 1;
}
.light2 ul li div .part:nth-of-type(2) {
-webkit-transform: translateX(0) translateY(10px) translateZ(0) rotateX(90deg) rotateY(0deg) rotateZ(180deg) scaleX(1) scaleY(1) scaleZ(1);
-moz-transform: translateX(0) translateY(10px) translateZ(0) rotateX(90deg) rotateY(0deg) rotateZ(180deg) scaleX(1) scaleY(1) scaleZ(1);
-ms-transform: translateX(0) translateY(10px) translateZ(0) rotateX(90deg) rotateY(0deg) rotateZ(180deg) scaleX(1) scaleY(1) scaleZ(1);
transform: translateX(0) translateY(10px) translateZ(0) rotateX(90deg) rotateY(0deg) rotateZ(180deg) scaleX(1) scaleY(1) scaleZ(1);
}
.light2 ul li:nth-of-type(1) {
-webkit-transform: translateX(0) translateY(0) translateZ(0) rotateX(0deg) rotateY(0deg) rotateZ(0deg) scaleX(1) scaleY(1) scaleZ(1);
-moz-transform: translateX(0) translateY(0) translateZ(0) rotateX(0deg) rotateY(0deg) rotateZ(0deg) scaleX(1) scaleY(1) scaleZ(1);
-ms-transform: translateX(0) translateY(0) translateZ(0) rotateX(0deg) rotateY(0deg) rotateZ(0deg) scaleX(1) scaleY(1) scaleZ(1);
transform: translateX(0) translateY(0) translateZ(0) rotateX(0deg) rotateY(0deg) rotateZ(0deg) scaleX(1) scaleY(1) scaleZ(1);
}
.light2 ul li:nth-of-type(1) span {
position: absolute;
width: 1000px;
height: 1000px;
left: 50%;
top: 50%;
margin-left: -500px;
margin-top: -500px;
-webkit-perspective: 2000px;
-moz-perspective: 2000px;
-ms-perspective: 2000px;
perspective:2000px;
-webkit-transform-style: preserve-3d;
-moz-transform-style: preserve-3d;
-ms-transform-style: preserve-3d;
transform-style: preserve-3d;
-webkit-animation: z 12s linear 0s infinite;
-moz-animation: z 12s linear 0s infinite;
-ms-animation: z 12s linear 0s infinite;
animation: z 12s linear 0s infinite;
}
.light2 ul li:nth-of-type(1) span .round {
position: absolute;
width: 1000px;
height: 1000px;
left: 50%;
top: 50%;
margin-left: -500px;
margin-top: -500px;
-webkit-animation: z 3s linear 0s infinite;
-moz-animation: z 3s linear 0s infinite;
-ms-animation: z 3s linear 0s infinite;
animation: z 3s linear 0s infinite;
}
.light2 ul li:nth-of-type(2) {
-webkit-transform: translateX(0) translateY(0) translateZ(0) rotateX(0deg) rotateY(60deg) rotateZ(0deg) scaleX(1) scaleY(1) scaleZ(1);
-moz-transform: translateX(0) translateY(0) translateZ(0) rotateX(0deg) rotateY(60deg) rotateZ(0deg) scaleX(1) scaleY(1) scaleZ(1);
-ms-transform: translateX(0) translateY(0) translateZ(0) rotateX(0deg) rotateY(60deg) rotateZ(0deg) scaleX(1) scaleY(1) scaleZ(1);
transform: translateX(0) translateY(0) translateZ(0) rotateX(0deg) rotateY(60deg) rotateZ(0deg) scaleX(1) scaleY(1) scaleZ(1);
}
.light2 ul li:nth-of-type(2) span {
position: absolute;
width: 1000px;
height: 1000px;
left: 50%;
top: 50%;
margin-left: -500px;
margin-top: -500px;
-webkit-animation: z 12s linear 0s infinite;
-moz-animation: z 12s linear 0s infinite;
-ms-animation: z 12s linear 0s infinite;
animation: z 12s linear 0s infinite;
}
.light2 ul li:nth-of-type(2) span .round {
position: absolute;
width: 1000px;
height: 1000px;
left: 50%;
top: 50%;
margin-left: -500px;
margin-top: -500px;
-webkit-animation: z 4s linear 0s infinite;
-moz-animation: z 4s linear 0s infinite;
-ms-animation: z 4s linear 0s infinite;
animation: z 4s linear 0s infinite;
}
.light2 ul li:nth-of-type(3) {
-webkit-transform: translateX(0) translateY(0) translateZ(0) rotateX(0deg) rotateY(-60deg) rotateZ(0deg) scaleX(1) scaleY(1) scaleZ(1);
-moz-transform: translateX(0) translateY(0) translateZ(0) rotateX(0deg) rotateY(-60deg) rotateZ(0deg) scaleX(1) scaleY(1) scaleZ(1);
-ms-transform: translateX(0) translateY(0) translateZ(0) rotateX(0deg) rotateY(-60deg) rotateZ(0deg) scaleX(1) scaleY(1) scaleZ(1);
transform: translateX(0) translateY(0) translateZ(0) rotateX(0deg) rotateY(-60deg) rotateZ(0deg) scaleX(1) scaleY(1) scaleZ(1);
}
.light2 ul li:nth-of-type(3) span {
position: absolute;
width: 1000px;
height: 1000px;
left: 50%;
top: 50%;
margin-left: -500px;
margin-top: -500px;
-webkit-animation: z 12s linear 0s infinite;
-moz-animation: z 12s linear 0s infinite;
-ms-animation: z 12s linear 0s infinite;
animation: z 12s linear 0s infinite;
}
.light2 ul li:nth-of-type(3) span .round {
position: absolute;
width: 1000px;
height: 1000px;
left: 50%;
top: 50%;
margin-left: -500px;
margin-top: -500px;
-webkit-animation: z 5s linear 0s infinite;
-moz-animation: z 5s linear 0s infinite;
-ms-animation: z 5s linear 0s infinite;
animation: z 5s linear 0s infinite;
}
@-webkit-keyframes y {
from {
-webkit-transform: translateX(0) translateY(0) translateZ(0) rotateX(0deg) rotateY(0deg) rotateZ(0deg) scaleX(1) scaleY(1) scaleZ(1);
-moz-transform: translateX(0) translateY(0) translateZ(0) rotateX(0deg) rotateY(0deg) rotateZ(0deg) scaleX(1) scaleY(1) scaleZ(1);
-ms-transform: translateX(0) translateY(0) translateZ(0) rotateX(0deg) rotateY(0deg) rotateZ(0deg) scaleX(1) scaleY(1) scaleZ(1);
transform: translateX(0) translateY(0) translateZ(0) rotateX(0deg) rotateY(0deg) rotateZ(0deg) scaleX(1) scaleY(1) scaleZ(1);
}
to {
-webkit-transform: translateX(0) translateY(0) translateZ(0) rotateX(0deg) rotateY(360deg) rotateZ(0deg) scaleX(1) scaleY(1) scaleZ(1);
-moz-transform: translateX(0) translateY(0) translateZ(0) rotateX(0deg) rotateY(360deg) rotateZ(0deg) scaleX(1) scaleY(1) scaleZ(1);
-ms-transform: translateX(0) translateY(0) translateZ(0) rotateX(0deg) rotateY(360deg) rotateZ(0deg) scaleX(1) scaleY(1) scaleZ(1);
transform: translateX(0) translateY(0) translateZ(0) rotateX(0deg) rotateY(360deg) rotateZ(0deg) scaleX(1) scaleY(1) scaleZ(1);
}
}
@-webkit-keyframes z {
from {
-webkit-transform: translateX(0) translateY(0) translateZ(0) rotateX(0deg) rotateY(0deg) rotateZ(0deg) scaleX(1) scaleY(1) scaleZ(1);
-moz-transform: translateX(0) translateY(0) translateZ(0) rotateX(0deg) rotateY(0deg) rotateZ(0deg) scaleX(1) scaleY(1) scaleZ(1);
-ms-transform: translateX(0) translateY(0) translateZ(0) rotateX(0deg) rotateY(0deg) rotateZ(0deg) scaleX(1) scaleY(1) scaleZ(1);
transform: translateX(0) translateY(0) translateZ(0) rotateX(0deg) rotateY(0deg) rotateZ(0deg) scaleX(1) scaleY(1) scaleZ(1);
}
to {
-webkit-transform: translateX(0) translateY(0) translateZ(0) rotateX(0deg) rotateY(0deg) rotateZ(360deg) scaleX(1) scaleY(1) scaleZ(1);
-moz-transform: translateX(0) translateY(0) translateZ(0) rotateX(0deg) rotateY(0deg) rotateZ(360deg) scaleX(1) scaleY(1) scaleZ(1);
-ms-transform: translateX(0) translateY(0) translateZ(0) rotateX(0deg) rotateY(0deg) rotateZ(360deg) scaleX(1) scaleY(1) scaleZ(1);
transform: translateX(0) translateY(0) translateZ(0) rotateX(0deg) rotateY(0deg) rotateZ(360deg) scaleX(1) scaleY(1) scaleZ(1);
}
}
@keyframes y {
from {
-webkit-transform: translateX(0) translateY(0) translateZ(0) rotateX(0deg) rotateY(0deg) rotateZ(0deg) scaleX(1) scaleY(1) scaleZ(1);
-moz-transform: translateX(0) translateY(0) translateZ(0) rotateX(0deg) rotateY(0deg) rotateZ(0deg) scaleX(1) scaleY(1) scaleZ(1);
-ms-transform: translateX(0) translateY(0) translateZ(0) rotateX(0deg) rotateY(0deg) rotateZ(0deg) scaleX(1) scaleY(1) scaleZ(1);
transform: translateX(0) translateY(0) translateZ(0) rotateX(0deg) rotateY(0deg) rotateZ(0deg) scaleX(1) scaleY(1) scaleZ(1);
}
to {
-webkit-transform: translateX(0) translateY(0) translateZ(0) rotateX(0deg) rotateY(360deg) rotateZ(0deg) scaleX(1) scaleY(1) scaleZ(1);
-moz-transform: translateX(0) translateY(0) translateZ(0) rotateX(0deg) rotateY(360deg) rotateZ(0deg) scaleX(1) scaleY(1) scaleZ(1);
-ms-transform: translateX(0) translateY(0) translateZ(0) rotateX(0deg) rotateY(360deg) rotateZ(0deg) scaleX(1) scaleY(1) scaleZ(1);
transform: translateX(0) translateY(0) translateZ(0) rotateX(0deg) rotateY(360deg) rotateZ(0deg) scaleX(1) scaleY(1) scaleZ(1);
}
}
@keyframes z {
from {
-webkit-transform: translateX(0) translateY(0) translateZ(0) rotateX(0deg) rotateY(0deg) rotateZ(0deg) scaleX(1) scaleY(1) scaleZ(1);
-moz-transform: translateX(0) translateY(0) translateZ(0) rotateX(0deg) rotateY(0deg) rotateZ(0deg) scaleX(1) scaleY(1) scaleZ(1);
-ms-transform: translateX(0) translateY(0) translateZ(0) rotateX(0deg) rotateY(0deg) rotateZ(0deg) scaleX(1) scaleY(1) scaleZ(1);
transform: translateX(0) translateY(0) translateZ(0) rotateX(0deg) rotateY(0deg) rotateZ(0deg) scaleX(1) scaleY(1) scaleZ(1);
}
to {
-webkit-transform: translateX(0) translateY(0) translateZ(0) rotateX(0deg) rotateY(0deg) rotateZ(360deg) scaleX(1) scaleY(1) scaleZ(1);
-moz-transform: translateX(0) translateY(0) translateZ(0) rotateX(0deg) rotateY(0deg) rotateZ(360deg) scaleX(1) scaleY(1) scaleZ(1);
-ms-transform: translateX(0) translateY(0) translateZ(0) rotateX(0deg) rotateY(0deg) rotateZ(360deg) scaleX(1) scaleY(1) scaleZ(1);
transform: translateX(0) translateY(0) translateZ(0) rotateX(0deg) rotateY(0deg) rotateZ(360deg) scaleX(1) scaleY(1) scaleZ(1);
}
}
.page0_round_div {
position: absolute;
width: 679px;
height: 679px;
left: 50%;
top: 50%;
margin-left: -339.5px;
margin-top: -339.5px;
-webkit-transform: translateX(0) translateY(100px) translateZ(-20px) rotateX(-110deg) rotateY(-6deg) rotateZ(0deg) scaleX(2.6) scaleY(1) scaleZ(1);
-moz-transform: translateX(0) translateY(100px) translateZ(-20px) rotateX(-110deg) rotateY(-6deg) rotateZ(0deg) scaleX(2.6) scaleY(1) scaleZ(1);
-ms-transform: translateX(0) translateY(100px) translateZ(-20px) rotateX(-110deg) rotateY(-6deg) rotateZ(0deg) scaleX(2.6) scaleY(1) scaleZ(1);
transform: translateX(0) translateY(100px) translateZ(-20px) rotateX(-110deg) rotateY(-6deg) rotateZ(0deg) scaleX(2.6) scaleY(1) scaleZ(1);
}
.page0_round_div img {
-webkit-animation: z 5s linear 0s infinite;
-moz-animation: z 5s linear 0s infinite;
-ms-animation: z 5s linear 0s infinite;
animation: z 5s linear 0s infinite;
}
.dotWrap{
width:100%;
height: 100%;
position: absolute;
left:0;
top:0;
}
.dotWrap span{
width:12px;
height: 12px;
display: inline-block;
background: url(../img/dot.png) no-repeat left top;
position: absolute;
}
.dotWrap span:nth-of-type(1){
right:186px;
top: 338px;
}
.dotWrap span:nth-of-type(2){
right:174px;
top: 369px;
}
.dotWrap span:nth-of-type(3){
right:215px;
top: 377px;
}
.dotWrap span:nth-of-type(4){
right:198px;
top: 416px;
}
.dotWrap span:nth-of-type(5){
right:241px;
top: 381px;
}
.dotWrap span:nth-of-type(6){
right:242px;
top: 407px;
}
.dotWrap span:nth-of-type(7){
right:325px;
top: 396px;
}
.dotWrap span:nth-of-type(8){
right:388px;
top: 337px;
}
.dotWrap span:nth-of-type(9){
right:422px;
top: 321px;
}
.dotWrap span:nth-of-type(10){
right:403px;
top: 371px;
}
.dotWrap span:nth-of-type(11){
right:454px;
top: 345px;
}
.dotWrap span:nth-of-type(12){
right:432px;
top: 381px;
}
.dotWrap span:nth-of-type(13){
right:422px;
top: 417px;
}
.dotWrap span:nth-of-type(14){
right:446px;
top: 441px;
}
.dotWrap span:nth-of-type(15){
right:452px;
top: 487px;
}
.earth{
position: absolute;
width:896px;
height: 896px;
left:50%;
margin-left: -448px;
bottom: -700px;
z-index: 6;
}
.earth .earthbg{
width:100%;
height: 100%;
position: absolute;
left:0;
top:0;
background: url(../img/earth.png) no-repeat left top;
}
.earth .earthbg2{
width:100%;
height: 100%;
position: absolute;
left:0;
top:0;
background: url(../img/earth3.png) no-repeat left top;
}
.earth .earthpic{
width:100%;
height: 100%;
position: absolute;
left:0;
top:0;
background: url(../img/earth1.png) no-repeat left top;
z-index: 2;
}
.earth .people{
width:100%;
height: 286px;
position: absolute;
background:url(../img/people.png) no-repeat center top;
z-index: 3;
left:0;
top:-156px;
}
.delay400{
animation-delay:0.4s;
-webkit-animation-delay:0.4s;
}
.delay700{
animation-delay:0.7s;
-webkit-animation-delay:0.7s;
}
.delay1000{
animation-delay:1s;
-webkit-animation-delay:1s;
}
.delay1200{
animation-delay:1.2s;
-webkit-animation-delay:1.2s;
}
.delay1400{
animation-delay:1.4s;
-webkit-animation-delay:1.4s;
}
.delay1600{
animation-delay:1.6s;
-webkit-animation-delay:1.6s;
}
.delay2000{
animation-delay:2.0s;
-webkit-animation-delay:2.0s;
}
.delay2400{
animation-delay:2.4s;
-webkit-animation-delay:2.4s;
}
.delay3000{
animation-delay:3s;
-webkit-animation-delay:3s;
}
.delay4000{
animation-delay:4s;
-webkit-animation-delay:4s;
}
.delay5000{
animation-delay:5s;
-webkit-animation-delay:5s;
}
.delay5200{
animation-delay:5.2s;
-webkit-animation-delay:5.2s;
}
.delay5400{
animation-delay:5.4s;
-webkit-animation-delay:5.4s;
}
.delay5500{
animation-delay:5.5s;
-webkit-animation-delay:5.5s;
}
.delay5600{
animation-delay:5.6s;
-webkit-animation-delay:5.6s;
}
.delay6000{
animation-delay:6s;
-webkit-animation-delay:6s;
}
.delay7000{
animation-delay:7s;
-webkit-animation-delay:7s;
}
.delay6000{
animation-delay:6s;
-webkit-animation-delay:6s;
}
.delay6200{
animation-delay:6.2s;
-webkit-animation-delay:6.2s;
}
.delay6400{
animation-delay:6.4s;
-webkit-animation-delay:6.4s;
}
.delay6600{
animation-delay:6.6s;
-webkit-animation-delay:6.6s;
}
.delay7200{
animation-delay:7.2s;
-webkit-animation-delay:7.2s;
}
.delay7400{
animation-delay:7.4s;
-webkit-animation-delay:7.4s;
}
.delay7600{
animation-delay:7.6s;
-webkit-animation-delay:7.6s;
}
.delay9600{
animation-delay:9.6s;
-webkit-animation-delay:9.6s;
}
.delay13600{
animation-delay:13.6s;
-webkit-animation-delay:13.6s;
}
.delay17600{
animation-delay:17.6s;
-webkit-animation-delay:17.6s;
}
.delay11600{
animation-delay:11.6s;
-webkit-animation-delay:11.6s;
}
.delay12600{
animation-delay:12.6s;
-webkit-animation-delay:12.6s;
}
.delay13000{
animation-delay:13.0s;
-webkit-animation-delay:13.0s;
}
.delay13600{
animation-delay:13.6s;
-webkit-animation-delay:13.6s;
}
.delay12000{
animation-delay:12.0s;
-webkit-animation-delay:12.0s;
}
.delay14000{
animation-delay:14.0s;
-webkit-animation-delay:14.0s;
}
.delay14600{
animation-delay:14.6s;
-webkit-animation-delay:14.6s;
}
.delay15600{
animation-delay:15.6s;
-webkit-animation-delay:15.6s;
}
.delay16600{
animation-delay:16.6s;
-webkit-animation-delay:16.6s;
}
.delay15000{
animation-delay:15.0s;
-webkit-animation-delay:15.0s;
}
.delay18600{
animation-delay:18.6s;
-webkit-animation-delay:18.6s;
}
.delay19600{
animation-delay:19.6s;
-webkit-animation-delay:19.6s;
}
.delay21600{
animation-delay:21.6s;
-webkit-animation-delay:21.6s;
}
.delay23600{
animation-delay:23.6s;
-webkit-animation-delay:23.6s;
}
@-webkit-keyframes high {
from {
-webkit-transform: translateX(-136.5px) translateY(0) translateZ(0) rotateX(0deg) rotateY(0deg) rotateZ(0deg) scaleX(1) scaleY(1) scaleZ(1);
-moz-transform: translateX(-136.5px) translateY(0) translateZ(0) rotateX(0deg) rotateY(0deg) rotateZ(0deg) scaleX(1) scaleY(1) scaleZ(1);
-ms-transform: translateX(-136.5px) translateY(0) translateZ(0) rotateX(0deg) rotateY(0deg) rotateZ(0deg) scaleX(1) scaleY(1) scaleZ(1);
transform: translateX(-136.5px) translateY(0) translateZ(0) rotateX(0deg) rotateY(0deg) rotateZ(0deg) scaleX(1) scaleY(1) scaleZ(1);
}
50%{
-webkit-transform: translateX(136.5px) translateY(0) translateZ(0) rotateX(0deg) rotateY(0deg) rotateZ(0deg) scaleX(1) scaleY(1) scaleZ(1);
-moz-transform: translateX(136.5px) translateY(0) translateZ(0) rotateX(0deg) rotateY(0deg) rotateZ(0deg) scaleX(1) scaleY(1) scaleZ(1);
-ms-transform: translateX(136.5px) translateY(0) translateZ(0) rotateX(0deg) rotateY(0deg) rotateZ(0deg) scaleX(1) scaleY(1) scaleZ(1);
transform: translateX(136.5px) translateY(0) translateZ(0) rotateX(0deg) rotateY(0deg) rotateZ(0deg) scaleX(1) scaleY(1) scaleZ(1);
}
to {
-webkit-transform: translateX(-136.5px) translateY(0) translateZ(0) rotateX(0deg) rotateY(0deg) rotateZ(0deg) scaleX(1) scaleY(1) scaleZ(1);
-moz-transform: translateX(-136.5px) translateY(0) translateZ(0) rotateX(0deg) rotateY(0deg) rotateZ(0deg) scaleX(1) scaleY(1) scaleZ(1);
-ms-transform: translateX(-136.5px) translateY(0) translateZ(0) rotateX(0deg) rotateY(0deg) rotateZ(0deg) scaleX(1) scaleY(1) scaleZ(1);
transform: translateX(-136.5px) translateY(0) translateZ(0) rotateX(0deg) rotateY(0deg) rotateZ(0deg) scaleX(1) scaleY(1) scaleZ(1);
}
}
.text1 .dot{
-webkit-animation: high 2s linear infinite;
-moz-animation: high 2s linear infinite;
-ms-animation: high 2s linear infinite;
animation: high 2s linear infinite;
}
.enterPage{
width:400px;
height: 656px;
position: absolute;
left:50%;
top:50%;
margin-left: -200px;
margin-top: -328px;
z-index: 10;
}
.enterPage .logo{
width:100%;
height: 498px;
background:url(../img/logo.png) no-repeat center top;
}
.enterPage .text2{
width:100%;
height: 136px;
background:url(../img/logo_1.png) no-repeat center bottom;
/*background:url(../img/text2.png) no-repeat center top;*/
margin-top: 43px;
}
.enterPage .enter{
padding-top: 50px;
font-size: 0;
text-align: center;
}
.enterPage .enter a{
display: inline-block;
width:110px;
height: 36px;
}
.enterPage .enter a:hover{
-webkit-animation: bounce2 1.0s ease both;
animation: bounce2 1.0s ease both;
}
.enterPage .enter a.cn{
background:url(../img/cn.png) no-repeat center center;
}
.enterPage .enter a.en{
background:url(../img/en.png) no-repeat center center;
}
.enterPage .enter a.cn:hover{
background:url(../img/cn2.png) no-repeat center center;
}
.enterPage .enter a.en:hover{
background:url(../img/en2.png) no-repeat center center;
}
.skipA{
position: absolute;
right:20px;
bottom: 60px;
font-size: 20px;
color:#fff;
z-index: 99;
line-height: 24px;
padding:10px 20px;
font-family: '微软雅黑';
}
.skipA:hover{
color:#d4ae54;
}
.mapdot{
width:1114px;
height: 656px;
position: absolute;
left:50%;
top:50%;
margin-left: -557px;
margin-top: -328px;
}
.mapdot span{
width:8px;
height: 8px;
display: inline-block;
position: absolute;
border:2px solid #c59329;
background:#ffe400;
border-radius: 50%;
-moz-border-radius: 50%;
-webkit-border-radius: 50%;
-ms-border-radius: 50%;
-o-border-radius: 50%;
}
.mapdot span:nth-of-type(1){
right:186px;
top: 338px;
}
.mapdot span:nth-of-type(2){
right:174px;
top: 369px;
}
.mapdot span:nth-of-type(3){
right:215px;
top: 377px;
}
.mapdot span:nth-of-type(4){
right:198px;
top: 416px;
}
.mapdot span:nth-of-type(5){
right:241px;
top: 381px;
}
.mapdot span:nth-of-type(6){
right:242px;
top: 407px;
}
.mapdot span:nth-of-type(7){
right:325px;
top: 396px;
}
.mapdot span:nth-of-type(8){
right:388px;
top: 337px;
}
.mapdot span:nth-of-type(9){
right:422px;
top: 321px;
}
.mapdot span:nth-of-type(10){
right:403px;
top: 371px;
}
.mapdot span:nth-of-type(11){
right:454px;
top: 345px;
}
.mapdot span:nth-of-type(12){
right:432px;
top: 381px;
}
.mapdot span:nth-of-type(13){
right:422px;
top: 417px;
}
.mapdot span:nth-of-type(14){
right:446px;
top: 441px;
}
.mapdot span:nth-of-type(15){
right:452px;
top: 487px;
}
.earth{
bottom: -278px;
}
.earth .people{
top:150px;
}
.earthpicwrap{
position: absolute;
overflow: hidden;
width:100%;
height: 100%;
left:0;
top:0;
-webkit-border-radius: 50%;
-moz-border-radius: 50%;
-ms-border-radius: 50%;
-o-border-radius: 50%;
border-radius: 50%;
}
.earthnew{
width:1521px;
height: 100%;
background:url(../img/map5.png) no-repeat left top;
position: absolute;
left:0;
top:0;
}
.earthnew{
width: 3042px;
left:initial;
right:0;
background: url(../img/map5.png) repeat-x right top;
}
.starlight{
position: absolute;
right:-140px;
top:-140px;
width:409px;
height: 409px;
}
.starlight .s1{
width:100%;
height: 100%;
display: block;
background:url(../img/star1.png) no-repeat center center;
position: absolute;
left:0;
top:0;
-webkit-animation: starspp 4s linear infinite both;
animation: starspp 4s linear infinite both;
}
.starlight .s2{
width:100%;
height: 100%;
display: block;
background:url(../img/star2.png) no-repeat center center;
position: absolute;
left:0;
top:0;
z-index: 2;
-webkit-animation: starspp2 4s linear infinite both;
animation: starspp2 4s linear infinite both;
}
.flash{
position: absolute;
left:50%;
margin-left:-500px;
top:50%;
margin-top: -500px;
z-index: 22;
}