/* General */

.content-container .main-title {
  font-size: 32px;
  margin-bottom: 9px;
}

.content-container .message-with-form-action-container {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  align-items: center;
  justify-content: flex-start;
}

.content-container .action-form {
  margin: -12px -18px;
}

/* For templates that display login forms to user */

.login-container {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;

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

  width: 100%;
  height: 100vh;

  padding: 48px 96px;
}

.login-container > .logo-container {
  height: 75vh;
  flex: 0 0 auto;
  width: 40%;
  padding: 0 60px;
}

.login-container > .logo-container > h2 {
  font-size: 24px;
}

.login-container > .logo-container > .logo > img {
  height: 60px;
  margin-bottom: 24px;
}

.login-container > .content-container {
  height: 75vh;
  flex: 1 1 auto;
  width: 60%;
}

.login-container > .content-container .message-with-form-action-container .action-form {
  margin-left: -6px;
}

.form {
  width: 60%;
  margin-top: 36px;
}

.form .ant-form-item-label > label {
  font-size: 18px;
}

.form .ant-form-item-control {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  align-items: center;
  justify-content: flex-start;
}

.form .ant-form-explain {
  line-height: 24px;
  min-height: 24px;
  color: #F5222D;
  margin: -6px 0 18px 0;
}

.form .form-button {
  min-width: 240px;
}

.form .form-forgot {
  float: right;
}

/* For templates that display confirmation/notification messages to user */

.message-container {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  flex-flow: column nowrap;

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

  width: 100%;
  height: 100vh;
}

.message-container > .logo-container {
  width: 100%;
  height: 64px;
  flex: 0 0 auto;
  padding: 0 36px;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  align-items: center;
}

.message-container > .logo-container > .logo > img {
  height: 32px;
}

.message-container > .content-container {
  width: 60%;
  flex: 1 1 auto;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  flex-flow: column nowrap;
  align-items: center;
}

.message-container > .content-container .main-title {
  text-align: center;
}

.message-container > .content-container .message-with-form-action-container .action-form {
  margin-left: -12px;
}