/* =========================================================
   CUSTOM WORDPRESS LOGIN PAGE
   ========================================================= */

body.login {
    background: #f5f7f2 !important;
    font-family: Arial, Helvetica, sans-serif;
}

/* Login Main Wrapper */
#login {
    width: 100%;
    max-width: 420px;
    padding: 40px 20px 20px;
}

/* WordPress Logo Area */
.login h1 {
    margin-bottom: 25px;
}

.login h1 a {
    width: 260px !important;
    height: 90px !important;

    background-image: url("../images/logo.png") !important;
    background-size: contain !important;
    background-position: center !important;
    background-repeat: no-repeat !important;

    margin: 0 auto !important;
}

/* Login Box */
.login form {
    margin-top: 0;
    padding: 30px !important;

    background: #ffffff;

    border: 1px solid #e6e6e6;
    border-radius: 18px;

    box-shadow: 0 15px 45px rgba(0, 0, 0, 0.10);
}

/* Labels */
.login label {
    color: #173f36;
    font-size: 14px;
    font-weight: 600;
}

/* Input Fields */
.login input[type="text"],
.login input[type="password"] {
    width: 100%;
    min-height: 48px;

    margin-top: 8px;

    padding: 10px 14px !important;

    border: 1px solid #d8ddd9 !important;
    border-radius: 10px !important;

    background: #ffffff !important;

    box-shadow: none !important;

    font-size: 15px;
}

/* Input Focus */
.login input[type="text"]:focus,
.login input[type="password"]:focus {
    border-color: #e88b32 !important;

    box-shadow: 0 0 0 3px rgba(232, 139, 50, 0.12) !important;

    outline: none !important;
}

/* Remember Me */
.login .forgetmenot {
    margin-top: 15px;
}

.login .forgetmenot label {
    font-size: 13px;
    font-weight: 500;
}

/* Login Button Area */
.login .submit {
    margin-top: 20px;
}

/* Login Button */
.login .button-primary {
    width: 100%;

    min-height: 48px;

    border: 0 !important;
    border-radius: 10px !important;

    background: #e88b32 !important;
    color: #ffffff !important;

    font-size: 15px;
    font-weight: 700;

    text-shadow: none !important;

    box-shadow: none !important;

    cursor: pointer;
}

/* Login Button Hover */
.login .button-primary:hover,
.login .button-primary:focus {
    background: #d9781f !important;
    color: #ffffff !important;
}

/* Password Eye Button */
.login .button.wp-hide-pw {
    color: #173f36;
}

/* Lost Password */
.login #nav {
    margin-top: 18px;
    padding: 0;
    text-align: center;
}

.login #nav a {
    color: #173f36 !important;
    font-size: 14px;
    text-decoration: none;
}

.login #nav a:hover {
    color: #e88b32 !important;
}

/* Back to Website */
.login #backtoblog {
    margin-top: 10px;
    padding: 0;
    text-align: center;
}

.login #backtoblog a {
    color: #173f36 !important;
    font-size: 14px;
    text-decoration: none;
}

.login #backtoblog a:hover {
    color: #e88b32 !important;
}

/* Error / Message */
.login .message,
.login #login_error {
    border-left: 4px solid #e88b32;
    border-radius: 8px;
    box-shadow: none;
}

/* Language Selector */
.login .language-switcher {
    margin-top: 20px;
}

.login .language-switcher select {
    border-radius: 8px;
}

/* Mobile */
@media (max-width: 480px) {

    #login {
        width: 100%;
        max-width: 100%;
        padding: 30px 15px 20px;
    }

    .login h1 a {
        width: 220px !important;
        height: 75px !important;
    }

    .login form {
        padding: 25px 20px !important;
        border-radius: 14px;
    }

}