 * { margin: 0; padding: 0; }

        body { font-family: "Hiragino Sans GB","Microsoft YaHei","WenQuanYi Micro Hei",sans-serif; font-size: 12px; background:#FFF; width: 100%; overflow: hidden; }

        .wp-login { width: 900px; position: absolute; left: 50%; top: 50%; margin: -280px 0 0 -450px; text-align: center; }

        .wp-logo { opacity: 0; -webkit-transform: translatey(-100px); -moz-transform: translatey(-100px); transform: translatey(-50px); -webkit-animation: movein 1s ease forwards 0.3s; -moz-animation: movein 1s ease forwards 0.3s; animation: movein 1s ease forwards 0.3s; }

        .wp-login-title { opacity: 0; -webkit-transform: translateX(-166px); -moz-transform: translateX(-166px); transform: translateX(-166px); -webkit-animation: movein 1s ease forwards 0.3s; -moz-animation: movein 1s ease forwards 0.3s; animation: movein 1s ease forwards 0.3s; }

        .wp-login-title h1 { margin: 40px 0 15px 0; color: #fff; font-size: 32px; }

        .wp-login-title p { color: #fff; }

        .wp-login-form { position: relative; margin: 0 auto; width: 322px; text-align: left; opacity: 0; -webkit-transform: translateX(166px); -moz-transform: translateX(166px); transform: translateX(166px); -webkit-animation: movein 1s ease forwards 0.3s; -moz-animation: movein 1s ease forwards 0.3s; animation: movein 1s ease forwards 0.3s; }

        .wp-login-form .wp-login-input, .wp-code { border: 1px solid transparent; width: 310px; padding: 12px 5px; border-radius: 5px; text-align: center; font-size: 16px; box-shadow: 0 2px 3px rgba(0,0,0,.2); display: block; margin-bottom: 15px; -webkit-transition: .05s border-color ease-in-out; transition: .05s border-color ease-in-out; outline: none; background: url() no-repeat center center #fff; }

        .wp-login-form input:first-of-type { background: url() no-repeat center center #fff; }

        .wp-login-form input[type="text"]:focus, .wp-login-form input[type="password"]:focus { border-color: #ff9204; box-shadow: inset 0 2px 10px rgba(0,0,0,.3); }

        .wp-code { width: 80px; box-shadow: none; float: left; background: url() no-repeat center center #fff; }

        .wp-login-form span { display: inline-block; width: 80px; height: 45px; overflow: hidden; border-radius: 5px; float: left; margin-left: 15px; }

        .wp-login-form span img { width: 100%; height: 100%; }

        .wp-login-form a { float: right; font-size: 14px; text-decoration: none; color: #FFF; margin-top: 26px; }

        .wp-login-form input[type=submit] { width: 322px; padding: 12px 5px; border: none; background: #3f84bc; font-weight: bold; color: #fff; border-radius: 5px; font-size: 16px; box-shadow: 0 2px 3px rgba(0,0,0,.2); margin-top: 15px; outline: none; cursor: pointer; -webkit-appearance: none; }

        .wp-login-form .btn-black { width: 322px; padding: 12px 5px; border: none; background: #1abd6c; font-weight: bold; color: #fff; border-radius: 5px; font-size: 16px; box-shadow: 0 2px 3px rgba(0,0,0,.2); margin-top: 15px; outline: none; cursor: pointer; -webkit-appearance: none; }

        .wp-login-form input[type=submit]:hover { background: #f1a41f; }

        .wp-login-form input[type=submit]:active { background:#f1a41f; box-shadow: inset 0 2px 3px rgba(0,0,0,.2); }

        .wp-footer { position: absolute; width: 100%; text-align: center; bottom: 0; color: #fff; line-height: 30px; padding-bottom: 20px; opacity: 0.8; }

        .wp-footer span { padding: 0 10px; }

        .wp-footer a { text-decoration: none; color: #fff; }

        .wp-verify { padding: 10px 0 5px 0; height: 25px; text-align: center; line-height: 25px; color: #ff1a0f; }

        .wp-verify b { font-weight: normal; }

        @media only screen and (max-width: 900px) {
            body { background: #44b549; }

            .wp-login-title, #container, .wp-footer, .background { display: none; }

            .wp-login { position: static; width: 100%; margin: 0; }

            .wp-login-form { box-sizing: border-box; padding: 0 15px; }

            .wp-login-form .wp-login-input, .wp-login-form input[type=submit] { width: 100%; box-sizing: border-box; }

            .wp-logo { margin-top: 30px; }
        }



        .container { position: absolute; height: 100%; width: 100%; z-index: -2; }
        .background { width: 100%; height: 100%; position: absolute; left: 0; top: 0; z-index: -1; }

        @-webkit-keyframes movein {
            to { -webkit-transform: translateX(0); opacity: 1; }
        }

        @-moz-keyframes movein {
            to { -moz-transform: translateX(0); opacity: 1; }
        }

        @keyframes movein {
            to { transform: translateX(0); opacity: 1; }
        }