@-webkit-keyframes fade-in-body {
  0% {
    opacity: 0; }
  100% {
    opacity: 1; } }

@-o-keyframes fade-in-body {
  0% {
    opacity: 0; }
  100% {
    opacity: 1; } }

@keyframes fade-in-body {
  0% {
    opacity: 0; }
  100% {
    opacity: 1; } }

@-webkit-keyframes fade-in-left-relative {
  0% {
    margin-right: 4rem;
    opacity: 0; }
  100% {
    margin-right: 0;
    opacity: 1; } }

@-o-keyframes fade-in-left-relative {
  0% {
    margin-right: 4rem;
    opacity: 0; }
  100% {
    margin-right: 0;
    opacity: 1; } }

@keyframes fade-in-left-relative {
  0% {
    margin-right: 4rem;
    opacity: 0; }
  100% {
    margin-right: 0;
    opacity: 1; } }

@-webkit-keyframes fade-in-up-absolute {
  0% {
    top: 3em;
    opacity: 0; }
  100% {
    top: 1em;
    opacity: 1; } }

@-o-keyframes fade-in-up-absolute {
  0% {
    top: 3em;
    opacity: 0; }
  100% {
    top: 1em;
    opacity: 1; } }

@keyframes fade-in-up-absolute {
  0% {
    top: 3em;
    opacity: 0; }
  100% {
    top: 1em;
    opacity: 1; } }

.password-strength__meter {
  margin-top: 0.5em;
  background-color: #e9ecef; }

.password-strength__indicator {
  background-color: #18BC9C;
  -webkit-transition: width 0.5s ease-out;
  -o-transition: width 0.5s ease-out;
  transition: width 0.5s ease-out; }

.password-strength__indicator.is-weak {
  background-color: #E74C3C; }

.password-strength__indicator.is-fair {
  background-color: #F39C12; }

.password-strength__indicator.is-good {
  background-color: #3498DB; }

.password-strength__indicator.is-strong {
  background-color: #18BC9C; }

.password-confirm,
.password-field,
.password-strength,
.password-confirm-match {
  width: 55%; }

.password-suggestions {
  padding: 0.2em 0.5em;
  margin: 0.7em 0;
  max-width: 34.7em;
  border: 1px solid #dee2e6; }

.password-suggestions ul {
  margin-bottom: 0; }

.confirm-parent,
.password-parent {
  clear: left;
  /* LTR */
  margin: 0;
  max-width: 33em;
  overflow: hidden; }

[dir="rtl"] .confirm-parent,
[dir="rtl"] .password-parent {
  clear: right; }

.password-confirm .ok {
  color: #18BC9C;
  font-weight: bold; }

.password-confirm .error {
  color: #E74C3C;
  font-weight: bold; }

.page-user-login main .region-content,
.page-user-password main .region-content {
  max-width: 400px;
  background: white;
  padding: 1rem 1rem;
  margin: 0 auto;
  border-radius: 0; }
