/*login*/





/*  star  */
.star0
,.star1
,.star2
,.star3
,.star4
{
    width: 30px;
    height: 30px;
    position: absolute;
    left: 50%;
    top: 50%;
}
.star0{
    margin: -329px 0 0 -437px;
    -webkit-animation: star 16s linear infinite;
    -moz-animation: star 16s linear infinite;
    -o-animation: star 16s linear infinite;
    animation: star 16s linear infinite;    
}
.star1{
    margin: -216px 0 0 411px;
    -webkit-animation: star 30s linear infinite;
    -moz-animation: star 30s linear infinite;
    -o-animation: star 30s linear infinite;
    animation: star 30s linear infinite;    
}
.star2{
    margin: -86px 0 0 -358px;
    -webkit-animation: star 10s linear infinite;
    -moz-animation: star 10s linear infinite;
    -o-animation: star 10s linear infinite;
    animation: star 10s linear infinite;    
}
.star3{
    margin: -136px 0 0 -251px;
    -webkit-animation: star 5s linear infinite;
    -moz-animation: star 5s linear infinite;
    -o-animation: star 5s linear infinite;
    animation: star 5s linear infinite; 
}
.star4{
    margin: -22px 0 0 157px;
    -webkit-animation: star 3s linear infinite;
    -moz-animation: star 3s linear infinite;
    -o-animation: star 3s linear infinite;
    animation: star 3s linear infinite; 
}
@-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;}
}
.meteor0
,.meteor1
,.meteor2
,.meteor3
{
    position: absolute;
    left: 50%;
    top: 50%;
}
.meteor0{
    width: 40px;
    height: 26px;
    margin: -100px 0 0 -100px; 
    -webkit-animation: meteor0 4s ease infinite;
    -moz-animation: meteor0 4s ease infinite;
    -o-animation: meteor0 4s ease infinite;
    animation: meteor0 4s ease infinite;
    opacity: 0; 
}
@-webkit-keyframes meteor0{
    0%{opacity: 0;margin:-450px 0 0 600px;}
    25%{opacity: 1;}
    50%{opacity: 0;margin: -100px 0 0 -100px; }
    100%{}
}
@-moz-keyframes meteor0{
    0%{opacity: 0;margin:-450px 0 0 600px;}
    25%{opacity: 1;}
    50%{opacity: 0;margin: -100px 0 0 -100px; }
    100%{}
}
@-o-keyframes meteor0{
    0%{opacity: 0;margin:-450px 0 0 600px;}
    25%{opacity: 1;}
    50%{opacity: 0;margin: -100px 0 0 -100px; }
    100%{}
}
@keyframes meteor0{
    0%{opacity: 0;margin:-450px 0 0 600px;}
    25%{opacity: 1;}
    50%{opacity: 0;margin: -100px 0 0 -100px; }
    100%{}
}
.meteor1{
    width: 60px;
    height: 40px;
    margin: 500px 0 0 -500px; 
    -webkit-animation: meteor1 10s ease infinite;
    -moz-animation: meteor1 10s ease infinite;
    -o-animation: meteor1 10s ease infinite;
    animation: meteor1 10s ease infinite;
    opacity: 0; 
}
@-webkit-keyframes meteor1{
    0%{}
    80%{opacity: 0;margin:-400px 0 0 700px;}
    90%{opacity: 1;}
    100%{opacity: 0;margin: 600px 0 0 -500px; }
}
@-moz-keyframes meteor1{
    0%{}
    80%{opacity: 0;margin:-400px 0 0 700px;}
    90%{opacity: 1;}
    100%{opacity: 0;margin: 600px 0 0 -500px; }
}
@-o-keyframes meteor1{
    0%{}
    80%{opacity: 0;margin:-400px 0 0 700px;}
    90%{opacity: 1;}
    100%{opacity: 0;margin: 600px 0 0 -500px; }
}
@keyframes meteor1{
    0%{}
    80%{opacity: 0;margin:-400px 0 0 700px;}
    90%{opacity: 1;}
    100%{opacity: 0;margin: 600px 0 0 -500px; }
}
.meteor2{
    width: 90px;
    height: 60px;
    margin: -500px 0 0 300px; 
    -webkit-animation: meteor2 8s ease infinite;
    -moz-animation: meteor2 8s ease infinite;
    -o-animation: meteor2 8s ease infinite;
    animation: meteor2 8s ease infinite;
    animation-delay: 0; 
    opacity: 0; 
}
@-webkit-keyframes meteor2{
    0%{}
    25%{opacity: 0;margin:-500px 0 0 300px;}
    50%{opacity: 1;}
    75%{opacity: 0;margin: 500px 0 0 -1000px; }
    100%{}
}
@-moz-keyframes meteor2{
    0%{}
    25%{opacity: 0;margin:-500px 0 0 300px;}
    50%{opacity: 1;}
    75%{opacity: 0;margin: 500px 0 0 -1000px; }
    100%{}
}
@-o-keyframes meteor2{
    0%{}
    25%{opacity: 0;margin:-500px 0 0 300px;}
    50%{opacity: 1;}
    75%{opacity: 0;margin: 500px 0 0 -1000px; }
    100%{}
}
@keyframes meteor2{
    0%{}
    25%{opacity: 0;margin:-500px 0 0 300px;}
    50%{opacity: 1;}
    75%{opacity: 0;margin: 500px 0 0 -1000px; }
    100%{}
}
.meteor3{
    width: 90px;
    height: 60px;
    margin: -100px 0 0 1000px; 
    -webkit-animation: meteor3 16s ease infinite;
    -moz-animation: meteor3 16s ease infinite;
    -o-animation: meteor3 16s ease infinite;
    animation: meteor3 16s ease infinite;
    opacity: 0; 
}
@-webkit-keyframes meteor3{
    0%{}
    25%{opacity: 0;margin:-100px 0 0 1000px;}
    50%{opacity: 1;}
    75%{opacity: 0;margin: 400px 0 0 100px; }
    100%{}
}
@-moz-keyframes meteor3{
    0%{}
    25%{opacity: 0;margin:-100px 0 0 1000px;}
    50%{opacity: 1;}
    75%{opacity: 0;margin: 400px 0 0 100px; }
    100%{}
}
@-o-keyframes meteor3{
    0%{}
    25%{opacity: 0;margin:-100px 0 0 1000px;}
    50%{opacity: 1;}
    75%{opacity: 0;margin: 400px 0 0 100px; }
    100%{}
}
@keyframes meteor3{
    0%{}
    25%{opacity: 0;margin:-100px 0 0 1000px;}
    50%{opacity: 1;}
    75%{opacity: 0;margin: 400px 0 0 100px; }
    100%{}
}
