/*首页解决方案用201806*/



/* Above all are from animate.css by daneden http://daneden.me/animate/ */

.from-top{
	-webkit-transform-origin: 0% 0%;
	 -moz-transform-origin: 0% 0%;
	  -ms-transform-origin: 0% 0%;
	   transform-origin: 0% 0%;
}

.from-left{
	-webkit-transform-origin: 0% 100%;
	 -moz-transform-origin: 0% 100%;
	  -ms-transform-origin: 0% 100%;
	   transform-origin: 0% 100%;
}

.from-right{
	-webkit-transform-origin: 100% 100%;
	 -moz-transform-origin: 100% 100%;
	  -ms-transform-origin: 100% 100%;
	   transform-origin: 100% 100%;
}

.from-bottom{
	-webkit-transform-origin: 0% 100%;
	 -moz-transform-origin: 0% 100%;
	  -ms-transform-origin: 0% 100%;
	   transform-origin: 0% 100%;
}


.from-top, .from-left{
	-webkit-animation: enter-clockwise 0.23s ease-out;
	 -moz-animation: enter-clockwise 0.23s ease-out;
	  -ms-animation: enter-clockwise 0.23s ease-out;
	   animation: enter-clockwise 0.23s ease-out;
}


.from-right, .from-bottom{
	-webkit-animation: enter-anti-clockwise 0.23s ease-out;
	 -moz-animation: enter-anti-clockwise 0.23s ease-out;
	  -ms-animation: enter-anti-clockwise 0.23s ease-out;
	   animation: enter-anti-clockwise 0.23s ease-out;
}
.to-top{
	-webkit-transform-origin: 0% 0%;
	 -moz-transform-origin: 0% 0%;
	  -ms-transform-origin: 0% 0%;
	   transform-origin: 0% 0%;
}

.to-left{
	-webkit-transform-origin: 0% 100%;
	 -moz-transform-origin: 0% 100%;
	  -ms-transform-origin: 0% 100%;
	   transform-origin: 0% 100%;
}

.to-right{
	-webkit-transform-origin: 100% 100%;
	 -moz-transform-origin: 100% 100%;
	  -ms-transform-origin: 100% 100%;
	   transform-origin: 100% 100%;
}

.to-bottom{
	-webkit-transform-origin: 0% 100%;
	 -moz-transform-origin: 0% 100%;
	  -ms-transform-origin: 0% 100%;
	   transform-origin: 0% 100%;
}

.to-top, .to-left{
	-webkit-animation: leave-anti-clockwise 0.23s ease-out;
	 -moz-animation: leave-anti-clockwise 0.23s ease-out;
	  -ms-animation: leave-anti-clockwise 0.23s ease-out;
	   animation: leave-anti-clockwise 0.23s ease-out;
}



.to-right, .to-bottom{
	-webkit-animation: leave-clockwise 0.23s ease-out;
	 -moz-animation: leave-clockwise 0.23s ease-out;
	  -ms-animation: leave-clockwise 0.23s ease-out;
	   animation: leave-clockwise 0.23s ease-out;
}

@-webkit-keyframes enter-clockwise{
	from{
		z-index: 3;
		-webkit-transform: rotate(-90deg);
	}
	to{
		z-index: 3;
		-webkit-transform: rotate(0deg);
	}
}
@-moz-keyframes enter-clockwise{
	from{
		z-index: 3;
		-moz-transform: rotate(-90deg);
	}
	to{
		z-index: 3;
		-moz-transform: rotate(0deg);
	}
}
@-ms-keyframes enter-clockwise{
	from{
		z-index: 3;
		-ms-transform: rotate(-90deg);
	}
	to{
		z-index: 3;
		-ms-transform: rotate(0deg);
	}
}
@keyframes enter-clockwise{
	from{
		z-index: 3;
		transform: rotate(-90deg);
	}
	to{
		z-index: 3;
		transform: rotate(0deg);
	}
}

@-webkit-keyframes enter-anti-clockwise{
	from{
		z-index: 3;
		-webkit-transform: rotate(90deg);
	}
	to{
		z-index: 3;
		-webkit-transform: rotate(0deg);
	}
}
@-moz-keyframes enter-anti-clockwise{
	from{
		z-index: 3;
		-moz-transform: rotate(90deg);
	}
	to{
		z-index: 3;
		-moz-transform: rotate(0deg);
	}
}
@-ms-keyframes enter-anti-clockwise{
	from{
		z-index: 3;
		-ms-transform: rotate(90deg);
	}
	to{
		z-index: 3;
		-ms-transform: rotate(0deg);
	}
}
@keyframes enter-anti-clockwise{
	from{
		z-index: 3;
		transform: rotate(90deg);
	}
	to{
		z-index: 3;
		transform: rotate(0deg);
	}
}

@-webkit-keyframes leave-clockwise{
	from{
		z-index: 3;
		-webkit-transform: rotate(0deg);
	}
	to{
		z-index: 3;
		-webkit-transform: rotate(90deg);
	}
}
@-moz-keyframes leave-clockwise{
	from{
		z-index: 3;
		-moz-transform: rotate(0deg);
	}
	to{
		z-index: 3;
		-moz-transform: rotate(90deg);
	}
}
@-ms-keyframes leave-clockwise{
	from{
		z-index: 3;
		-ms-transform: rotate(0deg);
	}
	to{
		z-index: 3;
		-ms-transform: rotate(90deg);
	}
}
@keyframes leave-clockwise{
	from{
		z-index: 3;
		transform: rotate(0deg);
	}
	to{
		z-index: 3;
		transform: rotate(90deg);
	}
}

@-webkit-keyframes leave-anti-clockwise{
	from{
		z-index: 3;
		-webkit-transform: rotate(0deg);
	}
	to{
		z-index: 3;
		-webkit-transform: rotate(-90deg);
	}
}
@-moz-keyframes leave-anti-clockwise{
	from{
		z-index: 3;
		-moz-transform: rotate(0deg);
	}
	to{
		z-index: 3;
		-moz-transform: rotate(-90deg);
	}
}
@-ms-keyframes leave-anti-clockwise{
	from{
		z-index: 3;
		-ms-transform: rotate(0deg);
	}
	to{
		z-index: 3;
		-ms-transform: rotate(-90deg);
	}
}
@keyframes leave-anti-clockwise{
	from{
		z-index: 3;
		transform: rotate(0deg);
	}
	to{
		z-index: 3;
		transform: rotate(-90deg);
	}
}

