.form-control {
    border-radius: 10px !important;
    background-color: color-mix(in srgb, var(--background) 80%, transparent) !important;
    border: 1px solid var(--button-background) !important;
    color: var(--text) !important;
    text-align: center !important;
    padding: 10px 9px !important;
}
.loginContainer {
  padding-top: 200px;
  height: calc(100vh - 73px);
}
.loginContainerPaddingFixed {
  padding-top: 80px;
  height: calc(100vh - 240px);
}
@media all and (max-height: 840px) {
  .loginContainer {
    padding-bottom: 120px;
    height: auto;
  }
}
@media all and (max-width: 991px) {
  .loginContainer {
    padding-bottom: 120px;
    height: auto;
  }
}


.loginContainer .page-content {
  /* background-color: var(--main-body); */
}
.loginContainer .page-content {
  /* background-color: var(--main-body);  */
  box-shadow:none;
}
.loginContainer .loginLogo {
  max-width: 250px;
}
.loginContainer .loginText {
  font-weight: bolder;
  color: var(--menu-text-color);
  font-size: large;
  padding-top: 15px;
}
.loginContainer .signInButton {
  font-weight:bolder;
  background-color: var(--title) !important;
  border-color: var(--title) !important;
  color: var(--background) !important;
}
.loginContainer .signInButton:hover {
  background-color: var(--background) !important;
  color: var(--title) !important;
}
.loginContainer .forgotPasswordContainer {
  margin-top: 14px;
}
.loginContainer .forgotPasswordContainer a{
  color:var(--text);
  font-size:22px; 
  font-weight: 400 !important;
  /* color: #FF3900 */
}
.register-container {
  margin-top: 55px;
  font-size: 22px;
  font-weight: 400;
}

.loginContainer .logoBottom {
  padding: 40px 0px 40px 0px;
}
.loginContainer .logoBottom img{
  max-width: 150px;
}
.loginContainer .logoBottom h3{
  padding-top: 25px;
}

.text-start {
  text-align: start !important;
}