html {
  font-size: 20px;
  max-width: 100vw !important;
  overflow-x: hidden;
  overflow-y: scroll;
  scrollbar-gutter: stable;
}

.bg-green {
  background-color: #224651;
}

.bg-light-green {
  background-color: #377386;
}

h1.pageHeadline {
  font-size: 1.2rem !important;
}

h2.pageHeadline {
  font-size: 1.1rem !important;
}

h1 {
  font-size: 1.6rem !important;
}
h2 {
  font-size: 1.3rem !important;
}
h3 {
  font-size: 1rem !important;
}

/* Prevent layout shift when modal is open by compensating for scrollbar */
body.modal-open {
  padding-right: var(--bs-scrollbar-width, 0px) !important;
}

#master-container {
  padding: 0;
  margin: 0;
  max-width: 100vw !important;
  overflow-x: hidden;
}

.hw-100 {
  max-width: 100vw;
  width: 100%;
}

.balance {
  text-wrap: balance;
}

#modal table td.verseText {
  width: 99%;
}

#modal table td.verseNum {
  width: 1%;
}

#modal table td.verseNum div {
  border-radius: 25%;
  min-width: 1.5rem;
  text-align: center;
}

#modal .version {
  font-weight: 100;
  margin-left: 0.5rem;
}

h1[data-scripture],
h2[data-scripture],
h3[data-scripture],
h4[data-scripture],
h5[data-scripture],
h6[data-scripture] {
  display: inline-block;
}

[data-scripture] {
  color: var(--bs-dark);
  cursor: pointer;
  white-space: nowrap;
  text-decoration: underline;
}

.verseNum {
  font-size: 0.7rem;
  font-weight: bold;
}

.text-smallcaps {
  font-variant: small-caps;
}

tbody.numerals td {
  font-variant-numeric: lining-nums tabular-nums;
}

.text-normal-numeric {
  font-variant-numeric: normal !important;
}

.form-control,
.form-check-input {
  border-color: #666666 !important;
}

input[data-mask="true"],
input[type="password"] {
  -webkit-text-security: disc;
  text-security: disc;
}