body{ margin: 0; padding: 0;}
li {list-style-type:none;}
ul{margin:0;padding:0}
.message,.msgBg{ position: fixed; width: 100%; height: 100%;overflow-y: scroll;}
/*.message{ background-image:linear-gradient(134deg, #5ff8e9 19%, #7370fe 73%); }*/
.msgBg{ background: url(../images/bg.jpg) no-repeat;display: -webkit-box;background-size: 100% 98%;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;}
.fs_14{font-size: 14px;color: #666;}
.ml_10{margin-left: 10px;}
.msgCenter{ background: #fff; max-width: 930px;min-height: 500px;min-width: 460px; max-height: 540px; width: 20%; height: 80%; border-radius: 12px; overflow: hidden; box-shadow: 4px 8px 26px rgba(0,0,0,0.3);position: absolute;left: 50%;top:15%;transform: translateX(-50%);
	margin: 0 auto;
}
/*<!–-[if gt IE 8]>.msgCenter{top:6%;}<![endif]–->*/
					   .msgL{ background: url(../images/img.jpg) no-repeat; background-size: 100% 100%; width: 50%; height: 100%; float: left;min-width: 405px;}
.msgR div{
	text-align: center;
}
.userTop{
	background: url('../images/bolang.png') no-repeat;width: 100%;height: 150px;margin-top: -10px;line-height: 150px;color: #ffffff;font-size: 30px;
}
.msgR div img{
	width: 220px;
	display: inline-block;
}
.msgR form{
	width: 60%;
	margin: 0 auto;
}
.msgR form ul li{
	position: relative;
}
.msgR form ul li input{
	width: 83%;
	border-radius:5px;
	background-color:#f4f4f4;
	outline:none;
	font-size: 16px;
	color: #000000;
    border: 1px solid #f4f4f4;
    padding-left: 45px;
    height:40px;
    line-height: 40px;
    margin-top: 35px;
    float: none;
    overflow: hidden;
}
.msgR form ul li input:focus{
	background-color:#fff;
	border: 1px solid #04aecf;
}
.msgR form ul{
	margin: 20px 0;
}
.msgR form ul li .login-label{
	position: absolute;
    z-index: 3;
    top: 36px;
    left: 0;
    width: 40px;
    height: 40px;
    background-position: center;
    background-repeat: no-repeat;
}
.msgR form ul li .name-label{
	background-image: url(../images/name.png);
	
}
.msgR form ul li .password-label{
	background-image: url(../images/passwrod.png);
}
.msgR form ul li .code-label{
	background-image: url(../images/code.png);
}
.msgR form ul li .code-label-img{
	position: absolute;
    z-index: 3;
    top: 22px;
    right: 10px;
    width: 80px;
    height: 40px;
	background-image: url(../images/yanz.png);
	background-repeat: no-repeat;
	background-position: center;
	cursor: pointer;
}
.msgR .btn{
	width: 100%;
	line-height: 45px;
	margin-top: 45px;
	text-align: center;
	background-image: url(../images/button_bg.jpg);
	background-repeat: repeat-y;
	border-radius: 5px;
	color: #fff;
	box-shadow: 0px 10px 18px #c5e7ff;
	cursor: pointer;
}
.msgR form ul .verificationCode input {
	padding-left: 10px;
	width: 100px;
	box-sizing: border-box;
}

.msgR form ul .verificationCode img{
	height: 40px;
	vertical-align: middle;
	border: 1px #ccc solid;
	box-sizing: border-box;
	margin-left: 20px;
	border-radius: 5px;
}
.msgR .remember_pw{
	width: 16px;
	height: 16px;
	background: url(../images/selected.png) no-repeat;
	cursor: pointer;
	vertical-align: middle;
	display: inline-block;
}
.msgR .select{
	background-position: -15px 0;
}
.remember_pw input[type="checkbox" i] {
	width: 16px;
	height: 16px;
	margin: 0;
	opacity: 0;
	filter:alpha(opacity=0)
}
.tip{
	display: block;
	position: absolute;
	bottom: -30px;
	font-size: 12px;
	color: red;
	display: none;
}
.banquan{
	position: absolute;
	bottom: 20px;
	text-align: center;
	font-size: 16px;
	color: #003d64;
	margin:0 40%;
}
form ul li .placeholder{
	position: absolute;
	top:49px;
	left:49px;
	color:#848484;
}
.red{
	text-align: center;
	font-size: 15px;
}
.BatchImport .el-dialog--small{
	width: 30%!important;
	top:30%!important;
}
.star {
	display: block;
	width: 5px;
	height: 5px;
	border-radius: 50%;
	background: #FFF;
	top: 100px;
	left: 500px;
	position: absolute;
	transform-origin: 100% 0;
	animation: star-ani 4s linear infinite;
	-webkit-animation:star-ani 5s linear infinite;
	box-shadow: 0 0 5px 5px rgba(255, 255, 255, .3);
	opacity: 0;
	z-index: 2;
}
.star:after {
	content: '';
	display: block;
	top: 0px;
	left: 4px;
	border: 0px solid #fff;
	border-width: 0px 90px 2px 90px;
	border-color: transparent transparent transparent rgba(255, 255, 255, .3);
	transform: rotate(-45deg) translate3d(1px, 3px, 0);
	box-shadow: 0 0 1px 0 rgba(255, 255, 255, .1);
	transform-origin: 0% 100%;
}
.pink {
	top: 100px;
	left: 800px;
	background: #fff;
	animation-delay: 3s;
	-webkit-animation-delay: 3s;
	-moz-animation-delay: 3s;
}
.pink:after {
	border-color: transparent transparent transparent #fff;
	animation-delay: 3s;
	-webkit-animation-delay: 3s;
	-moz-animation-delay: 3s;
}
.blue {
	top: 120px;
	left: 1200px;
	background: fff;
	animation-delay: 7s;
	-webkit-animation-delay: 7s;
	-moz-animation-delay: 7s;
}
.blue:after {
	border-color: transparent transparent transparent fff;
	-webkit-animation-delay: 7s;
	-moz-animation-delay: 7s;
	animation-delay: 7s;
}
@keyframes star-ani {
	0% {
		opacity: 0;
		transform: scale(0) translate3d(0, 0, 0);
	}
	20%{
		opacity: 0.8;
		transform: scale(0.2) translate3d(-100px, 100px, 0);
	}
	40% {
		opacity: 0.8;
		transform: scale(0.4) translate3d(-200px, 200px, 0);
	}
	60% {
		opacity: 0.8;
		transform: scale(0.6) translate3d(-300px, 300px, 0);
	}
	80% {
		opacity: 1;
		transform: scale(1) translate3d(-350px, 350px, 0);
	}
	100% {
		opacity: 1;
		transform: scale(1.2) translate3d(-400px, 380px, 0);
	}
}