/* 弹入-从右 */

@-webkit-keyframes bounceinR {
	0% {
		opacity: 0;
		-webkit-transform: translateX(1000px);
	}
	60% {
		opacity: 1;
		-webkit-transform: translateX(-30px);
	}
	80% {
		-webkit-transform: translateX(10px);
	}
	100% {
		-webkit-transform: translateX(0);
	}
}

@keyframes bounceinR {
	0% {
		opacity: 0;
		transform: translateX(1000px);
	}
	60% {
		opacity: 1;
		transform: translateX(-30px);
	}
	80% {
		transform: translateX(10px);
	}
	100% {
		transform: translateX(0);
	}
}

@-webkit-keyframes heart {
	from {
		transform: translate(0, 0)
	}
	to {
		transform: translate(0, 20px)
	}
}

@keyframes heart {
	from {
		transform: translate(0, 0)
	}
	to {
		transform: translate(0, 20px)
	}
}


@-webkit-keyframes flipintoright {
	0% {
    -webkit-transform: rotateY(90deg) scale(.9);
	}
	100% {
	    -webkit-transform: rotateY(0);
	}
	0% {
	    -moz-transform: rotateY(90deg) scale(.9);
	}
	100% {
	    -moz-transform: rotateY(0);
	}
}
@keyframes flipintoright {
	0% {
    -webkit-transform: rotateY(90deg) scale(.9);
	}
	100% {
	    -webkit-transform: rotateY(0);
	}
	0% {
	    -moz-transform: rotateY(90deg) scale(.9);
	}
	100% {
	    -moz-transform: rotateY(0);
	}
}
.anim-bounceinR {
	-webkit-animation: 1.0s ease-out bounceinR;
	animation: 1.0s ease-out bounceinR;
}

.anim-heart {
	-webkit-animation: heart 1.0s ease-in-out 0.5s infinite alternate;
	animation: heart 1.0s ease-in-out 0.5s infinite alternate;
}
.anim-flip {
	-webkit-animation-name: flipintoright;
	-webkit-animation-duration: .5s;
}