﻿.layout-login {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
       -ms-flex-direction: row;
           flex-direction: row;
    height: 100%;
    position: relative;
}

.layout-login > .columns {
    width: 100%;
}

.layout-login > .columns > .columns-item {
    -webkit-box-align: center;
       -ms-flex-align: center;
          align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
       -ms-flex-pack: center;
     justify-content: center;
}
.layout-login > .columns > .columns-item > .layout-login-background {
    -webkit-box-align: center;
       -ms-flex-align: center;
          align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: 100%;
    -webkit-box-pack: center;
       -ms-flex-pack: center;
     justify-content: center;
    overflow: hidden;
    position: relative;
    width: 100%;
    z-index: -1;
    background-color: white;
}

.layout-login > .columns > .columns-item > .layout-login-background * {
    position: relative;
    z-index: -1;
}

.layout-login > .columns > .columns-item > img {
    height: 100%;
    -o-object-fit: cover;
       object-fit: cover;
    -o-object-position: center;
       object-position: center;
    width: 100%;
}

.layout-login-form {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
       -ms-flex-direction: column;
           flex-direction: column;
    min-width: 435px;
    position: relative;
    z-index: 2;
}

.layout-login-simple .layout-login-background {
    background-color: white !important;
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: -1;
}

.layout-login-simple .layout-login-background > img {
    display: block;
    height: 100%;
    -o-object-fit: cover;
       object-fit: cover;
    width: 100%;
}

.layout-login-simple .layout-login-form-content {
    -webkit-box-align: center;
       -ms-flex-align: center;
          align-items: center;
    display: -ms-flexbox;
    display: -webkit-box;
    display: flex;
    height: 80%;
    -webkit-box-pack: center;
       -ms-flex-pack: center;
     justify-content: center;
    position: relative;
    width: 100%;
    z-index: 5;
}

.layout-login-simple .layout-login-form {
    background-color: var(--color-neutral-0);
    border-radius: var(--border-radius-soft);
    box-shadow: var(--shadow-l);
    padding: var(--space-xxl);
}

.phone .layout-login-simple .layout-login-form-content,
.phone .layout-login > .columns > .columns-item {
    -webkit-box-align: start;
       -ms-flex-align: start;
          align-items: flex-start;
}

.phone .layout-login-form {
    margin: var(--space-xl) var(--space-none) var(--space-none);
    min-width: auto;
    padding: var(--space-l);
    width: 100%;
}

.phone .layout-login-simple .layout-login-form {
    margin: var(--space-xl) var(--space-base);
}

.TopLeftPlaceholder {
    display: -ms-flexbox;
    display: -webkit-box;
    display: flex;
    position: absolute;
    top: 5%;
    width: 100%;
    z-index: 2;
    
}
.BottomLeftPlaceholder {
    display: -ms-flexbox;
    display: -webkit-box;
    display: flex;
    width: 100%;
    z-index: 2;
    bottom: 5%;
    position: absolute;
    
}

.layout-login-simple .layout-login-form {
    color: black !important;
}

.BottomLeftExpression {
    white-space: nowrap;
}
