@media only screen and (max-width: 500px) {
.login { width: 95%!important; margin: 40% auto!important; }
.widget-body { padding: 25px 15px!important; }
}

html, body { height: 100%; width: 100%; background: url(../images/banner.jpg) top center no-repeat; background-size: cover; }
.login { width: 350px; position: relative; top: 0; margin: 15% auto; background: #ffffff; border-radius: 10px; color: #000; box-shadow: 0px 5px 32px 4px rgba(43, 42, 42, 0.43); border-radius: 15px; }
.login-switch { width: 52px; height: 52px; line-height: 52px; position: absolute; right: 5px; top: 5px; }
.login-title { height: 18px; line-height: 18px; font-size: 16px; color: #3c3c3c; margin-top: 9px; padding-bottom: 8px; font-weight: 700; }
.login-content { margin-top: 20px; position: relative; }
.widget-body { padding: 25px 25px 40px; }
.formgroup { position: relative; width: 100%; display: table; border-collapse: separate; margin-bottom: 20px; }
.inputmh { padding-left: 10px; height: 38px; line-height: 38px; line-height: 36px\9; border: none; background-color: #fff; width: 100%; outline: none; border: 1px solid #ddd; }
#zphone { cursor: pointer; }
.buttonmh { width: 150px; height: 40px; background: #326EFC; line-height: 40px; display: block; margin: 0 auto; color: #fff; border: 0; font-size: 18px; border-radius: 20px; outline: 0; }
#username-error, #mobile-error { position: absolute; right: 0; top: 0; color: #F00; z-index: 100; box-sizing: border-box; line-height: 38px; margin-bottom: 0!important; padding-right: 5px; }
#mobile_code-error { position: absolute; padding-left: 10px; left: 0; top: 0; color: #F00; z-index: 100; box-sizing: border-box; line-height: 38px; margin-bottom: 0!important; }
 #username::-ms-input-placeholder, #mobile::-ms-input-placeholder {
font-family: "Microsoft YaHei";
}
 #username::-webkit-input-placeholder, #mobile::-webkit-input-placeholder {
font-family: "Microsoft YaHei";
}