@charset "utf-8";
/* CSS Document */

/* 星云夜船主页加载待机动画 */
/* Designed by Wi-Fi Kun*/

/* 动画位置定义 */
.LoadingScreen {
	position: fixed;
	top: 0px;
	left: 0px;
	width: 100vw;
	height: 100vh;
	background: #FFFFFF;
	z-index: 1;
}
.Loading {
	position: absolute;
	top: 0;
	left: 50px;
	bottom: 0;
	right: 0;
	margin: auto;
	width: 110px;
	height: 100px;
	display: -webkit-flex;
	display: flex;
	transform: skewX(-15deg);
	overflow: hidden;
	animation: LoadingOut 1.5s;
	-webkit-animation: LoadingOut 1.5s;
	animation-iteration-count: infinite;
	-webkit-animation-iteration-count: infinite;
}

/* Logo绘制 */
.Load_1 {
	background-color: #FF6F61;
	position: absolute;
	right: 85px;
	width: 25px;
	height: 100px;
	overflow: hidden;
	animation: Load_1_in 1.5s;
	-webkit-animation: Load_1_in 1.5s;
	animation-iteration-count: infinite;
	-webkit-animation-iteration-count: infinite;
}
.Load_2 {
	background-color: #72C951;
	position: absolute;
	top: 50px;
	right: 55px;
	width: 25px;
	height: 50px;
	overflow: hidden;
	animation: Load_2_in 1.5s;
	-webkit-animation: Load_2_in 1.5s;
	animation-iteration-count: infinite;
	-webkit-animation-iteration-count: infinite;
}
.Load_3 {
	background-color: #74D1EA;
	position: absolute;
	right: 25px;
	width: 25px;
	height: 100px;
	overflow: hidden;
	animation: Load_3_in 1.5s;
	-webkit-animation: Load_3_in 1.5s;
	animation-iteration-count: infinite;
	-webkit-animation-iteration-count: infinite;
	animation-timing-function: ease-in;
	-webkit-animation-timing-function: ease-in;
}
.Load_4 {
	background-color: #74D1EA;
	position: absolute;
	right: 0px;
	top: 50px;
	height: 25px;
	width: 35px;
	overflow: hidden;
	animation: Load_4_in 1.5s;
	-webkit-animation: Load_4_in 1.5s;
	animation-iteration-count: infinite;
	-webkit-animation-iteration-count: infinite;
	animation-timing-function: ease-out;
	-webkit-animation-timing-function: ease-out;
}
.Load_5 {
	background-color: #74D1EA;
	position: absolute;
	right: 0px;
	height: 25px;
	width: 35px;
	overflow: hidden;
	animation: Load_5_in 1.5s;
	-webkit-animation: Load_5_in 1.5s;
	animation-iteration-count: infinite;
	-webkit-animation-iteration-count: infinite;
	animation-timing-function: ease-out;
	-webkit-animation-timing-function: ease-out;
}

/* 动画关键帧 */
@keyframes Load_1_in {
	0%		{height: 0%;	top: 100%;}
	25%		{height: 100%;	top: 0%;}
	100%	{height: 100%;	top: 0%;}
}
@keyframes Load_2_in {
	0%		{height: 0%;	top: 100%;}
	5%		{height: 0%;	top: 100%;}
	30%		{height: 50%;	top: 50%;}
	100%	{height: 50%;	top: 50%;}
}
@keyframes Load_3_in {
	0%		{height: 0%;	top: 100%;}
	10%		{height: 0%;	top: 100%;}
	30%		{height: 100%;	top: 0%;}
	100%	{height: 100%;	top: 0%;}
}
@keyframes Load_4_in {
	0%		{width: 0px;	right: 35px;}
	23%		{width: 0px;	right: 35px;}
	38%		{width: 35px;	right: 0px;}
	100%	{width: 35px;	right: 0px;}
}
@keyframes Load_5_in {
	0%		{width: 0px;	right: 35px;}
	30%		{width: 0px;	right: 35px;}
	45%		{width: 35px;	right: 0px;}
	100%	{width: 35px;	right: 0px;}
}
@keyframes LoadingOut {
	0% {width: 110px;left: 0;}
	60% {width: 110px;left: 0;}
	85% {width: 0px;left: 110px;}
	100% {width: 0px;left: 110px;}
}