body {
  background-image: url("/web/assets/img/si-background.png");
  background-size: cover;
}

.headerTitle {
  display: flex;
  font-size: 1.5em;
  font-weight: bold;
  color: #000;

  margin-top: 130px;

  align-items: center;
  justify-content: center;

  flex-direction: row;
}
/* .Container {
  display: flex;
  align-items: baseline;
  flex-direction: column;
  flex-wrap: wrap;
  justify-content: center;
  margin-right: 120px;
} */
.title1 {
  color: #111010;
  font-family: Chinese Quote, -apple-system, BlinkMacSystemFont, Segoe UI,
    PingFang SC, Hiragino Sans GB, Microsoft YaHei, Helvetica Neue, Helvetica,
    Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
  font-weight: 600;
  font-size: 36px;
}

.title2 {
  display: flex;
  font-size: 16px;
  color: gray;
  font-weight: 400;
  justify-content: center;
  margin-top: 10px;
}
.phone-input {
  display: flex;

  justify-content: center;
  margin-top: 15px;
}
#phone {
  height: 40px;
  width: 380px;
  border-radius: 1px;
  border: 1px solid #ccc;
  font-size: 18px;

  margin-top: 15px;
}
.verification-input {
  display: flex;
  margin-top: 25px;
  justify-content: center;

  align-items: baseline;
  align-content: space-between;
}

#verification-code {
  height: 25px;
  width: 180px;
  padding: 10px;
  border-radius: 5px;
  border: 1px solid #ccc;
  font-size: 14px;
  margin-bottom: 10px;
}
#verification-code::placeholder {
  padding-left: 20px;
  background-image: url("/web/assets/img/icon/message.png");
  background-size: 16px;
  font-size: 12px;
  background-position: left center;
  background-repeat: no-repeat;
}

button[type="button"] {
  background-color: #1890ff;
  color: white;
  padding: 10px 29px;
  border: none;
  height: 45px;
  width: 165px;
  border-radius: 5px;
  font-size: 16px;
  cursor: pointer;
  margin-left: 1rem;
}

button[type="button"]:hover {
  background-color: #1b7dd8;
}
.checkboxsubmit {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  max-width: 400px;
  margin: 0 auto;
  flex-direction: column;
}

.autologin-checkbox {
  display: flex;
  margin-left: 10px;
  margin-top: 20px;
}

#autologin {
  display: flex;
  margin-right: 4px;
  font-weight: 100;
  font-size: 14px;
  color: grey;
}

/* @media screen and (max-width: 1008px) {
  .autologin-checkbox {
    margin-left: auto;
    margin-right: auto;
  }
} */

button[type="submit"] {
  display: block;
  margin: 0 auto;
  background-color: #1890ff;
  color: white;
  padding: 12px 172px;
  border: none;

  border-radius: 5px;
  justify-content: center;

  margin-bottom: 25px;
  font-size: 16px;
  cursor: pointer;
}

button[type="submit"]:hover {
  background-color: #1b7dd8;
}
.alert {
  padding: 15px;
  margin-top: 10px;
  border: 1px solid transparent;
  border-radius: 4px;
}

.alert-info {
  border-color: #bce8f1;
  color: #31708f;
  background-color: #d9edf7;
}

.alert-error {
  color: #a94442;
  background-color: #f2dede;
  border-color: #ebccd1;
}
.footer {
  display: flex;
  flex-direction: row;
  align-items: center;
  align-content: center;
  justify-content: center;

  color: gray;
  font-size: 14px;
}