.dot {
  visibility: hidden;
}

.level-0 {
   visibility: visible;
-ms-transform: translate(0,135px);
-moz-transform: translate(0,135px);
-webkit-transform: translate3d(0,135px,0);
-webkit-animation-name: level-0;
}
@-webkit-keyframes level-0{
0% { -webkit-transform: translate3d(0,0px,0);-moz-transform: translate(0,0px);-ms-transform: translate(0,0px); -webkit-animation-timing: ease-in;
}
35% { -webkit-transform: translate3d(0,135px,0);-moz-transform: translate(0,135px);-ms-transform: translate(0,135px); -webkit-animation-timing: ease-out;
}
55% { -webkit-transform: translate3d(0,101px,0);-moz-transform: translate(0,101px);-ms-transform: translate(0,101px); -webkit-animation-timing: ease-in;
}
71% { -webkit-transform: translate3d(0,135px,0);-moz-transform: translate(0,135px);-ms-transform: translate(0,135px); -webkit-animation-timing: ease-out;
}
81% { -webkit-transform: translate3d(0,126px,0);-moz-transform: translate(0,126px);-ms-transform: translate(0,126px); -webkit-animation-timing: ease-in;
}
90% { -webkit-transform: translate3d(0,135px,0);-moz-transform: translate(0,135px);-ms-transform: translate(0,135px); -webkit-animation-timing: ease-out;
}
94% { -webkit-transform: translate3d(0,132px,0);-moz-transform: translate(0,132px);-ms-transform: translate(0,132px); -webkit-animation-timing: ease-in;
}
100% { -webkit-transform: translate3d(0,135px,0);-moz-transform: translate(0,135px);-ms-transform: translate(0,135px); -webkit-animation-timing: ease-out;
}
}

.level-1 {
   visibility: visible;
-ms-transform: translate(0,180px);
-moz-transform: translate(0,180px);
-webkit-transform: translate3d(0,180px,0);
-webkit-animation-name: level-1;
}
@-webkit-keyframes level-1{
0% { -webkit-transform: translate3d(0,0px,0);-moz-transform: translate(0,0px);-ms-transform: translate(0,0px); -webkit-animation-timing: ease-in;}
35% { -webkit-transform: translate3d(0,180px,0);-moz-transform: translate(0,180px);-ms-transform: translate(0,180px); -webkit-animation-timing: ease-out;}
55% { -webkit-transform: translate3d(0,135px,0);-moz-transform: translate(0,135px);-ms-transform: translate(0,135px); -webkit-animation-timing: ease-in;}
71% { -webkit-transform: translate3d(0,180px,0);-moz-transform: translate(0,180px);-ms-transform: translate(0,180px); -webkit-animation-timing: ease-out;}
81% { -webkit-transform: translate3d(0,168px,0);-moz-transform: translate(0,168px);-ms-transform: translate(0,168px); -webkit-animation-timing: ease-in;}
89% { -webkit-transform: translate3d(0,180px,0);-moz-transform: translate(0,180px);-ms-transform: translate(0,180px); -webkit-animation-timing: ease-out;}
95% { -webkit-transform: translate3d(0,177px,0);-moz-transform: translate(0,177px);-ms-transform: translate(0,177px); -webkit-animation-timing: ease-in;}
100% { -webkit-transform: translate3d(0,180px,0);-moz-transform: translate(0,180px);-ms-transform: translate(0,180px); -webkit-animation-timing: ease-out;}
}

.level-2 {
   visibility: visible;

-ms-transform: translate(0,225px);
-moz-transform: translate(0,225px);
-webkit-transform: translate3d(0,225px,0);
-webkit-animation-name: level-2;
}
@-webkit-keyframes level-2{
0% { -webkit-transform: translate3d(0,0px,0);-moz-transform: translate(0,0px);-ms-transform: translate(0,0px); -webkit-animation-timing: ease-in;}
35% { -webkit-transform: translate3d(0,225px,0);-moz-transform: translate(0,225px);-ms-transform: translate(0,225px); -webkit-animation-timing: ease-out;}
53% { -webkit-transform: translate3d(0,168px,0);-moz-transform: translate(0,168px);-ms-transform: translate(0,168px); -webkit-animation-timing: ease-in;}
71% { -webkit-transform: translate3d(0,225px,0);-moz-transform: translate(0,225px);-ms-transform: translate(0,225px); -webkit-animation-timing: ease-out;}
80% { -webkit-transform: translate3d(0,210px,0);-moz-transform: translate(0,210px);-ms-transform: translate(0,210px); -webkit-animation-timing: ease-in;}
89% { -webkit-transform: translate3d(0,225px,0);-moz-transform: translate(0,225px);-ms-transform: translate(0,225px); -webkit-animation-timing: ease-out;}
95% { -webkit-transform: translate3d(0,221px,0);-moz-transform: translate(0,221px);-ms-transform: translate(0,221px); -webkit-animation-timing: ease-in;}
100% { -webkit-transform: translate3d(0,225px,0);-moz-transform: translate(0,225px);-ms-transform: translate(0,225px); -webkit-animation-timing: ease-out;}
}

.level-3 {
   visibility: visible;

-ms-transform: translate(0,270px);
-moz-transform: translate(0,270px);
-webkit-transform: translate3d(0,270px,0);
-webkit-animation-name: level-3;
}
@-webkit-keyframes level-3{
0% { -webkit-transform: translate3d(0,0px,0);-moz-transform: translate(0,0px);-ms-transform: translate(0,0px); -webkit-animation-timing: ease-in;}
35% { -webkit-transform: translate3d(0,270px,0);-moz-transform: translate(0,270px);-ms-transform: translate(0,270px); -webkit-animation-timing: ease-out;}
54% { -webkit-transform: translate3d(0,202px,0);-moz-transform: translate(0,202px);-ms-transform: translate(0,202px); -webkit-animation-timing: ease-in;}
71% { -webkit-transform: translate3d(0,270px,0);-moz-transform: translate(0,270px);-ms-transform: translate(0,270px); -webkit-animation-timing: ease-out;}
81% { -webkit-transform: translate3d(0,253px,0);-moz-transform: translate(0,253px);-ms-transform: translate(0,253px); -webkit-animation-timing: ease-in;}
89% { -webkit-transform: translate3d(0,270px,0);-moz-transform: translate(0,270px);-ms-transform: translate(0,270px); -webkit-animation-timing: ease-out;}
94% { -webkit-transform: translate3d(0,265px,0);-moz-transform: translate(0,265px);-ms-transform: translate(0,265px); -webkit-animation-timing: ease-in;}
100% { -webkit-transform: translate3d(0,270px,0);-moz-transform: translate(0,270px);-ms-transform: translate(0,270px); -webkit-animation-timing: ease-out;}
}

.level-4 {
   visibility: visible;

-ms-transform: translate(0,315px);
-moz-transform: translate(0,315px);
-webkit-transform: translate3d(0,315px,0);
-webkit-animation-name: level-4;
}
@-webkit-keyframes level-4{
0% { -webkit-transform: translate3d(0,0px,0);-moz-transform: translate(0,0px);-ms-transform: translate(0,0px); -webkit-animation-timing: ease-in;}
35% { -webkit-transform: translate3d(0,315px,0);-moz-transform: translate(0,315px);-ms-transform: translate(0,315px); -webkit-animation-timing: ease-out;}
54% { -webkit-transform: translate3d(0,236px,0);-moz-transform: translate(0,236px);-ms-transform: translate(0,236px); -webkit-animation-timing: ease-in;}
71% { -webkit-transform: translate3d(0,315px,0);-moz-transform: translate(0,315px);-ms-transform: translate(0,315px); -webkit-animation-timing: ease-out;}
81% { -webkit-transform: translate3d(0,295px,0);-moz-transform: translate(0,295px);-ms-transform: translate(0,295px); -webkit-animation-timing: ease-in;}
89% { -webkit-transform: translate3d(0,315px,0);-moz-transform: translate(0,315px);-ms-transform: translate(0,315px); -webkit-animation-timing: ease-out;}
95% { -webkit-transform: translate3d(0,310px,0);-moz-transform: translate(0,310px);-ms-transform: translate(0,310px); -webkit-animation-timing: ease-in;}
100% { -webkit-transform: translate3d(0,315px,0);-moz-transform: translate(0,315px);-ms-transform: translate(0,315px); -webkit-animation-timing: ease-out;}
}

.level-5 {
   visibility: visible;
-ms-transform: translate(0,360px);
-moz-transform: translate(0,360px);
-webkit-transform: translate3d(0,360px,0);
-webkit-animation-name: level-5;
}
@-webkit-keyframes level-5{
0% { -webkit-transform: translate3d(0,0px,0);-moz-transform: translate(0,0px);-ms-transform: translate(0,0px); -webkit-animation-timing: ease-in;}
35% { -webkit-transform: translate3d(0,360px,0);-moz-transform: translate(0,360px);-ms-transform: translate(0,360px); -webkit-animation-timing: ease-out;}
54% { -webkit-transform: translate3d(0,270px,0);-moz-transform: translate(0,270px);-ms-transform: translate(0,270px); -webkit-animation-timing: ease-in;}
71% { -webkit-transform: translate3d(0,360px,0);-moz-transform: translate(0,360px);-ms-transform: translate(0,360px); -webkit-animation-timing: ease-out;}
81% { -webkit-transform: translate3d(0,337px,0);-moz-transform: translate(0,337px);-ms-transform: translate(0,337px); -webkit-animation-timing: ease-in;}
89% { -webkit-transform: translate3d(0,360px,0);-moz-transform: translate(0,360px);-ms-transform: translate(0,360px); -webkit-animation-timing: ease-out;}
94% { -webkit-transform: translate3d(0,354px,0);-moz-transform: translate(0,354px);-ms-transform: translate(0,354px); -webkit-animation-timing: ease-in;}
100% { -webkit-transform: translate3d(0,360px,0);-moz-transform: translate(0,360px);-ms-transform: translate(0,360px); -webkit-animation-timing: ease-out;}
}

 .level-1-from0 {
-ms-transform: translate(0,180px);
-moz-transform: translate(0,180px);
-webkit-transform: translate3d(0,180px,0);
-webkit-animation-name: level-1-from0;
}
@-webkit-keyframes level-1-from0{
0% { -webkit-transform: translate3d(0,135px,0);-moz-transform: translate(0,135px);-ms-transform: translate(0,135px); -webkit-animation-timing: ease-in;}
35% { -webkit-transform: translate3d(0,180px,0);-moz-transform: translate(0,180px);-ms-transform: translate(0,180px); -webkit-animation-timing: ease-out;}
55% { -webkit-transform: translate3d(0,168px,0);-moz-transform: translate(0,168px);-ms-transform: translate(0,168px); -webkit-animation-timing: ease-in;}
72% { -webkit-transform: translate3d(0,180px,0);-moz-transform: translate(0,180px);-ms-transform: translate(0,180px); -webkit-animation-timing: ease-out;}
84% { -webkit-transform: translate3d(0,177px,0);-moz-transform: translate(0,177px);-ms-transform: translate(0,177px); -webkit-animation-timing: ease-in;}
100% { -webkit-transform: translate3d(0,180px,0);-moz-transform: translate(0,180px);-ms-transform: translate(0,180px); -webkit-animation-timing: ease-out;}
}

.level-2-from0 {
-ms-transform: translate(0,225px);
-moz-transform: translate(0,225px);
-webkit-transform: translate3d(0,225px,0);
-webkit-animation-name: level-2-from0;
}
@-webkit-keyframes level-2-from0{
0% { -webkit-transform: translate3d(0,135px,0);-moz-transform: translate(0,135px);-ms-transform: translate(0,135px); -webkit-animation-timing: ease-in;}
35% { -webkit-transform: translate3d(0,225px,0);-moz-transform: translate(0,225px);-ms-transform: translate(0,225px); -webkit-animation-timing: ease-out;}
55% { -webkit-transform: translate3d(0,202px,0);-moz-transform: translate(0,202px);-ms-transform: translate(0,202px); -webkit-animation-timing: ease-in;}
71% { -webkit-transform: translate3d(0,225px,0);-moz-transform: translate(0,225px);-ms-transform: translate(0,225px); -webkit-animation-timing: ease-out;}
82% { -webkit-transform: translate3d(0,219px,0);-moz-transform: translate(0,219px);-ms-transform: translate(0,219px); -webkit-animation-timing: ease-in;}
91% { -webkit-transform: translate3d(0,225px,0);-moz-transform: translate(0,225px);-ms-transform: translate(0,225px); -webkit-animation-timing: ease-out;}
95% { -webkit-transform: translate3d(0,223px,0);-moz-transform: translate(0,223px);-ms-transform: translate(0,223px); -webkit-animation-timing: ease-in;}
100% { -webkit-transform: translate3d(0,225px,0);-moz-transform: translate(0,225px);-ms-transform: translate(0,225px); -webkit-animation-timing: ease-out;}
}

.level-3-from0 {
-ms-transform: translate(0,270px);
-moz-transform: translate(0,270px);
-webkit-transform: translate3d(0,270px,0);
-webkit-animation-name: level-3-from0;
}
@-webkit-keyframes level-3-from0{
0% { -webkit-transform: translate3d(0,135px,0);-moz-transform: translate(0,135px);-ms-transform: translate(0,135px); -webkit-animation-timing: ease-in;}
35% { -webkit-transform: translate3d(0,270px,0);-moz-transform: translate(0,270px);-ms-transform: translate(0,270px); -webkit-animation-timing: ease-out;}
55% { -webkit-transform: translate3d(0,236px,0);-moz-transform: translate(0,236px);-ms-transform: translate(0,236px); -webkit-animation-timing: ease-in;}
71% { -webkit-transform: translate3d(0,270px,0);-moz-transform: translate(0,270px);-ms-transform: translate(0,270px); -webkit-animation-timing: ease-out;}
81% { -webkit-transform: translate3d(0,261px,0);-moz-transform: translate(0,261px);-ms-transform: translate(0,261px); -webkit-animation-timing: ease-in;}
90% { -webkit-transform: translate3d(0,270px,0);-moz-transform: translate(0,270px);-ms-transform: translate(0,270px); -webkit-animation-timing: ease-out;}
94% { -webkit-transform: translate3d(0,267px,0);-moz-transform: translate(0,267px);-ms-transform: translate(0,267px); -webkit-animation-timing: ease-in;}
100% { -webkit-transform: translate3d(0,270px,0);-moz-transform: translate(0,270px);-ms-transform: translate(0,270px); -webkit-animation-timing: ease-out;}
}

.level-4-from0 {
-ms-transform: translate(0,315px);
-moz-transform: translate(0,315px);
-webkit-transform: translate3d(0,315px,0);
-webkit-animation-name: level-4-from0;
}
@-webkit-keyframes level-4-from0{
0% { -webkit-transform: translate3d(0,135px,0);-moz-transform: translate(0,135px);-ms-transform: translate(0,135px); -webkit-animation-timing: ease-in;}
35% { -webkit-transform: translate3d(0,315px,0);-moz-transform: translate(0,315px);-ms-transform: translate(0,315px); -webkit-animation-timing: ease-out;}
55% { -webkit-transform: translate3d(0,270px,0);-moz-transform: translate(0,270px);-ms-transform: translate(0,270px); -webkit-animation-timing: ease-in;}
71% { -webkit-transform: translate3d(0,315px,0);-moz-transform: translate(0,315px);-ms-transform: translate(0,315px); -webkit-animation-timing: ease-out;}
81% { -webkit-transform: translate3d(0,303px,0);-moz-transform: translate(0,303px);-ms-transform: translate(0,303px); -webkit-animation-timing: ease-in;}
89% { -webkit-transform: translate3d(0,315px,0);-moz-transform: translate(0,315px);-ms-transform: translate(0,315px); -webkit-animation-timing: ease-out;}
95% { -webkit-transform: translate3d(0,312px,0);-moz-transform: translate(0,312px);-ms-transform: translate(0,312px); -webkit-animation-timing: ease-in;}
100% { -webkit-transform: translate3d(0,315px,0);-moz-transform: translate(0,315px);-ms-transform: translate(0,315px); -webkit-animation-timing: ease-out;}
}

.level-5-from0 {
-ms-transform: translate(0,360px);
-moz-transform: translate(0,360px);
-webkit-transform: translate3d(0,360px,0);
-webkit-animation-name: level-5-from0;
}
@-webkit-keyframes level-5-from0{
0% { -webkit-transform: translate3d(0,135px,0);-moz-transform: translate(0,135px);-ms-transform: translate(0,135px); -webkit-animation-timing: ease-in;}
35% { -webkit-transform: translate3d(0,360px,0);-moz-transform: translate(0,360px);-ms-transform: translate(0,360px); -webkit-animation-timing: ease-out;}
53% { -webkit-transform: translate3d(0,303px,0);-moz-transform: translate(0,303px);-ms-transform: translate(0,303px); -webkit-animation-timing: ease-in;}
71% { -webkit-transform: translate3d(0,360px,0);-moz-transform: translate(0,360px);-ms-transform: translate(0,360px); -webkit-animation-timing: ease-out;}
80% { -webkit-transform: translate3d(0,345px,0);-moz-transform: translate(0,345px);-ms-transform: translate(0,345px); -webkit-animation-timing: ease-in;}
89% { -webkit-transform: translate3d(0,360px,0);-moz-transform: translate(0,360px);-ms-transform: translate(0,360px); -webkit-animation-timing: ease-out;}
95% { -webkit-transform: translate3d(0,356px,0);-moz-transform: translate(0,356px);-ms-transform: translate(0,356px); -webkit-animation-timing: ease-in;}
100% { -webkit-transform: translate3d(0,360px,0);-moz-transform: translate(0,360px);-ms-transform: translate(0,360px); -webkit-animation-timing: ease-out;}
}

 .level-2-from1 {
-ms-transform: translate(0,225px);
-moz-transform: translate(0,225px);
-webkit-transform: translate3d(0,225px,0);
-webkit-animation-name: level-2-from1;
}
@-webkit-keyframes level-2-from1{
0% { -webkit-transform: translate3d(0,180px,0);-moz-transform: translate(0,180px);-ms-transform: translate(0,180px); -webkit-animation-timing: ease-in;}
35% { -webkit-transform: translate3d(0,225px,0);-moz-transform: translate(0,225px);-ms-transform: translate(0,225px); -webkit-animation-timing: ease-out;}
55% { -webkit-transform: translate3d(0,213px,0);-moz-transform: translate(0,213px);-ms-transform: translate(0,213px); -webkit-animation-timing: ease-in;}
72% { -webkit-transform: translate3d(0,225px,0);-moz-transform: translate(0,225px);-ms-transform: translate(0,225px); -webkit-animation-timing: ease-out;}
84% { -webkit-transform: translate3d(0,222px,0);-moz-transform: translate(0,222px);-ms-transform: translate(0,222px); -webkit-animation-timing: ease-in;}
100% { -webkit-transform: translate3d(0,225px,0);-moz-transform: translate(0,225px);-ms-transform: translate(0,225px); -webkit-animation-timing: ease-out;}
}

.level-3-from1 {
-ms-transform: translate(0,270px);
-moz-transform: translate(0,270px);
-webkit-transform: translate3d(0,270px,0);
-webkit-animation-name: level-3-from1;
}
@-webkit-keyframes level-3-from1{
0% { -webkit-transform: translate3d(0,180px,0);-moz-transform: translate(0,180px);-ms-transform: translate(0,180px); -webkit-animation-timing: ease-in;}
35% { -webkit-transform: translate3d(0,270px,0);-moz-transform: translate(0,270px);-ms-transform: translate(0,270px); -webkit-animation-timing: ease-out;}
55% { -webkit-transform: translate3d(0,247px,0);-moz-transform: translate(0,247px);-ms-transform: translate(0,247px); -webkit-animation-timing: ease-in;}
71% { -webkit-transform: translate3d(0,270px,0);-moz-transform: translate(0,270px);-ms-transform: translate(0,270px); -webkit-animation-timing: ease-out;}
82% { -webkit-transform: translate3d(0,264px,0);-moz-transform: translate(0,264px);-ms-transform: translate(0,264px); -webkit-animation-timing: ease-in;}
91% { -webkit-transform: translate3d(0,270px,0);-moz-transform: translate(0,270px);-ms-transform: translate(0,270px); -webkit-animation-timing: ease-out;}
95% { -webkit-transform: translate3d(0,268px,0);-moz-transform: translate(0,268px);-ms-transform: translate(0,268px); -webkit-animation-timing: ease-in;}
100% { -webkit-transform: translate3d(0,270px,0);-moz-transform: translate(0,270px);-ms-transform: translate(0,270px); -webkit-animation-timing: ease-out;}
}

.level-4-from1 {
-ms-transform: translate(0,315px);
-moz-transform: translate(0,315px);
-webkit-transform: translate3d(0,315px,0);
-webkit-animation-name: level-4-from1;
}
@-webkit-keyframes level-4-from1{
0% { -webkit-transform: translate3d(0,180px,0);-moz-transform: translate(0,180px);-ms-transform: translate(0,180px); -webkit-animation-timing: ease-in;}
35% { -webkit-transform: translate3d(0,315px,0);-moz-transform: translate(0,315px);-ms-transform: translate(0,315px); -webkit-animation-timing: ease-out;}
55% { -webkit-transform: translate3d(0,281px,0);-moz-transform: translate(0,281px);-ms-transform: translate(0,281px); -webkit-animation-timing: ease-in;}
71% { -webkit-transform: translate3d(0,315px,0);-moz-transform: translate(0,315px);-ms-transform: translate(0,315px); -webkit-animation-timing: ease-out;}
81% { -webkit-transform: translate3d(0,306px,0);-moz-transform: translate(0,306px);-ms-transform: translate(0,306px); -webkit-animation-timing: ease-in;}
90% { -webkit-transform: translate3d(0,315px,0);-moz-transform: translate(0,315px);-ms-transform: translate(0,315px); -webkit-animation-timing: ease-out;}
94% { -webkit-transform: translate3d(0,312px,0);-moz-transform: translate(0,312px);-ms-transform: translate(0,312px); -webkit-animation-timing: ease-in;}
100% { -webkit-transform: translate3d(0,315px,0);-moz-transform: translate(0,315px);-ms-transform: translate(0,315px); -webkit-animation-timing: ease-out;}
}

.level-5-from1 {
-ms-transform: translate(0,360px);
-moz-transform: translate(0,360px);
-webkit-transform: translate3d(0,360px,0);
-webkit-animation-name: level-5-from1;
}
@-webkit-keyframes level-5-from1{
0% { -webkit-transform: translate3d(0,180px,0);-moz-transform: translate(0,180px);-ms-transform: translate(0,180px); -webkit-animation-timing: ease-in;}
35% { -webkit-transform: translate3d(0,360px,0);-moz-transform: translate(0,360px);-ms-transform: translate(0,360px); -webkit-animation-timing: ease-out;}
55% { -webkit-transform: translate3d(0,315px,0);-moz-transform: translate(0,315px);-ms-transform: translate(0,315px); -webkit-animation-timing: ease-in;}
71% { -webkit-transform: translate3d(0,360px,0);-moz-transform: translate(0,360px);-ms-transform: translate(0,360px); -webkit-animation-timing: ease-out;}
81% { -webkit-transform: translate3d(0,348px,0);-moz-transform: translate(0,348px);-ms-transform: translate(0,348px); -webkit-animation-timing: ease-in;}
89% { -webkit-transform: translate3d(0,360px,0);-moz-transform: translate(0,360px);-ms-transform: translate(0,360px); -webkit-animation-timing: ease-out;}
95% { -webkit-transform: translate3d(0,357px,0);-moz-transform: translate(0,357px);-ms-transform: translate(0,357px); -webkit-animation-timing: ease-in;}
100% { -webkit-transform: translate3d(0,360px,0);-moz-transform: translate(0,360px);-ms-transform: translate(0,360px); -webkit-animation-timing: ease-out;}
}

 .level-3-from2 {
-ms-transform: translate(0,270px);
-moz-transform: translate(0,270px);
-webkit-transform: translate3d(0,270px,0);
-webkit-animation-name: level-3-from2;
}
@-webkit-keyframes level-3-from2{
0% { -webkit-transform: translate3d(0,225px,0);-moz-transform: translate(0,225px);-ms-transform: translate(0,225px); -webkit-animation-timing: ease-in;}
35% { -webkit-transform: translate3d(0,270px,0);-moz-transform: translate(0,270px);-ms-transform: translate(0,270px); -webkit-animation-timing: ease-out;}
55% { -webkit-transform: translate3d(0,258px,0);-moz-transform: translate(0,258px);-ms-transform: translate(0,258px); -webkit-animation-timing: ease-in;}
72% { -webkit-transform: translate3d(0,270px,0);-moz-transform: translate(0,270px);-ms-transform: translate(0,270px); -webkit-animation-timing: ease-out;}
84% { -webkit-transform: translate3d(0,267px,0);-moz-transform: translate(0,267px);-ms-transform: translate(0,267px); -webkit-animation-timing: ease-in;}
100% { -webkit-transform: translate3d(0,270px,0);-moz-transform: translate(0,270px);-ms-transform: translate(0,270px); -webkit-animation-timing: ease-out;}
}

.level-4-from2 {
-ms-transform: translate(0,315px);
-moz-transform: translate(0,315px);
-webkit-transform: translate3d(0,315px,0);
-webkit-animation-name: level-4-from2;
}
@-webkit-keyframes level-4-from2{
0% { -webkit-transform: translate3d(0,225px,0);-moz-transform: translate(0,225px);-ms-transform: translate(0,225px); -webkit-animation-timing: ease-in;}
35% { -webkit-transform: translate3d(0,315px,0);-moz-transform: translate(0,315px);-ms-transform: translate(0,315px); -webkit-animation-timing: ease-out;}
55% { -webkit-transform: translate3d(0,292px,0);-moz-transform: translate(0,292px);-ms-transform: translate(0,292px); -webkit-animation-timing: ease-in;}
71% { -webkit-transform: translate3d(0,315px,0);-moz-transform: translate(0,315px);-ms-transform: translate(0,315px); -webkit-animation-timing: ease-out;}
82% { -webkit-transform: translate3d(0,309px,0);-moz-transform: translate(0,309px);-ms-transform: translate(0,309px); -webkit-animation-timing: ease-in;}
91% { -webkit-transform: translate3d(0,315px,0);-moz-transform: translate(0,315px);-ms-transform: translate(0,315px); -webkit-animation-timing: ease-out;}
95% { -webkit-transform: translate3d(0,313px,0);-moz-transform: translate(0,313px);-ms-transform: translate(0,313px); -webkit-animation-timing: ease-in;}
100% { -webkit-transform: translate3d(0,315px,0);-moz-transform: translate(0,315px);-ms-transform: translate(0,315px); -webkit-animation-timing: ease-out;}
}

.level-5-from2 {
-ms-transform: translate(0,360px);
-moz-transform: translate(0,360px);
-webkit-transform: translate3d(0,360px,0);
-webkit-animation-name: level-5-from2;
}
@-webkit-keyframes level-5-from2{
0% { -webkit-transform: translate3d(0,225px,0);-moz-transform: translate(0,225px);-ms-transform: translate(0,225px); -webkit-animation-timing: ease-in;}
35% { -webkit-transform: translate3d(0,360px,0);-moz-transform: translate(0,360px);-ms-transform: translate(0,360px); -webkit-animation-timing: ease-out;}
55% { -webkit-transform: translate3d(0,326px,0);-moz-transform: translate(0,326px);-ms-transform: translate(0,326px); -webkit-animation-timing: ease-in;}
71% { -webkit-transform: translate3d(0,360px,0);-moz-transform: translate(0,360px);-ms-transform: translate(0,360px); -webkit-animation-timing: ease-out;}
81% { -webkit-transform: translate3d(0,351px,0);-moz-transform: translate(0,351px);-ms-transform: translate(0,351px); -webkit-animation-timing: ease-in;}
90% { -webkit-transform: translate3d(0,360px,0);-moz-transform: translate(0,360px);-ms-transform: translate(0,360px); -webkit-animation-timing: ease-out;}
94% { -webkit-transform: translate3d(0,357px,0);-moz-transform: translate(0,357px);-ms-transform: translate(0,357px); -webkit-animation-timing: ease-in;}
100% { -webkit-transform: translate3d(0,360px,0);-moz-transform: translate(0,360px);-ms-transform: translate(0,360px); -webkit-animation-timing: ease-out;}
}

 .level-4-from3 {
-ms-transform: translate(0,315px);
-moz-transform: translate(0,315px);
-webkit-transform: translate3d(0,315px,0);
-webkit-animation-name: level-4-from3;
}
@-webkit-keyframes level-4-from3{
0% { -webkit-transform: translate3d(0,270px,0);-moz-transform: translate(0,270px);-ms-transform: translate(0,270px); -webkit-animation-timing: ease-in;}
35% { -webkit-transform: translate3d(0,315px,0);-moz-transform: translate(0,315px);-ms-transform: translate(0,315px); -webkit-animation-timing: ease-out;}
55% { -webkit-transform: translate3d(0,303px,0);-moz-transform: translate(0,303px);-ms-transform: translate(0,303px); -webkit-animation-timing: ease-in;}
72% { -webkit-transform: translate3d(0,315px,0);-moz-transform: translate(0,315px);-ms-transform: translate(0,315px); -webkit-animation-timing: ease-out;}
84% { -webkit-transform: translate3d(0,312px,0);-moz-transform: translate(0,312px);-ms-transform: translate(0,312px); -webkit-animation-timing: ease-in;}
100% { -webkit-transform: translate3d(0,315px,0);-moz-transform: translate(0,315px);-ms-transform: translate(0,315px); -webkit-animation-timing: ease-out;}
}

.level-5-from3 {
-ms-transform: translate(0,360px);
-moz-transform: translate(0,360px);
-webkit-transform: translate3d(0,360px,0);
-webkit-animation-name: level-5-from3;
}
@-webkit-keyframes level-5-from3{
0% { -webkit-transform: translate3d(0,270px,0);-moz-transform: translate(0,270px);-ms-transform: translate(0,270px); -webkit-animation-timing: ease-in;}
35% { -webkit-transform: translate3d(0,360px,0);-moz-transform: translate(0,360px);-ms-transform: translate(0,360px); -webkit-animation-timing: ease-out;}
55% { -webkit-transform: translate3d(0,337px,0);-moz-transform: translate(0,337px);-ms-transform: translate(0,337px); -webkit-animation-timing: ease-in;}
71% { -webkit-transform: translate3d(0,360px,0);-moz-transform: translate(0,360px);-ms-transform: translate(0,360px); -webkit-animation-timing: ease-out;}
82% { -webkit-transform: translate3d(0,354px,0);-moz-transform: translate(0,354px);-ms-transform: translate(0,354px); -webkit-animation-timing: ease-in;}
91% { -webkit-transform: translate3d(0,360px,0);-moz-transform: translate(0,360px);-ms-transform: translate(0,360px); -webkit-animation-timing: ease-out;}
95% { -webkit-transform: translate3d(0,358px,0);-moz-transform: translate(0,358px);-ms-transform: translate(0,358px); -webkit-animation-timing: ease-in;}
100% { -webkit-transform: translate3d(0,360px,0);-moz-transform: translate(0,360px);-ms-transform: translate(0,360px); -webkit-animation-timing: ease-out;}
}

 .level-5-from4 {
-ms-transform: translate(0,360px);
-moz-transform: translate(0,360px);
-webkit-transform: translate3d(0,360px,0);
-webkit-animation-name: level-5-from4;
}
@-webkit-keyframes level-5-from4{
0% { -webkit-transform: translate3d(0,315px,0);-moz-transform: translate(0,315px);-ms-transform: translate(0,315px); -webkit-animation-timing: ease-in;}
35% { -webkit-transform: translate3d(0,360px,0);-moz-transform: translate(0,360px);-ms-transform: translate(0,360px); -webkit-animation-timing: ease-out;}
55% { -webkit-transform: translate3d(0,348px,0);-moz-transform: translate(0,348px);-ms-transform: translate(0,348px); -webkit-animation-timing: ease-in;}
72% { -webkit-transform: translate3d(0,360px,0);-moz-transform: translate(0,360px);-ms-transform: translate(0,360px); -webkit-animation-timing: ease-out;}
84% { -webkit-transform: translate3d(0,357px,0);-moz-transform: translate(0,357px);-ms-transform: translate(0,357px); -webkit-animation-timing: ease-in;}
100% { -webkit-transform: translate3d(0,360px,0);-moz-transform: translate(0,360px);-ms-transform: translate(0,360px); -webkit-animation-timing: ease-out;}
