@charset "UTF-8";
@font-face {
  font-family: "Noto Serif";
  font-weight: 100 900;
  font-style: normal;
  src: url("../fonts/NotoSerif-VariableFont.woff2") format("woff2-variations");
  font-display: auto;
}
@font-face {
  font-family: "Noto Serif";
  font-weight: 100 900;
  font-style: italic;
  src: url("../fonts/NotoSerif-Italic-VariableFont.woff2") format("woff2-variations");
  font-display: auto;
}
@font-face {
  font-family: "Noto Sans";
  font-weight: 100 900;
  font-style: normal;
  src: url("../fonts/NotoSans-VariableFont.woff2") format("woff2-variations");
  font-display: auto;
}
@font-face {
  font-family: "Noto Sans";
  font-weight: 100 900;
  font-style: italic;
  src: url("../fonts/NotoSans-Italic-VariableFont.woff2") format("woff2-variations");
  font-display: auto;
}
html {
  box-sizing: border-box;
}

*,
*::before,
*::after {
  box-sizing: inherit;
}

html {
  scroll-behavior: smooth;
}

/* Set core body defaults */
body {
  scroll-behavior: smooth;
  text-rendering: optimizeLegibility;
  line-height: 1.6;
}

input:focus,
select:focus,
textarea:focus,
button:focus {
  outline: none;
}

a,
area,
button,
[role=button],
input,
label,
select,
summary,
textarea {
  touch-action: manipulation;
}

/* Remove default padding */
ul,
ol {
  margin-block: 0;
  padding-inline: 0;
  padding: 0;
  margin: 0;
}

header,
footer,
section,
article {
  container-type: inline-size;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  text-wrap: balance;
}

p,
li,
figcaption {
  text-wrap: pretty;
}

/* Remove default margin */
body,
h1,
h2,
h3,
h4,
h5,
h6,
p,
li,
figure,
figcaption,
blockquote,
dl,
dd {
  margin: 0;
}

/* Make images easier to work with, low-res background if available as well */
img {
  max-width: 100%;
  height: auto;
  vertical-align: middle;
  font-style: italic;
  shape-margin: 0.75rem;
  background-repeat: no-repeat;
  background-size: cover;
}

/* Inherit fonts for inputs and buttons */
input,
button,
textarea,
select {
  font: inherit;
}

/* Remove all animations and transitions for people that prefer not to see them */
@media (prefers-reduced-motion: reduce) {
  * {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}
:root {
  --gutter: 1rem;
  --content-max: 90rem;
  --main-width: 100%;
  --table-width: 55rem;
  --listing-width: 60rem;
  --search-width: 60rem;
  --site-highlight: #003873;
  --site-highlight-plus: #000000;
  --shadow-sm: 0px 1px 3px 0px rgba(10, 13, 18, 0.10), 0px 1px 2px -1px rgba(10, 13, 18, 0.10);
  --shadow-lg: 0px 12px 16px -4px rgba(10, 13, 18, 0.08), 0px 4px 6px -2px rgba(10, 13, 18, 0.03), 0px 2px 2px -1px rgba(10, 13, 18, 0.04);
  --shadow-inset-sm: inset 0 0 18px rgba(0, 0, 0, 0.10);
  --shadow-inset-lg: inset 0 0 50px rgba(0, 0, 0, 0.10);
  --primary-serif: "Noto Serif", Georgia, serif;
  --primary-sans: "Noto Sans", system-ui, sans-serif;
  --primary-text-color: #222222;
  --text-width: 40rem;
  --color-scheme: light dark;
  --page-bg: light-dark( #d6d6d6, #292929);
  --header-bg: light-dark(#fcfcfc, #0f0f0f);
  --facsimile-title-color: light-dark(#0f0f0f, #ffffff);
  --panel-toggler-bg-color: light-dark(#737373, #0f0f0f);
  --interface-text-color: light-dark(#ffffff, #ffffff);
  --button-color: light-dark(#737373, #ffffff);
  --menu-bg: light-dark(#f5f5f5, #424242);
  --active-tab-bg: light-dark( #d6d6d6, #0f0f0f);
  --link-inactive: light-dark(#6941C6, #D6BBF6);
}

:where(a, a:visited) {
  color: var(--site-highlight);
  transition: text-decoration-color 0.3s ease-in-out;
  text-decoration: underline;
}
:where(a, a:visited):is(:hover, :focus) {
  color: var(--site-highlight-plus);
  text-decoration-color: var(--site-highlight-plus);
  cursor: pointer;
}

li[data-el=def] {
  list-style-type: none;
}

html[lang=en] {
  /* q[lang*="fr"] {
  	quotes: "«" "»" "‹" "›";
  } */
}
html[lang=en] q {
  quotes: "‘" "’";
}

a.itemLink {
  color: var(--primary-text-color);
  text-decoration: none;
  cursor: pointer;
}

#main h2,
#main h1 {
  font-weight: 700;
  font-size: 2rem;
  text-align: center;
  font-family: var(--primary-serif);
  color: var(--primary-text-color);
}

#main > div > h3 {
  font-weight: 700;
  font-size: 2rem;
  text-align: center;
  font-family: var(--primary-serif);
  color: var(--primary-text-color);
  line-height: 1.3;
}
#main > div > h3 + p {
  margin-block-start: 0;
  font-size: 1.25rem;
  font-weight: 500;
  color: #525252;
  text-align: center;
}
#main ul[data-el=stems] {
  margin-block-start: 0;
  padding-inline-start: 0;
}

#main ul[data-el=stems] li {
  position: relative;
}
#main ul[data-el=stems] li:has(h3.caption) {
  list-style-type: none;
}
#main ul[data-el=stems] li :is(h3, h3.caption) {
  text-align: left;
  margin-inline: initial;
  margin-block-start: 3rem;
  position: relative;
}
#main ul[data-el=stems] li::before {
  content: "";
  width: 100%;
  height: 1px;
  position: absolute;
  top: -1rem;
  background-color: var(--primary-text-color);
}

#main h3 + table,
#main h3.caption + div.hyphTable > table:first-of-type {
  margin-block-start: 0;
}

#main table {
  margin-block-start: 0;
  padding: 1rem;
  background-image: url(../images/body-bg.png);
  background-repeat: repeat;
  box-shadow: 0px 1px 3px 0px rgba(10, 13, 18, 0.1), 0px 1px 2px -1px rgba(10, 13, 18, 0.1);
  border-radius: 8px;
  font-family: var(--primary-serif);
  font-size: 1rem;
  font-weight: 400;
  color: var(--primary-text-color);
  border-collapse: collapse;
}
#main table td {
  padding-block: 0.75rem;
  padding-inline: 0.75rem;
  border: 1px solid #d8d8d8;
}
#main table td div[data-el=note] {
  margin-inline: 0;
}

#main table.entryTable {
  max-width: var(--table-width);
  margin-inline: auto;
}

#main table thead td h3 {
  margin-block-start: 0;
}

#main table thead td h3 ~ br {
  display: none;
}

#main table thead td h3 ~ span {
  margin-top: 0.5rem;
}

tr.multiForm {
  border-top: 4px solid #d8d8d8;
}

div[data-el=source] {
  font-family: var(--primary-serif);
  font-weight: 600;
  font-size: 1.25rem;
  color: var(--primary-text-color);
}
div[data-el=source] div[data-el=cit] {
  margin-block-start: 0.5rem;
  font-weight: 400;
  font-size: 1rem;
}

#main h3 {
  width: 100%;
  max-width: var(--text-width);
  margin-inline: auto;
  margin-block-start: 1.5rem;
  font-family: var(--primary-serif);
  font-weight: 600;
  font-size: 1.25rem;
  color: var(--primary-text-color);
  text-align: center;
}

#main h3 + * {
  margin-block-start: 0.5rem;
}

#main h3.caption {
  font-size: 1.25rem;
  font-weight: 600;
}

#main h3[data-el=headword] {
  display: inline;
}

#main span.warning {
  margin-top: 0.5rem;
  display: block;
  font-weight: 600;
  background-color: #eeeeee;
  padding: 1rem;
  border-radius: 5px;
}

p.warning {
  padding: 1rem;
  font-weight: 600;
  border-radius: 5px;
  background-color: #d6d6d6;
}

#main table ul {
  margin-inline: 0;
  margin-block-start: 0;
  padding-inline-start: 0;
  list-style-type: none;
}

#main h2 + *,
#main h1 + * {
  margin-top: 1.5rem;
}

div[data-el=listBibl] {
  margin-inline: auto;
  margin-block-start: 1.5rem;
  width: 100%;
  max-width: var(--text-width);
}

div[data-el=bibl] {
  margin-inline-start: 1.5rem;
  margin-block-start: 0.5rem;
  display: list-item;
  list-style-type: none;
  text-indent: -1.5rem;
  font-size: 1rem;
  font-family: var(--primary-serif);
  color: var(--primary-text-color);
}
div[data-el=bibl] span.mjTitle {
  font-style: italic;
}

#main ul.glossary {
  list-style: none;
}
#main ul.glossary h3 {
  text-align: left;
}
#main ul.glossary p[data-el=def] {
  margin-block-start: 0.25rem;
  font-style: italic;
}

div[data-el=note] {
  width: 100%;
  max-width: var(--text-width);
  margin-inline: auto;
  margin-block-start: 0;
  font-family: var(--primary-serif);
}
div[data-el=note] .noteCaption {
  font-family: var(--primary-serif);
  font-weight: 700;
  font-size: 1rem;
  text-align: left;
}

p[data-el=def] + div[data-el=note] {
  margin-block-start: 1.5rem;
}

#main :where(p) {
  font-family: var(--primary-serif);
  font-size: 1rem;
  color: var(--primary-text-color);
  margin-top: 0.5rem;
  margin-inline: auto;
  width: 100%;
  max-width: var(--text-width);
}

#main :where(ul, p) {
  width: 100%;
  max-width: var(--text-width);
  margin-block-start: 1rem;
  margin-inline: auto;
  font-size: 1rem;
  font-family: var(--primary-serif);
  color: var(--primary-text-color);
}

#main :where(ul) {
  padding-inline-start: 1.5rem;
}

span.interlin {
  font-variant: small-caps;
}

p[data-el=def] + div#hyph_ {
  margin-block-start: 3rem;
}

#main h2 + div[data-el=eg] h3 {
  font-size: 1.5rem;
  font-weight: 500;
}
#main h2 + div[data-el=eg] p {
  font-size: 1rem;
}

:root {
  --top-offset: 130px;
  --mobile-nav-banner-bg-color: transparent;
  --hamburger-closed-color: #fff;
  --hamburger-open-color: #fff;
  --hamburger-bg-color: var(--site-highlight);
  --hamburger-open-bg-color: transparent;
}

html.bilingual #mobile-nav-banner {
  display: none;
}

body:has(button[aria-expanded=true]) {
  overflow: hidden;
}

#mobile-nav-banner {
  display: grid;
  grid-template-columns: min-content 1fr;
  grid-template-rows: auto auto;
  margin-inline-end: 0.5rem;
  column-gap: 1rem;
  align-content: center;
}
#mobile-nav-banner span[lang=en],
#mobile-nav-banner span[lang=fr] {
  text-align: left;
}
#mobile-nav-banner img {
  max-width: none;
}
#mobile-nav-banner .site-title {
  align-self: flex-start;
}
#mobile-nav-banner .mobile-nav-toggle {
  grid-column: 1/3;
  margin-inline-start: auto;
  margin-inline-end: 0;
}

.site-logo-mobile {
  width: 60px;
}

button.mobile-nav-toggle {
  width: 49px;
  height: 44px;
  box-shadow: var(--shadow-sm);
  appearance: none;
  border: 0;
  background-color: var(--hamburger-bg-color);
  color: var(--hamburger-closed-color);
  display: flex;
  justify-content: center;
  align-items: center;
  cursor: pointer;
  position: static;
  margin-left: auto;
  z-index: 10;
  margin-right: 0.5rem;
  border-radius: 8px;
  transition: all 0s ease-in-out;
}

header[data-state=closed] button.mobile-nav-toggle .burger-open {
  display: block;
}
header[data-state=closed] button.mobile-nav-toggle .burger-close {
  display: none;
}
@media only screen and (min-width: 768px) {
  header[data-state=closed] button.mobile-nav-toggle {
    display: none;
  }
}

header[data-state=open] button.mobile-nav-toggle .burger-open {
  display: none;
}
header[data-state=open] button.mobile-nav-toggle .burger-close {
  display: block;
}
@media only screen and (min-width: 768px) {
  header[data-state=open] button.mobile-nav-toggle {
    display: none;
  }
}

header[data-state=open] button.mobile-nav-toggle {
  position: absolute;
  right: 1.5rem;
}

header[data-state=closed] + #mainMenu {
  transform: translate3d(-100%, 0, 0);
  position: fixed;
  top: var(--top-offset);
  left: 0;
  background-color: var(--internal-nav-mobile-bg-color-closed);
  border-radius: 0;
  display: flex;
  justify-content: center;
  padding-block: 0.5rem;
  padding-inline: 2rem;
  opacity: 1;
  height: 100%;
  z-index: 5;
}
@media only screen and (min-width: 768px) {
  header[data-state=closed] + #mainMenu {
    transform: translate3d(0, 0, 0);
    position: initial;
    height: initial;
    top: 0;
    margin-left: auto;
    padding-block-start: 0.5rem;
    padding-inline: 0;
  }
}

header[data-state=open] + #mainMenu {
  position: fixed;
  transform: translate3d(0, 0, 0);
  padding-block-start: 1.5rem;
  border-top: 10px solid var(--site-highlight);
  overflow: auto;
  left: 0;
  border-radius: 0;
  opacity: 1;
  width: 100%;
  height: 100%;
  z-index: 5;
  display: flex;
  flex-direction: column;
  visibility: visible;
}
@media only screen and (orientation: landscape) and (max-width: 956px) {
  header[data-state=open] + #mainMenu {
    background: url("../images/card-bg.webp") no-repeat center bottom 50px/768px 440px, #ffffff;
  }
}
@media only screen and (min-width: 768px) {
  header[data-state=open] + #mainMenu {
    position: initial;
    display: flex;
    border-block-start: 1px solid var(--site-highlight);
    margin-block-start: 0.5rem;
    padding-block-start: 0.5rem;
    padding-inline-start: 0;
    padding-inline-end: 0;
    width: 100%;
    background: none;
  }
}

#mobile-nav-banner[data-state=closed] {
  width: 100%;
  position: relative;
  top: 0;
  z-index: 15;
  transition: all 0.1s ease-in-out;
  padding-block-end: 1rem;
}
@media only screen and (min-width: 768px) {
  #mobile-nav-banner[data-state=closed] {
    display: none;
  }
}

#mobile-nav-banner[data-state=open] {
  width: 100%;
  height: var(--top-offset);
  background-color: var(--mobile-banner-open-bg-color);
  box-shadow: 0 0 0 rgba(0, 0, 0, 0.08);
}
@media only screen and (min-width: 768px) {
  #mobile-nav-banner[data-state=open] {
    display: none;
  }
}

#mobile-nav-banner[data-state=open] ~ a.langSwitch {
  z-index: 1;
}

@view-transition {
  navigation: auto;
}
.versionWarning {
  position: absolute;
  top: 0;
  left: 0;
  display: none;
}

.bannerBg,
#asideLeft,
#menuBurger {
  display: none;
}

#asideLeft {
  display: inline-flex;
  flex-flow: row wrap;
  margin-block-start: 1.5rem;
  position: sticky;
  top: 3px;
}
#asideLeft a {
  text-decoration: none;
  font-weight: 700;
}
@media only screen and (min-width: 1328px) {
  #asideLeft {
    display: grid;
    flex-flow: column nowrap;
    position: fixed;
    top: 200px;
    left: max(var(--gutter), (100vw - var(--content-max)) / 2 + var(--gutter));
  }
}

#asideLeft form {
  margin-inline: auto;
  background-image: url(../images/body-bg.png);
  background-repeat: repeat;
  box-shadow: var(--shadow-sm), var(--shadow-inset-sm);
  border-radius: 8px;
}

@media only screen and (min-width: 1328px) and (min-height: 500px) {
  #index #asideLeft form {
    background-image: url(../images/body-bg.png);
    box-shadow: var(--shadow-sm), var(--shadow-inset-sm);
  }
}

#asideLeft fieldset {
  position: relative;
  padding: 0.5rem;
  border: none;
  border-radius: 5px;
  font-family: var(--primary-sans);
  font-size: 0.8rem;
}
#asideLeft fieldset legend {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  font-weight: 500;
}
@media only screen and (min-width: 1328px) and (min-height: 500px) {
  #asideLeft fieldset legend {
    left: 0.5rem;
    transform: none;
  }
}
#asideLeft fieldset > div {
  display: flex;
  flex-direction: row;
  gap: 1rem;
  padding-block-start: 1.5rem;
}
@media only screen and (min-width: 1328px) and (min-height: 500px) {
  #asideLeft fieldset > div {
    flex-direction: column;
    justify-content: center;
    gap: 0.25rem;
    padding-block-start: 1.5rem;
  }
}
#asideLeft fieldset > div input {
  accent-color: var(--site-highlight);
}
@media only screen and (min-width: 1328px) and (min-height: 500px) {
  #asideLeft fieldset {
    padding: 0.75rem;
  }
}

html {
  height: 100%;
  border-top: 10px solid var(--site-highlight);
  background: url(../images/body-bg.png) repeat;
  padding-inline: 0;
}
@media only screen and (min-width: 768px) {
  html {
    padding-inline: 2rem;
  }
}

html body {
  display: flex;
  flex-flow: column nowrap;
  align-items: initial;
  width: 100%;
  max-width: var(--content-max);
  margin-inline: auto;
  padding-inline: 1rem;
  background: url(../images/html-bg.png) repeat;
  box-shadow: 0px 1px 3px 0px rgba(10, 13, 18, 0.1), 0px 1px 2px -1px rgba(10, 13, 18, 0.1), var(--shadow-inset-lg);
}
@media only screen and (min-width: 768px) {
  html body {
    padding-inline: 2rem;
  }
}

html.bilingual body {
  display: grid;
  grid-template-rows: auto 1fr auto;
  min-height: calc(100dvh - 10px);
  padding-block-start: clamp(1rem, 5vh, 25vh);
  position: relative;
  border-bottom: 10px solid var(--site-highlight);
  background-image: url(../images/html-bg.png);
  background-repeat: repeat;
  background-position: top left;
  background-size: auto;
}
html.bilingual body::after {
  content: "";
  position: absolute;
  bottom: 3rem;
  left: 50%;
  transform: translateX(-50%);
  width: 36px;
  height: 32px;
  background-image: url(../images/logo-footer.png);
  background-repeat: no-repeat;
  background-size: 36px 32px;
}

html.bilingual .scroll-to-top {
  display: none;
}

html.bilingual main.bilingual {
  display: flex;
  flex-flow: row wrap;
  justify-content: center;
  margin-block-start: 1.5rem;
  height: fit-content;
  gap: 1rem;
}
html.bilingual main.bilingual a.langSwitch {
  padding: 1rem;
  width: 8rem;
  text-align: center;
  font-size: 1.25rem;
  font-family: var(--primary-serif);
  font-weight: 500;
  color: #fff;
  text-decoration: none;
  border: 2px solid transparent;
  border-radius: 8px;
  background-color: var(--site-highlight);
  box-shadow: var(--shadow-sm);
  transition: all 0.3s ease-in-out;
}
html.bilingual main.bilingual a.langSwitch:is(:hover, :focus) {
  background-color: transparent;
  border: 2px solid var(--site-highlight);
  color: var(--site-highlight);
}
@media only screen and (min-width: 768px) {
  html.bilingual main.bilingual {
    margin-block-start: 3rem;
    gap: 3rem;
  }
}

header {
  position: relative;
  display: grid;
  grid-template-columns: 1fr min-content;
  margin-block-start: 1rem;
}

header > br,
header > br ~ span {
  display: none;
}

.site-title-container {
  display: none;
}
@media only screen and (min-width: 768px) {
  .site-title-container {
    display: flex;
    flex-flow: row nowrap;
    column-gap: 1rem;
  }
}

html.bilingual body header {
  border-block: none;
}

html.bilingual body .site-title-container {
  display: flex;
  flex-flow: column nowrap;
  column-gap: 1rem;
  margin-inline: auto;
}
html.bilingual body .site-title-container .site-logo {
  display: flex;
  justify-content: center;
}
html.bilingual body .site-title-container .site-logo img {
  width: 250px;
}
html.bilingual body .site-title-container span:is([lang=fr], [lang=en]),
html.bilingual body .site-title-container [lang=wdt] {
  text-align: center;
}

html.bilingual body .site-title-container span:is([lang=fr], [lang=en]) {
  font-size: clamp(0.9rem, 2vw, 1.5rem);
}

html.bilingual body .site-title-container span[lang=wdt] {
  font-size: clamp(1.5rem, 3vw, 3rem);
}

html.bilingual .site-title {
  display: flex;
  flex-flow: column nowrap;
  align-self: center;
}
html.bilingual .site-title .site-logo {
  width: 120px;
}
html.bilingual .site-title span[lang=wdt] {
  font-family: var(--primary-serif);
  font-weight: 500;
  font-size: 3rem;
  color: #000000;
  line-height: 1;
}
html.bilingual .site-title span[lang=en],
html.bilingual .site-title span[lang=fr] {
  font-family: var(--primary-sans);
  font-weight: 500;
  font-size: 1.5rem;
  color: #414651;
  text-align: right;
}

.site-title {
  display: flex;
  flex-flow: column nowrap;
  align-self: center;
}
.site-title span[lang=wdt] {
  font-family: var(--primary-serif);
  font-weight: 500;
  font-size: clamp(1rem, 5vw, 1.5rem);
  color: #000000;
  line-height: 1;
}
.site-title span[lang=en],
.site-title span[lang=fr] {
  font-family: var(--primary-sans);
  font-weight: 500;
  font-size: clamp(1rem, 3vw, 1.25rem);
  color: #414651;
  text-align: right;
}

header .langSwitch {
  width: 3.125rem;
  height: 2.75rem;
  margin-block-start: 0;
  position: absolute;
  top: 68px;
  right: 70px;
  z-index: 15;
  font-family: var(--primary-serif);
  font-size: 1.5rem;
  font-weight: 600;
  color: #ffffff;
  text-align: center;
  text-decoration: none;
  background-color: var(--site-highlight);
  border: 2px solid transparent;
  border-radius: 8px;
  align-content: center;
  transition: color 0.3s ease-in-out, background-color 0.3s ease-in-out;
}
header .langSwitch:is(:hover, :focus) {
  color: var(--site-highlight);
  background-color: transparent;
  border: 2px solid var(--site-highlight);
}
@media only screen and (min-width: 768px) {
  header .langSwitch {
    margin-block-start: auto;
    position: initial;
  }
}

nav#mainMenu {
  position: fixed;
  transform: translate3d(0, 0, 0);
  top: 0;
  left: 0;
  border-radius: 0;
  padding-block: 3rem;
  padding-inline-start: 3rem;
  padding-inline-end: 2rem;
  opacity: 1;
  width: 100%;
  height: 100%;
  z-index: 5;
  display: flex;
  flex-direction: column;
  background-image: url(../images/html-bg.png);
  background-repeat: repeat;
}
@media only screen and (min-width: 768px) {
  nav#mainMenu {
    position: initial;
    display: flex;
    border-block-start: 1px solid var(--site-highlight);
    margin-block-start: 0.5rem;
    padding-block-start: 1rem;
    padding-inline-start: 0;
    padding-inline-end: 0;
    width: 100%;
    background: none;
  }
}
nav#mainMenu ul {
  display: flex;
  flex-flow: column wrap;
  gap: 0.5rem;
  list-style: none;
}
@media only screen and (min-width: 768px) {
  nav#mainMenu ul {
    flex-flow: row wrap;
    gap: 1.5rem;
  }
}
nav#mainMenu ul li {
  font-family: var(--primary-sans);
  font-size: 1rem;
}
@media only screen and (min-width: 768px) {
  nav#mainMenu ul li {
    font-size: 1rem;
  }
}
nav#mainMenu ul li a {
  position: relative;
  text-decoration: none;
  color: #000000;
}
nav#mainMenu ul li a::before {
  content: "";
  position: absolute;
  top: 1.75rem;
  left: 0;
  width: 100%;
  height: 3px;
  background-color: transparent;
  transition: background-color 0.3s ease-in-out;
}
nav#mainMenu ul li a:is(:focus, :hover, .active)::before {
  background-color: var(--site-highlight);
}

#index #main {
  align-self: center;
  flex: 1 0 auto;
  width: 100%;
  max-width: 60rem;
  margin-block-start: max(1.5rem, 3vh);
  padding-block-start: 1.5rem;
  padding-block-end: clamp(3rem, 10vh, 25vh);
  background-image: url(../images/logo-bg.png), url(../images/body-bg.png);
  background-repeat: no-repeat, repeat;
  background-position: center 1rem, top left;
  background-size: 50% auto, auto;
  border-radius: 8px;
  box-shadow: 0px 1px 3px 0px rgba(10, 13, 18, 0.1), 0px 1px 2px -1px rgba(10, 13, 18, 0.1), var(--shadow-inset-lg);
  font-family: var(--primary-serif);
  color: var(--primary-text-color);
}
#index #main h2 {
  text-align: center;
  font-size: 2rem;
  font-weight: 700;
}
#index #main section {
  width: 100%;
  max-width: 43rem;
  margin-inline: auto;
  padding-inline: 1.5rem;
}
#index #main section :is(h3, h4) {
  text-align: center;
}
#index #main section h3 {
  font-size: clamp(1.25rem, 3vw, 2rem);
  font-weight: 700;
}
#index #main section h4 {
  font-size: 1.25rem;
  font-weight: 500;
  font-style: italic;
}
#index #main section p:first-of-type {
  margin-block-start: 1.5rem;
}
#index #main section :is(ul, p) {
  margin-top: 0.5rem;
  font-size: clamp(1rem, 4vw, 1.25rem);
}

#main {
  width: 100%;
  margin-inline: auto;
  margin-block-start: 0rem;
  padding-block-start: 1.5rem;
  background: none;
  box-shadow: none;
}
@media only screen and (min-width: 1024px) and (min-height: 500px) {
  #main {
    margin-block-start: 0;
  }
}

.letterLinks,
.onScreenKeyboard,
#keyboard {
  display: flex;
  flex-flow: row wrap;
  justify-content: center;
  gap: 0.75rem;
  width: 100%;
  max-width: var(--text-width);
  margin-inline: auto;
  margin-block-start: 3rem;
  padding-inline: 1rem;
  padding-block: 1.5rem;
  background-image: url(../images/body-bg.png);
  background-repeat: repeat-x;
  border-radius: 8px;
  box-shadow: 0px 1px 3px 0px rgba(10, 13, 18, 0.1), 0px 1px 2px -1px rgba(10, 13, 18, 0.1);
}

#keyboard {
  margin-block-start: 1.5rem;
  margin-block-end: 0.5rem;
}

.onScreenKeyboard > button {
  -webkit-appearance: none;
  appearance: none;
}

.onScreenKeyboard button:is(:hover, :focus) {
  border: 2px solid var(--site-highlight);
}

.letterLinks > a,
.onScreenKeyboard > button,
#keyboard > button {
  justify-items: center;
  align-content: center;
  width: 2.75rem;
  height: 2.75rem;
  background-color: #ffffff;
  border: 2px solid transparent;
  border-radius: 5px;
  box-shadow: 0px 1px 3px 0px rgba(10, 13, 18, 0.1), 0px 1px 2px -1px rgba(10, 13, 18, 0.1);
  font-family: var(--primary-serif);
  font-size: 1.25rem;
  font-weight: 500;
  color: var(--primary-text-color);
  text-align: center;
  text-decoration: none;
  transition: all 0.3s ease-in-out;
}

.letterLinks > a:is(:focus, :hover),
.onScreenKeyboard > button:is(:hover, :focus) {
  border: 2px solid var(--site-highlight);
  cursor: pointer;
}

html main#main ul.listing {
  width: 100%;
  max-width: var(--listing-width);
  margin-inline: auto;
  margin-block-start: 3rem;
  padding-inline-start: 0;
  /* a {
    margin-inline-end: 1ch;
  } */
}
html main#main ul.listing li {
  list-style: none;
}

p[data-el=def] q {
  margin-inline-start: 0;
}

main#main .listing ul {
  width: 100%;
  max-width: var(--listing-width);
  margin-inline: 0;
  padding-inline-start: 0;
}

.listing li:has(ul) {
  margin-block-start: 4.5rem;
}

.listing li ul li[data-sort-heading] {
  margin-block-start: 0;
  margin-inline-start: 0;
}

.listing li ul li {
  margin-inline-start: 5rem;
  margin-block-start: 0.75rem;
}
@media only screen and (min-width: 768px) {
  .listing li ul li {
    margin-inline-start: 8rem;
  }
}

.listing li[data-sort-heading]:first-of-type {
  margin-block-start: 0;
}

li[data-sort-heading] {
  float: left;
  clear: both;
  margin-inline-start: 0;
  margin-block-start: 3rem;
  position: sticky;
  top: 1rem;
  align-content: center;
  justify-content: center;
  width: 3.5rem;
  height: 3.5rem;
  background-image: url(../images/body-bg.png);
  background-repeat: no-repeat;
  border-radius: 8px;
  box-shadow: 0px 1px 3px 0px rgba(10, 13, 18, 0.1), 0px 1px 2px -1px rgba(10, 13, 18, 0.1);
  font-size: 1.25rem;
  color: var(--primary-text-color);
  font-weight: 700;
  text-align: center;
}
li[data-sort-heading] a {
  display: none;
}
@media only screen and (min-width: 768px) {
  li[data-sort-heading] {
    width: 4.5rem;
    height: 4.5rem;
    font-size: 1.5rem;
  }
}

li[data-sort-heading] + li {
  margin-block-start: 3rem;
}

div[data-el=source] {
  width: 100%;
  max-width: var(--text-width);
  margin-inline: auto;
  margin-block-start: 1.5rem;
}

footer {
  flex-shrink: 0;
  display: flex;
  flex-flow: column wrap;
  align-items: center;
  padding-block: 3rem;
}
footer :is(#pageCitation, .acknowledgements, .copyright, #buildInfo, #credits) {
  font-family: var(--primary-sans);
  font-size: 0.8rem;
  color: #424242;
  text-align: center;
}

.logo-footer {
  margin-block-end: 1.5rem;
}

#credits {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 1.5rem;
  margin-block-start: 1.5rem;
}
@media only screen and (min-width: 1024px) {
  #credits {
    flex-direction: row;
    gap: 4.5rem;
  }
}

#uvicHcmc {
  width: 100%;
  max-width: 250px;
}

#sshrc {
  width: 100%;
  max-width: 582px;
}

.scroll-to-top[aria-hidden=false],
.scroll-to-top[aria-hidden=true] {
  position: fixed;
  bottom: 30px;
  z-index: 10;
  display: flex;
  flex-flow: column nowrap;
  align-items: center;
  width: 4rem;
  height: 4rem;
  padding: 0.5rem 0.5rem;
  font-family: var(--primary-sans);
  font-size: 0.75rem;
  font-weight: 400;
  line-height: 1.5;
  text-align: center;
  text-decoration: none;
  color: var(--primary-text-color);
  /* background-color: #ffffff; */
  background-image: url(../images/popup-bg.png);
  background-repeat: repeat;
  border-radius: 8px;
  box-shadow: 0px 1px 3px 0px rgba(10, 13, 18, 0.1), 0px 1px 2px -1px rgba(10, 13, 18, 0.1);
  transition: all 0.75s ease-in-out;
}

.scroll-to-top[aria-hidden=false] {
  opacity: 1;
  /* 
    (100vw - --content-max)/2  → the “side margin” on wide viewports. 
    Add --gutter to push it slightly inside that margin. 
    If viewport is narrower than --content-max, the calc() becomes negative, so max() picks --gutter.
  */
  right: max(var(--gutter), (100vw - var(--content-max)) / 2 + var(--gutter));
}

.scroll-to-top[aria-hidden=true] {
  opacity: 0;
  right: -100px;
  transition-delay: 0.9s;
}

svg.up-caret {
  width: 16px;
  height: auto;
  margin-bottom: 0.25rem;
  stroke: #222222;
  transform: translate3d(0, 0, 0);
  transition: all 0.3s ease-in-out;
}

dialog#infoPopup[open] {
  opacity: 1;
}
@starting-style {
  dialog#infoPopup[open] {
    opacity: 0;
  }
}

dialog#infoPopup {
  transition: opacity 200ms ease-out, display 200ms;
  transition-behavior: allow-discrete;
  opacity: 0;
}

dialog#infoPopup[open],
dialog#infoPopup {
  position: fixed;
  /* make it a fixed box */
  left: 1rem;
  /* desired x-offset */
  top: 3rem;
  /* desired y-offset */
  right: auto;
  /* override any “right: 50%” from the UA */
  bottom: auto;
  /* override any “bottom: 50%” from the UA */
  margin: 0;
  /* cancel out any automatic centering margins */
  transform: none;
  /* remove the UA’s translate(-50%, -50%) */
  padding: 0;
  z-index: 100;
  overflow: visible;
  width: 85%;
  border-radius: 8px;
  border: 0px;
  background-image: url(../images/popup-bg.png);
  background-repeat: repeat;
  box-shadow: var(--shadow-lg), var(--shadow-inset-lg);
}
@media only screen and (min-width: 768px) {
  dialog#infoPopup[open],
  dialog#infoPopup {
    left: 3rem;
    width: 400px;
    height: initial;
    max-height: 60vh;
  }
}
dialog#infoPopup[open] button,
dialog#infoPopup button {
  float: right;
  position: absolute;
  top: 0;
  right: 0;
  translate: 50% -50%;
  padding: 0.5rem;
  font-family: var(--primary-sans);
  color: #ffffff;
  box-shadow: var(--shadow-sm);
  background-color: var(--site-highlight);
  border: 2px solid transparent;
  border-radius: 8px;
  transition: all 0.3s ease-in-out;
  cursor: pointer;
}
dialog#infoPopup[open] button:is(:hover, :focus),
dialog#infoPopup button:is(:hover, :focus) {
  color: var(--site-highlight);
  background-color: #ffffff;
  border: 2px solid var(--site-highlight);
}
dialog#infoPopup[open] #infoContent,
dialog#infoPopup #infoContent {
  padding: 2rem;
  overflow-y: auto;
  max-block-size: 60vh;
}
dialog#infoPopup[open] #infoContent h3,
dialog#infoPopup #infoContent h3 {
  font-family: var(--primary-serif);
  color: var(--primary-text-color);
}
dialog#infoPopup[open] #infoContent p,
dialog#infoPopup #infoContent p {
  margin-block-start: 0.5rem;
  font-family: var(--primary-serif);
  color: var(--primary-text-color);
}
dialog#infoPopup[open] #infoContent p[data-el=def],
dialog#infoPopup #infoContent p[data-el=def] {
  font-style: italic;
}

@media (any-hover: hover) {
  .scroll-to-top:hover {
    cursor: pointer;
    background-color: #ffffff;
    color: var(--site-highlight);
  }
  .scroll-to-top:hover svg.up-caret {
    stroke: var(--site-highlight);
    transform: translate3d(0, -3px, 0);
  }
}
/* Hiding and showing things for the various views. */
html body.basic *.noBasic,
html body.intermediate *.noIntermediate,
html body.basic #main *.noBasic,
html body.intermediate #main *.noIntermediate,
html body.full #main *.noFull {
  display: none;
}

/* When we're showing an entry with multiple
   form elements in full view, we need to delimit
   the form sections with thicker borders. */
body.full tr.multiForm > td,
body.intermediate tr.multiForm > td {
  border-top-width: 2pt;
  border-top-color: black;
}

span.ssQueryAndButton {
  display: grid;
  gap: 1rem;
  margin-block-start: 1.5rem;
  width: var(--text-width);
  max-width: 100%;
  margin-inline: auto;
  margin-block-start: 1.5rem;
  padding-inline: 1rem;
  padding-block: 1.5rem;
  background-image: url(../images/body-bg.png);
  background-repeat: repeat-x;
  border-radius: 8px;
  box-shadow: 0px 1px 3px 0px rgba(10, 13, 18, 0.1), 0px 1px 2px -1px rgba(10, 13, 18, 0.1);
}

#ssQuery {
  padding-inline: 0.75rem;
  padding-block: 0.5rem;
  border-radius: 8px;
  border: 1px solid #D5D7DA;
  background: #ffffff;
  box-shadow: 0px 1px 2px 0px rgba(10, 13, 18, 0.05);
  font-family: var(--primary-serif);
  transition: all 0.3s ease-in-out;
}

#ssQuery:focus {
  border: 1px solid var(--site-highlight);
}

span.ssQueryAndButton button,
button#ssDoSearch2 {
  justify-self: end;
  padding-inline: 0.75rem;
  padding-block: 0.5rem;
  border: 2px solid transparent;
  border-radius: 5px;
  background-color: var(--site-highlight);
  box-shadow: 0px 1px 3px 0px rgba(10, 13, 18, 0.1), 0px 1px 2px -1px rgba(10, 13, 18, 0.1);
  font-family: var(--primary-sans);
  color: #ffffff;
  transition: all 0.3s ease-in-out;
}
span.ssQueryAndButton button:is(:hover, :focus),
button#ssDoSearch2:is(:hover, :focus) {
  border: 2px solid var(--site-highlight);
  background-color: #fff;
  cursor: pointer;
  color: var(--site-highlight);
}

button#ssDoSearch2 {
  margin-block-start: 1.5rem;
}

.clearButton {
  width: 100%;
  max-width: var(--text-width);
  margin-inline: auto;
  margin-block-start: 0.5rem;
}

#ssClear {
  justify-self: end;
  padding-inline: 0.75rem;
  padding-block: 0.5rem;
  border: 2px solid transparent;
  border-radius: 5px;
  background-color: #e8d400;
  box-shadow: 0px 1px 3px 0px rgba(10, 13, 18, 0.1), 0px 1px 2px -1px rgba(10, 13, 18, 0.1);
  font-family: var(--primary-sans);
  color: var(--site-highlight);
  transition: all 0.3s ease-in-out;
}
#ssClear:is(:hover, :focus) {
  border: 2px solid #e8d400;
  background-color: #fff;
  cursor: pointer;
  color: var(--site-highlight);
}

div.ssDescFilters {
  display: flex;
  flex-flow: row wrap;
  gap: 1rem;
}

#staticSearch fieldset {
  border: none;
  border-radius: 8px;
  background-image: url(../images/body-bg.png);
  box-shadow: 0px 1px 3px 0px rgba(10, 13, 18, 0.1), 0px 1px 2px -1px rgba(10, 13, 18, 0.1);
}
#staticSearch fieldset legend {
  all: unset;
  display: block;
  position: relative;
  bottom: 1rem;
  font-weight: 500;
  font-family: var(--primary-sans);
}

#staticSearch {
  width: 100%;
  margin-inline: auto;
  max-width: var(--search-width);
}

#staticSearch ul {
  padding: 0;
  margin: 0;
  position: relative;
}

.ssContent {
  width: 100%;
}

#staticSearch ul li {
  display: grid;
  grid-template-columns: 1rem auto;
  gap: 0.5rem;
  color: var(--text-color);
  font-size: 0.988rem;
  padding: 0;
  margin: 0 0 0 0.75rem;
}

#staticSearch ul li label {
  font-family: var(--primary-sans);
  font-weight: 400;
  color: #222222;
  font-size: 0.8rem;
  letter-spacing: -0.131966px;
}

#staticSearch ul li input[type=checkbox] {
  -webkit-appearance: none;
  appearance: none;
  background-color: transparent;
  margin: 0;
  color: currentcolor;
  width: 1.15em;
  height: 1.15em;
  border: 0.1em solid currentcolor;
  border-radius: 0.15em;
  transform: translateY(0.15em);
  display: grid;
  place-content: center;
  padding: 0;
}

#staticSearch ul li input[type=checkbox]::before {
  content: "";
  width: 0.65em;
  height: 0.65em;
  transform: scale(0);
  transition: 120ms transform ease-in-out;
  box-shadow: inset 1em 1em var(--site-highlight);
  transform-origin: bottom left;
  /*Remove this for a square marker*/
  clip-path: polygon(14% 44%, 0 65%, 50% 100%, 100% 16%, 80% 0%, 43% 62%);
  /* Windows High Contrast Mode */
  background-color: CanvasText;
}

#staticSearch ul li input[type=checkbox]:checked::before {
  transform: scale(1);
}

#staticSearch ul li input[type=checkbox]:focus {
  outline: max(1px, 0.1em) solid currentColor;
  outline-offset: max(1px, 0.1em);
}

#staticSearch li + li {
  margin-top: 0.25rem;
}

div.ssDescFilters fieldset,
div.ssDateFilters fieldset,
div.ssNumFilters fieldset,
div.ssBoolFilters fieldset,
div.ssSearchInFilters fieldset {
  margin: 0.25em auto;
  padding: 0.25em;
  flex-grow: 1;
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
}

form#ssForm {
  width: 100%;
  max-width: var(--search-width);
  margin-block-end: 3rem;
}

#ssForm *[class^=ss] fieldset {
  margin-block-end: 1rem;
}

#ssForm legend {
  color: var(--text-color);
  font-family: var(--primary-sans);
  font-size: 1.1rem;
  font-weight: 500;
}

#ssForm label {
  font-family: var(--primary-sans);
}

#ssForm button + button {
  margin-inline-start: 1rem;
}

span.ssQueryAndButton {
  margin-block-end: 0.5rem;
}

#ssForm *[class^=ss] input:not([type=checkbox]) {
  margin-inline-end: 0.5rem;
  max-width: 100%;
  font-size: 1rem;
  border: 1px solid transparent;
  border-radius: 3px;
  width: 100%;
  box-shadow: inset 0 0 2px rgba(0, 0, 0, 0.5);
  font-family: var(--primary-sans);
  font-weight: 400;
  padding: 0.5rem 0.5rem 0.5rem 0.5rem;
  color: #222222;
  position: relative;
  background-image: url(../images/magnifying-glass.svg);
  background-repeat: no-repeat;
  background-position: top 50% right 15px;
  background-size: 27px 27px;
  transition: all 0.3s ease-in-out;
  outline: none;
}

#ssForm *[class^=ss] input:focus:not([type=checkbox]) {
  background-color: #fff;
  color: #222222;
  background-color: #fff;
  background-image: url(../images/magnifying-glass.svg);
  background-repeat: no-repeat;
  background-position: top 50% right 15px;
  background-size: 27px 27px;
  transition: all 0.3s ease-in-out;
  outline: none;
  color: #222222;
  padding: 0.5rem 0.5rem 0.5rem 0.5rem;
  border: 1px solid var(--site-highlight);
}

span.clearButton {
  margin-block-end: 1.5rem;
}

div#ssResults > ul > li {
  padding: 0;
  margin: 0;
}

#ssForm svg {
  display: none;
}

div.ssDateFilters fieldset.ssFieldset span,
div.ssNumFilters fieldset.ssFieldset span,
div.ssBoolFilters fieldset.ssFieldset span {
  padding: 0.5em 0;
}

div.ssDescFilters,
div.ssDateFilters,
div.ssNumFilters,
div.ssBoolFilters,
div.ssSearchInFilters {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 1.5rem;
}

#main details {
  display: block;
  cursor: pointer;
  width: 100%;
  max-width: var(--text-width);
  margin-inline: auto;
  margin-block-start: 1.5rem;
  padding: 1rem;
  border-radius: 8px;
  background-image: url(../images/body-bg.png);
  background-repeat: repeat;
  box-shadow: var(--shadow-sm);
}
#main details summary h3 {
  display: inline;
}
#main details h3.caption {
  text-align: left;
}
#main details ul {
  width: auto;
  max-width: none;
}

summary::marker {
  color: var(--site-highlight);
  font-size: 1.5rem;
  line-height: 1;
}

#search details {
  width: 100%;
}

#search details > * {
  padding: 0rem 1rem;
  font-family: var(--primary-sans);
}

#search #staticSearch #ssResults ul li div {
  margin-block-end: 1.5rem;
  padding: 1rem;
}

div#ssResults > ul > li > a > img {
  width: 50px;
  height: auto;
  min-width: auto;
  min-height: auto;
}

div#ssResults {
  min-height: initial;
  padding-block-start: 1rem;
  margin-block-end: 0;
}

div#staticSearch details {
  width: 100%;
  max-width: var(--search-width);
  margin-block-start: 1.5rem;
  padding: 1rem;
  border-radius: 8px;
  background-image: url(../images/body-bg.png);
  background-repeat: repeat;
  box-shadow: var(--shadow-sm);
}

div#staticSearch details[open] fieldset {
  background-image: url(../images/html-bg.png);
  background-repeat: repeat;
}

html body #main div.ssDescFilters {
  margin-block-start: 1.5rem;
}

div.ssDescFilters + h3 {
  margin-block-start: 0.5rem;
  font-family: var(--primary-sans);
  font-weight: 600;
}

div#staticSearch summary::marker {
  color: var(--site-highlight);
}

div#staticSearch summary h3 {
  display: inline;
}

#ssPoweredBy > p {
  margin-block-start: 1.5rem;
  font-family: var(--primary-sans);
  color: var(--primary-text-color);
  font-weight: 300;
  font-size: 0.875rem;
  text-align: center;
}

#ssResults > p {
  font-family: var(--primary-sans);
  font-weight: 500;
  font-size: 1.25rem;
  color: var(--primary-text-color);
  width: 100%;
  max-width: none;
}

div#ssResults > ul > li:nth-child(2n) {
  background-color: transparent;
  transition: none;
  border-top: 1px solid lightGrey;
  border-bottom: 1px solid lightGrey;
}

/* Main site components. */
body {
  /*  font-family: NotoSerif, sans-serif;
  display: flex;
  flex-direction: column;
  align-items: center; */
}

/* Default born-digital page main section. */
body[class*=BornDigital] > section {
  max-width: 50em;
  margin-left: auto;
  margin-right: auto;
}

body[class*=BornDigitalCognates] > section {
  max-width: 90vw;
  width: 90vw;
}

body[class*=BornDigital] section.fullWidth {
  margin-left: auto;
  margin-right: auto;
}

section.twoScrollingColumns h2 {
  text-align: left;
}

body[class*=BornDigital] section.fullWidth div.scrollingColumn {
  max-height: 70vh;
  overflow-y: scroll;
}

header {
  width: 100%;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  border-block-end: 1px solid var(--site-highlight);
}
@media only screen and (min-width: 768px) {
  header {
    border-block-end: none;
  }
}

header > p {
  min-width: 2em;
}

nav#navMain ul {
  list-style-type: none;
  display: flex;
  flex-direction: row;
  align-items: center;
}

nav#navMain > ul > li > a,
header > p > a {
  text-decoration: none;
  padding: 0.25em;
  background-color: #d0d0d0;
  color: #660000;
  border-left: solid 1pt white;
}

nav#navMain > ul > li:first-of-type > a {
  border-left: none;
}

div#credits {
  /* width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  flex-wrap: wrap;
  border-top: solid 1pt gray;
  padding: 1em; */
}

footer img {
  /*  max-height: 3em;
  max-width: 30vw;
  margin: 0.25em; */
}

html[id*=ms i] {
  /* Tables used to capture ms layout in entryFree. */
  /* *[lang ^= 'fr'], *[lang ^= 'en']{
    font-weight: normal;
    color: black;
  } */
  /* Images alongside transcription. */
  /* Inline styling. */
  /* Override default browser stylesheet to move dotted underline down.
  *  Only currently supported in Firefox and Safari. */
  /* #main span>span.fw {
    border-top: solid 1px #000;
  }

  #main div+span.fw {
    border-top: 1px solid #000;
  }

  #main span.facsViewerThumb+span.fw {
    border-top: 1px solid #000;
  }

  #main section div[data-el="div"] span.fw {
    border-top: 1px solid #000;
  }  */
  /* span[data-el="fw"]{
    border: none;
  } */
  /* CSS adapted from the FacsViewer project CSS. */
  /* Close X is in the top right. */
  /*   span.closer a:not(.arrow),
  span.closer a:not(.arrow):hover,
  span.closer a:not(.arrow):visited {
    text-decoration: none;
    color: black;
    padding-right: 0.5em;
    padding-left: 0.5em;
  } */
  /* Let the image take up most of the box. */
  /* Now to show things... */
  /*   span.facsViewerThumb:target {
    float: none;
    height: 96vh;
    width: 96vw;
    position: fixed;
    top: 2vh;
    left: 2vw;
    z-index: 1000;
    overflow: scroll;
  } */
  /* span.facsViewerThumb:target img {
     width: auto;
     max-width: 90vw;
     max-height: 90vh;
     border: dotted 1pt #a60000;
     cursor: default;
     transition-property: transform;
     transition-duration: 0.2s;
   }
  */
  /* Trial templates for layout of interlinear glossed texts. */
  /* ul[data-list-rend="simple"], ol[data-list-rend="simple"], ul:not([data-list-rend]), ol:not([data-list-rend]){
    list-style-type: none;
  } */
  /* Abbreviations table pages */
  /* Onscreen keyboard for Wendat on search page. */
  /* These classes set up the side-by-side scrolling 
  * cognate/cognate pages. */
  /*section.twoScrollingColumns>div{
    overflow-y: scroll;
    max-height: 90%;
    padding: 1em;
    margin: 1em;
  }*/
  /*  Error reporting lists in details elements. */
  /* Red bg for warning. */
  /*Layout for manuscript pages Pat*/
}
html[id*=ms i] section[data-el=msDesc] {
  border: solid 1pt gray;
  padding: 0.5rem;
  margin: 0.5rem;
  border-radius: 0.25em;
  background-color: #e0e0e0;
  font-size: 120%;
  box-shadow: 0.25em 0.25em 0.5em 0.5em #ccc;
}
html[id*=ms i] section[data-el=facsimile] {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
}
html[id*=ms i] section[data-el=facsimile] > div[data-el=surface] {
  max-width: 20%;
  height: auto;
  margin: 2%;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: center;
}
html[id*=ms i] section[data-el=facsimile] > div[data-el=surface] > a > img {
  max-width: 100%;
  height: auto;
}
html[id*=ms i] div[data-el=surface] a {
  text-decoration: none;
  color: #000000;
  text-shadow: 0.05em 0.05em 0.02em #c0c0c0;
}
html[id*=ms i] div[data-el=surface] a.nav {
  display: none;
}
html[id*=ms i] div[data-el=surface] span.navGrp {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
html[id*=ms i] section[data-el=facsimile] > div[data-el=surface]:target {
  z-index: 1000;
  position: absolute;
  left: 0;
  right: 0;
  max-width: 100%;
  background-color: rgba(255, 255, 255, 0.7);
  padding: 0.5em;
  margin: 0;
}
html[id*=ms i] section[data-el=facsimile] > div[data-el=surface]:target > a > img {
  /*max-width: 90vw;*/
  /*max-height: 90vh;*/
}
html[id*=ms i] div[data-el=surface]:target a.nav {
  display: block;
  font-size: 10rem;
  font-weight: 900;
}
html[id*=ms i] h1,
html[id*=ms i] h2 {
  text-align: center;
}
html[id*=ms i] body > div {
  margin: 2em 5%;
}
html[id*=ms i] div[data-el=entryFree] {
  line-height: 1.5;
}
html[id*=ms i] #main table[data-el*=entry],
html[id*=ms i] #main div[data-el=div] table {
  margin-inline-start: 0;
  margin-inline-end: 0;
  margin-bottom: 1em;
  border-collapse: collapse;
  box-shadow: none;
  background-image: none;
  /*  border: solid 1pt gray; */
}
html[id*=ms i] table[data-el*=entry] td,
html[id*=ms i] div[data-el=div] table td {
  border: solid 1pt gray;
  padding: 0.25em;
}
html[id*=ms i] table[data-el*=entry] > thead > tr > td,
html[id*=ms i] table[data-el*=entry] > tbody > tr > td {
  min-width: 8em;
}
html[id*=ms i] table[data-el*=entry] table {
  border-collapse: collapse;
}
html[id*=ms i] table[data-el*=entry] table td,
html[id*=ms i] div[data-el=div] table td {
  text-align: center;
}
html[id*=ms i] span.elLabel,
html[id*=ms i] span.attName,
html[id*=ms i] span.interlin {
  font-size: 0.9rem;
  font-variant: small-caps;
  font-weight: bold;
  display: inline-block;
  min-width: 4em;
  padding: 0.2em;
  text-align: right;
}
html[id*=ms i] span.interlin {
  text-align: center;
}
html[id*=ms i] span.attName::before {
  content: "@";
}
html[id*=ms i] span.persName {
  text-decoration: underline dotted green;
}
html[id*=ms i] table[data-el="wdt:entry"] {
  max-width: 60em;
}
html[id*=ms i] table[data-el="wdt:entry"] thead td {
  font-weight: bold;
  text-align: center;
}
html[id*=ms i] #main div[data-el=entryFree] table {
  margin-inline-start: 0;
  margin-inline-end: 0;
  border-collapse: collapse;
}
html[id*=ms i] div[data-el=entryFree] td {
  padding: 0.25em;
  border: solid 1pt gray;
}
html[id*=ms i] span.unclear {
  background-color: #e0e0e0;
  border-bottom: dotted 1px red;
}
html[id*=ms i] span.form {
  font-weight: 800;
  color: var(--primary-text-color);
}
html[id*=ms i] img.float {
  clear: both;
  float: right;
  margin: 0.75em;
  max-width: 50vh;
}
html[id*=ms i] hr {
  clear: both;
  background-color: #d0d0d0;
  border-style: none;
  height: 0.25em;
}
html[id*=ms i] *[data-rendition=italic] {
  font-style: italic;
}
html[id*=ms i] *[data-rendition=sup] {
  vertical-align: super;
  font-size: 80%;
}
html[id*=ms i] *[data-rendition=uline] {
  text-decoration: underline;
}
html[id*=ms i] *[data-rendition=upover] {
  position: relative;
  top: -0.9em;
  left: -0.7em;
  text-indent: 0;
  margin: 0 -0.5em 0 0;
}
html[id*=ms i] *[lang=la] {
  color: #905800;
}
html[id*=ms i] *[lang=moh] {
  color: rebeccapurple;
}
html[id*=ms i] div[data-el=entryFree] *[lang=en] {
  font-family: var(--primary-serif);
  font-style: italic;
  color: mediumblue;
  /*  color: #00f;
  font-style: italic; */
}
html[id*=ms i] a.anchor,
html[id*=ms i] a.anchor:visited {
  text-decoration: none;
  color: var(--site-highlight);
  transition: all 0.3s ease-in-out;
  /*  display: inline-block;
  margin: 0 1em;
  text-decoration: none;
  color: #9999ff; */
}
html[id*=ms i] a.anchor:is(:hover, :focus) {
  text-decoration: underline;
}
html[id*=ms i] main#main h1 {
  text-align: left;
  font-weight: 600;
  font-size: 1.5rem;
  line-height: 1.4;
}
html[id*=ms i] div[data-el=entryFree] a.anchor {
  text-indent: 0;
  line-height: unset;
}
html[id*=ms i] abbr[title] {
  text-decoration: underline dotted;
  text-underline-offset: 0.25em;
  cursor: help;
}
html[id*=ms i] span.pb {
  display: block;
  margin-inline: auto;
  width: 100%;
  margin-block-start: 3rem;
  margin-block-end: 3rem;
  border-top: solid 1px #bababa;
  clear: both;
  font-weight: 500;
  font-size: 1.25rem;
  /*  &:first-of-type {
    border-top: 0;
    margin-block-start: 0;
  } */
}
html[id*=ms i] span.facsViewerThumb {
  /*  width: 50vh;
  float: right;
  text-align: center;
  display: flex;
  flex-direction: column;
  justify-content: start;
  align-items: center;
  border: solid 1pt gray;
  box-shadow: 0.2em 0.2em 0.1em gray;
  margin: 0.25em 0.25em 1.5em 0.25em;
  padding-top: 0;
  background-color: rgba(255, 255, 255, 0.7); */
  display: block;
  width: 30%;
  float: right;
  margin-block-end: 3rem;
  margin-inline-start: 3rem;
  box-shadow: var(--shadow-lg);
}
html[id*=ms i] span.facsViewerThumb > span {
  width: 100%;
  display: grid;
  align-items: flex-start;
  grid-template-columns: min-content auto min-content;
  padding: 0;
}
html[id*=ms i] .facsViewerThumb:target > span {
  padding: 0 1rem 0rem 1rem;
}
html[id*=ms i] span.facsViewerThumb > span > span {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
html[id*=ms i] span.facsViewerThumb span.closer {
  display: none;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  background-color: lightgray;
  color: black;
  border: solid 1pt gray;
  width: calc(100% - 0.5em);
  height: 4vh;
  padding: 0.25em;
  margin: auto;
}
html[id*=ms i] a.arrow,
html[id*=ms i] a.arrow:hover {
  display: none;
  text-decoration: none;
  color: var(--site-highlight);
  font-size: 2rem;
  font-weight: 900;
  cursor: pointer;
}
html[id*=ms i] span.facsViewerThumb img {
  width: 100%;
  /* margin-top: 0.25em; */
  box-shadow: var(--shadow-sm);
}
html[id*=ms i] span.facsViewerThumb:target span.controls,
html[id*=ms i] span.facsViewerThumb.fvSelected span.controls {
  z-index: 2000;
}
html[id*=ms i] .controls {
  background-color: #ebebeb;
  padding: 0.25rem;
}
html[id*=ms i] span.facsViewerThumb:target span.imgContainer,
html[id*=ms i] span.facsViewerThumb.fvSelected span.imgContainer {
  width: auto;
}
html[id*=ms i] span.facsViewerThumb:target,
html[id*=ms i] span.facsViewerThumb.fvSelected {
  margin-inline-start: 0;
  margin-inline-end: 0;
  float: none;
  height: 90vh;
  width: clamp(min(100vw - 2rem, 400px), 90vw, 1200px);
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%) !important;
  z-index: 1000;
  cursor: default;
  background-color: #fff;
  box-shadow: 2.8px 2.8px 2.2px rgba(0, 0, 0, 0.02), 6.7px 6.7px 5.3px rgba(0, 0, 0, 0.028), 12.5px 12.5px 10px rgba(0, 0, 0, 0.035), 22.3px 22.3px 17.9px rgba(0, 0, 0, 0.042), 41.8px 41.8px 33.4px rgba(0, 0, 0, 0.05), 100px 100px 80px rgba(0, 0, 0, 0.07);
  overflow: hidden;
}
html[id*=ms i] span.facsViewerThumb:target img,
html[id*=ms i] span.facsViewerThumb.fvSelected img {
  width: min(100%, 350px);
  cursor: default;
  transition-property: transform;
  transition-duration: 0.2s;
  max-width: none;
  max-height: none;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 1rem;
  box-shadow: var(--shadow-lg);
}
html[id*=ms i] span.facsViewerThumb span.closer {
  display: none;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  background-color: #eeeeee;
  margin-bottom: 1.5rem;
  border: none;
  border-bottom: 1px solid #cacaca;
  height: auto;
  width: 100%;
}
html[id*=ms i] .closer a:not(.arrow),
html[id*=ms i] .closer a:not(.arrow):hover,
html[id*=ms i] .closer a:not(.arrow):visited {
  font-family: var(--primary-sans);
  color: var(--site-highlight);
  padding-right: 0.5em;
  padding-left: 0.5em;
  font-weight: 700;
  font-size: 1.5rem;
  text-decoration: none;
}
html[id*=ms i] span.facsViewerThumb.fvSelected {
  resize: both;
}
html[id*=ms i] span.facsViewerThumb:target span.imgContainer {
  box-shadow: none;
  background-color: transparent;
}
html[id*=ms i] span.facsViewerThumb:target span.imgContainer a {
  display: flex;
  justify-content: center;
}
html[id*=ms i] span.facsViewerThumb:target > span > span {
  padding: 0.5rem;
  font-family: var(--primary-serif);
  color: var(--primary-text-color);
  font-weight: 400;
}
html[id*=ms i] span.facsViewerThumb:target span.controls {
  z-index: 2000;
}
html[id*=ms i] span.facsViewerThumb:target span.closer {
  display: flex;
}
html[id*=ms i] span.facsViewerThumb:target span.closer a[onclick] {
  cursor: pointer;
}
html[id*=ms i] span.facsViewerThumb span.imgContainer {
  overflow: auto;
  transition-property: transform;
  transition-duration: 0.2s;
  width: 100%;
  flex-grow: 3;
  background-color: black;
  box-shadow: var(--shadow-lg);
}
html[id*=ms i] span.facsViewerThumb:target a.arrow {
  display: block;
}
html[id*=ms i] abbr:target {
  background-color: #ffff00;
}
html[id*=ms i] summary {
  cursor: pointer;
}
html[id*=ms i] details ul li {
  margin-top: 0.1em;
}
html[id*=ms i] div[data-type=interlinear],
html[id*=ms i] div[data-type=interlinear] p {
  display: block;
}
html[id*=ms i] div[data-type=interlinear] span {
  padding: 0.1em 0.25em;
}
html[id*=ms i] div[data-type=interlinear] span[data-el=s] > span[data-el=choice] {
  display: flex;
  flex-direction: column;
}
html[id*=ms i] div[data-type=interlinear] span[data-el=s] > span[data-el=choice] > span[data-type=orig] {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
}
html[id*=ms i] span[data-el=note] {
  display: block;
  padding: 0.25em;
  border: solid 1pt gray;
  text-indent: 0;
  margin-right: auto;
  max-width: 50%;
}
html[id*=ms i] span[data-el=note] span[data-el=p] {
  display: block;
}
html[id*=ms i] div[data-type=interlinear] span[data-el=s] > span[data-el=choice] > span[data-type=orig] > span[data-el=choice] {
  display: flex;
  flex-direction: column;
}
html[id*=ms i] div[data-type=cognate] {
  display: flex;
  flex-direction: column;
  align-items: center;
}
html[id*=ms i] div[data-type=cognate] table {
  min-width: 30em;
}
html[id*=ms i] table.cognate,
html[id*=ms i] table.cognate td,
html[id*=ms i] table.formTable,
html[id*=ms i] table.formTable td {
  border: solid 1pt #d0d0d0;
  border-collapse: collapse;
  padding: 0.25em;
}
html[id*=ms i] table.formTable {
  margin-left: auto;
  margin-right: auto;
}
html[id*=ms i] table.formTable td {
  vertical-align: top;
}
html[id*=ms i] span.focus,
html[id*=ms i] div.focus {
  background-color: #ffff00;
}
html[id*=ms i] table.cognate tr.def[lang=fr] td::before {
  content: "« ";
}
html[id*=ms i] table.cognate tr.def[lang=fr] td::after {
  content: " »";
}
html[id*=ms i] table.cognate tr.def[lang=en] td::before {
  content: "‘";
}
html[id*=ms i] table.cognate tr.def[lang=en] td::after {
  content: "’";
}
html[id*=ms i] ul[data-list-rend=numbered],
html[id*=ms i] ol[data-list-rend=numbered] {
  list-style-type: decimal;
}
html[id*=ms i] ul[data-list-rend=bulleted],
html[id*=ms i] ol[data-list-rend=bulleted] {
  list-style-type: disc;
}
html[id*=ms i] div[data-el=listBibl],
html[id*=ms i] div[data-el=bibl] {
  margin-top: 0.5em;
  margin-left: 2em;
  text-indent: -2em;
}
html[id*=ms i] div[data-el=listBibl] > div[data-el=bibl] {
  display: list-item;
  list-style-type: none;
  margin-left: 4em;
  text-indent: -4em;
}
html[id*=ms i] span.mjTitle {
  font-style: italic;
}
html[id*=ms i] div[id$=AbbrsTagged] table {
  border-collapse: collapse;
  border: solid 1pt gray;
  margin: 1em auto;
}
html[id*=ms i] div[id$=AbbrsTagged] table td {
  border: solid 1pt lightgray;
  padding: 0.25em;
}
html[id*=ms i] tr[data-role=label] td {
  text-align: center;
  background-color: lightgray;
  border: solid 1pt black;
  font-weight: bold;
}
html[id*=ms i] .del {
  text-decoration: line-through;
  text-decoration-style: wavy;
  text-decoration-thickness: 1pt;
  padding: 0 0.1em;
}
html[id*=ms i] div#keyboard {
  width: 100%;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
}
html[id*=ms i] div#keyboard button {
  font-size: 1.25rem;
  margin: 0.1em;
  min-height: 2.5rem;
  min-width: 2.5rem;
}
html[id*=ms i] section.twoScrollingColumns {
  display: grid;
  grid-template-columns: 40vw 40vw;
  column-gap: 1em;
  justify-content: center;
}
html[id*=ms i] section.twoScrollingColumns div:target {
  background-color: #ffffcc;
}
html[id*=ms i] details.errorReport {
  border: solid 1pt gray;
  padding: 0.25em;
}
html[id*=ms i] details.errorReport > summary {
  padding: 0.25em;
  background-color: silver;
  margin: -0.25em;
}
html[id*=ms i] .warning {
  background-color: #ffc0c0;
}
html[id*=ms i] body[class*=dtPrimarySource i] #main {
  width: 100%;
  max-width: 65rem;
  font-family: var(--primary-serif);
}
html[id*=ms i] #main ul {
  margin-inline-start: 0;
  margin-inline-end: 0;
  list-style-type: none;
}

#main .multiHyphDiv,
#main .hyphTable {
  margin-block-start: 1.5rem;
}

#main .multiHyphDiv,
#main .hyphTable {
  display: flex;
  flex-flow: row wrap;
  align-items: flex-start;
  justify-content: center;
  gap: 1rem;
}
#main .multiHyphDiv table,
#main .hyphTable table {
  margin-inline: 0;
}

#main details .hyphTable {
  justify-content: flex-start;
}

tbody > tr:first-of-type td > .wordInHyph {
  font-weight: 700;
  text-align: center;
}

thead > tr > td {
  text-align: center;
}

html[lang=fr] q {
  quotes: "« " " »";
}

html[lang=fr] q::before {
  content: open-quote;
}

html[lang=fr] q::after {
  content: close-quote;
}

/*Old styling retained just in case*/

/*# sourceMappingURL=dictionary.css.map */