#login_page {
  background-color: var(--grey-background) !important;
  width: 100vw !important;
  height: 100vh !important;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
}


#login_container {
  width: var(--login-container-width) !important;
  height: var(--login-container-height_stretched) !important;
  overflow: auto;
  background-color: var(--auth-background) !important;
  border-radius: var(--border-radius) !important;
  display: flex;
  flex-direction: column;
  overflow-x: hidden;
  justify-content: flex-start;
  align-items: center;
  padding: min(2vw,20px) 15px;
  box-shadow:
  0 2.8px 2.2px rgba(0, 0, 0, 0.034),
  0 6.7px 5.3px rgba(0, 0, 0, 0.048),
  0 12.5px 10px rgba(0, 0, 0, 0.06),
  0 22.3px 17.9px rgba(0, 0, 0, 0.072),
  0 41.8px 33.4px rgba(0, 0, 0, 0.086),
  0 100px 80px rgba(0, 0, 0, 0.12)
  !important
}


#login_header {
  font-size: var(--font-size-header);
  font-weight: bold;
}


#login_logo_container {
  height: clamp(25px, 10vh, 300px) !important;
  background-color: inherit;
  margin-top: 2vh;
  margin-bottom: 3vh;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

#login_logo_container  Img {
  height: clamp(25px, 10vh, 100px)
}

#register_click {
  padding-left:0.2vw;
}

.login_button_row, .login_button_row_no_pad {
  background-color: #999299;
  display: flex;
  flex-direction: row;
  width: 100%;
  align-items: center;
  padding: 0.5vh 0.5vw;
  border-radius: var(--border-radius) !important;
  border: var(--border-width) solid var(--purple-dark);
  margin-top: 2vh !important;
  height: clamp(30px, 2.5vw, 40px) !important;
}
.login_button_row_no_pad {
  margin-top: 0vh !important;
}
.icon_container_login {
  background-color: transparent;
  width: var(--button-height);
  height: var(--button-height);
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;

}
.icon_container_login > Img {
  width: var(--button-img) !important;
  height: var(--button-img) !important;
}

.login_input {
  background-color: #999299 !important;
  width: 100%;
  height: var(--button-height) !important;
  border: none !important;
  padding-left: 0.3vw;
  padding-right: 0.3vw;
  margin-left: 0.5vw;
  margin-right: 0.5vw;
  height: 100% !important;
  font-size: var(--font-size-body) !important;
  
}

.login_input::placeholder {
  color: rgba(0, 0, 0, 0.404) !important;
}

/* #remember_row {
  display: flex;
  flex-direction: row;
  width: 100%;
  justify-content: flex-start;
  align-items: center;
  background-color: inherit;
  margin-top: 1.5vh;
  height: 3vh !important;
  font-size: 0.8vw !important;

}


#remember_row > div > label > input {
  margin-right: 0.2vw !important;
  accent-color: #999299 !important;
} */



#vertical_placeholder {
  display: flex;
  flex-direction: column;
  height: 100%;
}



#login_button_container, #login_button_container2 {
  height: 100%;
  background-color: inherit;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  width: 100%;
}


#login_button, #login_button2 {
  display: flex;
  flex-direction: column;
  height: 100% !important;
  justify-content: center;
  align-items: center;
  width: 100%;
  border: none;
  border-radius: var(--border-radius) !important;
  height: var(--button-height-large) !important;
  background-color: var(--purple-dark);
  color: white !important;
  margin-bottom: 1vh;
}
#mfa_notice {
  text-align: center;
}

#login_button:hover, #login_button2:hover {
  background-color: var(--purple-light) !important;
}

#feedback_login_row {
  margin-top: 2vh;
  text-align: center;
}


.show_password_button {
  background-color: transparent;
  width: var(--button-height);
  height: var(--button-height);
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  border: none;
  overflow: hidden;
  padding: 0rem !important;

}
.show_password_button > Img {
  width: var(--button-img) !important;
  height: var(--button-img) !important;
  margin: 0rem !important;
}
#row_below_password {
  margin-top: 1vh;
  display: flex;
  flex-direction: row;
  width: 100%;
  justify-content: center;
  margin-left: 0.7vw;
  margin-right: 0.7vw;
}


#forgot_password_text {
  margin-right: 0.7vw;
  background-color: inherit;

  
}

#remember_checkbox {
  margin-left: 0.7vw;
}
#remember_checkbox > label > input {
  margin-right: 0.2vw !important;
}

input[type="checkbox" i] {
  accent-color: var(--purple-medium);
}


.container_login {
  padding: 0rem !important;
  margin: 0rem !important;
  display: flex;
  flex-direction: column;
  width: 100%;
}