


.index-logob { width:105px; height:105px; position:absolute;left:50%; margin-left:-600px; top:5%; z-index:44; background:url(/skin/images/logob.svg) center no-repeat; display:block;}
.index-bg {background:#100e17;height: 899px;}

/*����*/
.index-animate {width:100%;height:100%;}
.index-animate a { display:block; }
.index-animate a img { display:block;}

.index-txt { /*width:860px; height:409px;*/ z-index:20; position:absolute; /*left:50%; top:50%; margin-left:-430px; margin-top:-354.5px; padding-top:200px;text-align:center;*/ }
.index-txt h1 {font-family:'DINCond-Bold',Arial, Helvetica; font-size:48px; color:#FFF; text-transform:uppercase; letter-spacing:9px; padding-top:2%; font-style:normal;}
.index-txt h3 { font-size:30px; color:#FFF; letter-spacing:5px; padding-bottom:5%;}
.iplay { border:#FFF 3px solid;border-radius:100px; width:80px; height:80px; overflow:hidden; position:relative; margin:auto;-webkit-transition:all .3s ease;-moz-transition:all .3s ease;transition:all .3s ease;}
.iplay i{display:block;width:0;height:0;border-width:20px 0 20px 30px;border-style:solid;border-color:transparent transparent transparent #fff;position:absolute;top:50%;left:50%; margin-left:-10px; margin-top:-20px;}
.index-txt a:hover .iplay {transform:rotate(180deg);-ms-transform:rotate(180deg);-moz-transform:rotate(180deg);-webkit-transform:rotate(180deg);-o-transform:rotate(180deg);}
.index-txt a:hover .iplay i { border-color:transparent transparent transparent #9dacff;}
#myVideo1 { cursor: pointer; }


/*�˽����*/
.imore {text-align:center; color:#fff; font-size:14px; border:#FFF 1px solid; margin:auto; display:block; width:165px; height:45px; line-height:45px; position:relative;}
.imore * {display:block; overflow:hidden;-webkit-transition:all .3s ease;-moz-transition:all .3s ease;transition:all .3s ease;}
.imore a {color:#fff; }
.imore span { position:absolute; z-index:3; height:10px;}
.imore span i{width:100px; height:1px; background:#FFF;margin-top:2px;}
.imore span em{width:5px; height:5px; background:#FFF;border-radius:100px;}
.il { left:-70px; top:20px;}
.ir { right:-70px; top:20px;}
.il em {float:left;}
.il i {float:left;}
.ir em {float:right;}
.ir i {float:right;}
.imore:hover { background:#5b6d9b; color:#fff;border:#9dacff 1px solid;}
.imore:hover .il { left:-80px; }
.imore:hover .ir { right:-80px; }
.imore:hover span i{width:50px;}
.imore:hover span i,.imore:hover span em{background:#9dacff;}



/*����*/
.index-eath { width:609px; height:609px; z-index:2;position:absolute; left:50%; top:50%;margin-left:-304.5px; margin-top:-304.5px;animation: eathspin 66s linear infinite;-webkit-animation: eathspin 66s linear infinite;}
.index-eath a { display: block; }
.index-eath a img {display: block; width: 100%; height: auto;}


@keyframes eathspin{
	from {transform:rotate(0);-ms-transform:rotate(0);-moz-transform:rotate(0);-webkit-transform:rotate(0);-o-transform:rotate(0);}to {transform:rotate(360deg);-ms-transform:rotate(360deg);-moz-transform:rotate(360deg); -webkit-transform:rotate(360deg);-o-transform:rotate(360deg);}
}
@-moz-keyframes eathspin
{
	from {transform:rotate(0);-ms-transform:rotate(0);-moz-transform:rotate(0);-webkit-transform:rotate(0);-o-transform:rotate(0);}to {transform:rotate(360deg);-ms-transform:rotate(360deg);-moz-transform:rotate(360deg); -webkit-transform:rotate(360deg);-o-transform:rotate(360deg);}
}
@-webkit-keyframes eathspin
{
	from {transform:rotate(0);-ms-transform:rotate(0);-moz-transform:rotate(0);-webkit-transform:rotate(0);-o-transform:rotate(0);}to {transform:rotate(360deg);-ms-transform:rotate(360deg);-moz-transform:rotate(360deg); -webkit-transform:rotate(360deg);-o-transform:rotate(360deg);}
}
@-o-keyframes eathspin
{
	from {transform:rotate(0);-ms-transform:rotate(0);-moz-transform:rotate(0);-webkit-transform:rotate(0);-o-transform:rotate(0);}to {transform:rotate(360deg);-ms-transform:rotate(360deg);-moz-transform:rotate(360deg); -webkit-transform:rotate(360deg);-o-transform:rotate(360deg);}
}


.stars { overflow:hidden;width: 100%; height: 100%; position:fixed;left:0;top: 0;z-index:4;} 

/*����*/
.star{display: block; width:2px; height:3px; border-radius: 50%; background:#8043f3; top:0; left:40%; position: relative; transform-origin: 100% 0; animation: star-ani 6s infinite ease; box-shadow: 0 0 2px 2px rgba(255, 255, 255, .3); opacity: 0; z-index:2;}
.star:after{content: ''; display: block; top: 0px; left: 3px; border: 0px solid #9dacff; border-width: 0px 190px 2px 190px; border-color: transparent transparent transparent rgba(255, 255, 255, .3); transform: rotate(-45deg) translate3d(1px, 1px, 0); box-shadow: 0 0 1px 0 rgba(255, 255, 255, .1); transform-origin: 0% 100%; animation: shooting-ani 3s infinite ease;}
.star1{top: 0; left:48%; background: #9dacff; animation-delay: 2s; -webkit-animation-delay: 2s; -moz-animation-delay: 2s;}
.star1:after{border-color: transparent transparent transparent #9dacff; animation-delay: 2s; -webkit-animation-delay: 2s; -moz-animation-delay: 2s;}
.star2{top: 0; left: 55%; background:#9dacff; animation-delay: 4s; -webkit-animation-delay: 4s; -moz-animation-delay: 4s;}
.star2:after{border-color: transpareanimation-delay: 12s; -webkit-animation-delay: 4s; -moz-animation-delay: 4s; animation-delay: 4s;}
.star3{top: 0; left: 60%; background: #9dacff; animation-delay: 6s;}
.star3:after{border-color: transparent transparent transparent #9dacff; animation-delay: 6s;}
.star4{top: 0; left: 80%; background:#9dacff; animation-delay: 7s; -webkit-animation-delay: 7s; -moz-animation-delay: 7s;}
.star4:after{border-color: transpareanimation-delay: 12s; -webkit-animation-delay: 7s; -moz-animation-delay: 7s; animation-delay: 7s;}
.star5{top: 0; left:70%; background: #9dacff; animation-delay: 9s; -webkit-animation-delay: 9s; -moz-animation-delay: 9s;}
.star5:after{border-color: transparent transparent transparent #9dacff; animation-delay: 8s; -webkit-animation-delay: 8s; -moz-animation-delay:8s;}

@keyframes star-ani{
	0%{opacity: 0; transform: scale(0) rotate(0) translate3d(0, 0, 0); -webkit-transform: scale(0) rotate(0) translate3d(0, 0, 0); -moz-transform: scale(0) rotate(0) translate3d(0, 0, 0);} 
	50%{opacity: 1; transform: scale(1) rotate(0) translate3d(-200px, 200px, 0); -webkit-transform: scale(1) rotate(0) translate3d(-200px, 200px, 0); -moz-transform: scale(1) rotate(0) translate3d(-200px, 200px, 0);} 
	100%{opacity: 0; transform: scale(1) rotate(0) translate3d(-300px, 300px, 0); -webkit-transform: scale(1) rotate(0) translate3d(-300px, 300px, 0); -moz-transform: scale(1) rotate(0) translate3d(-300px, 300px, 0);}
}



/*��˸*/
.starpoint {color: #6b20e7; background:#6b20e7;border-radius:100px; width:3px;height:3px;-moz-box-shadow:0px 0px 2px #fff;-webkit-box-shadow:0px 0px 2px #fff ;box-shadow:0px 0px 2px #fff; position:absolute; z-index:3;animation: fade 1600ms infinite;-webkit-animation: fade 1600ms infinite;}
.starpoint1  { left:26%; top:44%; animation: fade 3600ms infinite;-webkit-animation: fade 3600ms infinite;}
.starpoint2  { left:22%; top:24%; width:2px;height:2px;}
.starpoint3  { left:74%; top:44%; animation: fade 2600ms infinite;-webkit-animation: fade 2600ms infinite;}
.starpoint4  { left:79%; top:34%; width:2px;height:2px; }
.starpoint5  { left:92%; top:24%; animation: fade 3600ms infinite;-webkit-animation: fade 3600ms infinite;background:#995bff; width:4px;height:4px;}
.starpoint6  { left:69%; top:74%; width:2px;height:2px; }
.starpoint7  { left:12%; top:64%; animation: fade 2600ms infinite;-webkit-animation: fade 2600ms infinite;}
.starpoint8  { left:30%; top:74%; width:1px;height:1px; }
.starpoint9  { left:28%; top:64%; animation: fade 3600ms infinite;-webkit-animation: fade 3600ms infinite;}
.starpoint10 { left:88%; top:46%; animation: fade 2600ms infinite;-webkit-animation: fade 2600ms infinite;background:#995bff; width:4px;height:4px;}
.starpoint11 { left:77%; top:30%; width:2px;height:2px; }
.starpoint12 { left:90%; top:20%; animation: fade 3600ms infinite;-webkit-animation: fade 3600ms infinite;}
.starpoint13 { left:66%; top:68%; width:2px;height:2px; }
.starpoint14 { left:10%; top:60%; animation: fade 2600ms infinite;-webkit-animation: fade 2600ms infinite;}
.starpoint15 { left:28%; top:70%; width:1px;height:1px; }
.starpoint16 { left:24%; top:53%; animation: fade 3600ms infinite;-webkit-animation: fade 3600ms infinite;}
.starpoint17 { left:22%; top:43%; animation: fade 1000ms infinite;-webkit-animation: fade 1000ms infinite;background:#995bff; width:4px;height:4px;}
.starpoint18 { left:76%; top:16%; animation: fade 1000ms infinite;-webkit-animation: fade 1000ms infinite;}
.starpoint19 { left:75%; top:20%; width:2px;height:2px; }
.starpoint20 { left:71%; top:18%; animation: fade 2600ms infinite;-webkit-animation: fade 2600ms infinite;}
.starpoint21 { left:66%; top:19%; width:2px;height:2px; }
.starpoint22 { left:34%; top:21%; animation: fade 1000ms infinite;-webkit-animation: fade 1000ms infinite;}
.starpoint23 { left:35%; top:14%; width:1px;height:1px; }
.starpoint24 { left:36%; top:12%; animation: fade 1000ms infinite;-webkit-animation: fade 1000ms infinite;}
.starpoint25 { left:37%; top:13%; width:2px;height:2px; }



@keyframes fade {
    from {opacity: 1.0;}
    50% {opacity: 0.4;}
    to {opacity: 1.0;}
}

@-webkit-keyframes fade {
    from {opacity: 1.0;}
    50% {opacity: 0.4;}
    to {opacity: 1.0;}
}







