@-webkit-keyframes fadeInRight {
  from {
    opacity: 1;
    -webkit-transform: translate3d(300%, 0, 0);
    transform: translate3d(300%, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

@keyframes fadeInRight {
  from {
    opacity: 1;
    -webkit-transform: translate3d(300%, 0, 0);
    transform: translate3d(300%, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}


@-webkit-keyframes xuanz {
 from {
   -webkit-transform:rotate(0deg); 
    transform:rotate(0deg); 
  }

  to {
    -webkit-transform:rotate(360deg); 
    transform:rotate(360deg); 
  }
}

@keyframes xuanz {
  from {
   -webkit-transform:rotate(0deg); 
    transform:rotate(0deg); 
  }

  to {
    -webkit-transform:rotate(360deg); 
    transform:rotate(360deg); 
  }
}
@-webkit-keyframes yd {
  from {
     -webkit-transform: translate(0, 0);
    transform: translate(0, 0);
  }
25%{
  -webkit-transform: translate(-40px, 20px);
    transform: translate(-40px, 20px);
}
50%{
   -webkit-transform: translate(0, 0);
    transform: translate(0, 0);
}

75%{
   -webkit-transform: translate(40px, -20px);
    transform: translate(40px, -20px);
}
100%{
   -webkit-transform: translate(0, 0);
    transform: translate(0, 0);
}


}

@keyframes yd {
   from {
     -webkit-transform: translate(0, 0);
    transform: translate(0, 0);
  }
25%{
  -webkit-transform: translate(-40px, 20px);
    transform: translate(-40px, 20px);
}
50%{
   -webkit-transform: translate(0, 0);
    transform: translate(0, 0);
}

75%{
   -webkit-transform: translate(40px, -20px);
    transform: translate(40px, -20px);
}
100%{
   -webkit-transform: translate(0, 0);
    transform: translate(0, 0);
}
}


@-webkit-keyframes yd2 {
  from {
     -webkit-transform: translate(0, 0);
    transform: translate(0, 0);
  }
25%{
  -webkit-transform: translate(-10px, 0);
    transform: translate(-10px, 0);
}
50%{
   -webkit-transform: translate(0, 0);
    transform: translate(0, 0);
}

75%{
   -webkit-transform: translate(10px, 0);
    transform: translate(10px, 0);
}
100%{
   -webkit-transform: translate(0, 0);
    transform: translate(0, 0);
}


}

@keyframes yd2 {
   from {
     -webkit-transform: translate(0, 0);
    transform: translate(0, 0);
  }
25%{
  -webkit-transform: translate(-30px, 0);
    transform: translate(-30px, 0);
}
50%{
   -webkit-transform: translate(0, 0);
    transform: translate(0, 0);
}

75%{
   -webkit-transform: translate(30px, 0);
    transform: translate(30px, 0);
}
100%{
   -webkit-transform: translate(0, 0);
    transform: translate(0, 0);
}
}




@-webkit-keyframes sc {
  from {
     -webkit-transform: scale(1);
    transform: scale(1);
  }
25%{
  -webkit-transform: scale(1.2);
    transform: scale(1.2);
}
50%{
  -webkit-transform: scale(1);
    transform: scale(1);
}

75%{
  -webkit-transform: scale(0.8);
    transform: scale(0.8);
}
100%{
  -webkit-transform: scale(1);
    transform: scale(1);
}


}

@keyframes sc {
  from {
     -webkit-transform: scale(1);
    transform: scale(1);
  }
25%{
  -webkit-transform: scale(1.2);
    transform: scale(1.2);
}
50%{
  -webkit-transform: scale(1);
    transform: scale(1);
}

75%{
  -webkit-transform: scale(0.8);
    transform: scale(0.8);
}
100%{
  -webkit-transform: scale(1);
    transform: scale(1);
}

}