.flex-layout.login-layout{
    background: var(--color-background-primary-gradient, var(--color-background-primary));
}

.flex-layout.login-layout .pk-heading{
    text-align: center;
}
.flex-layout.login-layout .pk-heading:not(:last-child){
    margin-bottom: max(1.875rem, calc(1.875 * var(--su)));
}
.flex-layout.login-layout .image-wrapper{
    display: flex;
    justify-content: center;
}
.flex-layout.login-layout .image-wrapper:not(:last-child){
    margin-bottom: max(3.75rem, calc(3.75 * var(--su)));
}
.flex-layout.login-layout .image-wrapper img{
    max-width: 100%;
    width: max(13.75rem, 13.75 * var(--su));
    height: auto;
}

.flex-layout.login-layout .form-footer + .form-group{
    padding-left: max(.75rem, calc(.75 * var(--su)));
}

.flex-layout.login-layout .form-footer + .form-group .pk-button,
.flex-layout.login-layout .forgot-password .pk-button{
    font-size: var(--pk-text-font-size);
    color: var(--color-form-label);
}

.flex-layout.login-layout .forgot-password{
    display: flex;
    justify-content: center;
    margin-top: max(2.25rem, calc(2.25 * var(--su)));
}
.flex-layout.login-layout .forgot-password:not(:last-child){
    margin-bottom: max(1.5rem, calc(1.5 * var(--su)));
}

.flex-layout.login-layout .pk-heading{
    color: var(--color-heading-primary);
}
.flex-layout.login-layout .text{
    color: var(--color-text-primary);
}


@media screen and (min-width: 768px){
    .flex-layout.login-layout{ 
        display: flex;
    }
    .flex-layout.login-layout > .pk-row{
        margin-top: auto;
        margin-bottom: auto;
    }
}