body.login {
    display: flex;
}
body.login h1 a { 
    background-image:url(https://byardsonlinemarketing.com//wp-content/uploads/2018/01/BYARD_OM_LOGO_BLACK_sm.png) !important; 
    background-size: contain;
    width: 100%;
}
/* Overall background */
body.login {
    background-color: #f0f4f8; /* Light grey background */
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100vh;
}

/* Login form customization */
.login form {
    background: #ffffff; /* White background */
    border: none;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); /* Soft shadow */
    padding: 40px;
    border-radius: 8px; /* Rounded corners */
}

/* Logo customization */
.login h1 a {
    background-image: url('your-logo-url.png'); /* Replace 'your-logo-url.png' with the path to your logo */
    background-size: 120px; /* Logo size */
    width: 120px;
    height: 120px;
}

/* Input field customization */
.login form .input, .login input[type="text"] {
    border-radius: 4px; /* Rounded corners for input fields */
    border: 1px solid #ccc; /* Light grey border */
    padding: 12px; /* Padding inside input fields */
    color: #333; /* Darker text for better readability */
}

/* Button customization */
.login .button-primary {
    background-color: #0056b3; /* Primary button color */
    border-color: #0056b3; /* Border color to match the button */
    color: #ffffff; /* White text */
    font-weight: bold;
    border-radius: 4px; /* Rounded corners for buttons */
    padding: 12px 24px; /* Button padding */
    font-size: 16px; /* Larger font size */
    box-shadow: none; /* Remove default shadow */
    transition: background-color 0.3s ease, border-color 0.3s ease; /* Smooth transition for hover effect */
}

.login .button-primary:hover {
    background-color: #003d82; /* Darker shade on hover */
    border-color: #003d82;
}

/* Link customization */
.login a {
    color: #0056b3 !important; /* Primary color for links */
    transition: color 0.2s ease; /* Smooth transition for hover effect */
}

.login a:hover {
    color: #003d82 !important; /* Darker shade on hover */
}

/* Customize the login error messages */
.login .message, .login .success, .login #login_error {
    border-left: 4px solid #0056b3; /* Add a colored border to the left */
    padding: 12px;
    background-color: #f0f4f8; /* Light background for contrast */
}

#backtoblog {
    display: none;
}