.heading,
.intro,
.divider,
.create,
.mobile_footer,
form div.buttons,
#requiredFieldMissing,
#fieldIncorrect,
#captchaUnresolved,
#claimVerificationServerError,
#api div.buttons:last-child,
.verificationControlContent div[class^="verification"],
.localAccount div[class^="error pageLevel"],
.verificationInfoText,
.verificationSuccessText,
.verificationErrorText,
.error.pageLevel > p {
  text-align: center;
}

.heading {
  padding: 1rem;
}

.intro {
  padding: 0 1rem 1rem;
}

.entry {
  padding: 0 1rem;
}

.entry .entry-item {
  display: flex;
  flex-direction: column;
  padding: 0 .5rem .5rem;
}

#api div.buttons:last-child,
form div.buttons {
  margin: 1rem;
}

.create p {
  padding: .5rem;
}

.create a {
  padding: 0 0 0 .5rem;
}

h1 {
  margin-bottom: 0;
  text-transform: capitalize;
}

.password-label {
  display: flex;
  flex-wrap: wrap;
}

.password-label label {
  padding-right: .5rem;
}

.password-label a {
  padding-bottom: .5rem;
  text-transform: capitalize;
}

.intro > p,
.intro > h2 {
  display: block;
  font-size: 1.5rem;
  font-weight: 500;
  line-height: 2.25rem;
  margin: 0;
}

dl, ol, ul {
  margin-top: 0;
  list-style-type: none;
  padding-left: 0px;
}

.attrEntry,
.Password .attrEntry {
  display: grid;
  padding: .5rem;
}

#continue {
  margin-right: 15px;
}

@media (max-width: 576px) {
  #continue {
    margin-right: 0px;
  }

  .attrEntry {
    display: block;
    padding: .2rem;
  }

  .attrEntry > input {
    width: 100% !important;
  }

  .entry-item > input {
    width: 100% !important;
  }

  .attrEntry > button {
    width: 100% !important;
  }

  .entry .entry-item {
    display: grid;
    padding: .2rem;
  }

  .entry {
    padding: .5rem;
  }

  .Password .attrEntry {
    padding: .5rem;
  }

  .buttons button {
    width: 100% !important;
  }
}

.VerificationControl > .attrEntry {
  padding-top: 0;
}

.error.pageLevel {
  padding: 0 1rem;
}

.error.pageLevel>p,
.intro>h2 {
  margin-bottom: 0;
}

.error.pageLevel,
.entry-item label,
.entry-item .error.itemLevel p,
.attrEntry .error.itemLevel.show,
.attrEntry>label {
  margin-bottom: 0;
  padding-bottom: .5rem;
}

button {
  margin: 5px;
  padding: 8px 16px;
  color: #0f6949;
  cursor: pointer;
  border: 2px solid #0f6949;
  border-radius: 7px;
  transition: color .15s ease-in-out, background-color .15s ease-in-out,
    border-color .15s ease-in-out, box-shadow .15s ease-in-out;
}

button:hover {
  color: #fff !important;
  background-color: #0f6949 !important;
  border-color: #f7fffc !important;
  box-shadow: 0px 2px 0px #81c342;
}

button:focus, button.focus {
  box-shadow: 0 0 0 .2rem rgba(179, 237, 138, .5) !important;
  color: #0f6949 !important;
  background-color: rgba(255, 255, 255, 0) !important;
}

button:not(:disabled):not(.disabled):active,
button:not(:disabled):not(.disabled).active,
.show>button.dropdown-toggle {
  color: #fff !important;
  background-color: #56b16e !important;
  border-color: #e7e7e7 !important;
}

input {
  padding: .55rem .75rem;
  background-color: #f9f9f9;
  border: 1px solid #e7e7e7;
  border-radius: .375rem;
}

input:focus {
  color: #495057 !important;
  background-color: #fff !important;
  border-color: #36e368 !important;
  outline: 0 !important;
  box-shadow: 0 0 0 .2rem #acfbc64d !important;
}

.error {
  color: red;
}

/* Change the modal color */
.alert .modal {
  color: #000;
}

.verificationControlContent div[class^="verification"] {
  padding-left: 1rem;
}

ul li .attrEntry label:empty,
ul li .attrEntry .error.itemLevel:empty,
form .entry .entry-item .error.itemLevel:empty,
form .entry .entry-item .error.itemLevel p:empty {
 padding: 0;
}

/* MFA Page */
#codeVerification input {
  margin: 0 auto;
  text-align: center;
}

.phoneEntry,
.phoneNumbers,
#codeVerification,
#codeVerification div.error.itemLevel,
.phoneEntry .input .code {
  margin: 0 auto;
  text-align: center;
  padding: 0 1rem 1rem;
}

#countryCode {
  width: 40%;
}

/* Sign Up Page */
form#attributeVerification #attributeList > ul > li.Password {
  padding: 0 .5rem;
}

/* Password input */
.input-group > .error.itemLevel {
  width: 100%;
}

.input-group input {
  border-right: none;
  border-top-left-radius: .25rem !important;
  border-bottom-left-radius: .25rem !important;
}

.input-group span {
  border-left: none;
}