html, body{
 height:100%;
 padding:0;
 margin:0;

}
body{margin:0;width:100%;position:absolute;font-family:arial; overflow:hidden;resize:none; }

/*xpaker update 20150429*/
#background {
 position:absolute;
 top:0;
 bottom:0;
 left:0;
 right:0;
 margin:auto;
}

img{position:absolute}
.qiangbi_on { z-index: 1;}
.diban_on{z-index:1;bottom:0}
.chuanglian_on{z-index:2;top:0}
.chuang_on{z-index:4;top:37%}
.chuangzhao_on{z-index:5}
.bihua_on{z-index:3}
.deng_on{z-index:4;top:0}
.yigui_on{z-index:4;left:0}
.zhuozi_on{z-index:3}
.ditan_on{z-index:2;bottom:0}
.chuangtougui_on{z-index:6;right:1%}
.wanju_on{z-index:7;bottom:8%}
@-webkit-keyframes star_shine { 
0% {-webkit-transform:scale(1) rotate(0deg);}
 50% {-webkit-transform:scale(4) rotate(45deg);}
 100% {-webkit-transform:scale(1) rotate(0deg);}
}
@-o-keyframes star_shine { 
0% {-o-transform:scale(1) rotate(0deg);}
 50% {-o-transform:scale(4) rotate(45deg);}
 100% {-o-transform:scale(1) rotate(0deg);}
}
@-moz-keyframes star_shine { 
0% {-moz-transform:scale(1) rotate(0deg);}
 50% {-moz-transform:scale(4) rotate(45deg);}
 100% {-moz-transform:scale(1) rotate(0deg);}
}
@-ms-keyframes star_shine { 
0% {-ms-transform:scale(1) rotate(0deg);}
 50% {-ms-transform:scale(4) rotate(45deg);}
 100% {-ms-transform:scale(1) rotate(0deg);}
}
#star1{ left:20%; top:20%; z-index:3; -webkit-animation:star_shine 1.0s linear infinite; -moz-animation:star_shine 1.0s linear infinite; -o-animation:star_shine 1.0s linear infinite;-ms-animation:star_shine 1.0s linear infinite;}
#star2{ left:45%; top:21%; z-index:3; -webkit-animation:star_shine 1.01s ease infinite; -moz-animation:star_shine 1.01s ease infinite; -o-animation:star_shine 1.01s ease infinite;-ms-animation:star_shine 1.0s linear infinite;}
#star3{ left:64%; top:32%; z-index:3; -webkit-animation:star_shine 1.02s ease-in infinite; -moz-animation:star_shine 1.02s ease-in infinite; -o-animation:star_shine 1.02s ease-in infinite;-ms-animation:star_shine 1.0s linear infinite;}
#star4{ left:75%; top:13%; z-index:3; -webkit-animation:star_shine 1.03s ease-out infinite; -moz-animation:star_shine 1.03s ease-out infinite; -o-animation:star_shine 1.03s ease-out infinite;-ms-animation:star_shine 1.0s linear infinite;}
#star5{ left:50%; top:37%; z-index:3; -webkit-animation:star_shine 1.04s linear infinite; -moz-animation:star_shine 1.04s linear infinite; -o-animation:star_shine 1.04s linear infinite;-ms-animation:star_shine 1.0s linear infinite;}
#star6{ left:35%; top:28%; z-index:3; -webkit-animation:star_shine 1.05s linear infinite; -moz-animation:star_shine 1.05s linear infinite; -o-animation:star_shine 1.05s linear infinite;-ms-animation:star_shine 1.0s linear infinite;}
#star7{ left:29%; top:30%; z-index:3; -webkit-animation:star_shine 1.06s linear infinite; -moz-animation:star_shine 1.06s linear infinite; -o-animation:star_shine 1.06s linear infinite;-ms-animation:star_shine 1.0s linear infinite;}
#star8{ left:64%; top:25%; z-index:3; -webkit-animation:star_shine 1.07s linear infinite; -moz-animation:star_shine 1.07s linear infinite; -o-animation:star_shine 1.07s linear infinite;-ms-animation:star_shine 1.0s linear infinite;}
#star9{ left:54%; top:32%; z-index:3; -webkit-animation:star_shine 1.08s linear infinite; -moz-animation:star_shine 1.08s linear infinite; -o-animation:star_shine 1.08s linear infinite;-ms-animation:star_shine 1.0s linear infinite;}

#star_show1{ left:39%; top:4%; z-index:30; -webkit-animation:star_shine 1.0s linear infinite; -moz-animation:star_shine 1.0s linear infinite; -o-animation:star_shine 1.0s linear infinite;-ms-animation:star_shine 1.0s linear infinite;}
#star_show2{ left:27%; top:1%; z-index:30; -webkit-animation:star_shine 1.01s linear infinite; -moz-animation:star_shine 1.01s linear infinite; -o-animation:star_shine 1.0s linear infinite;-ms-animation:star_shine 1.0s linear infinite;}
#star_show3{ left:66%; top:88%; z-index:30; -webkit-animation:star_shine 1.02s linear infinite; -moz-animation:star_shine 1.02s linear infinite; -o-animation:star_shine 1.0s linear infinite;-ms-animation:star_shine 1.0s linear infinite;}
#star_show4{ left:72%; top:43%; z-index:30; -webkit-animation:star_shine 1.03s linear infinite; -moz-animation:star_shine 1.03s linear infinite; -o-animation:star_shine 1.0s linear infinite;-ms-animation:star_shine 1.0s linear infinite;}
#star_show5{ left:67%; top:29%; z-index:30; -webkit-animation:star_shine 1.04s linear infinite; -moz-animation:star_shine 1.04s linear infinite; -o-animation:star_shine 1.0s linear infinite;-ms-animation:star_shine 1.0s linear infinite;}
#star_show6{ left:75%; top:68%; z-index:30; -webkit-animation:star_shine 1.05s linear infinite; -moz-animation:star_shine 1.05s linear infinite; -o-animation:star_shine 1.0s linear infinite;-ms-animation:star_shine 1.0s linear infinite;}
#star_show7{ left:63%; top:67%; z-index:30; -webkit-animation:star_shine 1.06s linear infinite; -moz-animation:star_shine 1.06s linear infinite; -o-animation:star_shine 1.0s linear infinite;-ms-animation:star_shine 1.0s linear infinite;}
#star_show8{ left:51%; top:36%; z-index:30; -webkit-animation:star_shine 1.07s linear infinite; -moz-animation:star_shine 1.07s linear infinite; -o-animation:star_shine 1.0s linear infinite;-ms-animation:star_shine 1.0s linear infinite;}
#star_show9{ left:80%; top:65%; z-index:30; -webkit-animation:star_shine 1.08s linear infinite; -moz-animation:star_shine 1.08s linear infinite; -o-animation:star_shine 1.0s linear infinite;-ms-animation:star_shine 1.0s linear infinite;}
#star_show10{ left:95%; top:11%; z-index:30; -webkit-animation:star_shine 1.09s linear infinite; -moz-animation:star_shine 1.09s linear infinite; -o-animation:star_shine 1.0s linear infinite;-ms-animation:star_shine 1.0s linear infinite;}
#star_show11{ left:92%; top:68%; z-index:30; -webkit-animation:star_shine 1.0s linear infinite; -moz-animation:star_shine 1.0s linear infinite; -o-animation:star_shine 1.0s linear infinite;-ms-animation:star_shine 1.0s linear infinite;}
#star_show12{ left:69%; top:53%; z-index:30; -webkit-animation:star_shine 1.01s linear infinite; -moz-animation:star_shine 1.01s linear infinite; -o-animation:star_shine 1.0s linear infinite;-ms-animation:star_shine 1.0s linear infinite;}
#star_show13{ left:3%; top:82%; z-index:30; -webkit-animation:star_shine 1.02s linear infinite; -moz-animation:star_shine 1.02s linear infinite; -o-animation:star_shine 1.0s linear infinite;-ms-animation:star_shine 1.0s linear infinite;}
#star_show14{ left:10%; top:22%; z-index:30; -webkit-animation:star_shine 1.03s linear infinite; -moz-animation:star_shine 1.03s linear infinite; -o-animation:star_shine 1.0s linear infinite;-ms-animation:star_shine 1.0s linear infinite;}
#star_show15{ left:79%; top:32%; z-index:30; -webkit-animation:star_shine 1.04s linear infinite; -moz-animation:star_shine 1.04s linear infinite; -o-animation:star_shine 1.0s linear infinite;-ms-animation:star_shine 1.0s linear infinite;}
#star_show16{ left:46%; top:90%; z-index:30; -webkit-animation:star_shine 1.05s linear infinite; -moz-animation:star_shine 1.05s linear infinite; -o-animation:star_shine 1.0s linear infinite;-ms-animation:star_shine 1.0s linear infinite;}
#star_show17{ left:51%; top:46%; z-index:30; -webkit-animation:star_shine 1.06s linear infinite; -moz-animation:star_shine 1.06s linear infinite; -o-animation:star_shine 1.0s linear infinite;-ms-animation:star_shine 1.0s linear infinite;}
#star_show18{ left:34%; top:88%; z-index:30; -webkit-animation:star_shine 1.07s linear infinite; -moz-animation:star_shine 1.07s linear infinite; -o-animation:star_shine 1.0s linear infinite;-ms-animation:star_shine 1.0s linear infinite;}
#star_show19{ left:27%; top:56%; z-index:30; -webkit-animation:star_shine 1.08s linear infinite; -moz-animation:star_shine 1.08s linear infinite; -o-animation:star_shine 1.0s linear infinite;-ms-animation:star_shine 1.0s linear infinite;}
#star_show20{ left:36%; top:38%; z-index:30; -webkit-animation:star_shine 1.09s linear infinite; -moz-animation:star_shine 1.09s linear infinite; -o-animation:star_shine 1.0s linear infinite;-ms-animation:star_shine 1.0s linear infinite;}

#progress_bar{left:20%; top:40%;  width:50%;height:30%;border:3px solid white;background: blue;overflow:hidden;-webkit-box-shadow:0px 0px 30px white;}
#progress{margin-left:1%;margin-top:1%;width:97%;height:70%;background: red;}
#progNum{margin-left:45%; margin-top:0; text-align:center;color:white;}

#begin_logo{left:38%; top:40%;width:25%;height:7%;position:absolute; z-index:1000; cursor:pointer;}
#first_logo{right:1%; bottom:4%;width:25%;height:7%;position:absolute; z-index:1000; cursor:pointer;}
#second_logo{left:27%; bottom:4%;width:25%;height:7%;position:absolute; z-index:1000; cursor:pointer;}
#third_logo{right:1%; top:5%;width:25%;height:7%;position:absolute; z-index:1000; cursor:pointer;}
#MG1{ width:23%; height:11%;z-index:1; left:39%; top:73%;z-index:1000;}
#MG2{ width:20%;  height:9%;z-index:1; left:78%; top:88%;z-index:1000;}
#MG3{ width:15%; height:8%; z-index:1; left:81%; top:88%;z-index:1000;}