.login-pf .login-pf-page {
    display: grid;
    grid-template-columns: 400px 2fr [end];
    width: 100%;
    padding: 0;
}

.login-pf .login-pf-page .login-pf-page-header {
    order: 1;
    background-image: url("../img/login.avif");
    background-position: center right;
    background-size: cover;
}

.login-pf .login-pf-page .card-pf .login-pf-header #kc-current-locale-link {
    color: unset;
}

.login-pf .login-pf-page .card-pf .login-pf-header:before {
    content: "";
    display: block;
    height: 100px;
    background-size: 180px;
    filter: invert(.75);
    background-image: url('../img/ibricks-logo.svg');
    background-repeat: no-repeat;
    background-position: top;
}

.login-pf .login-pf-page .card-pf #kc-content-wrapper:after {
    content: "";
    display: block;
    height: 50px;
    background-size: 50px;
    background-image: url('../img/iSi-logo.svg');
    background-repeat: no-repeat;
    background-position: bottom;
}

.login-pf .login-pf-page .card-pf #kc-locale {
    position: absolute;
    top: 15px;
    left: 15px;
}

.login-pf .login-pf-page .card-pf #kc-locale .pf-c-dropdown__menu {
    right: unset;
}

.login-pf .login-pf-page .card-pf #kc-locale #kc-locale-dropdown ul {
    display: none;
}

.login-pf .login-pf-page .login-pf-page-header .logo {
    display: none;
}

.login-pf .login-pf-page .card-pf {
    order: 0;
}

.login-pf .login-pf-page .card-pf .login-subtitle {
    color: unset;
}

.login-pf .login-pf-page .card-pf, .login-pf .login-pf-page .login-pf-page-header {
    border-radius: unset;
}

@media (max-width: 767px) {
    .login-pf body {
        background: none;
    }

    .login-pf .login-pf-page {
        grid-template-columns: 1fr;
    }

    .login-pf .login-pf-page .login-pf-page-header {
        display: none;
    }

    .login-pf .login-pf-page .card-pf .login-pf-header #kc-page-title {
        font-size: 1.5rem;
        text-align: center;
    }

    .login-pf .login-pf-page .card-pf .login-subtitle {
        text-align: center;
    }

    .login-pf .login-pf-page .card-pf {
        max-width: 400px;
        box-shadow: none;
        margin: 0 auto;
    }
}

@media (max-width: 300px) {
    .login-pf .login-pf-page .card-pf .login-pf-header:before {
        height: 50px;
        background-size: 100px;
    }

    .login-pf .login-pf-page .card-pf .login-pf-header #kc-page-title {
        font-size: 1.2rem;
    }
}