* { font-family: 'Microsoft YaHei', sans-serif, Arial, 'DejaVu Sans', 'Liberation Sans', Freesans, sans-serif; }
body { background: #fff; font-size: 100%; margin: 0; }

a { color: #222; }
.clear { clear: both; }

.i8-container { width: 360px; margin: 10% auto auto auto; padding: 20px; color: #222; }
	.i8-container.qr .i8-form { display: none; }
	.i8-container.qr .i8-login-title { display: none; }
	.i8-container.qr #i8-login-qr { display: block; }
	.i8-container.qr .i8-switch-pc { display: block; }
	.i8-container.qr .i8-switch-qr { display: none; }
#i8-login-qr { display: none; }

.i8-container.h-0 { margin-left: 0; margin-right: auto; }
.i8-container.h-10 { margin-left: calc(10% - 159px); margin-right: auto; }
.i8-container.h-20 { margin-left: calc(20% - 159px); margin-right: auto; }
.i8-container.h-30 { margin-left: calc(30% - 159px); margin-right: auto; }
.i8-container.h-40 { margin-left: calc(40% - 159px); margin-right: auto; }
.i8-container.h-50 { margin-left: auto; margin-right: auto; }
.i8-container.h-60 { margin-left: auto; margin-right: calc(40% - 159px); }
.i8-container.h-70 { margin-left: auto; margin-right: calc(30% - 159px); }
.i8-container.h-80 { margin-left: auto; margin-right: calc(20% - 159px); }
.i8-container.h-90 { margin-left: auto; margin-right: calc(15% - 159px); }
.i8-container.h-100 { margin-left: auto; margin-right: 0; }

.i8-container.v-0 { margin-top: 20px; }
.i8-container.v-10 { margin-top: 2%; }
.i8-container.v-20 { margin-top: 4%; }
.i8-container.v-30 { margin-top: 6%; }
.i8-container.v-40 { margin-top: 8%; }
.i8-container.v-50 { margin-top: 10%; }
.i8-container.v-60 { margin-top: 13%; }
.i8-container.v-70 { margin-top: 16%; }
.i8-container.v-80 { margin-top: 19%; }
.i8-container.v-90 { margin-top: 22%; }
.i8-container.v-100 { margin-top: 25%; }

@keyframes blurFadeIn {
	0% { opacity: 0; text-shadow: 0px 0px 40px #fff; transform: scale(0.9); }
	100% { opacity: 1; text-shadow: 0px 0px 50px #fff; transform: scale(1); }
}

.i8-login { width: auto; position: relative; padding: 20px; background: rgba(255,255,255,0.5); backdrop-filter: blur(15px); border: 1px solid rgba(255,255,255,0); border-radius: 10px; box-shadow: 5px 5px 40px rgba(0,0,0,0.2); z-index: 99; animation: blurFadeIn 0.5s; }
.i8-login-logo { width: 66px; height: 66px; background: url("/Api2/Public/GetLogo?t=l") no-repeat; box-shadow: 0 0 30px rgba(0,0,0,0.1); background-size: cover; background-color: rgba(255,255,255,0.9); border-radius: 6px; display: inline-block; position: absolute; left: 24px; top: -33px; }
.i8-login-error { text-align: center; font-size: 0.9em; color: #f00; padding: 10px 0; }
.i8-login-title { width: inherit; font-weight: normal; font-size: 1.7em; text-align: center; margin: 30px 0 10px; }
.i8-text-shadow { text-shadow: 1px 0px 6px rgba(255,255,255,0.6), -1px 0px 6px rgba(255,255,255,0.6), 0px 1px 6px rgba(255,255,255,0.6), 0px -1px 6px rgba(255,255,255,0.6); }
.i8-text-shadow-lighter { text-shadow: 1px 0px 3px rgba(255,255,255,0.5), -1px 0px 3px rgba(255,255,255,0.5), 0px 1px 3px rgba(255,255,255,0.5), 0px -1px 3px rgba(255,255,255,0.5); }

.i8-switch { position: absolute; left: 285px; top: 0px; display: none; }
	.i8-switch.i8-switch-enabled { display: block; }
	.i8-switch img { width: 72px; height: 72px; }
	.i8-switch .i8-switch-pc { display: none; }
.i8-input-txt { width: 100%; margin: 10px; background: none; border: none; font-size: 1.2em; outline: none; }
	.i8-input-txt:-moz-placeholder { color: #888; font-weight: 200; }
	.i8-input-txt:-ms-input-placeholder { color: #888; font-weight: 200; }
	.i8-input-txt::-webkit-input-placeholder { color: #888; font-weight: 200; }
	.i8-input-txt:focus { }

.i8-login-input-box { display: flex; align-items: center; background-color:rgba(255,255,255,0.4); border-radius: 50px; margin-bottom: 10px; padding-right: 20px; }
	.i8-login-input-box i { margin-left: 16px; opacity: 20%; }
#VerifyCodeImage { position: absolute; margin-top: 5px; right: 40px; }

.i8-login-footer { margin: 10px 0; overflow: hidden; float: left; width: 100%; font-size: 0.8em; color: #666; }
	.i8-login-footer ul { padding: 0 10px; list-style: none; }
		.i8-login-footer ul li { margin: 20px 0 0; position: relative; }
			.i8-login-footer ul li.i8-login-checkbox { }
				.i8-login-footer ul li.i8-login-checkbox input.i8-checkbox { width: 16px; height: 16px; margin-right: 0px 5px 0 0; vertical-align: middle; }
			.i8-login-footer ul li.i8-login-submit { margin-top: 10px; }
			.i8-login-footer ul li.i8-login-win { padding: 0; padding-top: 10px; }
				.i8-login-footer ul li.i8-login-win a { text-decoration: dashed; padding: 0; display: block; text-align: center; font-size: 0.9em; color: #c00; border: 1px solid #c00; border-radius: 10px; background: rgba(255,255,255,0.6); text-decoration: none; }
					.i8-login-footer ul li.i8-login-win a:hover { color: #f00; }
			.i8-login-footer ul li.i8-login-forgot { float: right; font-size: 0.9em; }
				.i8-login-footer ul li.i8-login-forgot a { text-decoration:none; color: #0681b0; text-shadow: 0 0 4px #fff; }
					.i8-login-footer ul li.i8-login-forgot a:hover { color: #023160; }
					.i8-login-btn { padding: 0 30px; float: right; line-height: 40px; border: 1px solid #bb351f; background: white; border-radius: 5px; color: #fff; cursor: pointer; font-size: 1.1em; outline: none; background-color: #bb351f; }
	.i8-login-btn:hover { background-color: #f00; }
	.i8-login-btn.loading { border-color: #ccc; background-color: #aaa; }

div.login-mask { position: fixed; top: 0; left: 0; right: 0; bottom: 0; background: rgba(88,88,88,0.7); z-index: 991; }
div.resetpwd-dialog { position: absolute; top: 180px; width: 385px; height: 350px; left: -180px; background: #fff; border: 1px solid #888; border-radius: 10px; z-index: 992; padding: 20px; margin-left: 50%; }
div.resetpwd-close { position: absolute; top: -12px; right: -12px; width: 24px; height: 24px; border-radius: 12px; background-color: #f00; color: #fff; z-index: 993; text-align: center; line-height: 24px; }
div.resetpwd-step-1 { display: block; margin-bottom: 5px; }
div.resetpwd-step-img { display: none; margin-bottom: 5px; text-align: center; }
	div.resetpwd-step-img input { text-align: center; font-size: 1.2em; }
	div.resetpwd-step-img button { background-color: #f8f8f8; border: 1px solid #ccc; padding: 4px 16px; }
div.resetpwd-step-2 { display: none; margin-bottom: 5px; }
.resetpwd-dialog { font-size: 14px; }
.resetpwd h3 { margin: 0; padding: 10px 0; color: #333; font-weight: normal; }
.resetpwd .resetpwd-note { font-size: 12px; color: #888; margin-bottom: 20px; }
.resetpwd label { display: inline-block; width: 120px; text-align: left; font-size: 14px; }
.resetpwd input[type="text"] { font-size: 14px; padding: 4px 4px; border: 1px solid #888; width: 140px; }
.resetpwd input[type="password"] { font-size: 14px; padding: 4px 4px; border: 1px solid #888; width: 140px; }
.resetpwd input[type="button"] { font-size: 12px; border: 1px solid #888; background-color: #b5f0f6; }
.resetpwd-button { margin-top: 20px; }
i.fa-spin { display: none; }
#resetpwd-change-button { width: 100%; max-width: 400px; font-size: 14px; background-color: #a00; color: #fff; border: 1px solid #fff; border-radius: 8px; padding: 10px; }
#resetpwd-change-button-spin { display: none; }

.i8-background-img { position: absolute; top: 0; left: 0; z-index: 9; }
	.i8-background-img img { width: 100%; height: 100%; position: fixed; overflow: hidden; }
	.i8-background-img.top_left { }
	.i8-background-img.top_center img { left: 50%; transform: translateX(-50%); }
	.i8-background-img.top_right img { left: auto; right: 0; }
	.i8-background-img.center_left img { top: 50%; transform: translateY(-50%); }
	.i8-background-img.center_center img { top: 50%; left: 50%; transform: translate(-50%, -50%); }
	.i8-background-img.center_right img { top: 50%; transform: translateY(-50%); left: auto; right: 0; }
	.i8-background-img.bottom_left img { top: auto; bottom: 0; }
	.i8-background-img.bottom_center img { top: auto; bottom: 0; left: 50%; transform: translateX(-50%); }
	.i8-background-img.bottom_right img { top: auto; bottom: 0; left: auto; right: 0; }

/*--responsive--*/
@media (max-width: 1280px) {
}

@media (max-width: 1080px) {
}

@media (max-width: 1024px) {
}

@media (max-width: 991px) {
}

@media (max-width: 800px) {
}

@media (max-width: 768px) {
}

@media (max-width: 736px) {
	body { padding: 10px 0; }

	.i8-container { width: inherit; margin: 0 auto; }

		.i8-container.h-0 { margin-left: auto; margin-right: auto; }
		.i8-container.h-10 { margin-left: auto; margin-right: auto; }
		.i8-container.h-20 { margin-left: auto; margin-right: auto; }
		.i8-container.h-30 { margin-left: auto; margin-right: auto; }
		.i8-container.h-40 { margin-left: auto; margin-right: auto; }
		.i8-container.h-50 { margin-left: auto; margin-right: auto; }
		.i8-container.h-60 { margin-left: auto; margin-right: auto; }
		.i8-container.h-70 { margin-left: auto; margin-right: auto; }
		.i8-container.h-80 { margin-left: auto; margin-right: auto; }
		.i8-container.h-90 { margin-left: auto; margin-right: auto; }
		.i8-container.h-100 { margin-left: auto; margin-right: auto; }

		.i8-container.v-0 { margin-top: 10%; }
		.i8-container.v-10 { margin-top: 10%; }
		.i8-container.v-20 { margin-top: 10%; }
		.i8-container.v-30 { margin-top: 10%; }
		.i8-container.v-40 { margin-top: 10%; }
		.i8-container.v-50 { margin-top: 10%; }
		.i8-container.v-60 { margin-top: 10%; }
		.i8-container.v-70 { margin-top: 10%; }
		.i8-container.v-80 { margin-top: 10%; }
		.i8-container.v-90 { margin-top: 10%; }
		.i8-container.v-100 { margin-top: 10%; }

	.i8-login { width: auto; text-align: center; padding: 0; background: none; border: 0; box-shadow: none; }
	.i8-login-logo { width: 88px; height: 88px; margin: 0 auto; position: inherit; left: 0; top: 0; }
	.i8-login-title { margin: 10px 0; }
	.i8-login-footer ul { padding: 0; }
		.i8-login-footer ul li { padding: 0; }
			.i8-login-footer ul li.i8-login-checkbox { display: none; }
			.i8-login-footer ul li.i8-login-submit { margin-top: 20px; }
			.i8-login-footer ul li.i8-login-win { }

	.i8-login-footer li font { color: #FFF; text-shadow: 0 0 4px rgba(0,0,0,0.8); }
	.i8-login-footer li.i8-login-checkbox { }

	.i8-login-mobile-box { background: rgba(255,255,255,0.7); border: 1px solid rgba(255,255,255,0); border-radius: 10px; z-index: 99; }
		.i8-login-mobile-box > div { background-color: rgba(255,255,255,0.2); border-radius: 0; margin-bottom: 1px; padding-right: 20px; }

	#UserPwd { border-bottom: none; }

	.i8-login-btn { width: 100%; }

	div.resetpwd-dialog { top: 50px; left: 10%; right: 10%; margin-left: 0; width: auto; height: auto; min-height: 350px; }
	.resetpwd label { display: block; }
}

@media (max-width:667px) {
}

@media (max-width:640px) {
}

@media (max-width:480px) {
}

@media (max-width:414px) {
}

@media (max-width:384px) {
}

@media (max-width:320px) {
}