﻿
#loginPage {
  box-sizing: border-box;
  margin: auto;
  align-self: center;
  justify-content: center;
  align-content: center;
  display: flex;
  flex-direction: column;
}

.loginForm {
  background-color: var(--secondaryColor, #9c9c9c);
  border: 3px solid var(--mainColor, #000000);
  box-shadow: 3px 3px 3px 0 var(--mainColor, #000000);
  text-align: center;
  margin: .5em auto;
  padding: 1em;
  width: clamp(var(--minWidth),50%,var(--maxWidth));
}

.loginRow, .pwChange {
  margin: 0 auto;
  margin-bottom: .5em;
}

  .loginRow label, .pwChange label {
    font-weight: bold;
    text-align: center;
    display: block;
    min-width: 150px;
    margin: 0 auto;
    font-size: 1.1em;
  }

    .loginRow label.sameLine, .pwChange label.sameLine {
      display: inline-block;
      text-align: right;
      width: auto;
      min-width: unset;
    }

  .loginRow input[type=text], .loginRow input[type=password],
  .pwChange input[type=text], .pwChange input[type=password] {
    display: inline-block;
    min-width: 150px;
    font-size: 1.1em;
  }

  .loginRow input[type=submit], .pwChange input[type=submit] {
    font-size: 1.1em;
    font-weight: bold;
  }
