/**
 * Customize the login screen
 *
 * In case you are ever going to read this, we decided to keep the wp-login.php screen as our major login handler,
 * the why is pretty simple, it already has all the features and we don't need to change much.
 *
 * Wondering how to do this? Check out: http://wpmu.org/customize-wordpress-login/
 */

body.login {
    background: #77235F;
}

/* Login Logo */
.login h1 a {
    background-image: url(../images/login-logo.png);
    background-size: 240px 42px;
    width: 240px;
    height: 42px;
}

/* Login Wrap */
.login form {
    overflow: hidden;
    margin: 0;
    padding: 20px;
    background-color: #F5F5F5;
    background-image: -webkit-gradient(linear, left top, left bottom, from(#F5F5F5), to(#EEEEEE));
    background-image: -webkit-linear-gradient(top, #F5F5F5, #EEEEEE);
    background-image:    -moz-linear-gradient(top, #F5F5F5, #EEEEEE);
    background-image:      -o-linear-gradient(top, #F5F5F5, #EEEEEE);
    background-image:         linear-gradient(to bottom, #F5F5F5, #EEEEEE);
    border: solid #CCC;
    border-width: 0 0 1px 0;
    border-radius: 5px 5px 0 0;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
}

/* Text Fiels + Labels */
.login label {
    color: #444;
}
.login form input[type="text"],
.login form input[type="password"] {
    margin: .25em 0 1em 0;
    padding: 6px 8px;
    font-size: 20px;
    background: #FFF;
    border: 1px solid #CCC;
    border-radius: 3px;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}
.login form input[type="text"]:focus,
.login form input[type="password"]:focus,
.login form textarea:focus {
    box-shadow: 0 0 5px RGBa(253,201,0,0.5), inset 0 2px 4px RGBa(0,0,0,0.1);
    outline: none;
}

/* Remember Me */
input#rememberme {
    width: 18px;
    height: 18px;
    margin: -2px 0 0 0;
}

/* Submit Button */
.wp-core-ui.login input.button-primary {
    height: auto;
    text-align: center;
    color: #FFF;
    cursor: pointer;
    background-color: #77235F;
    background-image: -webkit-gradient(linear, left top, left bottom, from(#77235F), to(#6E1F56));
    background-image: -webkit-linear-gradient(top, #77235F, #6E1F56);
    background-image:    -moz-linear-gradient(top, #77235F, #6E1F56);
    background-image:      -o-linear-gradient(top, #77235F, #6E1F56);
    background-image:         linear-gradient(to bottom, #77235F, #6E1F56);
    border: 1px solid #66104E;
    box-shadow: inset 0 1px 0 RGba(255,255,255,0.25);
    border-radius: 3px;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}
.login input.button-primary:hover {
    border-color: #66104E;
    background-image: -webkit-gradient(linear, left top, left bottom, from(#6E1F56), to(#66104E));
    background-image: -webkit-linear-gradient(top, #6E1F56, #66104E);
    background-image:    -moz-linear-gradient(top, #6E1F56, #66104E);
    background-image:      -o-linear-gradient(top, #6E1F56, #66104E);
    background-image:         linear-gradient(to bottom, #6E1F56, #66104E);
    box-shadow: inset 0 1px 0 RGba(255,255,255,0.25);
}
.login input.button-primary:active {
    border-color: #66104E;
    background-image: -webkit-gradient(linear, left top, left bottom, from(#6E1F56), to(#77235F));
    background-image: -webkit-linear-gradient(top, #6E1F56, #77235F);
    background-image:    -moz-linear-gradient(top, #6E1F56, #77235F);
    background-image:      -o-linear-gradient(top, #6E1F56, #77235F);
    background-image:         linear-gradient(to bottom, #6E1F56, #77235F);
    box-shadow: inset 0 1px 0 RGba(255,255,255,0.25);
}

/* Bottom Links */
.login #nav,
.login #backtoblog {
    margin: 0;
    background: #FFF;
}
.login #nav {
    padding: 20px 20px 10px 20px;
}
.login #backtoblog {
    padding: 0 20px 20px 20px;
    border-radius: 0 0 5px 5px;
}
.login #nav a,
.login #backtoblog a {
    color: #77235F !important;
}
.login #nav a:hover,
.login #backtoblog a:hover {
    color: #444 !important;
}

/* Messages */
div.updated,
.login .message,
div.error,
.login #login_error {
    margin: 0 0 1em 0;
    padding: 15px 20px;
    border: none;
    border-radius: 5px;
}
div.updated,
.login .message {
    background-color: #FFF;
}
div.error,
.login #login_error {
    background-color: #FDC900;
}