.header{
    background-image: url("/img/brand/header_img.jpg") !important;
    background-size: cover;
    height: 45rem;
    background-repeat: no-repeat;
    background-position: center;
}

.login_card{
    margin-top: -20rem !important;
}




@media only screen and (min-width: 375px) and (max-width: 667px) {
    .header{
        background-position: left;
        background-size: contain;
        height: 14rem;
    }
    .login_card{
        margin-top: -1rem !important;
    }

    @media (max-width: 768px) {
        table, thead, tbody, th, td, tr {
            display: block;
        }
        thead tr {
            position: absolute;
            top: -9999px; /* Hides table headers visually */
            left: -9999px;
        }
        tr {
            border: 1px solid #ccc;
            margin-bottom: 10px;
        }
        td {
            border: none;
            border-bottom: 1px solid #eee;
            position: relative;
            padding-left: 50%; /* Creates space for labels */
            text-align: right;
        }
        td:before {
            position: absolute;
            left: 6px;
            content: attr(data-label); /* Displays header as label */
            font-weight: bold;
        }
    }
}