/* pullDown */
/* .pullDown{
	width: 270px;
	height: 444px;
	background-image: none !important;
	background-color: #fe5652 !important;
	border-radius: 24px;
    margin: 0px auto;
} */
/* .pullDown{
	animation-name: pullDown;
	-webkit-animation-name: pullDown;	

	animation-duration: 1.1s;	
	-webkit-animation-duration: 1.1s;

	animation-timing-function: ease-out;	
	-webkit-animation-timing-function: ease-out;	

	transform-origin: 50% 0%;
	-ms-transform-origin: 50% 0%;
	-webkit-transform-origin: 50% 0%; 		
} */

@keyframes pullDown {
	0% {
		transform: scaleY(0.1);
	}
	40% {
		transform: scaleY(1.02);
	}
	60% {
		transform: scaleY(0.98);
	}
	80% {
		transform: scaleY(1.01);
	}
	100% {
		transform: scaleY(0.98);
	}				
	80% {
		transform: scaleY(1.01);
	}
	100% {
		transform: scaleY(1);
	}							
}

@-webkit-keyframes pullDown {
	0% {
		-webkit-transform: scaleY(0.1);
	}
	40% {
		-webkit-transform: scaleY(1.02);
	}
	60% {
		-webkit-transform: scaleY(0.98);
	}
	80% {
		-webkit-transform: scaleY(1.01);
	}
	100% {
		-webkit-transform: scaleY(0.98);
	}				
	80% {
		-webkit-transform: scaleY(1.01);
	}
	100% {
		-webkit-transform: scaleY(1);
	}		
}
/* 左边淡入 */
.leftFadesIn {
-webkit-animation:fadeInLeft 1s .2s ease both;
-moz-animation:fadeInLeft 1s .2s ease both;
}
@-webkit-keyframes fadeInLeft {
	0% {
		opacity:0;
		-webkit-transform:translateX(-20px)
	}
	100% {
		opacity:1;
		-webkit-transform:translateX(0)
	}
}
@-moz-keyframes fadeInLeft {
	0% {
		opacity:0;
		-moz-transform:translateX(-20px)
	}
	100% {
		opacity:1;
		-moz-transform:translateX(0)
	}
}
/* 顶部淡入 */
.fadeInDownBig {
	-webkit-animation:fadeInDownBig 1s .2s ease both;
	-moz-animation:fadeInDownBig 1s .2s ease both;
}
@-webkit-keyframes fadeInDownBig {
	0% {
		opacity:0;
		-webkit-transform:translateY(-2000px)
	}
	100% {
		opacity:1;
		-webkit-transform:translateY(0)
	}
}
@-moz-keyframes fadeInDownBig {
	0% {
		opacity:0;
		-moz-transform:translateY(-2000px)
	}
	100% {
		opacity:1;
		-moz-transform:translateY(0)
	}
}
/* 上方淡入*/
.fadeInDown {
-webkit-animation:fadeInDown 1s .2s ease both;
-moz-animation:fadeInDown 1s .2s ease both;
}
@-webkit-keyframes fadeInDown {
0% {
opacity:0;
-webkit-transform:translateY(-20px)
}
100% {
opacity:1;
-webkit-transform:translateY(0)
}
}
@-moz-keyframes fadeInDown {
0% {
opacity:0;
-moz-transform:translateY(-20px)
}
100% {
opacity:1;
-moz-transform:translateY(0)
}
}

/* 脉冲 pulse*/
.pulse {
	-webkit-animation:pulse 1s .2s ease both;
	-moz-animation:pulse 1s .2s ease both;
}
@-webkit-keyframes pulse {
	0% {
		-webkit-transform:scale(1)
	}
	50% {
		-webkit-transform:scale(1.1)
	}
	100% {
		-webkit-transform:scale(1)
	}
}
@-moz-keyframes pulse {
	0% {
		-moz-transform:scale(1)
	}
	50% {
		-moz-transform:scale(1.1)
	}
	100% {
		-moz-transform:scale(1)
	}
}
/* bounceIn */

	@-webkit-keyframes bounceIn {
	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 bounceIn {
	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)
	}
	}

/*tada  */
@-webkit-keyframes tada {
0% {
-webkit-transform:scale(1)
}
10%, 20% {
-webkit-transform:scale(0.9) rotate(-3deg)
}
30%, 50%, 70%, 90% {
-webkit-transform:scale(1.1) rotate(3deg)
}
40%, 60%, 80% {
-webkit-transform:scale(1.1) rotate(-3deg)
}
100% {
-webkit-transform:scale(1) rotate(0)
}
}
@-moz-keyframes tada {
0% {
-moz-transform:scale(1)
}
10%, 20% {
-moz-transform:scale(0.9) rotate(-3deg)
}
30%, 50%, 70%, 90% {
-moz-transform:scale(1.1) rotate(3deg)
}
40%, 60%, 80% {
-moz-transform:scale(1.1) rotate(-3deg)
}
100% {
-moz-transform:scale(1) rotate(0)
}
}
/* 摇摆 */
.shake {
-webkit-animation:shake 1s .2s ease both;
-moz-animation:shake 1s .2s ease both;
}
@-webkit-keyframes shake {
0%, 100% {
-webkit-transform:translateX(0);
}
10%, 30%, 50%, 70%, 90% {
-webkit-transform:translateX(-10px);
}
20%, 40%, 60%, 80% {
-webkit-transform:translateX(10px);
}
}
@-moz-keyframes shake {
0%, 100% {
-moz-transform:translateX(0);
}
10%, 30%, 50%, 70%, 90% {
-moz-transform:translateX(-10px);
}
20%, 40%, 60%, 80% {
-moz-transform:translateX(10px);
}
}


@keyframes animation-down {
	    from {
	        opacity: 0;
	        transition: all 1s ease 0s, opacity 1.5s ease 0s;
	        transform: translateY(-40px);
	    }
	    to {
	        opacity: 1;
	        transition: all 1s ease 0s, opacity 1.5s ease 0s;
	    }
	}
	.my-an-down {
		-webkit-animation:animation-down 1s .2s ease both;
		-moz-animation:animation-down 1s .2s ease both;
	}
	
	/* 翻转 */
.flip {
-webkit-animation:flip 1s .2s ease both;
-moz-animation:flip 1s .2s ease both;
}
@-webkit-keyframes flip {
0% {
-webkit-transform:perspective(400px) rotateY(0);
-webkit-animation-timing-function:ease-out
}
40% {
-webkit-transform:perspective(400px) translateZ(150px) rotateY(170deg);
-webkit-animation-timing-function:ease-out
}
50% {
-webkit-transform:perspective(400px) translateZ(150px) rotateY(190deg) scale(1);
-webkit-animation-timing-function:ease-in
}
80% {
-webkit-transform:perspective(400px) rotateY(360deg) scale(.95);
-webkit-animation-timing-function:ease-in
}
100% {
-webkit-transform:perspective(400px) scale(1);
-webkit-animation-timing-function:ease-in
}
}
@-moz-keyframes flip {
0% {
-moz-transform:perspective(400px) rotateY(0);
-moz-animation-timing-function:ease-out
}
40% {
-moz-transform:perspective(400px) translateZ(150px) rotateY(170deg);
-moz-animation-timing-function:ease-out
}
50% {
-moz-transform:perspective(400px) translateZ(150px) rotateY(190deg) scale(1);
-moz-animation-timing-function:ease-in
}
80% {
-moz-transform:perspective(400px) rotateY(360deg) scale(.95);
-moz-animation-timing-function:ease-in
}
100% {
-moz-transform:perspective(400px) scale(1);
-moz-animation-timing-function:ease-in
}
}


.fadeIn{
	animation-name: fadeIn;
	-webkit-animation-name: fadeIn;	

	animation-duration: 1.5s;	
	-webkit-animation-duration: 1.5s;

	animation-timing-function: ease-in-out;	
	-webkit-animation-timing-function: ease-in-out;		

	visibility: visible !important;	
}

@keyframes fadeIn {
	0% {
		transform: scale(0);
		opacity: 0.0;		
	}
	60% {
		transform: scale(1.1);	
	}
	80% {
		transform: scale(0.9);
		opacity: 1;	
	}	
	100% {
		transform: scale(1);
		opacity: 1;	
	}		
}

@-webkit-keyframes fadeIn {
	0% {
		-webkit-transform: scale(0);
		opacity: 0.0;		
	}
	60% {
		-webkit-transform: scale(1.1);
	}
	80% {
		-webkit-transform: scale(0.9);
		opacity: 1;	
	}	
	100% {
		-webkit-transform: scale(1);
		opacity: 1;	
	}		
}
/*  */
.zoomInLeft {
-webkit-animation:zoomInLeft 1s .2s ease both;
-moz-animation:zoomInLeft 1s .2s ease both;
}
@keyframes zoomInLeft {
  from {
    opacity: 0;
    transform: scale3d(.1, .1, .1) translate3d(-1000px, 0, 0);
    animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
  }

  60% {
    opacity: 1;
    transform: scale3d(.475, .475, .475) translate3d(10px, 0, 0);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
  }
}
@-webkit-keyframes zoomInLeft {
  from {
    opacity: 0;
    -webkit-transform: scale3d(.1, .1, .1) translate3d(-1000px, 0, 0);
    -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
  }

  60% {
    opacity: 1;
    -webkit-transform: scale3d(.475, .475, .475) translate3d(10px, 0, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
  }
}

/*  */
.swing {
-webkit-animation:swing 1s .2s ease both;
-moz-animation:swing 1s .2s ease both;
}
@-webkit-keyframes swing {
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 swing {
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)
}
}