html {
  scroll-behavior: smooth;
  /* positions auto-scroll-to-top when verse-ref's
  jump link anchor tag <a> is clicked */
  scroll-snap-type: y;
  --sans: Arial, sans-serif;
  --serif-normal: Georgia, serif;
  --serif-bold: "Times New Roman", serif;
  font-family: var(--serif-normal);
  --transition-short: 0.25s;
  --transition-long: 0.25s; /* accordion */
  /* allows using with rgba() */
  --bg-event-group-rgb: 239, 239, 154;
  --bg-event-rgb: 255, 250, 205; /* LemonChiffon */
  --border-color-rgb: 189, 183, 107; /* DarkKhaki */
  --link-color-rgb: 13, 110, 253; /* bootstrap blue-500 */
  --chrome-light-rgb: 118, 118, 118; /* #767676 */
  --chrome-dark-rgb: 133, 133, 133; /* #858585 */
  --chrome-bg-light-rgb: 239, 239, 239; /* #efefef */
  --chrome-bg-dark-rgb: 59, 59, 59; /* #3b3b3b */
  --orange-red-rgb: 255, 69, 0;

  --bg-event-group: rgb(var(--bg-event-group-rgb));
  --bg-event: rgb(var(--bg-event-rgb));
  --border-color: rgb(var(--border-color-rgb));
  --chrome-light: rgb(var(--chrome-light-rgb));
  --chrome-bg-light: rgb(var(--chrome-bg-light-rgb));
  --link-color: rgb(var(--link-color-rgb));
  --border-radius: 0.3em;
  --border-radius-menu: 2em;
  --vertical-spacing: 5px;
  --orange-red-80: rgba(var(--orange-red-rgb), 80%);

  --scrollbar-width: max(16px, 0.6em);

  --scrollbar-track-light: #f1f1f1;
  --scrollbar-track-dark: rgb(64, 64, 64);
  --scrollbar-track-menu: rgba(0, 0, 0, 30%);

  --scrollbar-thumb-light: #a8a8a8;
  --scrollbar-thumb-dark: rgb(96, 96, 96);
  --scrollbar-thumb-menu: var(--orange-red-80);

  --scrollbar-thumb-hover-light: #c1c1c1;
  --scrollbar-thumb-hover-dark: rgb(112, 112, 112);

  --scrollbar-thumb-drag-light: #787878;
  --scrollbar-thumb-drag-dark: rgb(128, 128, 128);

  --scrollbar-arrow: #505050;
}

*,
*::before,
*::after {
  box-sizing: border-box;
  hyphens: auto;
}

*:focus {
  outline: unset;
  outline-offset: unset;
}

body {
  margin: unset;
}

a {
  color: inherit;
  text-decoration: none;
}

h1,
h2,
h3,
h4,
h5,
h6,
p,
dl,
dd {
  margin: unset;
}

h1,
h2,
h3,
h4,
h5,
h6,
strong {
  font-family: var(--serif-bold);
}

strong {
  font-size: 1.1em;
}