html, body {
    height: 100%;
    margin: 0;
}

body {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    padding-top: 40px;
    padding-bottom: 40px;
    /*background-color: #F5F7FA;*/
    background: url("../../images/watermark.jpg") no-repeat center;
    background-size: cover;
    opacity: 0.90; /* Adjust the opacity to make it look like a watermark */
}

@media (min-width: 992px) {
    body {
        background: none;
        background-color: #F5F7FA;
        opacity: inherit;
    }
}

.content {
    position: relative;
    z-index: 1; /* Ensure the content is above the watermark */
}

.form-container {
    display: block;
    padding-top: 30px;
}

@media (min-width: 992px) {
    .form-container {
        display: flex;
        flex-direction: column;
        justify-content: center; /* Center vertically on larger screens */
        min-height: 100vh; /* Full viewport height */
        padding: 0;
    }
}

.banner {
    width: 100%;
    min-height: 165px;
    max-height: 200px;
    object-fit: cover; /* Ensures the image covers the container */
    object-position: center;
}

@media (max-width: 389px) {
    #login-banner {
        display: none;
    }
}

.soft-white {
    background-color: #F5F7FA;
}

.image-padding-top {
    padding-top: 5vh;
}

.custom-icon {
    font-size: 1rem;
}

.banner-img {
    display: block;
}

.sign-in-btn {
    position: relative;
    background-color: #0046AD;
    color: white;
    border: none;
    padding: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden; /* Ensure child elements do not overflow */
    transition: background 0.3s, color 0.3s;
}

.form-control {
    background-color: #e7f1ff !important;
}

.message-alert {
    display: flex;
    justify-content: center; /* Horizontally center */
    margin: 0 auto; /* Center align container */
    text-align: center;
    width: 100%; /* Ensure it takes full width of its parent */
    max-width: 100%; /* Ensure it does not exceed parent width */
}



.simmons-logo-blue {
        width: 100%;
        min-height: 60px;
        max-height: 70px;
        min-width: 240px;
        max-width: 250px;
}

/* Span containing the button text */
.sign-in-btn .btn-text {
    transition: opacity; /* Smooth transition for opacity */
    position: relative; /* Ensure it's on top of the image initially */
    z-index: 1; /* Ensure text is above the image by default */
}

/* Pseudo-element for the hover image */
.sign-in-btn::after {
    content: "";
    background-size: contain;
    position: absolute;
    top: 50%;
    left: 50%;
    width: 100%;
    height: 100%;
    opacity: 0;
    transform: translate(-50%, -50%);
    transition: opacity 0.3s;
    z-index: 0; /* Ensure image is behind the text */
}

/* Hover effect to replace text with image */
.sign-in-btn:hover .btn-text {
    opacity: 1;
}

.sign-in-btn:hover::after {
    opacity: 1; /* Show the image, if using image on hover */
}

.container-fluid {
    height: 100%;
}

.form-signin {
    width: 100%;
    max-width: 330px;
    padding: 15px;
    margin: auto;
}

.form-signin .checkbox {
    font-weight: 400;
}

.form-signin .form-control {
    position: relative;
    box-sizing: border-box;
    height: auto;
    padding: 10px;
    font-size: 16px;
}

.form-signin .form-control:focus {
    z-index: 2;
}

.form-signin input[type="email"] {
    margin-bottom: -1px;
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 0;
}

.form-signin input[type="password"] {
    margin-bottom: 10px;
    border-top-left-radius: 0;
    border-top-right-radius: 0;
}