*,body{margin: 0;padding: 0;}
html, body {background-color: #e2e6e9;}
:root {
	--color-1: #029ed7;
	--color-2: #03b1f0;
}
a{text-decoration:none;outline:none;}
a:link{color:#222; text-decoration:none;}
a:focus,a:hover{color:var(--color-1);}
a:visited{color:#333}
.flex-sb{
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	-webkit-justify-content:space-between;
	justify-content: space-between;
}
.login-page {width: 100%;padding: 10% 0 0;margin: auto;}
.login_form{position: relative;z-index: 1;width: 1200px;align-items: center;background-color: #fff;margin: 0 auto}
.login_form .img{width: 55%;padding: 0;margin: 0!important;}
.login_form .img img{height: 100%;width:auto;margin: 0!important;padding: 0!important;border: 0!important;display: block;}
.login_form .form{width: 45%;padding:50px 60px;}
.login_form .form .title{width: 100%;margin-bottom: 30px;}
.login_form .form .title h4{font-size: 50px;font-weight: 550;margin-bottom: 10px;color: #222}
.login_form .form .title p{font-size: 18px;color: #333}
.login_form .form label{font-size: 18px;color: 222;margin-bottom: 10px;font-weight: 550;display: inline-block}
.login_form .form  input[type="text"],.login_form .form  input[type="password"]{width: 100%;text-indent: 20px;line-height: 50px;border: 1px solid #888;border-radius: 12px;font-size: 18px;margin-bottom:20px;}
.login_form .form  input[type="checkbox"]{width: 18px;height: 18px;border: 1px solid #ddd;position: relative;top:2px;margin:0 5px}
.login_form .form .login_status{font-size: 14px;font-weight: 500;margin-bottom: 50px;}
.login_form .form button {
	margin-top: 20px;
	font-family: "Microsoft YaHei", "Roboto", sans-serif;
	text-transform: uppercase;
	outline: 0;border-radius: 12px;
	background: var(--color-1);
	width: 100%;
	border: 0;
	padding: 15px;
	color: #FFFFFF;
	font-size: 22px;
	cursor: pointer;
}
.form button:hover, .form button:active, .form button:focus {background: var(--color-2);}
.shake_effect {
	-webkit-animation-name: shake;
	animation-name: shake;
	-webkit-animation-duration: 1s;
	animation-duration: 1s;
}
 @-webkit-keyframes shake {
 from, to {
 -webkit-transform: translate3d(0, 0, 0);
 transform: translate3d(0, 0, 0);
}
 10%, 30%, 50%, 70%, 90% {
 -webkit-transform: translate3d(-10px, 0, 0);
 transform: translate3d(-10px, 0, 0);
}
 20%, 40%, 60%, 80% {
 -webkit-transform: translate3d(10px, 0, 0);
 transform: translate3d(10px, 0, 0);
}
}
 @keyframes shake {
 from, to {
 -webkit-transform: translate3d(0, 0, 0);
 transform: translate3d(0, 0, 0);
}
 10%, 30%, 50%, 70%, 90% {
 -webkit-transform: translate3d(-10px, 0, 0);
 transform: translate3d(-10px, 0, 0);
}
 20%, 40%, 60%, 80% {
 -webkit-transform: translate3d(10px, 0, 0);
 transform: translate3d(10px, 0, 0);
}
}
.footer{position: absolute;width: 100%;bottom: 0;left:0;height: 50px;}
.footer p{text-align: center;font-size: 14px;font-family: "Microsoft YaHei", "Roboto", sans-serif,Arial;text-transform: uppercase;color:#333}
