:root {
    --background-image: #015FFF14;
}

.login-container {
    grid-template-columns: 1fr minmax(500px, 1fr) 1fr;
    grid-template-rows: minmax(20px, 50px) auto minmax(20px, 50px) min-content;
}

    .login-container .background {
        grid-area: 1 / 1 / 5 / 5;
    }

    .login-container .login-form {
        grid-area: 2 / 2 / 3 / 3;
    }

.login-form {
    border-radius: 26px;
    box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.24);
}

.footer {
    grid-area: 4 / 1 / 5 / 4;
}

@media only screen and (max-width: 720px) {
    .login-container {
        grid-template-columns: 1fr;
        grid-template-rows: none;
    }

        .login-container .background {
            display: none;
        }

        .login-container .login-form {
            grid-area: unset;
            grid-column: 1 / -1;
        }

        .login-container .login-form {
            border-radius: 0;
            box-shadow: 0;
        }

        .login-container .footer {
            display: none;
        }
}