html, body { width: 100%; overflow-x: hidden; overflow-y: auto }
body, div, h1, h2, h3, h4, h5, h6, p, blockquote, dl, dt, dd, ul, ol, li, fieldset, form, tr, th, td, center, input, button, textarea { padding: 0; margin: 0 }
table { border-collapse: collapse; border-spacing: 0; font-size: 12px; color: #888888; }
tr.public_bm_tr { }
fieldset, img { border: 0; }
button, input, select, textarea { font-size: 12px; }
input, img, select { vertical-align: middle; }
ul, li { list-style: none; }
h1, h2, h3, h4, h5, h6 { font-size: 100%; font-weight: normal; }
/* float */
.clearfix:after { content: ""; height: 0; visibility: hidden; display: block; clear: both; }
.clearfix { zoom: 1; }
.clear { clear: both; }
body { color: #a7a7a7; font: 24px/1.5 "Microsoft Yahei"; background: #0a0a0b; height: 100%;/* overflow: hidden; */ }
a { text-decoration: none; }
/*animation*/
@-webkit-keyframes rotate { from {
-webkit-transform: rotate(0deg);
-moz-transform: rotate(0deg);
-ms-transform: rotate(0deg);
-o-transform: rotate(0deg);
transform: rotate(0deg);
}
to { -webkit-transform: rotate(360deg); -moz-transform: rotate(360deg); -ms-transform: rotate(360deg); -o-transform: rotate(360deg); transform: rotate(360deg); }
}
@keyframes rotate { from {
-webkit-transform: rotate(0deg);
-moz-transform: rotate(0deg);
-ms-transform: rotate(0deg);
-o-transform: rotate(0deg);
transform: rotate(0deg);
}
to { -webkit-transform: rotate(360deg); -moz-transform: rotate(360deg); -ms-transform: rotate(360deg); -o-transform: rotate(360deg); transform: rotate(360deg); }
}
 @-moz-keyframes rotate { from {
-webkit-transform: rotate(0deg);
-moz-transform: rotate(0deg);
-ms-transform: rotate(0deg);
-o-transform: rotate(0deg);
transform: rotate(0deg);
}
to { -webkit-transform: rotate(360deg); -moz-transform: rotate(360deg); -ms-transform: rotate(360deg); -o-transform: rotate(360deg); transform: rotate(360deg); }
}
 @-o-keyframes rotate { from {
-webkit-transform: rotate(0deg);
-moz-transform: rotate(0deg);
-ms-transform: rotate(0deg);
-o-transform: rotate(0deg);
transform: rotate(0deg);
}
to { -webkit-transform: rotate(360deg); -moz-transform: rotate(360deg); -ms-transform: rotate(360deg); -o-transform: rotate(360deg); transform: rotate(360deg); }
}
 @-webkit-keyframes rotateR { from {
-webkit-transform: rotate(360deg);
-moz-transform: rotate(360deg);
-ms-transform: rotate(360deg);
-o-transform: rotate(360deg);
transform: rotate(360deg);
}
to { -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -ms-transform: rotate(0deg); -o-transform: rotate(0deg); transform: rotate(0deg); }
}
@keyframes rotateR { from {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
to { -webkit-transform: rotate(0deg); transform: rotate(0deg); }
}
 @-moz-keyframes rotateR { from {
-webkit-transform: rotate(360deg);
-moz-transform: rotate(360deg);
-ms-transform: rotate(360deg);
-o-transform: rotate(360deg);
transform: rotate(360deg);
}
to { -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -ms-transform: rotate(0deg); -o-transform: rotate(0deg); transform: rotate(0deg); }
}
 @-o-keyframes rotateR { from {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
to { -webkit-transform: rotate(0deg); transform: rotate(0deg); }
}
/*people*/

@keyframes people { 0% {
transform:rotate(0deg);
}
50% {
transform:rotate(5deg);
}
100% {
transform:rotate(0deg);
}
}
 @-moz-keyframes people { 0% {
transform:rotate(0deg);
}
50% {
transform:rotate(5deg);
}
100% {
transform:rotate(0deg);
}
}
 @-webkit-keyframes people { 0% {
transform:rotate(0deg);
}
50% {
transform:rotate(5deg);
}
100% {
transform:rotate(0deg);
}
}
 @-o-keyframes people { 0% {
transform:rotate(0deg);
}
50% {
transform:rotate(5deg);
}
100% {
transform:rotate(0deg);
}
}
/*star1*/
@keyframes star { from {
top:-500px;
right:-600px;
opacity:0;
}
to { top: 0; right: -110px; opacity: 1; }
}
 @-moz-keyframes star { from {
top:-500px;
right:-600px;
opacity:0;
}
to { top: 0; right: -110px; opacity: 1; }
}
 @-webkit-keyframes star { from {
top:-500px;
right:-600px;
opacity:0;
}
to { top: 0; right: -110px; opacity: 1; }
}
 @-o-keyframes star { from {
top:-500px;
right:-600px;
opacity:0;
}
to { top: 0; right: -110px; opacity: 1; }
}
/*star2*/
@keyframes star2 { from {
top:-100px;
left:0;
opacity:0;
}
to { top: 200px; left: -300px;opacity: 1; }
}
 @-moz-keyframes star2 { from {
top:-100px;
left:0;
opacity:0;
}
to { top: 200px;left: -300px;opacity: 1; }
}
 @-webkit-keyframes star2 { from {
top:-100px;
left:0;
opacity:0;
}
to { top: 200px; left: -300px;opacity: 1; }
}
 @-o-keyframes star 2 {
from {
top:-100px;
left:0;
opacity:0;
}
to {
top: 200px;
left: -300px;
opacity:1;
}
}
/*star3*/
@keyframes star3 { from {
top:100px;
right:-600px;
opacity:0;
}
to { top: 350px; right: -180px; opacity: 1; }
}
 @-moz-keyframes star3 { from {
top:100px;
right:-600px;
opacity:0;
}
to { top: 350px; right: -180px; opacity: 1; }
}
 @-webkit-keyframes star3 { from {
top:100px;
right:-600px;
opacity:0;
}
to { top: 350px; right: -180px; opacity: 1; }
}
 @-o-keyframes star3 { from {
top:100px;
right:-600px;
opacity:0;
}
to { top: 350px; right: -180px; opacity: 1; }
}
/*/animation*/
/*full-bg*/
.full-bg { position: relative; background: url(https://img7.99.com/my/activity/2016/02/02/full-bg.jpg) no-repeat center top; overflow-x: hidden; }
.wrapper { width: 1200px; height: 1080px; margin: 0 auto; position: relative; background: url(https://img7.99.com/my/activity/2016/02/02/main.jpg) no-repeat;/* height: 100%; */ }
/*header*/
.header { }
.logo { position: absolute; top: 10px; left: 0px; }
.logo img { width: 138px; }
.header h2 { display: none; }
.header h3 { position: absolute; z-index: 5; top: 545px; left: 456px; width: 311px; height: 40px; background: url(https://img7.99.com/my/activity/2016/02/02/h3-bg.png) 0 20px no-repeat; color: #fee4ae; font-size: 30px; font-weight: bold; text-align: center; line-height: 40px; }
.slogan, .mtl-bg, .star-01, .star-02, .star-03, .people { position: absolute; }
.slogan { z-index: 3; top: 172px; left: 380px; width: 464px; height: 448px; background: url(https://img7.99.com/my/activity/2016/02/02/slogan.png) no-repeat; }
.star-01 { top: 0; right: -110px; width: 218px; height: 116px; background: url(https://img7.99.com/my/activity/2016/02/02/start-01.png) no-repeat; -webkit-animation: star 2s infinite linear; animation: star 2s infinite linear;}
.star-02 { top: 300px; left: -150px; width: 218px; height: 118px; background: url(https://img7.99.com/my/activity/2016/02/02/start-02.png) no-repeat; -webkit-animation: star2 1s infinite linear; animation: star2 1s infinite linear; }
.star-03 { top: 350px; right: -180px; width: 218px; height: 116px; background: url(https://img7.99.com/my/activity/2016/02/02/start-03.png) no-repeat; -webkit-animation: star3 2s infinite linear; animation: star3 2s infinite linear; }
.people { top: 550px; right: -120px; width: 272px; height: 327px; background: url(https://img7.99.com/my/activity/2016/02/02/people.png) no-repeat; -webkit-animation: people 1s infinite linear; animation: people 1s infinite linear; -o-animation: people 1s infinite linear;-moz-animation: people 1s infinite linear; }
.mtl { position: relative; margin: 0 auto; width: 536px; height: 536px; top: 136px; left: 13px }
.mtl-bg { z-index: 1; background: url(https://img7.99.com/my/activity/2016/02/02/mtl-bg.png) no-repeat; width: 636px; height: 636px; left: -50px; top: 10px; -webkit-animation: rotate 50s infinite linear; animation: rotate 50s infinite linear; }
.mtl a { position: absolute; z-index: 2; width: 237px; height: 165px; text-align: center; line-height: 26px; -webkit-animation: rotateR 50s infinite linear; animation: rotateR 50s infinite linear; }
.mtl a:hover { opacity: 80; filter:progid:DXImageTransform.Microsoft.Alpha(Opacity=80);
}
.mtl a span { display: block; padding-top: 22px; padding-bottom: 20px; color: #fff; font-weight: bold; font-size: 26px; text-align: left; text-indent: 68px; }
.mtl .a1 { top: 230px; left: -195px; background: url(https://img7.99.com/my/activity/2016/02/02/a1.png) no-repeat; color: #b73d02; }
.mtl .a2 { top: -20px; left: -90px; background: url(https://img7.99.com/my/activity/2016/02/02/a2.png) no-repeat; color: #446600; }
.mtl .a3 { top: -110px; left: 194px; background: url(https://img7.99.com/my/activity/2016/02/02/a3.png) no-repeat; color: #d01e4b; }
.mtl .a4 { top: -30px; left: 460px; background: url(https://img7.99.com/my/activity/2016/02/02/a4.png) no-repeat; color: #981faa; }
.mtl .a5 { top: 230px; left: 585px; background: url(https://img7.99.com/my/activity/2016/02/02/a5.png) no-repeat; color: #b73d02; }
.mtl .a6 { top: 510px; left: 480px; background: url(https://img7.99.com/my/activity/2016/02/02//a6.png) no-repeat; color: #446600;  }
.mtl .a7 { top: 580px; left: 200px; background: url(https://img7.99.com/my/activity/2016/02/02/a7.png) no-repeat; color: #981faa; }
.mtl .a8 { top: 510px; left: -90px; background: url(https://img7.99.com/my/activity/2016/02/02/a8.png) no-repeat; color: #d01e4b; }
.mtl .a1 span { text-shadow: 0 1px 1px #f67a40; }
.mtl .a2 span { text-shadow: 0 1px 1px #5d8f0a; }
.mtl .a3 span { text-shadow: 0 1px 1px #d72d68; }
.mtl .a4 span { text-shadow: 0 1px 1px #af3ee3; }
.mtl .a5 span { text-shadow: 0 1px 1px #f67a40; }
.mtl .a6 span { text-shadow: 0 1px 1px #5d8f0a; }
.mtl .a7 span { text-shadow: 0 1px 1px #af3ee3; }
.mtl .a8 span { text-shadow: 0 1px 1px #d72d68; }
/*footer*/
.footer { height: 120px; padding-top: 30px; }
.footer p { height: 0; }
.footer a { color: #888888; text-decoration: none; }
.mtl.on a, .mtl.on .mtl-bg { animation-play-state: paused; -webkit-animation-play-state: paused; }