/* #ifndef APP-NVUE */
.skeleton {
		width: 100%;
		height: 100%;
		/* 以下代码实现背景动画效果 */
		animation: loading 1.4s ease infinite !important;
		-webkit-animation: loading 1.4s ease infinite !important;
		background-image: -webkit-gradient(linear, left top, right top, color-stop(25%, #f0f0f0), color-stop(37%, #e3e3e3), color-stop(63%, #f0f0f0)) !important;
		background-image: -o-linear-gradient(left, #f0f0f0 25%, #e3e3e3 37%, #f0f0f0 63%) !important;
		background-image: linear-gradient(90deg, #f0f0f0 25%, #e3e3e3 37%, #f0f0f0 63%) !important;
		background-size: 400% 100% !important;
	}
	//定义骨架屏宽度
	@for $i from 0 through 100 {
		.skeleton-width-#{$i}, .sk-w-#{$i} {
			width: $i + vw !important;
		}
		.skeleton-height-#{$i}, .sk-h-#{$i} {
			height: $i + vmax !important;
		}
	}

	@-webkit-keyframes loading {
		0% {
			background-position: 100% 50%
		}

		to {
			background-position: 0 50%
		}
	}

	@keyframes loading {
		0% {
			background-position: 100% 50%
		}

		to {
			background-position: 0 50%
		}
	}
	@keyframes error-num {
		0% {
			transform: translateY(60px);
			opacity: 0;
		}
	
		100% {
			transform: translateY(0);
			opacity: 1;
		}
	}
.fade-in {
	-webkit-animation: fade-in .65s cubic-bezier(.39, .575, .565, 1.000) both !important;
	animation: fade-in .65s cubic-bezier(.39, .575, .565, 1.000) both !important;
}
.fade-out {
	-webkit-animation: fade-out .25s ease-out both !important;
	animation: fade-out .25s ease-out both !important;
}

.bounce-in-top {
	-webkit-animation: bounce-in-top 1.1s both !important;
	animation: bounce-in-top 1.1s both !important;
}

.rotate-center {
	-webkit-animation: rotate-center 0.6s ease-in-out both !important;
	animation: rotate-center 0.6s ease-in-out both !important;
}
.slide-in-top {
	-webkit-animation: slide-in-top 0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
	        animation: slide-in-top 0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
}
.slide-out-top {
	-webkit-animation: slide-out-top 0.5s cubic-bezier(0.550, 0.085, 0.680, 0.530) both;
	        animation: slide-out-top 0.5s cubic-bezier(0.550, 0.085, 0.680, 0.530) both;
}
.slide-in-bottom {
	-webkit-animation: slide-in-bottom 0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) both !important;
	        animation: slide-in-bottom 0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) both !important;
}
.slide-out-bottom {
	-webkit-animation: slide-out-bottom 0.5s cubic-bezier(0.550, 0.085, 0.680, 0.530) both !important;
	        animation: slide-out-bottom 0.5s cubic-bezier(0.550, 0.085, 0.680, 0.530) both !important;
}
.slide-in-left{
	-webkit-animation: slide-in-left 0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) both !important;
		        animation: slide-in-left 0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) both !important;
}
.slide-in-right{
	-webkit-animation: slide-in-right 0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) both !important;
		        animation: slide-in-right 0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) both !important;
}
@-webkit-keyframes slide-out-top {
  0% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateY(-1000px);
            transform: translateY(-1000px);
    opacity: 0;
  }
}
@keyframes slide-out-top {
  0% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateY(-1000px);
            transform: translateY(-1000px);
    opacity: 0;
  }
}

@-webkit-keyframes slide-in-top {
  0% {
    -webkit-transform: translateY(-1000px);
            transform: translateY(-1000px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    opacity: 1;
  }
}
@keyframes slide-in-top {
  0% {
    -webkit-transform: translateY(-1000px);
            transform: translateY(-1000px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    opacity: 1;
  }
}

@-webkit-keyframes slide-in-left {
						0% {
							-webkit-transform: translateX(-100px);
							transform: translateX(-100px);
							opacity: 0;
						}

						100% {
							-webkit-transform: translateX(0);
							transform: translateX(0);
							opacity: 1;
						}
					}

					@keyframes slide-in-left {
						0% {
							-webkit-transform: translateX(-100px);
							transform: translateX(-100px);
							opacity: 0;
						}

						100% {
							-webkit-transform: translateX(0);
							transform: translateX(0);
							opacity: 1;
						}
					}
					@-webkit-keyframes slide-in-right {
						0% {
							-webkit-transform: translateX(100px);
							transform: translateX(100px);
							opacity: 0;
						}
					
						100% {
							-webkit-transform: translateX(0);
							transform: translateX(0);
							opacity: 1;
						}
					}
					
					@keyframes slide-in-right {
						0% {
							-webkit-transform: translateX(100px);
							transform: translateX(100px);
							opacity: 0;
						}
					
						100% {
							-webkit-transform: translateX(0);
							transform: translateX(0);
							opacity: 1;
						}
					}

@-webkit-keyframes fade-in {
	0% {
		opacity: 0
	}

	100% {
		opacity: 1
	}
}

@keyframes fade-in {
	0% {
		opacity: 0
	}

	100% {
		opacity: 1
	}
}

@-webkit-keyframes fade-out {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
@keyframes fade-out {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
@keyframes error-num {
	0% {
		transform: translateY(60px);
		opacity: 0;
	}

	100% {
		transform: translateY(0);
		opacity: 1;
	}
}

@keyframes bounce-in-top {
	0% {
		-webkit-transform: translateY(-500px);
		transform: translateY(-500px);
		-webkit-animation-timing-function: ease-in;
		animation-timing-function: ease-in;
		opacity: 0;
	}

	38% {
		-webkit-transform: translateY(0);
		transform: translateY(0);
		-webkit-animation-timing-function: ease-out;
		animation-timing-function: ease-out;
		opacity: 1;
	}

	55% {
		-webkit-transform: translateY(-65px);
		transform: translateY(-65px);
		-webkit-animation-timing-function: ease-in;
		animation-timing-function: ease-in;
	}

	72% {
		-webkit-transform: translateY(0);
		transform: translateY(0);
		-webkit-animation-timing-function: ease-out;
		animation-timing-function: ease-out;
	}

	81% {
		-webkit-transform: translateY(-28px);
		transform: translateY(-28px);
		-webkit-animation-timing-function: ease-in;
		animation-timing-function: ease-in;
	}

	90% {
		-webkit-transform: translateY(0);
		transform: translateY(0);
		-webkit-animation-timing-function: ease-out;
		animation-timing-function: ease-out;
	}

	95% {
		-webkit-transform: translateY(-8px);
		transform: translateY(-8px);
		-webkit-animation-timing-function: ease-in;
		animation-timing-function: ease-in;
	}

	100% {
		-webkit-transform: translateY(0);
		transform: translateY(0);
		-webkit-animation-timing-function: ease-out;
		animation-timing-function: ease-out;
	}
}

@-webkit-keyframes bounce-in-top {
	0% {
		-webkit-transform: translateY(-500px);
		transform: translateY(-500px);
		-webkit-animation-timing-function: ease-in;
		animation-timing-function: ease-in;
		opacity: 0;
	}

	38% {
		-webkit-transform: translateY(0);
		transform: translateY(0);
		-webkit-animation-timing-function: ease-out;
		animation-timing-function: ease-out;
		opacity: 1;
	}

	55% {
		-webkit-transform: translateY(-65px);
		transform: translateY(-65px);
		-webkit-animation-timing-function: ease-in;
		animation-timing-function: ease-in;
	}

	72% {
		-webkit-transform: translateY(0);
		transform: translateY(0);
		-webkit-animation-timing-function: ease-out;
		animation-timing-function: ease-out;
	}

	81% {
		-webkit-transform: translateY(-28px);
		transform: translateY(-28px);
		-webkit-animation-timing-function: ease-in;
		animation-timing-function: ease-in;
	}

	90% {
		-webkit-transform: translateY(0);
		transform: translateY(0);
		-webkit-animation-timing-function: ease-out;
		animation-timing-function: ease-out;
	}

	95% {
		-webkit-transform: translateY(-8px);
		transform: translateY(-8px);
		-webkit-animation-timing-function: ease-in;
		animation-timing-function: ease-in;
	}

	100% {
		-webkit-transform: translateY(0);
		transform: translateY(0);
		-webkit-animation-timing-function: ease-out;
		animation-timing-function: ease-out;
	}
}

@-webkit-keyframes rotate-center {
  0% {
    -webkit-transform: rotate(0);
            transform: rotate(0);
  }
  100% {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg);
  }
}
@keyframes rotate-center {
  0% {
    -webkit-transform: rotate(0);
            transform: rotate(0);
  }
  100% {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg);
  }
}
@-webkit-keyframes slide-in-bottom {
  0% {
    -webkit-transform: translateY(1000px);
            transform: translateY(1000px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    opacity: 1;
  }
}
@keyframes slide-in-bottom {
  0% {
    -webkit-transform: translateY(1000px);
            transform: translateY(1000px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    opacity: 1;
  }
}
@-webkit-keyframes slide-out-bottom {
  0% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateY(1000px);
            transform: translateY(1000px);
    opacity: 0;
  }
}
@keyframes slide-out-bottom {
  0% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateY(1000px);
            transform: translateY(1000px);
    opacity: 0;
  }
}
/* #endif */