form {
	    z-index: 999;
	}

	/*登录*/

	.loginHtml,
	.loginBody {
	    height: 100%;
	}

	.loginBody form.layui-form {
	    padding: 0 20px;
	    width: 300px;
	    height: 335px;
	    position: absolute;
	    left: 50%;
	    top: 50%;
	    margin: -150px 0 0 -150px;
	    -webkit-box-sizing: border-box;
	    -moz-box-sizing: border-box;
	    -o-box-sizing: border-box;
	    box-sizing: border-box;
	    background: #fff;
	    -webkit-border-radius: 5px;
	    -moz-border-radius: 5px;
	    border-radius: 5px;
	    box-shadow: 0 0 50px #008cd3a1;
	}

	.login_face {
	    background: #fff;
	    margin: -55px auto 40px;
	    width: 100px;
	    height: 100px;
	    -webkit-border-radius: 50%;
	    -moz-border-radius: 50%;
	    border-radius: 50%;
	    border: 5px solid #fff;
	    overflow: hidden;
	    box-shadow: 0 0 30px #008cd3a1;
	}

	.login_face img {
	    width: 100%;
	}

	.loginBody .layui-form-item {
	    position: relative;
	}

	.loginBody .layui-form-item label {
	    position: absolute;
	    color: #757575;
	    left: 10px;
	    top: 5px;
	    line-height: 20px;
	    background: #fff;
	    padding: 0 5px;
	    font-size: 14px;
	    cursor: text;
	}

	.loginBody .layui-form-item.layui-input-focus label {
	    top: -10px;
	    font-size: 12px;
	    color: #ff6700;
	}

	.loginBody .layui-form-item.layui-input-active label {
	    top: -10px;
	    font-size: 12px;
	}

	.loginBody .layui-input::-webkit-input-placeholder {
	    color: #fff;
	}

	.loginBody .layui-input::-moz-placeholder {
	    color: #fff;
	}

	.loginBody .layui-input:-ms-input-placeholder {
	    color: #fff;
	}

	.loginBody .layui-input::placeholder {
	    color: #fff;
	}

	.loginBody .layui-form-item.layui-input-focus input {
	    border-color: #ff6700 !important;
	}

	.loginBody .layui-input-focus .layui-input::-webkit-input-placeholder {
	    color: #757575;
	}

	.loginBody .layui-input-focus .layui-input::-moz-placeholder {
	    color: #757575;
	}

	.loginBody .layui-input-focus .layui-input:-ms-input-placeholder {
	    color: #757575;
	}

	.loginBody .layui-input-focus .layui-input::placeholder {
	    color: #757575;
	}

	.loginBody .seraph {
	    font-size: 30px;
	    text-align: center;
	}

	.loginBody .seraph.icon-qq:hover {
	    color: #0288d1;
	}

	.loginBody .seraph.icon-wechat:hover {
	    color: #00d20d;
	}

	.loginBody .seraph.icon-sina:hover {
	    color: #d32f2f;
	}

	.imgCode {
	    position: relative;
	}

	#imgCode img {
	    position: absolute;
	    top: 1px;
	    right: 1px;
	    cursor: pointer;
	}

	.loginBody .layui-input-focus .layui-input::-webkit-input-placeholder {
	    transition: color 0.2s linear 0.2s;
	    -webkit-transition: color 0.2s linear 0.2s;
	}

	.loginBody .layui-input-focus .layui-input::-moz-placeholder {
	    transition: color 0.2s linear 0.2s;
	}

	.loginBody .layui-input-focus .layui-input:-ms-input-placeholder {
	    transition: color 0.2s linear 0.2s;
	}

	.loginBody .layui-input-focus .layui-input::placeholder {
	    transition: color 0.2s linear 0.2s;
	    -webkit-transition: color 0.2s linear 0.2s;
	}

	/* 背景 */

	html,
	body {
	    margin: 0;
	    overflow: hidden;
	    width: 100%;
	    height: 100%;
	    /* cursor: none; */
	    background: black;
	    background: linear-gradient(to bottom, #000000 0%, #5788fe 100%);
	}

	.filter {
	    width: 100%;
	    height: 100%;
	    position: absolute;
	    top: 0;
	    left: 0;
	    background: #14cf98;
	    animation: colorChange 10s ease-in-out infinite;
	    animation-fill-mode: both;
	    mix-blend-mode: overlay;
	}

	@keyframes colorChange {
	    0%,
	    100% {
	        opacity: 0;
	    }
	    50% {
	        opacity: .9;
	    }
	}

	.landscape {
	    position: absolute;
	    bottom: 0px;
	    left: 0;
	    width: 100%;
	    height: 100%;
	    /*background-image:url(https://openclipart.org/image/2400px/svg_to_png/250847/Trees-Landscape-Silhouette.png);
	*/
	    /* background-image: url('../../public/images/bg-login.png'); */
	    background-size: 1000px 250px;
	    background-repeat: repeat-x;
	    background-position: center bottom;
	}