*{
	margin: 0;
	padding: 0;
}
html,body{
	height: 100%;
	width: 100%;
}
.top{
	width: 100%;
	height: 20%;
	background-color: aliceblue;
	position: relative;
	box-sizing: border-box;
	padding-left: 200px;
}
.center{
	width: 100%;
	height: 60%;
	background-color: blanchedalmond;
	position: relative;
}
.loginfooter{
	width: 100%;
	height: 20%;
	background-color: aliceblue;
	display: flex;
	justify-content: center;
	align-content: center;
	align-items: center;
}
.topImg{
	width: 50%;
	float: left;
	position: relative;
	top: 50%;
	transform: translateY(-50%);
}
.topDiv{
	float: left;
	color: #00469e;
	font-size: 5vh;
	font-weight: bolder;
	position: relative;
	top: 52%;
	transform: translateY(-50%);
}

.centerImg{
	position: absolute;
	width: 100%;
	height: 100%;
	z-index: 0;
	filter: brightness(90%);
}

.form{
	position: absolute;
	z-index: 11;
	border: 4px rgba(255, 255, 255, 0.6) solid;
	border-radius: 20px;
	top: 50%;
	right: 15%;
	height: 55%;
	width: 25%;
	transform: translateY(-50%);
	box-sizing: border-box;
	overflow:hidden;
	
}
.form #normalLoginFormView{
	height: 100%;
	display: flex;
	flex-direction: column;
	justify-content: center;
}

.form #scanQRCodeView{
	height: 100%;
	display: grid;
	flex-direction: column;
	justify-content: center;
}

.loginTitle{
	text-align: center;
	height: 20%;
	color: aliceblue;
	font-size: 3vh;
	font-weight: bolder;
	display: flex;
    align-items: center;
    justify-content: center;
	
}
.inputDiv{
	height: 20%;
	width: 85%;
	margin: 0 auto;
	margin-bottom: 10px;
	/* display: flex; */
	position: relative;
	box-sizing: border-box;
	padding-left: 15px;
	background-color: white;
}



.forgotpassword{
	height: 13%;
	width: 85%;
	margin: 0 auto;
	/* display: flex; */
	position: relative;
	box-sizing: border-box;
	padding-left: 15px;
	
}

.forgotpassword span{
	float: right;
}
.forgotpassword span a{
	color: white;
	font-size: 3vh;
}


.inputDiv3{
	height: 20%;
	width: 100%;
	margin: 0 auto;
	position: relative;
	box-sizing: border-box;
}
.inputDiv>i{
	font-size: 4vh;
	color: #2662b2;
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
}
.input{
	height: 80%;
	width: 75%;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translateY(-50%) translateX(-40%);
	border: none;
	outline: none;
	font-size: 2.5vh;
}
.loginButton{
	height: 80%;
	width: 85%;
	background-color: #007BFF;
	border: none;
	cursor: pointer;
	color: white;
	font-size: 3vh;
	font-weight: bolder;
	border-radius: 5px;
	position: absolute;
	left: 50%;
	transform: translateX(-50%);
}

.j_password{
	position: relative;
}
.j_password .fa{
	position: absolute;
	left: 85%;
	font-size: 20px;
	cursor: pointer;
}

#j_captcha{
	float: left;
    width: 30%;
    left: 32%;
}

#j_captchaimg{
	float: right;
    width: 40%;
    height: 80%;
    margin-top: 3px;    
}

.error{
	color: #fff;
	text-align: center;
	font-weight: bold;
	font-size: 17px;
	text-shadow: 1px 1px 2px red,
	0 0 1em #000,
	0 0 0.2em blue;
}

/* IE浏览器降级样式支持 */
.error-ie {
	color: #ff0000;
	text-align: center;
	font-weight: bold;
	font-size: 17px;
	margin: 10px auto;
	width: 80%;
	display: block !important;
}

.footerImg{
	width: 5%;
	
}
.footerDiv{
	margin-left: 10px;
	color: grey;
	font-size: 10px;
}
.footerDiv>a{
	text-decoration: none;
	color: grey;
}
