
/* 原始动画 - 从下方淡入 */
.animated-element-fadeUp {
	opacity: 0;
	transform: translateY(100px);
	transition: all 1s ease;
}
/* 新增动画 - 从右侧淡入 */
.animated-element-fadeDown {
	opacity: 0;
	transform: translateY(-100px);
	transition: all 1s ease;
}
/* 新增动画 - 从右侧淡入 */
.animated-element-fadeLeft {
	opacity: 0;
	transform: translateX(100px);
	transition: all 1s ease;
}
/* 新增动画 - 从右侧淡入 */
.animated-element-fadeRight {
	opacity: 0;
	transform: translateX(-100px);
	transition: all 1s ease;
}
/* Up\Down\Right\Left - 归入原点 */
.animated-element-fadeUp.active,.animated-element-fadeDown.active,.animated-element-fadeLeft.active,.animated-element-fadeRight.active {
	opacity: 1;
	transform: translate(0);
}


/* 新增动画 - 从小到大 */
.animated-element-scale {
	opacity: 0;
	transform: scale(0.5);
	transition: all 1s ease;
}
.animated-element-scale.active {
	opacity: 1;
	transform: scale(1);
}




.delay-1 { transition-delay: 0.4s;}
.delay-2 { transition-delay: 0.8s;}
.delay-3 { transition-delay: 1.2s;}
.delay-4 { transition-delay: 1.6s;}
.delay-5 { transition-delay: 1.8s;}
.delay-6 { transition-delay: 2s;}
.delay-7 { transition-delay: 2.2s;}
.delay-8 { transition-delay: 2.4s;}
.delay-9 { transition-delay: 2.6s;}
.delay-10 { transition-delay: 2.8s;}




.rotate {
	transform: rotate(0deg);
	transition: transform 1s ease;
	}
		
.rotate.active {
	transform: rotate(360deg);
	}
