.pace {
	-webkit-pointer-events: none;
	pointer-events: none;

	-webkit-user-select: none;
	-moz-user-select: none;
	user-select: none;

	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-ms-box-sizing: border-box;
	-o-box-sizing: border-box;
	box-sizing: border-box;

	-webkit-background-clip: padding-box;
	-moz-background-clip: padding;
	background-clip: padding-box;

	z-index: 2000;
	position: fixed;
	margin: auto;
	top: 50%;
	left: 0;
	right: 0;
	bottom: auto;
	width: 2rem;
	transform: translateY(-60%);
}
.pace::before {
	display: block;
	margin: auto;
	width: 1.6rem;
	height: 1.6rem;
	content: '';
	background: url('/img/loading.gif') center no-repeat;
	background-size: 100%;
	margin-bottom: 0.2rem;
}

.pace .pace-progress {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-ms-box-sizing: border-box;
	-o-box-sizing: border-box;
	box-sizing: border-box;

	box-sizing: border-box;
	-webkit-border-radius: .05rem;
	-moz-border-radius: .05rem;
	border-radius: .05rem;

	-webkit-transform: translate3d(100%, 0, 0) !important;
	transform: translate3d(100%, 0, 0) !important;

	position: relative;
	display: block;
	width: 2rem;
	height: 0.10rem;
	background: linear-gradient(90deg, #cc33b1, #7082de 100%);
	border-radius: 8px;
	padding: 0.02rem;
}
.pace .pace-progress-inner {
	box-sizing: border-box;
	-webkit-border-radius: .03rem;
	-moz-border-radius: .03rem;
	border-radius: .03rem;

	overflow: hidden;
	position: relative;
	width: 1.96rem;
	height: 0.06rem;
	background: linear-gradient(90deg, #cc33b1, #7082de 100%);
}
.pace .pace-progress-inner::after {
	width: 100%;
	height: 100%;
	display: block;
	content: "";
	background: linear-gradient(90deg,rgba(204,51,177,0.15), #7182de 100%);
}

.pace .pace-progress:after {
	content: attr(data-progress-text);
	font-size: 14px;
	font-weight: 400;
	text-align: center;
	color: #cc33b1;
	position: absolute;
	bottom: -0.24rem;
	left: 50%;
	transform: translate(-50%);
}
.pace .pace-progress::before {
	box-sizing: border-box;
	-webkit-border-radius: .03rem;
	-moz-border-radius: .03rem;
	border-radius: .03rem;

	content: '';
	background-color: #000;
	width: 1.96rem;
	height: 0.06rem;
	position: absolute;
}

.pace .pace-progress[data-progress-text="0%"] .pace-progress-inner { width: 0%; }
.pace .pace-progress[data-progress-text="1%"] .pace-progress-inner { width: 1%; }
.pace .pace-progress[data-progress-text="2%"] .pace-progress-inner { width: 2% }
.pace .pace-progress[data-progress-text="3%"] .pace-progress-inner { width: 3% }
.pace .pace-progress[data-progress-text="4%"] .pace-progress-inner { width: 4% }
.pace .pace-progress[data-progress-text="5%"] .pace-progress-inner { width: 5% }
.pace .pace-progress[data-progress-text="6%"] .pace-progress-inner { width: 6% }
.pace .pace-progress[data-progress-text="7%"] .pace-progress-inner { width: 7% }
.pace .pace-progress[data-progress-text="8%"] .pace-progress-inner { width: 8% }
.pace .pace-progress[data-progress-text="9%"] .pace-progress-inner { width: 9% }
.pace .pace-progress[data-progress-text="10%"] .pace-progress-inner { width: 10% }
.pace .pace-progress[data-progress-text="11%"] .pace-progress-inner { width: 11% }
.pace .pace-progress[data-progress-text="12%"] .pace-progress-inner { width: 12% }
.pace .pace-progress[data-progress-text="13%"] .pace-progress-inner { width: 13% }
.pace .pace-progress[data-progress-text="14%"] .pace-progress-inner { width: 14% }
.pace .pace-progress[data-progress-text="15%"] .pace-progress-inner { width: 15% }
.pace .pace-progress[data-progress-text="16%"] .pace-progress-inner { width: 16% }
.pace .pace-progress[data-progress-text="17%"] .pace-progress-inner { width: 17% }
.pace .pace-progress[data-progress-text="18%"] .pace-progress-inner { width: 18% }
.pace .pace-progress[data-progress-text="19%"] .pace-progress-inner { width: 19% }
.pace .pace-progress[data-progress-text="20%"] .pace-progress-inner { width: 20% }
.pace .pace-progress[data-progress-text="21%"] .pace-progress-inner { width: 21% }
.pace .pace-progress[data-progress-text="22%"] .pace-progress-inner { width: 22% }
.pace .pace-progress[data-progress-text="23%"] .pace-progress-inner { width: 23% }
.pace .pace-progress[data-progress-text="24%"] .pace-progress-inner { width: 24% }
.pace .pace-progress[data-progress-text="25%"] .pace-progress-inner { width: 25% }
.pace .pace-progress[data-progress-text="26%"] .pace-progress-inner { width: 26% }
.pace .pace-progress[data-progress-text="27%"] .pace-progress-inner { width: 27% }
.pace .pace-progress[data-progress-text="28%"] .pace-progress-inner { width: 28% }
.pace .pace-progress[data-progress-text="29%"] .pace-progress-inner { width: 29% }
.pace .pace-progress[data-progress-text="30%"] .pace-progress-inner { width: 30% }
.pace .pace-progress[data-progress-text="31%"] .pace-progress-inner { width: 31% }
.pace .pace-progress[data-progress-text="32%"] .pace-progress-inner { width: 32% }
.pace .pace-progress[data-progress-text="33%"] .pace-progress-inner { width: 33% }
.pace .pace-progress[data-progress-text="34%"] .pace-progress-inner { width: 34% }
.pace .pace-progress[data-progress-text="35%"] .pace-progress-inner { width: 35% }
.pace .pace-progress[data-progress-text="36%"] .pace-progress-inner { width: 36% }
.pace .pace-progress[data-progress-text="37%"] .pace-progress-inner { width: 37% }
.pace .pace-progress[data-progress-text="38%"] .pace-progress-inner { width: 38% }
.pace .pace-progress[data-progress-text="39%"] .pace-progress-inner { width: 39% }
.pace .pace-progress[data-progress-text="40%"] .pace-progress-inner { width: 40% }
.pace .pace-progress[data-progress-text="41%"] .pace-progress-inner { width: 41% }
.pace .pace-progress[data-progress-text="42%"] .pace-progress-inner { width: 42% }
.pace .pace-progress[data-progress-text="43%"] .pace-progress-inner { width: 43% }
.pace .pace-progress[data-progress-text="44%"] .pace-progress-inner { width: 44% }
.pace .pace-progress[data-progress-text="45%"] .pace-progress-inner { width: 45% }
.pace .pace-progress[data-progress-text="46%"] .pace-progress-inner { width: 46% }
.pace .pace-progress[data-progress-text="47%"] .pace-progress-inner { width: 47% }
.pace .pace-progress[data-progress-text="48%"] .pace-progress-inner { width: 48% }
.pace .pace-progress[data-progress-text="49%"] .pace-progress-inner { width: 49% }
.pace .pace-progress[data-progress-text="50%"] .pace-progress-inner { width: 50% }
.pace .pace-progress[data-progress-text="51%"] .pace-progress-inner { width: 51% }
.pace .pace-progress[data-progress-text="52%"] .pace-progress-inner { width: 52% }
.pace .pace-progress[data-progress-text="53%"] .pace-progress-inner { width: 53% }
.pace .pace-progress[data-progress-text="54%"] .pace-progress-inner { width: 54% }
.pace .pace-progress[data-progress-text="55%"] .pace-progress-inner { width: 55% }
.pace .pace-progress[data-progress-text="56%"] .pace-progress-inner { width: 56% }
.pace .pace-progress[data-progress-text="57%"] .pace-progress-inner { width: 57% }
.pace .pace-progress[data-progress-text="58%"] .pace-progress-inner { width: 58% }
.pace .pace-progress[data-progress-text="59%"] .pace-progress-inner { width: 59% }
.pace .pace-progress[data-progress-text="60%"] .pace-progress-inner { width: 60% }
.pace .pace-progress[data-progress-text="61%"] .pace-progress-inner { width: 61% }
.pace .pace-progress[data-progress-text="62%"] .pace-progress-inner { width: 62% }
.pace .pace-progress[data-progress-text="63%"] .pace-progress-inner { width: 63% }
.pace .pace-progress[data-progress-text="64%"] .pace-progress-inner { width: 64% }
.pace .pace-progress[data-progress-text="65%"] .pace-progress-inner { width: 65% }
.pace .pace-progress[data-progress-text="66%"] .pace-progress-inner { width: 66% }
.pace .pace-progress[data-progress-text="67%"] .pace-progress-inner { width: 67% }
.pace .pace-progress[data-progress-text="68%"] .pace-progress-inner { width: 68% }
.pace .pace-progress[data-progress-text="69%"] .pace-progress-inner { width: 69% }
.pace .pace-progress[data-progress-text="70%"] .pace-progress-inner { width: 70% }
.pace .pace-progress[data-progress-text="71%"] .pace-progress-inner { width: 71% }
.pace .pace-progress[data-progress-text="72%"] .pace-progress-inner { width: 72% }
.pace .pace-progress[data-progress-text="73%"] .pace-progress-inner { width: 73% }
.pace .pace-progress[data-progress-text="74%"] .pace-progress-inner { width: 74% }
.pace .pace-progress[data-progress-text="75%"] .pace-progress-inner { width: 75% }
.pace .pace-progress[data-progress-text="76%"] .pace-progress-inner { width: 76% }
.pace .pace-progress[data-progress-text="77%"] .pace-progress-inner { width: 77% }
.pace .pace-progress[data-progress-text="78%"] .pace-progress-inner { width: 78% }
.pace .pace-progress[data-progress-text="79%"] .pace-progress-inner { width: 79% }
.pace .pace-progress[data-progress-text="80%"] .pace-progress-inner { width: 80% }
.pace .pace-progress[data-progress-text="81%"] .pace-progress-inner { width: 81% }
.pace .pace-progress[data-progress-text="82%"] .pace-progress-inner { width: 82% }
.pace .pace-progress[data-progress-text="83%"] .pace-progress-inner { width: 83% }
.pace .pace-progress[data-progress-text="84%"] .pace-progress-inner { width: 84% }
.pace .pace-progress[data-progress-text="85%"] .pace-progress-inner { width: 85% }
.pace .pace-progress[data-progress-text="86%"] .pace-progress-inner { width: 86% }
.pace .pace-progress[data-progress-text="87%"] .pace-progress-inner { width: 87% }
.pace .pace-progress[data-progress-text="88%"] .pace-progress-inner { width: 88% }
.pace .pace-progress[data-progress-text="89%"] .pace-progress-inner { width: 89% }
.pace .pace-progress[data-progress-text="90%"] .pace-progress-inner { width: 90% }
.pace .pace-progress[data-progress-text="91%"] .pace-progress-inner { width: 91% }
.pace .pace-progress[data-progress-text="92%"] .pace-progress-inner { width: 92% }
.pace .pace-progress[data-progress-text="93%"] .pace-progress-inner { width: 93% }
.pace .pace-progress[data-progress-text="94%"] .pace-progress-inner { width: 94% }
.pace .pace-progress[data-progress-text="95%"] .pace-progress-inner { width: 95% }
.pace .pace-progress[data-progress-text="96%"] .pace-progress-inner { width: 96% }
.pace .pace-progress[data-progress-text="97%"] .pace-progress-inner { width: 97% }
.pace .pace-progress[data-progress-text="98%"] .pace-progress-inner { width: 98% }
.pace .pace-progress[data-progress-text="99%"] .pace-progress-inner { width: 99% }
.pace .pace-progress[data-progress-text="100%"] .pace-progress-inner { width: 100% }


.pace .pace-activity {
	width: 100%;
	height: 28px;
	z-index: 2001;
	position: absolute;
	bottom: -0.60rem;
}
.pace .pace-activity::after {
	content: 'Horns Brothers are coming......';
	font-size: 0.14rem;
	font-weight: 400;
	text-align: center;
	color: #7180db;
}

.pace.pace-inactive {
	display: none;
}

.big-mask {
	background-color: #000;
	position: fixed;
	z-index: 1999;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
}
.big-mask.hide {
	display: none;
}