/* FORM validation */
form {
  margin: 20px auto;
  padding: 10px;
}
.chor {   display: none; }

.form-group {
	margin: 25px auto;
}
.form-control {
	margin: 5px auto;
  padding: 10px 15px;
  font-size:var(--font-size-tertiary);
  background-color: var(--form-field);
  border: 1px solid var(--form-field-border);
  border-radius: 10px;
  color: var(--form-text);
}
.form-control:focus {
	background-color: var(--form-field-focus);
  border: 1px solid var(--form-field-border);
  color: var(--form-text);
}
.form-prompt {
  margin: 5px auto;
  padding: 5px 15px;
  font-size: var(--font-size-micro);
  height: 24pt;
}
.form-check-input {
  margin: 10px;
  padding: 20px;
  width: 15px;
  height: 15px;
  border: 0px;
}
.radio-inline {
  font-size: var(--font-size-secondary);
  padding: 10px 30px 10px 0px;
}
.form-check-input-label {
  padding: 10px 10px 10px 10px;
  width: 15px;
  height: 15px;
  border: 0px;
}
.form-check-label {
    padding: 10px;
    font-size: var(--font-size-mini);
    color: var(--text-text);
}
.btn-lg {
  font-size: var(--font-size-secondary);
  padding: 10px 15px;
}
.btn-success {
  border: 1px solid var(--color-button);
  border-radius: 10px;
}
.btn-outline-success {
  margin: auto 10px;
  border-radius: 10px;
}

/* ######## sign-in ######## */
.signin-body {
  background-color: var(--bg-sign);
}
.signin-page {
  height: 100vh;
  display: flex;
  flex-direction: column;
}
.signin-logo {
  flex: 2;
  justify-content: center;
  align-items: flex-end;
}
.signin-form {
  flex: 3;
  justify-content: center;
  align-items:flex-start;
  padding: 0px 20px;
}
#signin-message {
  height: 25pt;
  color: var(--color-sign);
  padding: 15px 0px 0px 0px;
}

#input-id, #input-code {
  border-top-left-radius: 25px;
  border-top-right-radius: 0px;
  border-bottom-right-radius: 0px;
  border-bottom-left-radius: 25px;
  font-size: var(--font-size-secondary);
  text-align: center;
  background-color: var(--form-field-sign);
  border: 1px solid var(--form-field-sign);
  color: var(--form-text);
  padding: 5px;
}
.sign-input {
  border-top-left-radius: 25px;
  border-top-right-radius: 0px;
  border-bottom-right-radius: 0px;
  border-bottom-left-radius: 25px;
  font-size: var(--font-size-secondary);
  text-align: center;
  background-color: var(--form-field-sign);
  border: 1px solid var(--form-field-sign);
  color: var(--form-text);
  padding: 5px;
}
.sign-input:focus {
  background-color: var(--form-field-sign-focus);
  border: 1px solid var(--form-field-sign);
  color: var(--form-text);
}
.btn-sign {
  margin: 10px 0px;
  font-size: var(--font-size-tertiary);
  background-color: var(--bg-success);
  /* width: 100%; */
  border: 0px;
  border-style: none;
  border-top-left-radius: 0px;
  border-top-right-radius: 25px;
  border-bottom-right-radius: 25px;
  border-bottom-left-radius: 0px;
  padding: 7px 10px;
  display: flex;
  vertical-align: middle;
  justify-content: center;
  align-items: center;
  align-content: center;
}
.btn-sign:focus, .btn-sign:active, .btn-sign:hover, .btn-sign:visited, {
  border: 0px;
  text-decoration: none;
  text-transform: none;
  border-style:none;
}
.sign-link {
  /*color: var(--bg-success); */
  color: var(--color-sign);
  font-size: var(--font-size-micro);
  text-decoration: none;
  margin: 0px;
  /*padding: 0px 5px;*/
  font-weight: 200;
}
.sign-link:hover {
  color: var(--bg-success);
  font-size: var(--font-size-micro);
  text-decoration: none;
  font-weight: 400;
}