body {
  background-clip: content-box;
  background-size: cover;
  background-position-x: center;
}

  body .ofWizard {
    /*padding: 30px;*/
  }

.ofUsername .ofDomain {
  padding: 0;
  margin: 3px 0px;
  color: var(--of-grey800);
  text-align: right;
  width: 100%;
}

.ofLoginForm .error .ofIcon {
  fill: var(--of-red300);
}

.ofLoginForm {
  width: 100%;
  min-height: 284px;
}

.ofLoginForm .ofForm_ctrl_container {
  margin-left: 0px;
}

  .ofLoginForm .ofForm_ctrl_container > div:first-of-type, .ofOtpForm .ofForm_ctrl_container > div:first-of-type {
    display: table-caption !important;
    transform: translateX(-1px);
  }

.ofOtpForm{
  display: inline-block;
  width: 100%;
}

  .ofOtpForm .ofForm_ctrl_container {
    margin-left: 0px;
  }

    .ofOtpForm .ofForm_ctrl_container > div:first-of-type {
      display: table-caption !important;
      transform: translateX(-1px);
    }

    .ofOtpForm .ofLoginSubmit{
      margin-top: 10px;
    }

.otpInfo *:last-child{
  margin-bottom: 20px;
}

.ofLoginPage .pageTitle {
  padding-bottom: 10px;
}

.ofLoginPage .link_area {
  padding: 10px 0;
  cursor: pointer;
}

.ofLoginPage .ofLoginSubmit {
  padding: 10px 0;
  margin: 0 15px;
}

  .ofLoginPage .ofLoginSubmit input[type='button'] {
    padding: 0;
  }

.ofLoginPage .ofCaptchaSection a {
  margin-left: 10px;
}

  .ofLoginPage .ofCaptchaSection a img {
    padding: 5px;
    margin-bottom: 20px; /*1/2 height of 20 + padding + margin = 35, for spacing in middle of captcha with height of 70*/
  }

    .ofLoginPage .ofCaptchaSection a img:hover {
      border: 1px dotted #525252;
    }