@import url("variables.css");
@import url("common.css");

main .login-container {
  background-color: rgba(255, 255, 255, 0.95);
}

#kc-page-title {
  margin-bottom: 12px;
}
.login-pf-header {
  margin-bottom: 22px;
}

#kc-registration-container,
.bottom-container {
  border-top: 1px solid var(--lr-color-grau-3);
}

.border-bottom-line {
  border-bottom: 1px solid var(--lr-color-grau-3);
}
#kc-registration,
.bottom-content {
  margin: 30px 0;
}

#kc-otp-login-form .kc-device-list{
  gap: 40px;
}

#kc-otp-login-form .kc-device-list input{
  width: 20px;
  height: 20px;
}


.navbar-border-bottom-container{
  height: 7px;
}

.navbar-col-1,
.navbar-col-2 {
    width: 140px
}

.navbar-col-1 .nav-border-bottom-tilted {
    background-color: var(--lr-color-lemon);
}

.navbar-col-2 .nav-border-bottom-tilted {
    background-color: var(--lr-color-petrol-3)
}

.navbar-col-3 .nav-border-bottom-tilted {
    background-color: var(--lr-color-gruen);
    margin-right: 2px;
}

.nav-border-top-tilted {
    background-color: var(--lr-color-weiss);
    height: 18px;
    transform: skewX(149deg);
    margin-right: 5px;
    margin-top: -26px;
    right: 0;
    width: calc(100% - 280px);
}

.nav-border-top-tilted-end{
     right: 0px;
    transform: none;
    background-color: var(--lr-color-weiss);
    margin-right: 0px;
}


.nav-border-bottom-tilted {
    height: 7px;
    transform: skew(149deg);
    -webkit-transform: skew(149deg);
    -moz-transform: skew(149deg);
    -o-transform: skew(149deg);
}

.nav-border-bottom-tilted-end{
    background-color: var(--lr-color-gruen);
    position: absolute;
    transform: none;
    width: 20px;
    margin-right: 0px!important;
    right: 0;
}