

.aniFromRightToleft{
	-webkit-animation: aniFromRightToleft 1s .4s ease both;
	animation: aniFromRightToleft 1s .4s ease both;
	
}
.aniFromRightToleft2{
  -webkit-animation: aniFromRightToleft 1s  ease both;
  animation: aniFromRightToleft 1s  ease both;
  
}

@keyframes aniFromRightToleft {
     0% {
      /*opacity: 0;*/
        transform: translate(1800px);
     }
     
     100% {
     	opacity: 1;
         transform: translate(0px);
     }
  }

@-webkit-keyframes aniFromRightToleft {
     0% {
      /*opacity: 0;*/
        -webkit-transform: translateX(1800px);
     }
     
     100% {
     	opacity: 1;
         -webkit-transform: translateX(0px);
     }
  }



.aniFromleftToRight{
  -webkit-animation: aniFromleftToRight 1s .5s ease both;
  animation: aniFromleftToRight 1s .5s ease both;
  
}

@keyframes aniFromleftToRight {
     0% {
      opacity: 0;
        transform: translate(-800px);
     }
     
     100% {
      opacity: 1;
         transform: translate(0px);
     }
  }

@-webkit-keyframes aniFromRightToleft {
     0% {
      /*opacity: 0;*/
        -webkit-transform: translateX(-800px);
     }
     
     100% {
      opacity: 1;
         -webkit-transform: translateX(0px);
     }
  }








.aniFromTopToBottom{
  -webkit-animation: aniFromTopToBottom 1s .2s ease;
  animation: aniFromTopToBottom 1s  .2s ease both;
  
}
.aniFromTopToBottom2{
  -webkit-animation: aniFromTopToBottom 2s ease;
  animation: aniFromTopToBottom 2s  ease both;
  
}

@keyframes aniFromTopToBottom {
     0% {
      opacity: 0;
        transform: translate(0,-300px);
     }
      70% {
      opacity: 1;
         transform: translate(0,0px);
     }
     90% {
      opacity: 1;
         transform: translate(0,-10px);
     }
     100% {
      opacity: 1;
         transform: translate(0px);
     }
  }

.aniFromBottom2{
  -webkit-animation: aniFromBottom2 1s .6s ease;
  animation: aniFromBottom2 1s .6s ease both;
  
}


@keyframes aniFromBottom2 {
     0% {
      opacity: 0;
        transform: translate(0,100px);
     }
     
     100% {
      opacity: 1;
         transform: translate(0px);
     }
  }


.FadeIn{
  -webkit-animation: FadeIn 1s .6s ease;

  animation: FadeIn 1s .6s ease both;
  
}


@keyframes FadeIn {
     0% {
      opacity: 0;
       
     }
     
     100% {
      opacity: 1;
       
     }
  }


.aniFadeInToTop{
  -webkit-animation: aniFadeInToTop 3s .6s ease both;
  animation: aniFadeInToTop 3s .6s ease both;
  
}

@keyframes aniFadeInToTop {
     0% {
      opacity: 0;
        transform: translate(0px,150px);
     }
     
     100% {
      opacity: 1;
         transform: translate(0px);
         transition-delay:300ms
     }
  }

/*about_us banner动画*/

  .aniAboutUs1{
  -webkit-animation: aniAboutUs 2s .2s ease infinite;
  animation: aniAboutUs 2s .2s ease infinite;
  
}
.aniAboutUs2{
  -webkit-animation: aniAboutUs 2s .2s ease infinite;
  animation: aniAboutUs 2s .2s ease infinite;
  
}

@keyframes aniAboutUs {
     0% {
      opacity: 0;
        transform: translate(200px,0);
     }
     
     100% {
      opacity: 1;
         transform: translate(0px);
     }
  }

  .aniAboutUsText{
    animation: aniAboutUs 1s .5s ease both;
  }

/*左右浮动白云*/

.aniCloud1{
  -webkit-animation: aniCloud 8s .5s linear alternate infinite;
  animation: aniCloud 8s .5s linear alternate infinite;
}
.aniCloud2{
  -webkit-animation: aniCloud 8s 2s linear alternate infinite;
  animation: aniCloud 8s 2s linear alternate infinite;
}
.aniCloud3{
  -webkit-animation: aniCloud 8s 2.1s linear alternate infinite;
  animation: aniCloud 8s 2.1s linear alternate infinite;
}
.aniCloud4{
  -webkit-animation: aniCloud 8s 0.8s linear alternate infinite;
  animation: aniCloud 8s 0.8s linear alternate infinite;
}


@keyframes aniCloud {
     0% {
      opacity: 1;
        transform: translate(0,0);
     }
     
     100% {
      opacity: 1;
         transform: translate(100px,0px);
     }
  }



  /*loan页面banner动画*/

  .aniBannerTextD{
  -webkit-animation: aniBannerTextD 1s .2s ease;
  animation: aniBannerTextD 1s .2s ease both;
  
}

@keyframes aniBannerTextD {
     0% {
      opacity: 0;
        transform: translate(0,-100px);
     }
      50% {
      opacity: .8;
         transform: translate(0，50px);
     }
     
     100% {
      opacity: 1;
         transform: translate(0px);
     }
  }




/*cundaitong页面banner文字扭曲动画*/

.aniTextSkew{
  -webkit-animation: aniTextSkew .8s 0.2s linear ;
  animation: aniTextSkew .8s 0.2s linear ;
}


@keyframes aniTextSkew {
     0% {
      opacity: .5;
        
        transform:skew(45deg,10deg);
        -webkit-transform:skew(45deg,10deg);
     }
     
     100% {
      opacity: 1;
        
         transform:skew(0deg);
         -webkit-transform:skew(0deg);
     }
  }












  /*Browhaus page1动画*/

  .aniHand{
  -webkit-animation: aniHand 1s 0.3s linear alternate infinite;
  animation: aniHand 1s 0.3s linear alternate infinite;
}


@keyframes aniHand {
     0% {
      opacity: 1;
        transform: translate(0,0);
     }
     
     100% {
      opacity: 1;
         transform: translate(10px,10px);
     }
  }



  .aniCicle{
  -webkit-animation: aniCicle 1s 0.3s linear alternate infinite;
  animation: aniCicle 1s 0.3s linear alternate infinite;
}


@keyframes aniCicle {
     0% {
      opacity: 1;
        transform: scale(1);
     }
     
     100% {
      opacity: 1;
         transform: scale(.9);
     }
  }




  .aniLight{
  -webkit-animation: aniLight .2s 0.5s linear alternate;
  animation: aniLight .2s 0.5s linear alternate;
}


@keyframes aniLight {
     0% {
      opacity: 0;
        transform: scale(.3);
        transform-origin:center 80%;
     }
     
     100% {
      opacity: 1;
         transform: scale(1);
     }
  }


  .aniLighter{
  -webkit-animation: aniLighter 6s 0s linear  infinite;
  animation: aniLighter 6s 0s linear  infinite;
}


@keyframes aniLighter {
     0% {
      opacity: 1;
        transform: rotate(0deg);
        
     }
     
     100% {
      opacity: 1;
         transform: rotate(360deg);
     }
  }


  .aniEyes{
  -webkit-animation: aniEyes 2s 0s linear;
  animation: aniEyes 2s 0s linea;
}


@keyframes aniEyes {
     0% {
      opacity: 0;
        transform: scale(.5);
        
     }
     
     100% {
      opacity: 1;
        transform: scale(1);
     }
  }



  .aniLarrow{
  -webkit-animation: aniLarrow 1s 0.3s linear alternate infinite;
  animation: aniLarrow 1s 0.3s linear alternate infinite;
}


@keyframes aniLarrow {
     0% {
      opacity: 1;
        transform: translate(0,-20px;);
     }
     50% {
      opacity: 1;
        transform: translate(0,0px;);
     }
     100% {
      opacity: 1;
         transform: translate(0px,40px);
     }
  }




/*由上到下进场并弹起一次*/



.bounceInDown{
    -webkit-animation:bounceInDown 800ms .2s ease both;
}
@-webkit-keyframes bounceInDown {
    0% {
        opacity: 0;
        -webkit-transform: translateY(-200px);
        transform: translateY(-200px)
    }

    60% {
        opacity: 1;
        -webkit-transform: translateY(30px);
        transform: translateY(30px)
    }

    80% {
        opacity: 1;
        -webkit-transform: translateY(-10px);
        transform: translateY(-10px)
    }

    100% {
        opacity: 1;
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }
}



.FromLeftToRight{
    -webkit-animation:FromLeftToRight 500ms .2s ease both;
}
@-webkit-keyframes FromLeftToRight{
0%{
    opacity:0;
    -webkit-transform:translateX(-3000px)}
100%{
    opacity:1;
    -webkit-transform:translateX(0);}
}



.fadeInFromSmall{
    -webkit-animation:fadeInFromSmall 800ms .5s ease both;
    transform-origin:50% 60%;
}
@-webkit-keyframes fadeInFromSmall {
    0% {
        opacity: 0;
        -webkit-transform: scale(0.1);
        transform: scale(0.1)
    }

    40% {
        opacity: 1;
        -webkit-transform: scale(1.02);
        transform: scale(1.02)
    }

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

@-webkit-keyframes intro05TextWrapText7{
    0%{-webkit-transform:rotateX(90deg);}
    100%{-webkit-transform:rotateX(0deg);}
}


/*由上到下进场并弹起一次*/



.bounceInDown{
    -webkit-animation:bounceInDown 800ms .2s ease both;
}
@-webkit-keyframes bounceInDown {
    0% {
        opacity: 0;
        -webkit-transform: translateY(-300px);
        transform: translateY(-300px)
    }

    60% {
        opacity: 1;
        -webkit-transform: translateY(30px);
        transform: translateY(30px)
    }

    80% {
        opacity: 1;
        -webkit-transform: translateY(-10px);
        transform: translateY(-10px)
    }

    100% {
        opacity: 1;
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }
}


/*箭头移动类*/
.arrow{
    position:absolute;
    -webkit-animation:arrow 1000ms 1000ms alternate-reverse  infinite;
}

@-webkit-keyframes arrow {
    0% {
        opacity: 1;
        -webkit-transform: translateX(-16px);
        transform: translateX(-16px)
    }

    100% {
        opacity: 1;
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }
}


/*箭头移动类*/
.arrowFromTop{
    -webkit-animation:arrowFromTop 1000ms 1000ms alternate-reverse  infinite;
}

@-webkit-keyframes arrowFromTop {
    0% {
        opacity: 1;
        -webkit-transform: translateY(-10px);
        transform: translateY(-10px)
    }

    100% {
        opacity: 1;
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }
}