﻿  
.bounceInShow{
-webkit-animation:bounceIns 1s .2s ease both;
-moz-animation:bounceIns 1s .2s ease both;}
@-webkit-keyframes bounceIns{
0%{opacity:0;
-webkit-transform:scale(.3)}
50%{opacity:1;
-webkit-transform:scale(1.05)}
70%{-webkit-transform:scale(.9)}
100%{-webkit-transform:scale(1)}
}
@-moz-keyframes bounceIns{
0%{opacity:0;
-moz-transform:scale(.3)}
50%{opacity:1;
-moz-transform:scale(1.05)}
70%{-moz-transform:scale(.9)}
100%{-moz-transform:scale(1)}
}

@-webkit-keyframes swings{
20%,40%,60%,80%,100%{-webkit-transform-origin:top center}
20%{-webkit-transform:rotate(15deg)}
40%{-webkit-transform:rotate(-10deg)}
60%{-webkit-transform:rotate(5deg)}
80%{-webkit-transform:rotate(-5deg)}
100%{-webkit-transform:rotate(0deg)}
}
@-moz-keyframes swings{
20%,40%,60%,80%,100%{-moz-transform-origin:top center}
20%{-moz-transform:rotate(15deg)}
40%{-moz-transform:rotate(-10deg)}
60%{-moz-transform:rotate(5deg)}
80%{-moz-transform:rotate(-5deg)}
100%{-moz-transform:rotate(0deg)}
}
 

@-webkit-keyframes bounceup{
    0%,100%{ transform: translate3d(50px ,0px, 0)}50%{ transform: translate3d(0px,0px, 0)}
}
@-moz-keyframes bounceup{
    0%,100%{ transform: translate3d(50px ,0px, 0)}50%{ transform: translate3d(0px,0px, 0)}
}


@-webkit-keyframes bouncerate{
    0%,100%{ transform: rotate(10deg) scale(1.2)  }50%{ transform: rotate(-10deg) scale(1)}
}
@-moz-keyframes bouncerate{
    0%,100%{ transform: rotate(10deg) scale(1.2)  }50%{ transform: rotate(-10deg) scale(1)}
}

@-webkit-keyframes bouncetop{0%{opacity: 0;-webkit-transform: scale3d(.3, .3, .3);transform: scale3d(.3, .3, .3);}
    50%{opacity: 1;}}
@keyframes bouncetop{0%{opacity: 0;-webkit-transform: scale3d(.3, .3, .3);transform: scale3d(.3, .3, .3);}
    50%{opacity: 1;}}

@-webkit-keyframes bounceInLeft{0%{opacity:0;-webkit-transform:translateX(-2000px)}
    60%{opacity:1;-webkit-transform:translateX(30px)}
    80%{-webkit-transform:translateX(-10px)}
    100%{-webkit-transform:translateX(0)}}
@-moz-keyframes bounceInLeft{0%{opacity:0;-moz-transform:translateX(-2000px)}
    60%{opacity:1;-moz-transform:translateX(30px)}
    80%{-moz-transform:translateX(-10px)}
    100%{-moz-transform:translateX(0)}}

@-webkit-keyframes bounceInRight{0%{opacity:0;-webkit-transform:translateX(2000px)}
    60%{opacity:1;-webkit-transform:translateX(-30px)}
    80%{-webkit-transform:translateX(10px)}
    100%{-webkit-transform:translateX(0)}}
@-moz-keyframes bounceInRight{0%{opacity:0;-moz-transform:translateX(2000px)}
    60%{opacity:1;-moz-transform:translateX(-30px)}
    80%{-moz-transform:translateX(10px)}
    100%{-moz-transform:translateX(0)}}

@-webkit-keyframes zoomInDown{0%{opacity: 0;-webkit-transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0);transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0);-webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);}
    60%{opacity: 1;-webkit-transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);-webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);}}
@keyframes zoomInDown{0%{opacity: 0;-webkit-transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0);transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0);-webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);}
    60%{opacity: 1;-webkit-transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);-webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);}}


@-webkit-keyframes zoomIn{0%{opacity: 0;-webkit-transform: scale3d(.3, .3, .3);transform: scale3d(.3, .3, .3);}
    50%{opacity: 1;}}
@keyframes zoomIn{0%{opacity: 0;-webkit-transform: scale3d(.3, .3, .3);transform: scale3d(.3, .3, .3);}
    50%{opacity: 1;}}


@-webkit-keyframes bounceInDown{0%{opacity:0;-webkit-transform:translateY(2000px)}
    60%{opacity:1;-webkit-transform:translateY(30px)}
    80%{-webkit-transform:translateY(-10px)}
    100%{-webkit-transform:translateY(0)}}
@-moz-keyframes bounceInDown{0%{opacity:0;-moz-transform:translateY(2000px)}
    60%{opacity:1;-moz-transform:translateY(30px)}
    80%{-moz-transform:translateY(-10px)}
    100%{-moz-transform:translateY(0)}}

@-webkit-keyframes flipInY{0%{-webkit-transform:perspective(400px) rotateY(90deg);opacity:0}
    40%{-webkit-transform:perspective(400px) rotateY(-10deg)}
    70%{-webkit-transform:perspective(400px) rotateY(10deg)}
    100%{-webkit-transform:perspective(400px) rotateY(0deg);opacity:1}}
@-moz-keyframes flipInY{0%{-moz-transform:perspective(400px) rotateY(90deg);opacity:0}
    40%{-moz-transform:perspective(400px) rotateY(-10deg)}
    70%{-moz-transform:perspective(400px) rotateY(10deg)}
    100%{-moz-transform:perspective(400px) rotateY(0deg);opacity:1}}



@-webkit-keyframes syiconnscale{
    0%,100%{-webkit-transform: scale(1,1);}50% {-webkit-transform: scale(1.2,1.2); }
}
@-moz-keyframes syiconnscale{
    0%,100%{-moz-transform: scale(1,1);}50% {-moz-transform: scale(1.2,1.2); }
}


@-webkit-keyframes bounce {
    from,
    20%,
    53%,
    80%,
    to {
        -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
        animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
    40%,
    43% {
        -webkit-animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
        animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
        -webkit-transform: translate3d(0, -15px, 0);
        transform: translate3d(0, -15px, 0);
    }
    70% {
        -webkit-animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
        animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
        -webkit-transform: translate3d(0, -15px, 0);
        transform: translate3d(0, -15px, 0);
    }
    90% {
        -webkit-transform: translate3d(0, -4px, 0);
        transform: translate3d(0, -4px, 0);
    }
}

@-webkit-keyframes bounceleft {
    20%{
        transform:rotate(45deg);
    }
    40%{
        transform:translate3d(0, 0px, 0);   
    }
    80%{
        transform:translate3d(0, 10px, 0);
    }
    100% {
       transform:translate3d(0, 0px, 0);  
    }
}


@keyframes bounceopacity{
    0%,100%{
        opacity: 0;
    }
    50% {
        opacity: 1;
    }
}

@-webkit-keyframes tada{0%{-webkit-transform:scale(1);transform:scale(1);opacity: 0;}10%,20%{-webkit-transform:scale(0.9) rotate(-3deg);transform:scale(0.9) rotate(-3deg)}30%,50%,70%,90%{-webkit-transform:scale(1.1) rotate(3deg);transform:scale(1.1) rotate(3deg)}40%,60%,80%{-webkit-transform:scale(1.1) rotate(-3deg);transform:scale(1.1) rotate(-3deg)}100%{-webkit-transform:scale(1) rotate(0);transform:scale(1) rotate(0);opacity: 1;}}

@-webkit-keyframes rollIn{0%{opacity:0;-webkit-transform:translateX(-100%) rotate(-120deg);transform:translateX(-100%) rotate(-120deg)}100%{opacity:1;-webkit-transform:translateX(0px) rotate(0deg);transform:translateX(0px) rotate(0deg)}}
@-webkit-keyframes rotateIn{0%{-webkit-transform-origin:center center;transform-origin:center center;-webkit-transform:rotate(-200deg);transform:rotate(-200deg);opacity:0}100%{-webkit-transform-origin:center center;transform-origin:center center;-webkit-transform:rotate(0);transform:rotate(0);opacity:1}}

@-webkit-keyframes slideInLeft{0%{opacity:0;-webkit-transform:translateX(-2000px);transform:translateX(-2000px)}100%{-webkit-transform:translateX(0);transform:translateX(0)}}

@-webkit-keyframes slideInRight{0%{opacity:0;-webkit-transform:translateX(2000px);transform:translateX(2000px)}100%{-webkit-transform:translateX(0);transform:translateX(0)}}

@-webkit-keyframes rotateInDownLeft{0%{-webkit-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:rotate(-90deg);transform:rotate(-90deg);opacity:0}100%{-webkit-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:rotate(0);transform:rotate(0);opacity:1}}
@-webkit-keyframes rotateInDownRight{0%{-webkit-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:rotate(90deg);transform:rotate(90deg);opacity:0}100%{-webkit-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:rotate(0);transform:rotate(0);opacity:1}}

@-webkit-keyframes rubberBand{0%{-webkit-transform:scale(1);transform:scale(1); opacity: 0;}30%{-webkit-transform:scaleX(1.25) scaleY(0.75);transform:scaleX(1.25) scaleY(0.75)}40%{-webkit-transform:scaleX(0.75) scaleY(1.25);transform:scaleX(0.75) scaleY(1.25)}60%{-webkit-transform:scaleX(1.15) scaleY(0.85);transform:scaleX(1.15) scaleY(0.85)}100%{-webkit-transform:scale(1);transform:scale(1);opacity: 1}}

@-webkit-keyframes bounceInDownx{0%{opacity:0;-webkit-transform:translateY(-2000px);transform:translateY(-2000px)}60%{opacity:1;-webkit-transform:translateY(30px);transform:translateY(30px)}80%{-webkit-transform:translateY(-10px);transform:translateY(-10px)}100%{-webkit-transform:translateY(0);transform:translateY(0)}}

@-webkit-keyframes bounceInUps{0%{opacity:0;-webkit-transform:translateY(2000px);transform:translateY(2000px)}60%{opacity:1;-webkit-transform:translateY(-30px);transform:translateY(-30px)}80%{-webkit-transform:translateY(10px);transform:translateY(10px)}100%{-webkit-transform:translateY(0);transform:translateY(0)}}
@-webkit-keyframes swing{20%{-webkit-transform:rotate(15deg);transform:rotate(15deg)}40%{-webkit-transform:rotate(-10deg);transform:rotate(-10deg)}60%{-webkit-transform:rotate(5deg);transform:rotate(5deg)}80%{-webkit-transform:rotate(-5deg);transform:rotate(-5deg)}100%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}}

@-webkit-keyframes flip{0%{-webkit-transform:perspective(400px) translateZ(0) rotateY(0) scale(1);transform:perspective(400px) translateZ(0) rotateY(0) scale(1);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}40%{-webkit-transform:perspective(400px) translateZ(150px) rotateY(170deg) scale(1);transform:perspective(400px) translateZ(150px) rotateY(170deg) scale(1);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}50%{-webkit-transform:perspective(400px) translateZ(150px) rotateY(190deg) scale(1);transform:perspective(400px) translateZ(150px) rotateY(190deg) scale(1);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}80%{-webkit-transform:perspective(400px) translateZ(0) rotateY(360deg) scale(.95);transform:perspective(400px) translateZ(0) rotateY(360deg) scale(.95);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}100%{-webkit-transform:perspective(400px) translateZ(0) rotateY(360deg) scale(1);transform:perspective(400px) translateZ(0) rotateY(360deg) scale(1);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}}

@-webkit-keyframes fadeInRight{0%{opacity:0;-webkit-transform:translateX(20px);transform:translateX(20px)}100%{opacity:1;-webkit-transform:translateX(0);transform:translateX(0)}}

@-webkit-keyframes bounceIn{0%{opacity:0;-webkit-transform:scale(.3);transform:scale(.3)}50%{opacity:1;-webkit-transform:scale(1.05);transform:scale(1.05)}70%{-webkit-transform:scale(.9);transform:scale(.9)}100%{opacity:1;-webkit-transform:scale(1);transform:scale(1)}}


@-webkit-keyframes bounce-up {
   
    25% {
         -webkit-transform: translateY(10px);
    }
    50%{
         -webkit-transform: translateY(5px); 
    }
    
    75% {
         -webkit-transform: translateY(8px);
    }
     100% {
         -webkit-transform: translateY(0px);
    }
}
 
@-moz-keyframes bounce-up {
    25% {
        -moz-transform: translateY(10px);
    }
    50%{
        -moz-transform: translateY(5px); 
    }
    
    75% {
        -moz-transform: translateY(8px);
    }
     100% {
        -moz-transform: translateY(0px);
    }
}

@keyframes bounce-up {
    25% {
        transform: translateY(10px);
    }
    50%{
        transform: translateY(5px); 
    }
    
    75% {
        transform: translateY(8px);
    }
     100% {
        transform: translateY(0px);
    }
}
 



@-webkit-keyframes bounceInop { 0% {opacity: 0} 100% {opacity: 1 ;}}
@-moz-keyframes bounceInop {0% {opacity: 0 }  100% {opacity: 1;}}
@keyframes bounceInop {0% {opacity: 0 }  100% {opacity: 1;}}


@-webkit-keyframes bounceBot { 0% {opacity: 0.3} 100% {opacity:  1;}}
@-moz-keyframes bounceBot {0% {opacity: 0.3}  100% {opacity:  1;}}
@keyframes bounceBot {0% {opacity: 0.3}  100% {opacity: 1;}}

@-webkit-keyframes bounceshan { 0% {background: #e22730} 50%{ ackground: #e22730 } 51%{ ackground: #1d84c0 } 100% {background: #1d84c0;}}
@-moz-keyframes bounceshan {0% {background: #e22730} 50%{ ackground: #e22730 } 51%{ ackground: #1d84c0 } 100% {background: #1d84c0;}}
@keyframes bounceshan {0% {background: #e22730}  50%{ ackground: #e22730 } 51%{ ackground: #1d84c0 } 100% {background: #1d84c0;}}

 


@-webkit-keyframes rotate{
    from{
        -webkit-transform:rotate(0deg)
    }

   to{
    -webkit-transform:rotate(360deg)
    }
}
@-moz-keyframes rotate{
    from{
        -moz-transform:rotate(0deg)
    }
   to{
    -moz-transform:rotate(360deg)
    }
}
@keyframes rotate{
    from{
        transform:rotate(0deg)
    }
   to{
       transform:rotate(360deg)
    }
}



@-webkit-keyframes bounce-yun {
   
    0%{
        -webkit-transform: translateX(0px);
    }
    25% {
        -webkit-transform: translateX(30px);
    }
    50%{
        -webkit-transform: translateX(0px); 
    }
    75% {
        -webkit-transform: translateX(-30px);
    }
     100% {
        -webkit-transform: translateX(0px);
    }
}
 
@-moz-keyframes bounce-yun {
    0%{
        -moz-transform: translateX(0px);
    }
    25% {
        -moz-transform: translateX(30px);
    }
    50%{
        -moz-transform: translateX(0px); 
    }
    75% {
        -moz-transform: translateX(-30px);
    }
     100% {
        -moz-transform: translateX(0px);
    }
}

@keyframes bounce-yun {
    0%{
        transform: translateX(0px);
    }
    25% {
        transform: translateX(30px);
    }
    50%{
        transform: translateX(0px); 
    }
    75% {
        transform: translateX(-100px);
		transform: translateY(50px);
    }
     100% {
        transform: translateX(0px);
    }
}



@-webkit-keyframes bounce-jqt {
   
    0%{
        -webkit-transform: translateX(0px);
        opacity: 0.8;
    }
   
    50%{
        -webkit-transform: translateX(60px); 
    }
   
     100% {
        -webkit-transform: translateX(100px);
        opacity: 1;
    }
}
 
@-moz-keyframes bounce-jqt {
    0%{
        -moz-transform: translateX(0px);
        opacity: 0.8;
    }
   
    50%{
        -moz-transform: translateX(60px); 
    }
   
     100% {
        -moz-transform: translateX(100px);
        opacity: 1;
    }
}

@keyframes bounce-jqt {
     0%{
        transform: translateX(0px); 
		opacity:0.8
    } 
    50%{
        transform: translateX(325px); 
    }
   
     100% {
        transform: translateX(650px); 
		opacity:1
    }
}

@-webkit-keyframes bounce-op {
   
    0%,100%{
       
        opacity: 0;
    }
   
    
}

@-webkit-keyframes bounce-op1 {
   
    0%,100%{
       
        opacity: 1;
    }
   
    
}










