html {
  box-sizing: border-box;
}

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

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

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[class],
ol[class] {
  padding: 0;
}

/* Remove default margin */
body,
h1,
h2,
h3,
h4,
p,
ul[class],
ol[class],
li,
figure,
figcaption,
blockquote,
dl,
dd {
  margin: 0;
}

/* Make images easier to work with */
img {
  display: block;
}

/* 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;
  }
}
@font-face {
  font-family: "ui-font";
  font-style: normal;
  src: url("../fonts/ui.woff2") format("woff2"), url("../fonts/ui.woff") format("woff");
}
@font-face {
  font-family: "Inter-V";
  font-weight: 1 900;
  font-style: normal;
  src: url("../fonts/Inter-RomanVar.woff2") format("woff2-variations");
  font-display: swap;
}
@font-face {
  font-family: "Inter-V";
  font-weight: 1 900;
  font-style: italic;
  src: url("../fonts/Inter-ItalicVar.woff2") format("woff2-variations");
  font-display: swap;
}
@font-face {
  font-family: "Inter ";
  font-weight: 300;
  font-style: normal;
  src: url("../fonts/Inter-Light.woff2") format("woff2"), url("../fonts/Inter-Light.woff") format("woff");
  font-display: swap;
}
@font-face {
  font-family: "Open Sans";
  font-weight: 300;
  font-style: normal;
  src: url("../fonts/OpenSans-Light.woff2") format("woff2"), url("../fonts/OpenSans-Light.woff") format("woff");
  font-display: swap;
}
@font-face {
  font-family: "Open Sans";
  font-weight: 300;
  font-style: italic;
  src: url("../fonts/OpenSans-LightItalic.woff2") format("woff2"), url("../fonts/OpenSans-LightItalic.woff") format("woff");
  font-display: swap;
}
@font-face {
  font-family: "Inter";
  font-weight: 400;
  font-style: normal;
  src: url("../fonts/Inter-Regular.woff2") format("woff2"), url("../fonts/Inter-Regular.woff") format("woff");
  font-display: swap;
}
@font-face {
  font-family: "Open Sans";
  font-weight: 400;
  font-style: normal;
  src: url("../fonts/OpenSans-Regular.woff2") format("woff2"), url("../fonts/OpenSans-Regular.woff") format("woff");
  font-display: swap;
}
@font-face {
  font-family: "Open Sans";
  font-weight: 400;
  font-style: normal;
  src: url("../fonts/OpenSans-Regular.woff2") format("woff2"), url("../fonts/OpenSans-Regular.woff") format("woff");
  font-display: swap;
}
@font-face {
  font-family: "Open Sans";
  font-weight: 400;
  font-style: italic;
  src: url("../fonts/OpenSans-Italic.woff2") format("woff2"), url("../fonts/OpenSans-Italic.woff") format("woff");
  font-display: swap;
}
@font-face {
  font-family: "Inter";
  font-weight: 500;
  font-style: normal;
  src: url("../fonts/Inter-SemiBold.woff2") format("woff2"), url("../fonts/Inter-SemiBold.woff") format("woff");
  font-display: swap;
}
@font-face {
  font-family: "Open Sans";
  font-weight: 500;
  font-style: normal;
  src: url("../fonts/OpenSans-SemiBold.woff2") format("woff2"), url("../fonts/OpenSans-SemiBold.woff") format("woff");
  font-display: swap;
}
@font-face {
  font-family: "Inter";
  font-weight: 600;
  font-style: normal;
  src: url("../fonts/Inter-Bold.woff2") format("woff2"), url("../fonts/Inter-Bold.woff") format("woff");
  font-display: swap;
}
/*
2.041em (32.65px)	
1.913em (30.60px)	
1.793em (28.68px)	
1.68em (26.88px)	
1.575em (25.19px)	
1.476em (23.61px)	
1.383em (22.13px)	
1.296em (20.74px)	
1.215em (19.44px)	
1.138em (18.22px)	
1.067em (17.07px)	
1em (16.00px)	
0.937em (15.00px)	
0.878em (14.05px)	
0.823em (13.17px)	
0.772em (12.34px)
*/
div#contentContainer div.typographyApplied {
  --headerFont: "Inter VF", "Inter", Verdana, Geneva, Tahoma, sans-serif;
  --bodyFont: "Open Sans", Verdana, Geneva, Tahoma, sans-serif;
  --bodyColor: #222222;
}

.typographyApplied h1, .typographyApplied h2, .typographyApplied h3, .typographyApplied h4, .typographyApplied h5, .typographyApplied h6 {
  font-family: var(--headerFont);
  color: var(--bodyColor);
  font-weight: 700;
}
.typographyApplied h1 {
  margin-top: 1.5rem;
  margin-bottom: 1rem;
  font-size: 1.383rem;
}
.typographyApplied h2 {
  margin-bottom: 0.25rem;
  font-size: 1.215rem;
}
.typographyApplied p, .typographyApplied ul, .typographyApplied li {
  font-family: var(--bodyFont);
  font-size: 1.067rem;
}
.typographyApplied p, .typographyApplied li {
  font-weight: 300;
}
.typographyApplied p, .typographyApplied ul, .typographyApplied figure {
  margin-bottom: 0.5rem;
}
.typographyApplied ul {
  margin-top: 0;
  padding-left: 2rem;
  margin-bottom: 1rem;
}
.typographyApplied li {
  margin-bottom: 0;
}
.typographyApplied p {
  margin-bottom: 1rem;
}
.typographyApplied a:link, .typographyApplied a:visited {
  color: var(--bodyColor);
  text-decoration: underline;
  font-weight: 300;
}
.typographyApplied a:hover {
  text-decoration: none;
}

:root {
  --pageMaxWidth: 72.25rem;
  --pageInterfaceWidth: 48rem;
  --pageReadingWidth: 35rem;
  --topNavHeightMobile: 60px;
  --leftOffset: 5rem;
  --rightOffset: 5rem;
  --bodyBgColor: #fcfcfc;
  --primarySans: "Inter-V", "Inter", arial, sans-serif;
  --headerColor: #333333;
  --paraColor: #333333;
  --centerColWidth: 72.25rem;
  --formWidth: 46rem;
  --formBorderColor: #979797;
  --placeholderColor: #6d6d6d;
  --highlightColor: #4a7084;
  --hoverColor: #789eaf;
  --linkUnderlineColor: #cccccc;
  --buttonBgColor: #4a7084;
  --buttonFontColor: #ffffff;
  --formLabelColor: #333333;
  --borderColorFilter: #dcdcdc;
  --tableBorderColor: #cacaca;
  --borderColor: #cacaca;
  --darkMetaColor: #e1e1e1;
  --lightMetaColor: #ffffff;
  --overlayColor: rgba(145, 145, 145, 0.84);
  --topNavHeight: 80px;
}

html {
  scroll-behavior: smooth;
  height: 100%;
}

body {
  background-color: var(--pageOutofBoundsColor);
  height: 100%;
}

div#pageContainer {
  width: 100%;
  display: flex;
  flex-flow: column;
  align-items: center;
  min-height: 100%;
  background-color: #fcfcfc;
}

*:target {
  padding-top: 100px;
  margin-top: -100px;
}

div#overlayTopNav[data-state=closed],
div#overlyLeftNav[data-state=closed],
div#overlayModal[data-state=closed] {
  position: fixed;
  width: 100%;
  height: 100%;
  height: 100vh;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  padding: 0;
  overflow-y: scroll;
  opacity: 0;
  visibility: hidden;
  transition-duration: 350ms;
  transition-property: opacity, visibility;
  background-color: rgba(191, 191, 191, 0.64);
}

div#overlayTopNav.closed {
  z-index: 5;
}

div#overlayLeftNav.closed {
  z-index: 3;
}

@supports (-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px)) {
  #overlayTopNav,
  #overlayLeftNav,
  #overlayModal {
    background-color: rgba(124, 43, 43, 0.65);
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
  }
}
div#overlayTopNav[data-state=open],
div#overlayLeftNav[data-state=open] {
  position: fixed;
  width: 100%;
  height: 100%;
  height: 100vh;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  padding: 0;
  overflow-y: scroll;
  transition-duration: 350ms;
  transition-property: opacity, visibility;
  background-color: var(--overlayColor);
  opacity: 1;
  visibility: visible;
  pointer-events: all;
  transition-timing-function: cubic-bezier(0.165, 0.84, 0.44, 1);
}
@media only screen and (min-width: 1024px) {
  div#overlayTopNav[data-state=open],
  div#overlayLeftNav[data-state=open] {
    display: none;
  }
}

div#overlayModal[data-state=open] {
  position: fixed;
  width: 100%;
  height: 100%;
  height: 100vh;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  padding: 0;
  overflow-y: scroll;
  transition-duration: 350ms;
  transition-property: opacity, visibility;
  background-color: var(--overlayColor);
  opacity: 1;
  visibility: visible;
  pointer-events: all;
  transition-timing-function: cubic-bezier(0.165, 0.84, 0.44, 1);
}

div#overlayTopNav[data-state=open] {
  z-index: 5;
}

div#overlayLeftNav[data-state=open] {
  z-index: 3;
}

div#overlayModal[data-state=open] {
  z-index: 7;
}

body.noScroll {
  overflow: hidden;
}

header#headerTopNav {
  background-color: #fff;
  border-bottom: solid 1px rgba(0, 0, 0, 0.1);
  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.05);
  position: sticky;
  top: 0;
  overflow: visible;
  z-index: 6;
  width: 100%;
  margin-bottom: 1.875rem;
  display: flex;
  padding: 0 15px;
}
@media only screen and (min-width: 1024px) {
  header#headerTopNav {
    height: 80px;
    padding: 0;
  }
}

header#main_header {
  display: flex;
  flex-direction: column;
  margin-bottom: 1rem;
  grid-row: 1/2;
  grid-column: 1/2;
}
@media only screen and (min-width: 768px) {
  header#main_header {
    padding: 0;
  }
}
@media only screen and (min-width: 1024px) {
  header#main_header {
    grid-column: 2/3;
    margin-bottom: 1rem;
  }
}

main.splash header#main_header {
  margin-bottom: 0;
}
@media only screen and (min-width: 768px) {
  main.splash header#main_header {
    margin-bottom: 1rem;
  }
}

nav#topNav {
  width: 100%;
  max-width: 71.25rem;
  margin-left: auto;
  margin-right: auto;
}
@media only screen and (min-width: 1024px) {
  nav#topNav {
    display: flex;
  }
}

article#centerCol {
  grid-column: 1/2;
}
@media only screen and (min-width: 1024px) {
  article#centerCol {
    grid-column: 2/3;
  }
}

div.searchContainerSplash {
  padding: 2rem 0.5rem 2rem;
  margin: 0 0 3rem 0;
  background-color: #f8f8f8;
  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.05);
  border: solid 1px rgba(0, 0, 0, 0.1);
}
@media only screen and (min-width: 1024px) {
  div.searchContainerSplash {
    padding: 2rem 0.5rem 2.5rem;
  }
}

div.searchContainerSplash > p.splashDescription {
  width: 100%;
  max-width: 36rem;
  margin: 0 auto 1.5rem;
  font-size: 0.8rem;
}
@media only screen and (min-width: 768px) {
  div.searchContainerSplash > p.splashDescription {
    font-size: 1.125rem;
  }
}

div#index_search {
  display: flex;
  flex-flow: row wrap;
  justify-content: center;
  position: relative;
  width: 100%;
  max-width: 36rem;
  margin-left: auto;
  margin-right: auto;
}

div#index_search > input {
  display: block;
  width: 100%;
  max-width: 36rem;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  border: 2px solid #d6d6d6;
  color: var(--placeholderColor);
  padding: 0.5rem 0.5rem;
  transition: all 0.2s ease-in-out;
  box-shadow: 0 0 0 rgba(0, 0, 0, 0);
  font-family: var(--primarySans);
  font-weight: 400;
  font-size: 0.9rem;
}
@media only screen and (min-width: 768px) {
  div#index_search > input {
    font-size: 1.1875rem;
  }
}

div#index_search > input:hover,
div#index_search > input:focus {
  box-shadow: 0 0 2px 0 rgba(0, 0, 0, 0.08), 0 2px 2px 0 rgba(0, 0, 0, 0.06), 0 1px 3px 0 rgba(0, 0, 0, 0.1);
  border: 2px solid var(--highlightColor);
}

div.advancedSearchLinkContainer {
  display: flex;
  flex-flow: row wrap;
  justify-content: left;
  position: relative;
  width: 100%;
  max-width: 36rem;
  margin: 0 auto 0;
}

div.advancedSearchLinkContainer > a:link,
div.advancedSearchLinkContainer > a:link {
  font-weight: 300;
  font-size: 0.7rem;
  padding-left: 0.2rem;
}
@media only screen and (min-width: 768px) {
  div.advancedSearchLinkContainer > a:link,
  div.advancedSearchLinkContainer > a:link {
    font-size: 0.8rem;
  }
}

div#index_documents {
  width: 100%;
  max-width: 36rem;
  margin-left: auto;
  margin-right: auto;
}

/*
div#index_documents::before {
    content: '';
    background-color: #333333;
    width: 250px;
    height: 1px;
    display: block;
    margin: 0 auto 2rem;
}
*/
p.splashDescription {
  text-align: center;
  font-family: var(--primarySans);
  font-weight: 300;
  color: var(--paraColor);
  font-size: 0.8rem;
  margin-bottom: 2rem;
  padding: 0 10px 0;
}
@media only screen and (min-width: 768px) {
  p.splashDescription {
    font-size: 1.125rem;
  }
}

div.collectionsLinkContainer {
  width: 100%;
  max-width: 36rem;
  margin: 0 auto 2rem;
  display: flex;
  justify-content: center;
}

div#text a:link.splashLink,
div#text a:visited.splashLink {
  display: inline-block;
  align-items: center;
  margin-left: auto;
  margin-right: auto;
  padding: 1rem 2rem;
  color: #ffffff;
  background-color: var(--highlightColor);
  border-radius: 0;
  border: 1px solid transparent;
  box-shadow: 0 0 0 rgba(0, 0, 0, 0);
  transition: all 0.2s ease-in-out;
  text-decoration: none;
  font-weight: 600;
}

div#text a:hover.splashLink {
  border: 1px solid transparent;
  background-color: transparent;
  color: var(--highlightColor);
  box-shadow: 0 0 2px 0 rgba(0, 0, 0, 0.08), 0 2px 2px 0 rgba(0, 0, 0, 0.06), 0 1px 3px 0 rgba(0, 0, 0, 0.1);
}

main.splash > article {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-flow: column nowrap;
}

button.topNavMobile {
  appearance: none;
  border: 0;
  background-color: transparent;
  transition: color 120ms cubic-bezier(0.455, 0.03, 0.515, 0.955);
  padding-left: 1rem;
  padding-right: 1rem;
  margin-left: -1rem;
  color: #262626;
  display: block;
  cursor: pointer;
  position: absolute;
  top: 18px;
  left: 15px;
}
@media only screen and (min-width: 1024px) {
  button.topNavMobile {
    display: none;
  }
}

span.lineContainer {
  display: block;
  width: 1.5rem;
  height: 1.5rem;
  position: relative;
}

.topNavTopBar,
.topNavBottomBar {
  display: block;
  width: 1.25rem;
  height: 0.125rem;
  border-radius: 9999px;
  background-color: currentColor;
  position: absolute;
  margin-left: auto;
  margin-right: auto;
  left: 0.125rem;
  transition: all 120ms cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.topNavTopBar {
  top: 0.4375rem;
}

.topNavBottomBar {
  bottom: 0.4375rem;
}

header[data-state=open] span.topNavTopBar {
  top: 0.6875rem;
  transform: rotate(45deg);
}

header[data-state=open] span.topNavBottomBar {
  bottom: 0.6875rem;
  transform: rotate(-45deg);
}

button.leftNavMobile {
  border: 0;
  padding: 0;
  margin: 0 1rem 0 0;
  background: none;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  position: absolute;
  top: 1rem;
  right: 0;
}
@media only screen and (min-width: 1024px) {
  button.leftNavMobile {
    display: none;
  }
}

button.leftNavMobile svg {
  width: 25px;
  height: 25px;
  fill: #333333;
}

div#topNavLogoContainer {
  width: 100%;
  flex: 0 1 auto;
  display: flex;
  flex-direction: row;
  min-height: 60px;
}
@media only screen and (min-width: 1024px) {
  div#topNavLogoContainer {
    width: auto;
  }
}

#topNavHeader {
  margin-left: auto;
  margin-right: auto;
}
@media only screen and (min-width: 1024px) {
  #topNavHeader {
    margin-left: 0;
    margin-right: 0;
  }
}

div#topNavHeader a {
  height: 100%;
  display: flex;
  align-items: center;
  padding-left: 1rem;
  padding-right: 1rem;
}

img#topNavLogo {
  width: 45px;
  height: auto;
}
@media only screen and (min-width: 1024px) {
  img#topNavLogo {
    width: 65px;
  }
}

div#navItemsWrapper {
  flex: 1;
  display: flex;
  flex-flow: row nowrap;
}

header[data-state=closed] div#menuHeader {
  flex: 1;
  display: none;
  flex-flow: column nowrap;
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
}
@media only screen and (min-width: 1024px) {
  header[data-state=closed] div#menuHeader {
    flex-flow: row nowrap;
    align-items: center;
    padding: 0;
    display: flex;
  }
}

header[data-state=open] div#menuHeader {
  display: flex;
  flex-flow: column nowrap;
  justify-content: center;
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
  flex: 1;
}

div#menuHeader > div[data-el=list] {
  flex-flow: column nowrap;
}
@media only screen and (min-width: 1024px) {
  div#menuHeader > div[data-el=list] {
    display: flex;
    flex-flow: row nowrap;
    justify-content: center;
  }
}

div#menuHeader div[data-el=item] {
  display: flex;
  border-top: 1px solid rgba(0, 0, 0, 0.1);
  height: 3rem;
}
@media only screen and (min-width: 1024px) {
  div#menuHeader div[data-el=item] {
    height: auto;
    border-top: 0;
  }
}

div#menuHeader a[data-el=ref] {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding-bottom: 0.125em;
  text-decoration: none;
  transition: color 120ms cubic-bezier(0.455, 0.03, 0.515, 0.955);
  -webkit-tap-highlight-color: transparent;
  color: rgba(0, 0, 0, 0.85);
  font-family: var(--primarySans);
  font-weight: 500;
  padding: 0;
  transition: all 0.3s ease-in-out;
  position: relative;
}
@media only screen and (min-width: 1024px) {
  div#menuHeader a[data-el=ref] {
    margin-left: 1rem;
    margin-right: 1rem;
    width: 100%;
  }
}

div#menuHeader a.current {
  color: var(--highlightColor);
  position: relative;
}

div#menuHeader a[data-el=ref]::after {
  position: absolute;
  content: "";
  width: 100%;
  height: 3px;
  background-color: transparent;
  bottom: -8px;
  left: 0;
  transition: all 0.3s ease-in-out;
  pointer-events: none;
}

div#menuHeader a[data-el=ref]:hover,
div#menuHeader button[data-el=ref]:hover {
  color: var(--highlightColor);
}

div#menuHeader a[data-el=ref]:hover::after,
div#menuHeader button[data-el=ref]:hover::after {
  position: absolute;
  content: "";
  width: 100%;
  height: 3px;
  background-color: var(--highlightColor);
  bottom: 5px;
  left: 0;
}
@media only screen and (min-width: 1024px) {
  div#menuHeader a[data-el=ref]:hover::after,
  div#menuHeader button[data-el=ref]:hover::after {
    bottom: -5px;
  }
}

div#menuHeader a[data-el=ref].current::after {
  position: absolute;
  content: "";
  width: 100%;
  height: 3px;
  background-color: var(--highlightColor);
  bottom: 5px;
  left: 0;
}
@media only screen and (min-width: 1024px) {
  div#menuHeader a[data-el=ref].current::after {
    bottom: -5px;
  }
}

div#menuHeader button[data-el=ref] {
  display: flex;
  width: 100%;
  justify-content: space-between;
  align-items: center;
  padding-bottom: 0.125em;
  text-decoration: none;
  transition: color 120ms cubic-bezier(0.455, 0.03, 0.515, 0.955);
  -webkit-tap-highlight-color: transparent;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  border: 0;
  margin: 0;
  padding: 0;
  border-radius: 0;
  line-height: normal;
  background-color: transparent;
  overflow: visible;
  color: rgba(0, 0, 0, 0.85);
  font-family: var(--primarySans);
  font-weight: 500;
  cursor: pointer;
}
@media only screen and (min-width: 1024px) {
  div#menuHeader button[data-el=ref] {
    padding-left: 1rem;
    padding-right: 1rem;
  }
}

svg#topNavCaret {
  justify-self: flex-end;
  margin-left: 0.25rem;
  transition-property: stroke, fill, transform;
  transition-duration: 120ms;
  transition-timing-function: cubic-bezier(0.455, 0.03, 0.515, 0.955);
  overflow: hidden;
  fill: currentColor;
}

div#menuHeader div[data-el=item].open svg#topNavCaret {
  fill: red;
}

div[data-el=item].open svg#topNavCaret {
  transform: rotate(180deg);
  fill: currentColor;
}

div#subNav {
  position: absolute;
  top: 100%;
  width: 100%;
  left: 0;
  right: 0;
  max-height: calc(100vh - 5rem);
  overflow-y: scroll;
  padding-left: 1.5rem;
  padding-right: 1.5rem;
  display: flex;
  flex-flow: column;
  align-items: center;
  opacity: 0;
  pointer-events: none;
  transform: translateY(-1rem);
  transition-duration: 120ms;
  transition-property: visibility, opacity, transform;
  transition-timing-function: cubic-bezier(0.455, 0.03, 0.515, 0.955);
  visibility: hidden;
  height: 200px;
}

div#subNav[data-state=open] {
  opacity: 1;
  pointer-events: auto;
  transform: translateY(0);
  visibility: visible;
  border-bottom: solid 1px rgba(0, 0, 0, 0.1);
  background-color: #fff;
}

div#subNav ul {
  margin-left: -1rem;
  margin-right: -1rem;
  max-width: 72.25rem;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  list-style: none;
}

div#subNav ul > li {
  width: 50%;
}

div.subNavItem {
  padding-top: 1rem;
  padding-bottom: 1rem;
  display: flex;
  align-items: center;
  line-height: 1.375;
}

div#main_header {
  width: 100%;
  max-width: var(--pageInterfaceWidth);
}

main {
  margin-bottom: 1rem;
}
@media only screen and (min-width: 768px) {
  main {
    margin-bottom: 2rem;
  }
}

main.multiCol {
  display: grid;
  width: 100%;
  max-width: var(--pageMaxWidth);
  grid-template-columns: auto;
  grid-template-rows: min-content;
  grid-column-gap: 2rem;
  padding: 0 15px;
  justify-content: center;
}
@media only screen and (min-width: 1024px) {
  main.multiCol {
    grid-template-columns: 275px auto;
    flex: 1 0 auto;
  }
}

main.loiBornDigitalSearch.multiCol {
  display: grid;
  width: 100%;
  max-width: var(--pageMaxWidth);
  grid-template-columns: auto;
  grid-template-rows: min-content;
  grid-column-gap: 2rem;
  padding: 0 15px;
  justify-content: initial;
  flex: 1 0 auto;
}
@media only screen and (min-width: 768px) {
  main.loiBornDigitalSearch.multiCol {
    padding: 0 30px 0 30px;
  }
}
@media only screen and (min-width: 1024px) {
  main.loiBornDigitalSearch.multiCol {
    grid-template-columns: 225px auto;
    flex: 1 0 auto;
  }
}

main.loiBornDigitalSearch.singleCol,
main.singleCol {
  grid-template-columns: auto;
  grid-auto-rows: min-content;
  justify-content: center;
  width: 100%;
  max-width: var(--pageMaxWidth);
  margin-bottom: 2rem;
  flex: 1 0 auto;
  padding: 0 15px;
}

nav#topNav,
main.singleCol {
  padding-left: 15px;
  padding-right: 15px;
}
@media only screen and (min-width: 768px) {
  nav#topNav,
  main.singleCol {
    padding-left: 30px;
    padding-right: 30px;
  }
}

main.splash {
  padding-left: 0;
  padding-right: 0;
}
@media only screen and (min-width: 768px) {
  main.splash {
    padding-left: var(--leftOffset);
    padding-right: var(--rightOffset);
  }
}

.singleCol #centerCol {
  width: 100%;
  max-width: var(--pageMaxWidth);
  margin: 0 auto;
}
@media only screen and (min-width: 768px) {
  .singleCol #centerCol {
    padding: 0;
  }
}

main.splash {
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  display: flex;
  flex-flow: column nowrap;
  justify-content: flex-start;
  flex: 1 0 auto;
}

main.splash.singleCol #centerCol {
  width: 100%;
}

main.splash #main_header {
  height: 100px;
  width: 100%;
  max-width: 100%;
  display: flex;
  flex-flow: row;
  align-items: center;
  justify-content: center;
  background-image: linear-gradient(135deg, #eeeeee 0%, #ffffff 48%, #eeeeee 100%);
  background-position: center;
  background-size: cover;
  flex: none;
  margin-top: -1.875rem;
}
@media only screen and (min-width: 375px) {
  main.splash #main_header {
    height: 160px;
  }
}
@media only screen and (min-width: 768px) {
  main.splash #main_header {
    height: 200px;
  }
}
@media only screen and (min-width: 1024px) {
  main.splash #main_header {
    height: 250px;
  }
}
@media only screen and (min-width: 1140px) {
  main.splash #main_header {
    height: 300px;
  }
}
@media only screen and (min-width: 768px) {
  main.splash #main_header {
    background: none;
  }
}

#splashLogo {
  width: 75px;
  height: auto;
}
@media only screen and (min-width: 375px) {
  #splashLogo {
    width: 125px;
  }
}
@media only screen and (min-width: 768px) {
  #splashLogo {
    width: 150px;
  }
}
@media only screen and (min-width: 1024px) {
  #splashLogo {
    width: 175px;
  }
}
@media only screen and (min-width: 1280px) {
  #splashLogo {
    width: 225px;
  }
}

#splashLeft,
#splashRight {
  display: none;
}
@media only screen and (min-width: 768px) {
  #splashLeft,
  #splashRight {
    display: block;
  }
}

#splashLeft {
  width: 275px;
  height: auto;
}
@media only screen and (min-width: 1024px) {
  #splashLeft {
    width: 350px;
  }
}
@media only screen and (min-width: 1140px) {
  #splashLeft {
    width: 400px;
  }
}

#splashRight {
  width: 275px;
  height: auto;
}
@media only screen and (min-width: 1024px) {
  #splashRight {
    width: 350px;
  }
}
@media only screen and (min-width: 1140px) {
  #splashRight {
    width: 400px;
  }
}

#leftCol[data-state=closed] {
  display: none;
}
@media only screen and (min-width: 1024px) {
  #leftCol[data-state=closed] {
    display: block;
  }
}

#leftCol[data-state=open] {
  display: block;
  position: fixed;
  top: var(--topNavHeightMobile);
  left: 0;
  z-index: 4;
  background-color: #fff;
  height: 100vh;
  width: 250px;
  padding: 0 15px;
  overflow: scroll;
  padding-top: 3rem;
  border-right: solid 1px rgba(0, 0, 0, 0.1);
  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.05);
}
@media only screen and (min-width: 1024px) {
  #leftCol[data-state=open] {
    display: block;
    position: static;
    top: initial;
    left: initial;
    background-color: var(--bodyBgColor);
    border-right: 0;
    box-shadow: none;
    height: auto;
  }
}

ul.breadcrumb {
  display: none;
}
@media only screen and (min-width: 768px) {
  ul.breadcrumb {
    list-style-type: none;
    display: flex;
    margin-bottom: 1rem;
    flex-flow: wrap row;
    justify-content: flex-start;
  }
}

ul.breadcrumb a:link,
ul.breadcrumb a:visited,
ul.breadcrumb li {
  text-decoration: none;
  font-family: var(--primarySans);
  font-style: italic;
  font-weight: 200;
  font-size: 0.7rem;
  color: #333333;
  margin: 0 0 0 0;
}

ul.breadcrumb a:hover {
  text-decoration: underline;
  color: var(--highlightColor);
}

ul.breadcrumb li:not(:first-child)::before {
  content: ">";
  margin: 0 0.15rem;
}

ul.breadcrumb li.current {
  font-weight: 400;
}

ul.breadcrumb li.current::before {
  font-weight: 200;
}

ul.breadcrumb + div#nextPrev {
  margin-top: 1rem;
}

div#nextPrev {
  display: flex;
  flex-flow: row;
  width: 100%;
  margin-bottom: 1rem;
}
@media only screen and (min-width: 1024px) {
  div#nextPrev {
    margin-bottom: 2rem;
  }
}

div.nextLink {
  margin-left: auto;
  flex-basis: 50%;
}

div.prevLink {
  margin-right: 0.5rem;
  flex-basis: 50%;
}
@media only screen and (min-width: 768px) {
  div.prevLink {
    margin-right: 1rem;
  }
}

div.nextLink > a:link,
div.nextLink > a:visited,
div.prevLink > a:link,
div.prevLink > a:visited {
  text-decoration: underline;
  text-decoration-color: var(--linkUnderlineColor);
  transition: all 0.2s ease-in-out;
  color: var(--highlightColor);
  font-family: var(--primarySans);
  text-decoration: none;
  font-size: 0.8rem;
  font-weight: 400;
  display: flex;
  align-items: center;
  background-color: #f0f0f0;
  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.05);
  border: solid 1px rgba(0, 0, 0, 0.1);
  padding: 0.5rem;
  height: 100%;
  transition: all 0.3s ease-in-out;
}

div.nextLink > a:hover,
div.prevLink > a:hover {
  text-decoration: underline;
  text-decoration-color: var(--hoverColor);
  background: #ffffff;
  box-shadow: 0 9px 12px 1px rgba(0, 0, 0, 0.08), 0 3px 16px 2px rgba(0, 0, 0, 0.06), 0 5px 6px 0 rgba(0, 0, 0, 0.1);
  text-decoration: none;
}

div.prevLink > a > svg {
  height: 10px;
  width: 10px;
  stroke: currentColor;
  margin-right: 0.25rem;
  transition: transform 0.2s ease-in-out;
  flex-shrink: 0;
}

div.nextLink > a > svg {
  height: 10px;
  width: 10px;
  stroke: currentColor;
  margin-left: 0.25rem;
  transition: transform 0.2s ease-in-out;
  flex-shrink: 0;
}

div.prevLink > a:hover > svg {
  transform: translateX(-3px);
}

div.nextLink > a:hover > svg {
  transform: translateX(3px);
}

.loiPrimarySourceProtestLetter [data-el=opener] [data-el=address],
.loiPrimarySourceProtestLetter [data-el=addrLine],
.loiPrimarySourceProtestLetter [data-el=salute],
.loiPrimarySourceProtestLetter [data-el=signed],
.loiPrimarySourceFishingVesselRequest [data-el=opener] [data-el=address],
.loiPrimarySourceFishingVesselRequest [data-el=addrLine],
.loiPrimarySourceFishingVesselRequest [data-el=salute],
.loiPrimarySourceFishingVesselRequest [data-el=signed] {
  display: block;
}
.loiPrimarySourceProtestLetter [data-el=argument],
.loiPrimarySourceFishingVesselRequest [data-el=argument] {
  width: 50%;
  text-align: center;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 0.75rem;
}
.loiPrimarySourceProtestLetter [data-el=argument] > [data-el=p],
.loiPrimarySourceFishingVesselRequest [data-el=argument] > [data-el=p] {
  border-bottom: 1px solid black;
  margin: 0 auto;
  width: fit-content;
  padding-bottom: 0.5em !important;
}
.loiPrimarySourceProtestLetter [data-el=closer] [data-el=salute],
.loiPrimarySourceFishingVesselRequest [data-el=closer] [data-el=salute] {
  margin-left: -1rem;
  text-align: right;
}
.loiPrimarySourceProtestLetter [data-el=closer] [data-el=signed],
.loiPrimarySourceFishingVesselRequest [data-el=closer] [data-el=signed] {
  text-align: right;
}

main.loiBornDigitalSearch h1 {
  margin-bottom: 0;
}

h1.searchTitle,
main[class*=loiCollection] h1,
main[class*=loiBornDigital] h1,
main[class*=loiData] h1 {
  font-family: var(--primarySans);
  font-size: 1.25rem;
  color: var(--headerColor);
  font-weight: 800;
  margin-bottom: 0;
}
@media only screen and (min-width: 768px) {
  h1.searchTitle,
  main[class*=loiCollection] h1,
  main[class*=loiBornDigital] h1,
  main[class*=loiData] h1 {
    font-size: 2.5rem;
  }
}

main[class*=loiPrimarySource] h1,
main.loiDatasetCustodianCaseFileName h1,
main.loiDatasetLegalCaseFile h1,
main.loiDatasetTitle h1,
main.loiDatasetLot h1,
main[class*=loiDatasetNames] h1,
main.loiDatasetOrg h1,
main.loiDatasetPlace h1,
main.loiBornDigital h1,
main.loiDatasetArchivalObject h1,
main.loiDatasetArchivalFonds h1,
main.loiDatasetArchivalSeries h1 {
  font-family: var(--primarySans);
  font-size: 1.25rem;
  color: var(--headerColor);
  font-weight: 800;
  margin-bottom: 0;
}
@media only screen and (min-width: 768px) {
  main[class*=loiPrimarySource] h1,
  main.loiDatasetCustodianCaseFileName h1,
  main.loiDatasetLegalCaseFile h1,
  main.loiDatasetTitle h1,
  main.loiDatasetLot h1,
  main[class*=loiDatasetNames] h1,
  main.loiDatasetOrg h1,
  main.loiDatasetPlace h1,
  main.loiBornDigital h1,
  main.loiDatasetArchivalObject h1,
  main.loiDatasetArchivalFonds h1,
  main.loiDatasetArchivalSeries h1 {
    font-size: 1.5rem;
  }
}

div.loiBornDigitalSearch > div[data-el=body] > div[data-el=div] > div[data-el=p] {
  font-family: var(--primarySans);
  font-size: 0.8rem;
  font-weight: 500;
  color: var(--paraColor);
  margin-bottom: 1.875rem;
}
@media only screen and (min-width: 768px) {
  div.loiBornDigitalSearch > div[data-el=body] > div[data-el=div] > div[data-el=p] {
    font-size: 1rem;
  }
}

.input-container {
  position: relative;
  display: inline-flex;
  width: 100%;
  max-width: var(--formWidth);
  margin-bottom: 0.5rem;
}

input#ssQuery {
  display: block;
  width: 100%;
  max-width: var(--formWidth);
  appearance: none;
  border: 1px solid var(--formBorderColor);
  color: var(--placeholderColor);
  padding: 0.5rem 0.5rem;
  transition: all 0.2s ease-in-out;
  box-shadow: 0 0 0 rgba(0, 0, 0, 0);
  font-family: var(--primarySans);
  font-weight: 400;
  font-size: 16px;
}
@media only screen and (min-width: 768px) {
  input#ssQuery {
    font-size: 1.1875rem;
  }
}

input#ssQuery::placeholder {
  font-family: var(--primarySans);
  font-weight: 300;
}

input#ssQuery:focus,
input#ssQuery:hover {
  box-shadow: 0 0 2px 0 rgba(0, 0, 0, 0.08), 0 2px 2px 0 rgba(0, 0, 0, 0.06), 0 1px 3px 0 rgba(0, 0, 0, 0.1);
  border: 1px solid var(--highlightColor);
  color: var(--paraColor);
}

.input-container__icon-search {
  fill: var(--highlightColor);
  opacity: 0.7;
  position: absolute;
  right: 0.5rem;
  top: 0;
  left: 0;
  bottom: 0;
  margin: auto 0.25rem auto auto;
  transition: all 0.2s ease-in-out;
  height: 24px;
  width: auto;
}

.search-field:hover + .input-container__icon-search,
.search-field:focus + .input-container__icon-search {
  fill: var(--highlightColor);
  opacity: 1;
}

div.buttonContainer {
  display: inline-flex;
  width: 100%;
  max-width: var(--formWidth);
  margin-bottom: 1rem;
}

.buttons {
  margin-left: initial;
  display: flex;
  justify-content: center;
  flex-flow: wrap;
  width: 100%;
}
@media only screen and (min-width: 768px) {
  .buttons {
    margin-left: auto;
    width: auto;
  }
}

.buttons button {
  margin: 0.25rem 0.25rem;
  display: inline-block;
}
@media only screen and (min-width: 768px) {
  .buttons button {
    margin: 0 0.25rem;
  }
}

.buttons button span {
  font-size: 0.9rem;
}
@media only screen and (min-width: 768px) {
  .buttons button span {
    font-size: 1rem;
  }
}

.form-button, .fil #ssPagination > button {
  appearance: none;
  margin: 0;
  border: none;
  text-decoration: none;
  border: none;
  background-color: var(--buttonBgColor);
  font-family: var(--primarySans);
  font-weight: 300;
  color: var(--buttonFontColor);
  cursor: pointer;
  display: inline-flex;
  padding: 0.5rem 1rem;
  transition: all 0.2s ease-in-out;
  border: 1px solid transparent;
}

.form-button:hover, .fil #ssPagination > button:hover,
.form-button:focus,
.fil #ssPagination > button:focus {
  background-color: #fff;
  color: var(--highlightColor);
  border: 1px solid var(--highlightColor);
}

.form-button__icon-refresh,
.form-button__icon-clear,
.form-button__icon-search {
  fill: currentColor;
  margin: auto 0.25rem auto auto;
  height: 14px;
  width: auto;
  transition: all 0.2s ease-in-out;
}

.form-button:hover > .form-button__icon-refresh, .fil #ssPagination > button:hover > .form-button__icon-refresh,
.form-button:hover > .form-button__icon-clear,
.fil #ssPagination > button:hover > .form-button__icon-clear,
.form-button:hover > .form-button__icon-search,
.fil #ssPagination > button:hover > .form-button__icon-search {
  fill: currentColor;
  transform: translateX(-5px);
}

.filters__filter-button {
  appearance: none;
  margin: 0;
  border: none;
  text-decoration: none;
  border: none;
  background-color: var(--buttonBgColor);
  font-family: var(--primarySans);
  font-weight: 300;
  color: var(--buttonFontColor);
  cursor: pointer;
  display: inline-flex;
  padding: 0.5rem 1rem;
  transition: all 0.2s ease-in-out;
  border: 1px solid transparent;
  margin-bottom: 1rem;
}

.filters__filter-button:hover {
  background-color: #fff;
  color: var(--highlightColor);
  border: 1px solid var(--highlightColor);
}

.filters__filter-button__icon-filter {
  fill: currentColor;
  margin: auto 0.25rem auto auto;
  height: 14px;
  width: auto;
  transition: all 0.2s ease-in-out;
}

.filters__filter-button:hover > .filters__filter-button__icon-filter {
  fill: currentColor;
  transform: translateX(-5px);
}

.fil #ssPagination {
  width: 100%;
  display: flex;
  justify-content: flex-end;
  gap: 1rem;
}
button#ssDoSearch2 {
  display: none;
}
@media only screen and (min-width: 1024px) {
  button#ssDoSearch2 {
    display: initial;
  }
}

button.showFilters {
  display: initial;
}
@media only screen and (min-width: 1024px) {
  button.showFilters {
    display: none;
  }
}

.filters__main-header {
  font-family: var(--primarySans);
  font-weight: 500;
  color: var(--headerColor);
  font-size: 1.2rem;
  margin-bottom: 0.5rem;
}

.filter-description {
  font-family: var(--primarySans);
  font-weight: 300;
  color: var(--formLabelColor);
  font-size: 1rem;
}

div#staticSearch_filters {
  margin-bottom: 75px;
}
@media only screen and (min-width: 1024px) {
  div#staticSearch_filters {
    margin-bottom: 0px;
  }
}

div#staticSearch_filters .leftNavToggler {
  display: block;
}
@media only screen and (min-width: 1024px) {
  div#staticSearch_filters .leftNavToggler {
    display: none;
  }
}

#staticSearch_filters fieldset.expandable.closed > div.content {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.3s cubic-bezier(0.45, 0.05, 0.55, 0.95), opacity 0.3s cubic-bezier(0.45, 0.05, 0.55, 0.95);
  opacity: 0;
  display: block;
}

#staticSearch_filters fieldset.expandable > div.content {
  max-height: 20vh;
  transition: max-height 0.3s cubic-bezier(0.45, 0.05, 0.55, 0.95);
  overflow: auto;
  animation: hide-scroll 0.3s backwards;
}

div.content > span:nth-of-type(1) {
  margin-top: 0.5rem;
}

div.ssBoolFilters div.content > span:nth-of-type(1) {
  margin-top: 0;
  padding: 0.5rem 0 0;
}

#staticSearch_filters fieldset {
  border: 0;
  padding: 0;
  margin: 0;
}

.fieldset-setting {
  border: 0;
  padding: 0;
  margin: 0;
}

.filterTypeahead {
  border: 1px solid var(--formBorderColor);
  margin-bottom: 1rem;
  margin-top: 0.5rem;
  padding: 0.25rem;
  font-family: var(--primarySans);
  font-weight: 300;
  color: var(--formLabelColor);
  font-size: 0.9rem;
  width: 90%;
}

#staticSearch_filters fieldset legend {
  font-family: var(--primarySans);
  font-weight: 400;
  color: var(--headerColor);
  font-size: 0.85rem;
  padding-top: calc(0.5rem + 1px);
  margin-bottom: 0;
  cursor: pointer;
  width: 100%;
}

#staticSearch_filters div[class^=ss] fieldset::after {
  content: "";
  display: block;
  width: 100%;
  height: 1px;
  background-color: var(--borderColor);
  margin-top: 0.5rem;
}

div.ssBoolFilters div.content span label {
  display: block;
  font-family: var(--primarySans);
  font-weight: 400;
  color: var(--formLabelColor);
  font-size: 0.9rem;
}

div.ssBoolFilters div.content span {
  width: calc(100% - 10px);
  margin-top: 0.25rem;
}

#staticSearch_filters fieldset.expandable > legend > span {
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
}

@media (hover: hover) and (pointer: fine) {
  #staticSearch_filters fieldset.expandable.closed > legend > span:hover > svg {
    transform: translateY(3px);
  }
}
#staticSearch_filters fieldset.expandable > legend > span > svg {
  width: 15px;
  height: auto;
  fill: var(--highlightColor);
  margin-left: auto;
  transform: rotate(180deg);
  transition: transform 0.2s ease-in-out;
}

#staticSearch_filters fieldset.expandable.closed > legend > span > svg {
  transform: rotate(0deg) translateX(0px);
}

div.ssDateFilters div.content span,
div.ssNumFilters div.content span {
  margin-bottom: 0.5rem;
  display: block;
  padding-left: 2px;
}

div.ssBoolFilters div.content span {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 0.6rem;
  align-items: center;
}

div.ssDateFilters div.content span label,
div.ssNumFilters div.content span label {
  display: block;
  font-family: var(--primarySans);
  font-weight: 400;
  color: var(--formLabelColor);
  font-size: 0.8rem;
}

div#staticSearch_filters select {
  appearance: none;
  display: block;
  font-family: var(--primarySans);
  font-size: 1rem;
  color: var(--formLabelColor);
  font-weight: 300;
  border: 1px solid var(--formBorderColor);
  padding: 0.25rem 0.5rem;
  background-image: url(../images/svg/icon-down-caret.svg);
  background-position: right 0.7em top 50%, 0 0;
  background-size: 12px auto;
  background-repeat: no-repeat;
  width: 100%;
  max-width: 5rem;
  font-size: 0.9rem;
  border-radius: 0;
  cursor: pointer;
  margin-left: auto;
}

div.ssDateFilters div.content span input,
div.ssNumFilters div.content span input {
  border: 1px solid var(--formBorderColor);
  background-color: #fff;
  font-family: var(--primarySans);
  font-weight: 300;
  font-size: 0.8rem;
  color: var(--formLabelColor);
  padding: 0.25rem;
}

.ssDescCheckboxList {
  list-style-type: none;
  margin: 0;
  padding: 0;
}

.ssDescCheckboxList > li {
  display: grid;
  grid-template-columns: min-content 1fr;
  gap: 0.6rem;
  align-items: center;
}

input[type=checkbox] + label {
  font-family: var(--primarySans);
  font-weight: 300;
  font-size: 0.8rem;
  color: var(--formLabelColor);
}

input[type=checkbox] + label:hover {
  cursor: pointer;
}

input[type=checkbox]:checked + label {
  font-weight: 500;
}

@supports (-webkit-appearance: none) {
  /*  Remove the default styling.
      `-webkit-appearance` is not an official CSS property 
  	& likely never will be. But it's also in 95% of browsers, 
  	non-webkit included, yes, as a `-webkit` property. 
  	Firefox, Edge, Chrome, Opera all implemented `-webkit-appearance`.  
  	Plus it *will* stick around. Browsers can't remove it. 
  	So use it like this...                                 */
  input[type=checkbox] {
    -webkit-appearance: none;
    /* Style the box. */
    width: 25px;
    height: 25px;
    border: 1px solid #979797;
    border-radius: 3px;
  }
  input[type=checkbox]:focus,
  input[type=checkbox]:hover {
    border: 1px solid var(--highlightColor);
    cursor: pointer;
  }
  input[type=checkbox]:checked {
    position: relative;
    background: none;
    border-color: var(--highlightColor);
  }
  input[type=checkbox]:checked::after {
    position: absolute;
    top: 6px;
    left: 5px;
    content: "";
    width: 14px;
    height: 7px;
    border: 2px solid var(--highlightColor);
    border-right: none;
    border-top: none;
    transform: rotate(-45deg);
  }
}
div#ssResults {
  margin-bottom: 4rem;
  scroll-padding-top: calc(var(--topNavHeightMobile) + 2rem);
}
@media only screen and (min-width: 768px) {
  div#ssResults {
    scroll-padding-top: calc(var(--topNavHeight) + 4rem);
  }
}

div#ssResults > p:first-of-type {
  font-family: var(--primarySans);
  font-weight: 600;
  font-size: 1.2rem;
  color: #6d6d6d;
  margin-bottom: 1rem;
}
@media only screen and (min-width: 768px) {
  div#ssResults > p:first-of-type {
    margin-bottom: 2rem;
  }
}

div#ssResults > ul {
  list-style-type: none;
  margin: 0 0;
  padding: 0 0;
}

div#ssResults > ul > li {
  margin-bottom: 2rem;
  display: flex;
  flex-flow: row nowrap;
}

div#ssResults > ul > li.ssPaginationEnd ~ li {
  display: none;
}

div#ssResults > ul > li > div.resultContainer {
  display: grid;
  grid-template-areas: "top" "result";
  gap: 5px;
  width: 100%;
}

div#ssResults > ul > li > div.resultContainer > div.resultContainerTop {
  grid-area: top;
}

div#ssResults > ul > li > div.resultContainer > div.resultContainerBody {
  grid-area: result;
}

div#ssResults > ul > li > div.resultContainer > div.resultContainerTop > a:link,
div#ssResults > ul > li > div.resultContainer > div.resultContainerTop > a:visited {
  font-family: var(--primarySans);
  font-size: 0.9rem;
  font-weight: 500;
}
@media only screen and (min-width: 768px) {
  div#ssResults > ul > li > div.resultContainer > div.resultContainerTop > a:link,
  div#ssResults > ul > li > div.resultContainer > div.resultContainerTop > a:visited {
    font-size: 1.125rem;
  }
}

div#ssResults > ul > li > div.resultContainer > div.resultContainerBody {
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
}

div#ssResults > ul > li > div.resultContainer > div.resultContainerTop > a + span {
  font-family: var(--primarySans);
  font-size: 0.625rem;
  font-weight: 300;
  display: block;
  color: #333333;
}

div#ssResults > ul > li > div.resultContainer > div.resultContainerTop > ul.resultContainerFilters {
  list-style-type: none;
  margin-left: 0;
  font-family: var(--primarySans);
  font-size: 0.75rem;
  font-weight: 300;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min-content, 25%));
  color: #333333;
  gap: 0.5rem;
  margin: 0.8rem 0;
  display: flex;
  flex-direction: column;
  padding: 0.2rem;
}
div#ssResults > ul > li > div.resultContainer > div.resultContainerTop > ul.resultContainerFilters > li[data-filter-type=bool][data-filter-values=false] {
  display: none;
}
div#ssResults > ul > li > div.resultContainer > div.resultContainerTop > ul.resultContainerFilters > li[data-filter-type=bool] .filterValue {
  display: none;
}
div#ssResults > ul > li > div.resultContainer > div.resultContainerTop > ul.resultContainerFilters > li .filterName {
  font-weight: 400;
}

div#ssResults > ul > li > div.resultContainer > div.resultContainerBody ul.kwic {
  list-style-type: none;
  margin: 0;
  padding: 0;
}

.resultImage {
  margin-right: 2rem;
}

.resultImage > img {
  width: 60px;
  height: auto;
}

div#ssResults > ul > li > div.resultContainer > div.resultContainerBody > ul.kwic > li {
  font-family: var(--primarySans);
  font-size: 0.8rem;
  font-weight: 400;
  color: #333333;
  padding: 0.5rem;
  margin-bottom: 0.5rem;
  background-color: #eaeaea;
  border-radius: 5px;
  display: block;
}
@media only screen and (min-width: 768px) {
  div#ssResults > ul > li > div.resultContainer > div.resultContainerBody > ul.kwic > li {
    font-size: 0.9rem;
  }
}

div#indexToc div[data-el=list] {
  display: grid;
  grid-template-columns: repeat(auto-fill, 2.5rem);
  list-style-type: none;
  gap: 5px;
  margin: 0 0 0 0;
  padding: 0;
}

main.loiCollectionCustodianCaseFiles div#indexToc div[data-el=list] + div[data-el=list] {
  display: grid;
  grid-template-columns: repeat(auto-fit, 8rem);
  list-style-type: none;
  gap: 5px;
  margin: 0 0 0.5rem 0;
}

main.loiBornDigitalSearch #indexToc div[data-el=list] {
  display: grid;
  grid-template-columns: 1fr 1fr;
}
@media only screen and (min-width: 768px) {
  main.loiBornDigitalSearch #indexToc div[data-el=list] {
    grid-template-columns: repeat(auto-fit, 14rem);
  }
  main.loiBornDigitalSearch #indexToc div[data-el=list] > [data-el=item] {
    text-align: center;
  }
}

div#indexToc div[data-el=item] {
  height: 2.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: #ebebeb;
  font-family: var(--primarySans);
  font-weight: 500;
  text-align: center;
}
@media only screen and (min-width: 768px) {
  div#indexToc div[data-el=item] {
    height: 2.5rem;
  }
}

div#indexToc div[data-el=item] > a {
  padding: 0 15px;
}

main.loiBornDigitalSearch div#indexToc div[data-el=list] div[data-el=item] {
  font-size: 0.8rem;
}

div#indexToc div[data-el=item] span.current {
  background-color: var(--highlightColor);
  color: #fff;
  font-family: var(--primarySans);
  font-weight: 500;
  display: block;
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}

main.loiBornDigitalSearch div#indexToc div[data-el=item] span.current {
  font-weight: 400;
}

div#indexToc div[data-el=item] a:link,
div#indexToc div[data-el=item] a:visited,
div#indexToc div[data-el=item].notAvailable > span,
div#indexToc div[data-el=item].nameSearch {
  width: 100%;
  height: 100%;
  font-family: var(--primarySans);
  font-weight: 500;
  text-decoration: none;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.2s ease-in-out;
}

div#indexToc div[data-el=item] a:link,
div#indexToc div[data-el=item] a:visited {
  font-weight: 400;
}

div#indexToc div[data-el=item] a:link,
div#indexToc div[data-el=item] a:visited {
  color: #333;
}

div#indexToc div[data-el=item].notAvailable > span {
  color: #ebebeb;
  background-color: #ffffff;
}

div#indexToc div[data-el=item] a:hover {
  background-color: var(--highlightColor);
  color: #fff;
}

div#indexToc div[data-el=head] {
  grid-column: 1/4;
  width: 100%;
  font-family: var(--primarySans);
  font-weight: 500;
  text-decoration: none;
  display: flex;
  transition: all 0.2s ease-in-out;
  height: 2.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
  display: none;
}

div#indexToc li.notAvailable {
  cursor: not-allowed;
}

h2.sr-only {
  font-family: var(--primarySans);
  font-weight: 500;
  color: var(--headerColor);
  margin-bottom: 0.5rem;
}

h3,
h4 {
  font-family: var(--primarySans);
  font-weight: 700;
  color: var(--headerColor);
  margin-bottom: 0.5rem;
}

main.loiDataVancouverStreets div#text div[data-el=body] > div[data-el=div] {
  padding: 10px;
  margin-bottom: 1rem;
}

main.loiDataVancouverStreets.loiBornDigitalAbout div#text div[data-el=body] > div[data-el=div],
main.loiDataVancouverStreets.loiBornDigitalIndex div#text div[data-el=body] > div[data-el=div] {
  padding: 0;
  margin-bottom: 0;
}

main.loiDataVancouverStreets div#text div[data-el=body] > div[data-el=div] > div[data-el=div] {
  margin-bottom: 1rem;
}

main.loiDataVancouverStreets div#text div[data-el=body] > div[data-el=div] > div[data-el=div]:last-child {
  margin-bottom: 0;
}

main.loiDataVancouverStreets div#text div[data-el=body] > div[data-el=div]:nth-of-type(even) {
  background-color: #f5f5f5;
}

main.loiDataVancouverStreets.loiBornDigitalAbout div#text div[data-el=body] > div[data-el=div]:nth-of-type(even),
main.loiDataVancouverStreets.loiBornDigitalIndex div#text div[data-el=body] > div[data-el=div]:nth-of-type(even) {
  background-color: initial;
}

main.loiDataVancouverStreets div#text div[data-el=body] h3 {
  font-size: 1.1rem;
}

main.loiDataVancouverStreets div#text h4 {
  font-weight: 500;
  font-size: 1.1rem;
}

main.loiDataVancouverStreets div#text div[data-el=div] > div[data-el^=list] {
  margin-left: 1.5rem;
}

main.loiDataVancouverStreets div#text div[data-el=div] > div[data-el^=list]:last-child {
  margin-bottom: 0;
}

main.loiDataVancouverStreets div#text div[data-el^=list] > div[data-el=item],
main.loiDataVancouverStreets div#text div[data-el^=list] > div[data-el=org],
main.loiDataVancouverStreets div#text div[data-el^=list] > div[data-el=person],
main.loiDataVancouverStreets div#text div[data-el^=list] > div[data-el=item],
main.loiDataVancouverStreets div#text div[data-el=body] table div[data-el^=list] div[data-el=note] {
  font-size: 0.9rem;
  font-weight: 400;
  display: list-item;
  list-style-position: outside;
  margin-bottom: 0.25rem;
  margin-left: 0.5rem;
}

main.loiDataVancouverStreets.loiBornDigitalAbout div#text div[data-el^=list] > div[data-el=item] {
  margin-left: 0;
}

div#text div[data-el=body] h3,
div#text div[data-el=body] h4 {
  margin-bottom: 0.1rem;
  font-size: 1rem;
}

div.tableContainer {
  margin-bottom: 2rem;
  max-width: 100%;
  overflow-x: scroll;
}
@media only screen and (min-width: 768px) {
  div.tableContainer {
    width: 100%;
    max-width: var(--pageMaxWidth);
  }
}

table {
  width: 100%;
  font-family: var(--primarySans);
  font-size: 0.9rem;
  font-weight: 400;
  border-collapse: collapse;
  table-layout: initial;
}
@media only screen and (min-width: 768px) {
  table {
    table-layout: fixed;
  }
}

th {
  padding: 0.5rem 0.5rem 0.5rem 0.5rem;
}

td {
  padding: 1rem 0.5rem 1rem 0.5rem;
}

th {
  font-weight: 600;
  color: var(--headerColor);
  border-bottom: 2px solid var(--tableBorderColor);
  text-align: left;
}

td[data-role=label] {
  font-weight: 600;
}

td {
  border-bottom: 1px dotted var(--tableBorderColor);
  border-right: 0px dotted var(--tableBorderColor);
}

main div#text table tr td div[data-el=p] {
  font-family: var(--primarySans);
  font-size: 0.9rem;
}

div#text div.tableContainer td div[data-el=list] {
  margin-left: 0;
}

td div[data-el=list] div[data-el=item] {
  font-size: 0.9rem;
  font-weight: 400;
}

td a:link,
td a:visited {
  color: var(--highlightColor);
  text-decoration: none;
}

td a:hover {
  text-decoration: underline;
}

td > div[data-el=p] {
  margin-bottom: 0.5rem;
}

[data-el=text] *[title] {
  border-bottom: 1px dashed #ccc;
  cursor: help;
}

div#additionalInfo {
  display: flex;
  flex-direction: column;
}

div#additionalInfo + div#indexToc {
  margin-top: 1rem;
}
@media only screen and (min-width: 768px) {
  div#additionalInfo + div#indexToc {
    margin-top: 1rem;
  }
}

main.loiBornDigitalAbout div#additionalInfo {
  justify-content: flex-start;
  margin: 0;
}

div#additionalInfo > ul + details.sensitivity {
  margin-top: 1rem;
  margin-bottom: 0;
  margin-left: initial;
  margin-right: initial;
  padding: 0.25rem;
  width: 300px;
  background-color: #fffee9;
}
@media only screen and (min-width: 768px) {
  div#additionalInfo > ul + details.sensitivity {
    width: 40rem;
  }
}

details.sensitivity > summary {
  font-size: 0.8rem;
  padding: 0.25rem;
  font-family: var(--primarySans);
  font-weight: 400;
}

details.sensitivity p,
details.sensitivity ul {
  font-weight: 300;
  font-size: 0.8rem;
  font-family: var(--primarySans);
  font-weight: 300;
}

details.sensitivity ul {
  margin-top: 0;
}

details.sensitivity p {
  padding: 0 1rem;
  margin-bottom: 0.5rem;
}

details.sensitivity ul li {
  margin-bottom: 0.25rem;
  padding: 0 1rem 0 0;
}

div#additionalInfo > ul {
  list-style-type: none;
  display: flex;
  margin: 0;
  padding: 0;
}

div#additionalInfo > ul > li {
  font-family: var(--primarySans);
  color: var(--paraColor);
  font-weight: 300;
  color: var(--paraColor);
  font-size: 0.7rem;
  border-right: 1px solid var(--borderColor);
  padding: 0 0.5rem;
}
@media only screen and (min-width: 768px) {
  div#additionalInfo > ul > li {
    font-size: 0.9rem;
  }
}

div#additionalInfo > ul > li:first-child {
  padding-left: 0;
}

div#additionalInfo > ul > li:last-child {
  border-right: 0;
  padding-right: 0;
}

div#additionalInfo > ul > li > a:link,
div#additionalInfo > ul > li > a:visited {
  font-family: var(--primarySans);
  font-weight: 300;
  font-size: 0.7rem;
  display: inline-block;
}
@media only screen and (min-width: 768px) {
  div#additionalInfo > ul > li > a:link,
  div#additionalInfo > ul > li > a:visited {
    font-size: 0.9rem;
  }
}

div#additionalInfo > ul > li > a:hover {
  text-decoration: underline;
}

.JS .sortable th {
  cursor: pointer;
  transition: all 0.2s ease-in-out;
}

.JS .sortable th:hover {
  color: var(--highlightColor);
}

.JS .sortable th::after {
  position: relative;
  top: -1px;
  left: 5px;
  content: "";
  background-image: url(../images/icon-table-sort.png);
  background-repeat: no-repeat;
  background-size: 10px 7px;
  display: inline-block;
  width: 10px;
  height: 7px;
  transition: all 0.4s ease-in-out;
  transform: rotate(0deg);
}

.JS th.down::after {
  border-bottom: none;
}

.JS th.down.selected::after {
  transform: rotate(180deg);
}

main[class^=loiPrimarySource] details {
  margin: 0 auto 1rem auto;
  background-color: #fcfcfc;
  border: 1px solid var(--borderColor);
  width: 100%;
  font-family: var(--primarySans);
  font-weight: 500;
  width: 100%;
  padding: 1rem;
}

main[class^=loiPrimarySource] details summary:focus {
  outline: none;
}

main[class^=loiPrimarySource] details[open] summary {
  margin-bottom: 0.5rem;
}

main[class^=loiPrimarySource] details[open] summary ~ * {
  animation: sweep 0.3s ease-in-out;
}

main[class^=loiPrimarySource] article#centerCol div#text details div[data-el=p] {
  font-size: 0.9rem;
  padding-left: 0;
}
@media only screen and (min-width: 768px) {
  main[class^=loiPrimarySource] article#centerCol div#text details div[data-el=p] {
    padding-left: 1rem;
  }
}

@keyframes sweep {
  0% {
    opacity: 0;
    margin-left: -1rem;
  }
  100% {
    opacity: 1;
    margin-left: 0rem;
  }
}
details > summary {
  cursor: pointer;
}

details > table {
  margin-bottom: 0.5rem;
}

details div[data-el=list] {
  margin-bottom: 0.5rem;
  margin-top: 0.5rem;
  margin-left: 0.9rem;
  list-style-type: circle;
}

details div[data-el=item] {
  margin-bottom: 0.25rem;
  display: list-item;
  list-style-position: inside;
  font-size: 0.9rem;
  text-indent: -1rem;
}
@media only screen and (min-width: 768px) {
  details div[data-el=item] {
    font-size: 1rem;
  }
}

details div[data-el=list] a:link,
details div[data-el=list] a:visited {
  font-weight: 300;
}

main.multiCol.loiPrimarySourceProtestLetter aside#leftCol,
main.multiCol.loiPrimarySourceFishingVesselRequest aside#leftCol,
main.loiPrimarySourceOralHistory aside#leftCol {
  grid-row: 2/3;
  grid-column: 1/2;
  display: flex;
  align-items: flex-start;
}
@media only screen and (min-width: 1024px) {
  main.multiCol.loiPrimarySourceProtestLetter aside#leftCol,
  main.multiCol.loiPrimarySourceFishingVesselRequest aside#leftCol,
  main.loiPrimarySourceOralHistory aside#leftCol {
    grid-row: 1/3;
  }
}

aside#leftCol {
  display: flex;
  flex-flow: column;
  align-items: center;
}
@media only screen and (min-width: 1024px) {
  aside#leftCol {
    grid-row: 1/3;
  }
}

@media only screen and (min-width: 1024px) {
  div#leftCol_container {
    margin-top: 0;
    margin-bottom: 1rem;
    position: sticky;
    top: calc(var(--topNavHeight) + 30px);
    width: 100%;
  }
}

div#media,
div[data-el=notesStmt] {
  display: inline-flex;
  align-items: center;
  flex-flow: column nowrap;
  background-color: #f0f0f0;
  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.05);
  border: solid 1px rgba(0, 0, 0, 0.1);
  padding: 15px;
  margin-top: 0;
  margin-bottom: 0.5rem;
  width: 100%;
}

div#media p {
  width: 100%;
  font-weight: 400;
  font-size: 0.9rem;
  margin-bottom: 0.5rem;
  font-family: var(--primarySans);
}
@media only screen and (min-width: 768px) {
  div#media p {
    font-size: 1rem;
  }
}

div#media h3,
div[data-el=notesStmt] h3 {
  font-family: var(--primarySans);
  font-weight: 700;
  font-size: 1rem;
  color: var(--headerColor);
  text-align: center;
  margin-bottom: 0.25rem;
}

div#media a:link,
div#media a:visited,
div[data-el=notesStmt] a:link,
div[data-el=notesStmt] a:visited {
  text-decoration: underline;
  text-decoration-color: var(--linkUnderlineColor);
  transition: all 0.2s ease-in-out;
  color: var(--highlightColor);
  font-family: var(--primarySans);
  text-align: center;
  font-size: 0.9rem;
  margin-bottom: 0.5rem;
}

div#media a:hover {
  text-decoration: underline;
  text-decoration-color: var(--hoverColor);
}

div#media audio {
  width: 250px;
  display: block;
  margin-left: auto;
  margin-right: auto;
}

div.mediaSize {
  margin-bottom: 0.5rem;
}

div.mapLink {
  font-family: var(--primarySans);
  font-weight: 400;
  color: var(--paraColor);
  font-size: 0.9rem;
}

div#media div.mapLink > a {
  text-align: left;
  display: block;
}

div#media img,
div[data-el=notesStmt] img {
  width: 100%;
  max-width: 200px;
  height: auto;
}

div#media img[src="images/icon-pdf.png"] {
  max-width: 75px;
  margin-left: auto;
  margin-right: auto;
}

div[data-el=notesStmt] img + div.mediaSize {
  margin-top: 0.25rem;
}

div.media404 {
  font-family: var(--primarySans);
  font-weight: 400;
  font-size: 0.8rem;
  color: var(--paraColor);
}

div.toc {
  position: initial;
  width: 225px;
  margin-bottom: 2rem;
  overflow-y: auto;
  max-height: 90vh;
  padding-bottom: 2rem;
  display: inline-flex;
  align-items: center;
  flex-flow: column nowrap;
  background-color: #f0f0f0;
  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.05);
  border: solid 1px rgba(0, 0, 0, 0.1);
  padding: 15px;
}
div.toc {
  max-height: 50vh;
  width: 100%;
}

div.toc div[data-el=list] div[data-el=item] {
  margin-bottom: 0.5rem;
  margin-left: 0;
  font-size: 0.8rem;
}

div.toc div[data-el=list]:first-of-type {
  padding-top: 0.5rem;
  width: 100%;
}

div.toc div.show {
  text-align: right;
}

div.toc a#maxBtn,
div.toc a#minBtn {
  font-weight: 500;
  font-style: normal;
  color: #fff;
  padding: 0.25rem;
  border-radius: 5px;
  background-color: var(--highlightColor);
  cursor: pointer;
  transition: all 0.3s ease-in-out;
}

div.toc a#maxBtn:hover,
div.toc a#minBtn:hover {
  text-decoration: none;
  background-color: #fff;
  color: var(--highlightColor);
}

div.toc h3 {
  font-family: var(--primarySans);
  font-weight: 700;
  font-size: 1rem;
  text-align: center;
}

div.toc div {
  font-family: var(--primarySans);
  font-weight: 300;
  font-size: 0.8rem;
  color: var(--paraColor);
}

div.toc a:link,
div.toc a:visited {
  text-decoration: underline;
  text-decoration-color: var(--linkUnderlineColor);
  transition: all 0.2s ease-in-out;
  color: var(--highlightColor);
  font-family: var(--primarySans);
}

div.toc a:hover {
  text-decoration: underline;
  text-decoration-color: var(--hoverColor);
}

div.toc .toc-hide {
  display: none;
}

div.toc .show > a {
  padding-left: 1rem;
}
div.toc .show > a:before {
  content: "Hide " attr(data-count);
}
div.toc .show > a.hidden:before {
  content: "Show " attr(data-count) " more";
}

.toc [data-el=item] > [data-el=list] > [data-el=item] {
  margin-left: 0.3rem;
}

div.loiPrimarySourceProtestLetter table {
  table-layout: auto;
}

section#media img {
  width: 150px;
  height: auto;
}

div#text {
  font-family: var(--primarySans);
  color: var(--paraColor);
  width: 100%;
  max-width: var(--pageMaxWidth);
  padding: 0;
}

div#text[class^=loiPrimarySource] {
  padding: 1rem;
  background-color: #ffffff;
  border: 1px solid #ebebeb;
  margin-bottom: 0.5rem;
  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.05);
  border: solid 1px rgba(0, 0, 0, 0.1);
  margin-bottom: 2rem;
}
@media only screen and (min-width: 768px) {
  div#text[class^=loiPrimarySource] {
    padding: 2rem;
  }
}

div#text.loiDatasetNamesS,
div#text.loiDataNames {
  margin-bottom: 3rem;
}

main.splash div#text {
  width: 100%;
  max-width: var(--pageMaxWidth);
}

h2[data-el=head] {
  margin-bottom: 0.5rem;
  font-weight: 600;
}

div[data-el=opener] {
  margin-bottom: 0.5rem;
}

/*div#text a:link,
div#tex a:visited {
    text-decoration: none;
    color: var(--highlightColor);
}*/
div[class^=loiPrimary] div[data-el=p],
div[class^=loiPrimary] div[data-el=u] {
  width: 100%;
  font-weight: 300;
  max-width: var(--pageReadingWidth);
  font-size: 0.9rem;
  margin-bottom: 0.5rem;
}
@media only screen and (min-width: 768px) {
  div[class^=loiPrimary] div[data-el=p],
  div[class^=loiPrimary] div[data-el=u] {
    font-size: 1rem;
  }
}

span.speaker {
  font-weight: 500;
}

span.startTime {
  font-family: var(--primarySans);
  font-weight: 300;
  color: var(--paraColor);
  font-size: 0.9rem;
  margin-bottom: 0.5rem;
}

span.startTime.link {
  cursor: pointer;
  text-decoration: underline;
  text-decoration-color: var(--linkUnderlineColor);
  transition: all 0.2s ease-in-out;
  color: var(--highlightColor);
  font-family: var(--primarySans);
}

span.endTime {
  display: none;
}

q:before, q:after {
  content: unset;
}

span[data-el=title][data-level=m] {
  font-style: italic;
}

/*  
 * JT: Handling for translated docs (only in 
 * oral_history_yama81_2018-03-19 at the moment,
 * but could be in others).
 */
.hasTranslations.original .translation {
  display: none;
}

.hasTranslations.translation .original {
  display: none;
}

span.clicker {
  cursor: pointer;
}

details.editorialNote {
  margin: 0 auto 0.5em auto;
  font-size: 0.8rem;
  background-color: #fcfcfc;
  border: 1px solid var(--borderColor);
  width: 100%;
  font-family: var(--primarySans);
  font-weight: 500;
  width: 100%;
  padding: 0.5em;
}
details.editorialNote > div {
  margin-top: 0.25em;
}
details.editorialNote * {
  font-weight: 400;
  font-size: 0.8rem;
}

main[class^=loiPrimarySource] [data-el=u] details.editorialNote {
  display: inline;
  position: relative;
  font-size: 0.8rem;
  width: unset;
  background: none;
  border: none;
  margin: 0;
  padding: 0;
}
main[class^=loiPrimarySource] [data-el=u] details.editorialNote > summary, main[class^=loiPrimarySource] [data-el=u] details.editorialNote[open] > summary {
  display: inline;
  margin: 0;
  font-size: 0.5rem;
  vertical-align: super;
}
main[class^=loiPrimarySource] [data-el=u] details.editorialNote > summary::-webkit-details-marker, main[class^=loiPrimarySource] [data-el=u] details.editorialNote[open] > summary::-webkit-details-marker {
  display: none;
}
main[class^=loiPrimarySource] [data-el=u] details.editorialNote > summary {
  opacity: 0.8;
}
main[class^=loiPrimarySource] [data-el=u] details.editorialNote:hover, main[class^=loiPrimarySource] [data-el=u] details.editorialNote > summary:hover {
  opacity: 1;
}
main[class^=loiPrimarySource] [data-el=u] details.editorialNote[open] > summary + div {
  display: block;
  position: absolute;
  top: auto;
  padding: 1rem;
  max-width: 10rem;
  z-index: 999;
  background-color: #fcfcfc;
  border: 1px solid var(--borderColor);
  font-family: var(--primarySans);
}

tr[data-n=ttl_doc_lots] {
  display: none !important;
}

tr[data-n=japaneseBuyers] {
  display: none !important;
}

tr[data-n=otherAsianBuyers] {
  display: none !important;
}

tr[data-n=otherBuyers] {
  display: none !important;
}

tr[data-n=institutionalBuyers] {
  display: none !important;
}

tr[data-n=someOwnersJapanese] {
  display: none !important;
}

tr[data-n=allOwnersJapanese] {
  display: none !important;
}

tr[data-n=someOwnersEastAsiaOther] {
  display: none !important;
}

tr[data-n=allOwnersEastAsiaOther] {
  display: none !important;
}

tr[data-n=someOwnersOther] {
  display: none !important;
}

tr[data-n=allOwnersOther] {
  display: none !important;
}

tr[data-n=hasHumanOwner] {
  display: none !important;
}

tr[data-n=hasInstitutionalOwner] {
  display: none !important;
}

tr[data-n=hasCustodianOwner] {
  display: none !important;
}

tr[data-n=hasVlaOwner] {
  display: none !important;
}

tr[data-n=japaneseSellers] {
  display: none !important;
}

tr[data-n=otherAsianSellers] {
  display: none !important;
}

tr[data-n=otherSellers] {
  display: none !important;
}

tr[data-n=institutionalSellers] {
  display: none !important;
}

tr[data-n=someSellersJapanese] {
  display: none !important;
}

tr[data-n=allSellersJapanese] {
  display: none !important;
}

tr[data-n=someSellersEastAsiaOther] {
  display: none !important;
}

tr[data-n=allSellersEastAsiaOther] {
  display: none !important;
}

tr[data-n=someSellersOther] {
  display: none !important;
}

tr[data-n=allSellersOther] {
  display: none !important;
}

tr[data-n=hasHumanSeller] {
  display: none !important;
}

tr[data-n=hasInstitutionalSeller] {
  display: none !important;
}

tr[data-n=hasCustodianSeller] {
  display: none !important;
}

tr[data-n=hasVlaSeller] {
  display: none !important;
}

/****************************************************** BOAT LEDGERS */
.loiPrimarySourceBoatLedger td {
  color: #000066;
}

.loiPrimarySourceBoatLedger div[data-el=note] {
  margin: 1rem;
}

.loiPrimarySourceBoatLedger table {
  width: 100%;
}

.loiPrimarySourceBoatLedger h3 {
  width: 100%;
}

.loiPrimarySourceBoatLedger [data-el=label] {
  font-weight: bold;
  color: var(--paraColor);
}

[data-type=notEncoded] {
  opacity: 0.8;
  font-weight: 200;
}

div#text div[data-el=opener],
div#text div[data-el=closer],
div#text div[data-el=list],
div#text div[data-el=note] {
  display: inline-block;
  width: 100%;
  font-weight: 300;
  max-width: var(--pageReadingWidth);
  font-size: 0.9rem;
}
@media only screen and (min-width: 768px) {
  div#text div[data-el=opener],
  div#text div[data-el=closer],
  div#text div[data-el=list],
  div#text div[data-el=note] {
    font-size: 1rem;
    padding: 0;
  }
}

div#text div[data-el=closer] + div[data-el=note] {
  margin-top: 0.5rem;
}

div#text span[data-el=salute] {
  margin-top: 0.5rem;
  display: block;
  width: 100%;
  font-weight: 300;
  max-width: var(--pageReadingWidth);
  font-size: 0.9rem;
}
@media only screen and (min-width: 768px) {
  div#text span[data-el=salute] {
    font-size: 1rem;
    padding: 0;
  }
}

article#centerCol div#text h2[data-el=head] {
  width: 100%;
  font-weight: 500;
  max-width: var(--pageReadingWidth);
  font-size: 1rem;
  text-align: center;
  margin-bottom: 0.25rem;
}

div#text div[data-el=list] {
  margin-bottom: 0.5rem;
  margin-left: 1rem;
  padding-right: 0.5rem;
}

div[data-el=item] {
  margin-bottom: 0.25rem;
}

@media only screen and (min-width: 1024px) {
  article#centerCol div#text div[data-el=p] {
    padding: 0;
  }
}

div#text a:link,
div#text a:visited {
  text-decoration: underline;
  text-decoration-color: var(--linkUnderlineColor);
  transition: all 0.2s ease-in-out;
  color: var(--highlightColor);
  font-family: var(--primarySans);
  word-break: break-word;
}

div#text a:hover {
  text-decoration: underline;
  text-decoration-color: var(--hoverColor);
}

div[id*=notes] {
  margin-bottom: 1rem;
}

div[id*=metadata],
div[id*=docsMentioned],
div[id*=sharedSurnames] {
  margin-bottom: 1rem;
  width: 100%;
  max-width: var(--pageReadingWidth);
  padding: 0;
}
@media only screen and (min-width: 768px) {
  div[id*=metadata],
  div[id*=docsMentioned],
  div[id*=sharedSurnames] {
    padding: 0;
  }
}

footer {
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: #f8f8f8;
  font-family: var(--primarySans);
  font-weight: 300;
  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.05);
  border-top: solid 1px rgba(0, 0, 0, 0.1);
  flex: none;
}

div#footerContent {
  width: 100%;
  max-width: var(--pageMaxWidth);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-flow: row wrap;
  padding: 0.5rem 0;
}

img#hcmc,
img#sshrc {
  padding: 1rem;
}

img#sshrc {
  width: 225px;
}

img#hcmc {
  width: 223px;
}

ul.buildData {
  display: flex;
  width: 100%;
  flex-direction: row;
  list-style-type: none;
  font-size: 0.6rem;
  justify-content: center;
  gap: 0.5rem;
  color: var(--paraColor);
  font-family: var(--primarySans);
  font-weight: 200;
}

div#popup {
  display: none;
}

div#popup.enabled {
  position: fixed;
  left: 0;
  right: 0;
  width: 96%;
  max-width: 40rem;
  display: initial;
  margin-top: 10%;
  max-height: 95%;
  overflow-x: visible;
  overflow-y: scroll;
  padding: 0em;
  background-color: #ffffff;
  margin-left: auto;
  margin-right: auto;
  z-index: 8;
  box-shadow: 0 0 12px 0 rgba(0, 0, 0, 0.06), 0 40px 64px -4px rgba(0, 0, 0, 0.1);
  border-radius: 5px;
}
@media only screen and (min-width: 768px) {
  div#popup.enabled {
    margin-top: 7rem;
  }
}
@media only screen and (min-width: 768px) {
  div#popup.enabled {
    max-height: 80%;
  }
}

div#popupCloser {
  display: flex;
  flex-flow: row nowrap;
  padding: 1rem 1rem 1rem 1rem;
  position: sticky;
  top: 0px;
  background-color: #f6f6f6;
  border-bottom: 1px solid #ccc;
  margin-bottom: 0.5rem;
  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.05);
}

button.popupCloser {
  appearance: none;
  background-color: transparent;
  border: 0;
  padding: 0;
  margin: 0 0 0 auto;
  cursor: pointer;
  color: var(--headerColor);
  display: flex;
  align-items: center;
}

button.popupCloser > svg {
  width: 22px;
  height: auto;
  fill: currentColor;
}

button.popupCloser:hover > svg {
  fill: var(--highlightColor);
}

div#popupContent {
  padding: 0 15px 15px 15px;
}
@media only screen and (min-width: 768px) {
  div#popupContent {
    padding: 0 2rem 2rem 2rem;
  }
}

div#popupContent h1,
div#popupContent h2,
div#popupContent h3,
div#popupContent h4,
div#popupContent h5 {
  margin: 0 0 0.5rem 0;
}

div#popupContent h2,
div#appendix {
  font-family: var(--primarySans);
  color: var(--headerColor);
  font-weight: 700;
  font-size: 1.36rem;
}
@media only screen and (min-width: 768px) {
  div#popupContent h2,
  div#appendix {
    font-size: 1.5rem;
  }
}

div#popupContent h3,
div#appendix {
  font-family: var(--primarySans);
  color: var(--headerColor);
  font-weight: 700;
  font-size: 1.2rem;
}

div#popupContent h4,
div#appendix {
  font-family: var(--primarySans);
  color: var(--headerColor);
  font-weight: 600;
  font-size: 1rem;
}

div#popupContent h5,
div#appendix {
  font-family: var(--primarySans);
  color: var(--headerColor);
  font-weight: 500;
  font-size: 1rem;
}

div#popupContent div[data-el=p],
div#popupContent div[data-el=item],
div#popupContent li {
  font-family: var(--primarySans);
  color: var(--paraColor);
  font-weight: 400;
  font-size: 0.8rem;
}
@media only screen and (min-width: 768px) {
  div#popupContent div[data-el=p],
  div#popupContent div[data-el=item],
  div#popupContent li {
    font-size: 0.9rem;
  }
}

div#popupContent a:link,
div#popupContent a:visited {
  text-decoration: none;
  color: var(--highlightColor);
}

div#popupContent a:hover {
  text-decoration: underline;
}

div[data-type=metadata] {
  padding: 0 1rem 1rem 1rem;
  border-radius: 5px;
}

div[data-type=metadata] div {
  padding: 1rem;
  border-radius: 5px;
  overflow-wrap: break-word;
}

div[data-type=metadata] div[data-el=p] {
  margin-bottom: 0.5rem;
}

div[data-type=metadata] > div {
  background-color: var(--darkMetaColor);
}

div[data-type=metadata] div:not([data-el=p]) {
  margin-bottom: 0.5rem;
}

div[data-type=metadata] > div > div {
  background-color: var(--lightMetaColor);
}

div[data-type=metadata] > div > div > div {
  background-color: var(--darkMetaColor);
}

div[data-type=metadata] > div > div > div > div {
  background-color: var(--lightMetaColor);
}

div[data-type=metadata] > div > div > div > div > div {
  background-color: var(--darkMetaColor);
}

div[data-type=metadata] span[data-el=label] {
  font-weight: 600;
}

div[data-type=metadata] > div[data-el=div] > div[data-el=list] > div[data-el=item] {
  font-family: var(--primarySans);
  font-weight: 400;
  font-size: 0.9rem;
}

.JS #appendix {
  display: none;
}

div#appendix {
  width: 100%;
  max-width: var(--pageReadingWidth);
  padding: 0 15px 0 15px;
}

div#appendix a:link,
div#appendix a:visited {
  text-decoration: none;
  color: var(--highlightColor);
}

div#appendix a:hover {
  text-decoration: underline;
}

article div#appendix div#metadata div h2 {
  font-family: var(--primarySans);
  font-weight: 800;
  font-size: 2rem;
  color: var(--headerColor);
}

div#additionalInfo a:link,
div#additionalInfo a:visited,
div#ssResults a:link,
div#ssResults a:visited,
div.advancedSearchLinkContainer a:link,
div.advancedSearchLinkContainer a:visited {
  text-decoration: underline;
  text-decoration-color: var(--linkUnderlineColor);
  transition: all 0.2s ease-in-out;
  color: var(--highlightColor);
  font-family: var(--primarySans);
}

div#additionalInfo a:hover,
div#ssResults a:hover,
div.advancedSearchLinkContainer a:hover {
  text-decoration: underline;
  text-decoration-color: var(--hoverColor);
}

/* 
 * JT CHANGED .loiCollection to .loiBornDigitalAbout
 * as all of the indexes need the same styling. (data,
 * collection, etc)
 * 
 */
main.singleCol.loiBornDigitalAbout h1 {
  margin-bottom: 0.25rem;
  line-height: 1.2;
}

div#text[class*=loiBornDigital] div[data-el=body] > div > div[data-el=p],
main.loiBornDigitalIndex div[data-el=p],
main.loiCollectionCustodianCaseFiles.loiBornDigitalAbout div[data-el=body] > div > div > div[data-el=p] {
  margin-bottom: 0.5rem;
  font-weight: 500;
  font-size: 0.9rem;
  width: 100%;
  max-width: 50rem;
}
@media only screen and (min-width: 768px) {
  div#text[class*=loiBornDigital] div[data-el=body] > div > div[data-el=p],
  main.loiBornDigitalIndex div[data-el=p],
  main.loiCollectionCustodianCaseFiles.loiBornDigitalAbout div[data-el=body] > div > div > div[data-el=p] {
    font-size: 1rem;
  }
}

main.loiCollectionCustodianCaseFiles div#text div[data-el=body] > div > div[data-el=p] {
  margin-bottom: 2rem;
}

main.loiCollection div#text.loiBornDigitalAbout div[data-el=list],
main.loiData div#text.loiBornDigitalAbout div[data-el=list] {
  display: grid;
  margin: 0;
  padding: 0;
  width: 100%;
  max-width: var(--pageMaxWidth);
  gap: 15px 15px;
}
@media only screen and (min-width: 768px) {
  main.loiCollection div#text.loiBornDigitalAbout div[data-el=list],
  main.loiData div#text.loiBornDigitalAbout div[data-el=list] {
    grid-template-columns: 300px 300px;
    gap: 30px 15px;
  }
}
@media only screen and (min-width: 1024px) {
  main.loiCollection div#text.loiBornDigitalAbout div[data-el=list],
  main.loiData div#text.loiBornDigitalAbout div[data-el=list] {
    grid-template-columns: 300px 300px 300px;
  }
}

main.loiCollection div[data-el=list] div[data-el=item],
main.loiData div[data-el=list] div[data-el=item] {
  width: 100%;
  height: 300px;
  background: #ffffff;
  box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.08), 0 10px 16px -4px rgba(0, 0, 0, 0.1);
  padding: 15px;
  display: flex;
  flex-flow: column nowrap;
  border-top: 5px solid #cecece;
}

main.loiCollection div[data-el=list] div[data-el=item] > div:first-of-type,
main.loiData div[data-el=list] div[data-el=item] > div:first-of-type {
  font-family: var(--primarySans);
  font-weight: 700;
  color: var(--headerColor);
  font-size: 1rem;
  margin-bottom: 1rem;
}

main.loiCollection div#text.loiBornDigitalAbout div[data-el=list] div[data-el=item] div[data-el=p],
main.loiData div#text.loiBornDigitalAbout div[data-el=list] div[data-el=item] div[data-el=p] {
  flex: 1 0 auto;
  font-size: 0.9rem;
  font-weight: 300;
}

main.loiCollection div#text.loiBornDigitalAbout div[data-el=list] div[data-el=item] div[data-el=p] a.readMore,
main.loiData div#text.loiBornDigitalAbout div[data-el=list] div[data-el=item] div[data-el=p] a.readMore {
  font-weight: 600;
  display: block;
  margin-top: 0.5rem;
}

div.loiBornDigitalAbout div[data-el=list] div[data-el=item] div:last-of-type {
  display: flex;
  flex-flow: row nowrap;
  justify-content: flex-end;
}

div#text.loiBornDigitalAbout div[data-el=list] div[data-el=item] div:last-of-type a:link,
div#text.loiBornDigitalAbout div[data-el=list] div[data-el=item] div:last-of-type a:visited {
  text-decoration: none;
  display: inline-block;
  margin: 0.5rem;
  padding: 0.5rem 1rem;
  background-color: #d8d8d9;
  color: #333333;
  font-weight: 400;
  transition: all 0.2s ease-in-out;
  font-size: 1rem;
}

div#text.loiBornDigitalAbout div[data-el=list] div[data-el=item] div:last-of-type a:hover {
  background-color: var(--highlightColor);
  color: #fff;
}

#ssSearching {
  display: none;
}

div#loadingDiv {
  display: none;
}

h2.sr-only {
  display: none;
}

div[data-el=listPerson] div[data-el=person],
div[data-el=listPerson] div[data-el=org] {
  margin-bottom: 0.75rem;
}

a.hi::before {
  content: "";
  padding-top: 100px;
  margin-top: -100px;
  display: block;
  position: absolute;
}

a.hi {
  background-color: yellow;
}

a.hi:target::before {
  content: "";
  display: block;
  height: 10rem;
  margin: -10rem 0 0;
}

main.loiBornDigitalAbout div#main_header + div#text div[data-el=p] {
  font-weight: 300;
  width: 100%;
  max-width: 70ch;
  margin-bottom: 1rem;
}

main.loiBornDigitalAbout div#main_header + div#text div[data-el=p]:first-of-type {
  border-top: 1px solid var(--borderColor);
  padding-top: 2rem;
  margin-top: 2rem;
}

main.loiBornDigitalAbout div#main_header + div#text div[data-el=p]:last-of-type {
  border-bottom: 1px solid var(--borderColor);
  padding-bottom: 2rem;
  margin-bottom: 2rem;
}

h1 + div#indexToc {
  margin-top: 1rem;
}

div.loiBornDigitalSearch > div[data-el=body] {
  width: 100%;
}

div.loiBornDigitalSearch > div[data-el=body] > div[data-el=div] div[data-el=p] {
  font-weight: 400;
  width: 100%;
  max-width: 70ch;
  margin-bottom: 1rem;
}

div#radishOptions {
  margin-bottom: 1rem;
}

div#radishOptions button#openAll,
div#radishOptions button#closeAll {
  appearance: none;
  margin: 0;
  border: none;
  text-decoration: none;
  border: none;
  background-color: var(--buttonBgColor);
  font-family: var(--primarySans);
  font-weight: 300;
  color: var(--buttonFontColor);
  cursor: pointer;
  display: inline-flex;
  padding: 0.5rem 1rem;
  transition: all 0.2s ease-in-out;
  border: 1px solid transparent;
}

div#radishOptions button#openAll {
  margin-right: 1rem;
}

div#radishOptions button#openAll:hover,
div#radishOptions button#openAll:focus,
div#radishOptions button#closeAll:hover,
div#radishOptions button#closeAll:focus {
  background-color: #fff;
  color: var(--highlightColor);
  border: 1px solid var(--highlightColor);
}

div#text div[data-type=fonds][data-el=list] {
  margin-left: 0;
}

#text.loiDatasetArchival div[data-el=item].open > .clicker > .closed {
  display: none;
}
#text.loiDatasetArchival div[data-el=item].closed > [data-el=list] {
  display: none;
}
#text.loiDatasetArchival div[data-el=item].closed > .clicker > .open {
  display: none;
}

main.loiBornDigital div[data-el=p],
main.loiBornDigitalAbout div[data-el=p] {
  margin-bottom: 0.5rem;
  font-weight: 400;
  width: 100%;
  max-width: var(--pageReadingWidth);
  font-size: 0.9rem;
}
@media only screen and (min-width: 768px) {
  main.loiBornDigital div[data-el=p],
  main.loiBornDigitalAbout div[data-el=p] {
    font-size: 1rem;
  }
}

main.loiBornDigital div[data-el=p]:last-of-type,
main.loiBornDigitalAbout div[data-el=p]:last-of-type {
  margin-bottom: 0;
}

div[data-el=body] div[data-el=div] div[data-el=p]:last-child {
  margin-bottom: 1.5rem;
}

div.loiDataNames > div[data-el=body] div[data-el=div] > div:first-of-type {
  margin-bottom: 2rem;
  font-weight: 500;
  width: 100%;
  max-width: 50rem;
}

main.loiCollectionCustodianCaseFiles #text > div > div:nth-child(2) > div[data-el=list],
main.loiCollectionOralHistories #text > div > div:nth-child(2) > div[data-el=list],
main.loiCollectionProtestLetters #text > div > div:nth-child(2) > div[data-el=list],
main.loiCollectionLegalCases #text > div > div:nth-child(2) > div[data-el=list],
main.loiCollectionLandTitles #text > div > div:nth-child(2) > div[data-el=list],
main.loiCollectionLandLots #text > div > div:nth-child(2) > div[data-el=list],
main.loiCollectionFishingBoatLedger #text > div > div:nth-child(2) > div[data-el=list],
main.loiCollectionFishingVesselRequestLetters #text > div > div:nth-child(2) > div[data-el=list],
main.loiCollectionDirectories #text > div > div:nth-child(2) > div[data-el=list],
main.loiCollectionArchivalFiles #text > div > div:nth-child(2) > div[data-el=list],
main.loiCollectionMiscellaneous #text > div > div:nth-child(2) > div[data-el=list],
main.loiDataNames #text > div > div:nth-child(2) > div[data-el=list],
main.loiDataOrganizations #text > div > div:nth-child(2) > div[data-el=list],
main.loiDataPlaces #text > div > div:nth-child(2) > div[data-el=list],
main.loiDataVancouverStreets #text > div > div:nth-child(2) > div[data-el=list],
main.loiDataTeam #text > div > div:nth-child(2) > div[data-el=list],
main.loiDataNames #text > div > div:nth-child(2) > div[data-el=list] {
  margin-left: 0;
  display: flex;
}

main.loiCollectionCustodianCaseFiles #text > div > div:nth-child(2) > div[data-el=list] div[data-el=item],
main.loiCollectionOralHistories #text > div > div:nth-child(2) > div[data-el=list] div[data-el=item],
main.loiCollectionProtestLetters #text > div > div:nth-child(2) > div[data-el=list] div[data-el=item],
main.loiCollectionLegalCases #text > div > div:nth-child(2) > div[data-el=list] div[data-el=item],
main.loiCollectionLandTitles #text > div > div:nth-child(2) > div[data-el=list] div[data-el=item],
main.loiCollectionLandLots #text > div > div:nth-child(2) > div[data-el=list] div[data-el=item],
main.loiCollectionFishingBoatLedger #text > div > div:nth-child(2) > div[data-el=list] div[data-el=item],
main.loiCollectionFishingVesselRequestLetters #text > div > div:nth-child(2) > div[data-el=list] div[data-el=item],
main.loiCollectionDirectories #text > div > div:nth-child(2) > div[data-el=list] div[data-el=item],
main.loiCollectionArchivalFiles #text > div > div:nth-child(2) > div[data-el=list] div[data-el=item],
main.loiCollectionMiscellaneous #text > div > div:nth-child(2) > div[data-el=list] div[data-el=item],
main.loiDataNames #text > div > div:nth-child(2) > div[data-el=list] div[data-el=item],
main.loiDataOrganizations #text > div > div:nth-child(2) > div[data-el=list] div[data-el=item],
main.loiDataPlaces #text > div > div:nth-child(2) > div[data-el=list] div[data-el=item],
main.loiDataVancouverStreets #text > div > div:nth-child(2) > div[data-el=list] div[data-el=item],
main.loiDataTeam #text > div > div:nth-child(2) > div[data-el=list] div[data-el=item],
main.loiDataNames #text > div > div:nth-child(2) > div[data-el=list] div[data-el=item] {
  display: flex;
  justify-content: center;
}

main.loiCollectionCustodianCaseFiles #text > div > div:nth-child(2) > div[data-el=list] div[data-el=item] a,
main.loiCollectionOralHistories #text > div > div:nth-child(2) > div[data-el=list] div[data-el=item] a,
main.loiCollectionProtestLetters #text > div > div:nth-child(2) > div[data-el=list] div[data-el=item] a,
main.loiCollectionLegalCases #text > div > div:nth-child(2) > div[data-el=list] div[data-el=item] a,
main.loiCollectionLandTitles #text > div > div:nth-child(2) > div[data-el=list] div[data-el=item] a,
main.loiCollectionLandLots #text > div > div:nth-child(2) > div[data-el=list] div[data-el=item] a,
main.loiCollectionFishingBoatLedger #text > div > div:nth-child(2) > div[data-el=list] div[data-el=item] a,
main.loiCollectionFishingVesselRequestLetters #text > div > div:nth-child(2) > div[data-el=list] div[data-el=item] a,
main.loiCollectionDirectories #text > div > div:nth-child(2) > div[data-el=list] div[data-el=item] a,
main.loiCollectionArchivalFiles #text > div > div:nth-child(2) > div[data-el=list] div[data-el=item] a,
main.loiCollectionMiscellaneous #text > div > div:nth-child(2) > div[data-el=list] div[data-el=item] a,
main.loiDataNames #text > div > div:nth-child(2) > div[data-el=list] div[data-el=item] a,
main.loiDataOrganizations #text > div > div:nth-child(2) > div[data-el=list] div[data-el=item] a,
main.loiDataPlaces #text > div > div:nth-child(2) > div[data-el=list] div[data-el=item] a,
main.loiDataVancouverStreets #text > div > div:nth-child(2) > div[data-el=list] div[data-el=item] a,
main.loiDataTeam #text > div > div:nth-child(2) > div[data-el=list] div[data-el=item] a,
main.loiDataNames #text > div > div:nth-child(2) > div[data-el=list] div[data-el=item] a {
  text-decoration: none;
  display: inline-block;
  margin: 0.5rem 0.5rem 0.5rem 0;
  padding: 0.5rem 1rem;
  background-color: #d8d8d9;
  color: #333333;
  font-weight: 400;
  transition: all 0.2s ease-in-out;
  font-size: 1rem;
}

main.loiCollectionCustodianCaseFiles #text > div > div:nth-child(2) > div[data-el=list] div[data-el=item] a:hover,
main.loiCollectionOralHistories #text > div > div:nth-child(2) > div[data-el=list] div[data-el=item] a:hover,
main.loiCollectionProtestLetters #text > div > div:nth-child(2) > div[data-el=list] div[data-el=item] a:hover,
main.loiCollectionLegalCases #text > div > div:nth-child(2) > div[data-el=list] div[data-el=item] a:hover,
main.loiCollectionLandTitles #text > div > div:nth-child(2) > div[data-el=list] div[data-el=item] a:hover,
main.loiCollectionLandLots #text > div > div:nth-child(2) > div[data-el=list] div[data-el=item] a:hover,
main.loiCollectionFishingBoatLedger #text > div > div:nth-child(2) > div[data-el=list] div[data-el=item] a:hover,
main.loiCollectionFishingVesselRequestLetters #text > div > div:nth-child(2) > div[data-el=list] div[data-el=item] a:hover,
main.loiCollectionDirectories #text > div > div:nth-child(2) > div[data-el=list] div[data-el=item] a:hover,
main.loiCollectionArchivalFiles #text > div > div:nth-child(2) > div[data-el=list] div[data-el=item] a:hover,
main.loiCollectionMiscellaneous #text > div > div:nth-child(2) > div[data-el=list] div[data-el=item] a:hover,
main.loiDataNames #text > div > div:nth-child(2) > div[data-el=list] div[data-el=item] a:hover,
main.loiDataOrganizations #text > div > div:nth-child(2) > div[data-el=list] div[data-el=item] a:hover,
main.loiDataPlaces #text > div > div:nth-child(2) > div[data-el=list] div[data-el=item] a:hover,
main.loiDataVancouverStreets #text > div > div:nth-child(2) > div[data-el=list] div[data-el=item] a:hover,
main.loiDataTeam #text > div > div:nth-child(2) > div[data-el=list] div[data-el=item] a:hover,
main.loiDataNames #text > div > div:nth-child(2) > div[data-el=list] div[data-el=item] a:hover {
  background-color: var(--highlightColor);
  color: #fff;
}

main.loiAbout #text div > div[data-el=list]:first-of-type {
  margin-left: 0;
  font-size: 1rem;
  margin-top: 1rem;
  display: flex;
  flex-flow: column;
}
@media only screen and (min-width: 768px) {
  main.loiAbout #text div > div[data-el=list]:first-of-type {
    font-size: 1.2rem;
  }
}

main.loiAbout #text div > div[data-el=list]:first-of-type div[data-el=item] {
  display: list-item;
  list-style-position: inside;
  font-weight: 500;
}

main.loiAbout #text div > div[data-el=list]:first-of-type > div[data-ref=about] {
  order: 1;
}

main.loiAbout #text div > div[data-el=list]:first-of-type > div[data-ref=how_to_search] {
  order: 2;
}

main.loiAbout #text div > div[data-el=list]:first-of-type > div[data-ref=how_to_cite] {
  order: 3;
}

main.loiAbout #text div > div[data-el=list]:first-of-type > div[data-ref=terms_of_use] {
  order: 4;
}

main.loiAbout #text div > div[data-el=list]:first-of-type > div[data-ref=privacy] {
  order: 5;
}

main.loiAbout #text div > div[data-el=list]:first-of-type > div[data-ref=terminology] {
  order: 6;
}

main.loiAbout #text div > div[data-el=list]:first-of-type > div[data-ref=statistics] {
  order: 7;
}

main.loiAbout #text div > div[data-el=list]:first-of-type > div[data-ref=chars] {
  order: 8;
}

main.loiAbout #text div > div[data-el=list]:first-of-type > div[data-ref=contact] {
  order: 9;
}

div#cub_cr_objects div[data-el=list]:first-of-type,
main[class^=loiDatasetArchival] div#text div.object-list {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
  gap: 10px;
  margin-left: 0;
  padding-right: 0;
  max-width: initial;
}

div#cub_cr_objects div[data-el=list] div[data-el=item],
main[class^=loiDatasetArchival] div#text div.object-list div[data-el=item] {
  display: contents;
}

div#cub_cr_objects div[data-el=list] div[data-el=item] h4,
main[class^=loiDatasetArchival] div#text div.object-list div[data-el=item] h4 {
  text-align: left;
  font-size: 0.9rem;
  font-weight: 400;
}

div#cub_cr_objects div[data-el=list] div[data-el=item] a:link,
main[class^=loiDatasetArchival] div#text div.object-list div[data-el=item] a:link {
  background-color: #f0f0f0;
  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.05);
  border: solid 1px rgba(0, 0, 0, 0.1);
  padding: 10px 10px 15px 10px;
  margin-top: 0;
  margin-bottom: 0.5rem;
  width: 100%;
  display: flex;
  flex-flow: column nowrap;
  align-items: center;
  justify-content: center;
  height: 100%;
  color: var(--highlightColor);
  font-family: var(--primarySans);
  text-align: center;
  font-size: 0.8rem;
  min-height: 150px;
  transition: all 0.2s ease-in-out;
  word-break: break-word;
}

div#cub_cr_objects div[data-el=list] div[data-el=item] a:hover,
main[class^=loiDatasetArchival] div#text div.object-list div[data-el=item] a:hover {
  background: #ffffff;
  box-shadow: 0 9px 12px 1px rgba(0, 0, 0, 0.08), 0 3px 16px 2px rgba(0, 0, 0, 0.06), 0 5px 6px 0 rgba(0, 0, 0, 0.1);
}

div#cub_cr_objects div[data-el=list] img.loaded,
main[class^=loiDatasetArchival] div#text div.object-list img {
  width: 75px;
  height: auto;
  margin-top: auto;
}

span.clicker span.open,
span.clicker span.closed {
  padding: 0.1rem 0.25rem 0.1rem 0.25rem;
  cursor: pointer;
}

main.loiDatasetArchival div#text[data-el=text] div[data-el=body] > div[data-el=p] {
  margin-bottom: 1rem;
  font-style: italic;
}

main.loiDatasetArchival div#text[data-el=text] div[data-el=body] div[data-el=list] {
  margin-bottom: 0;
}

main.loiDatasetArchival div#text div[data-el=list] {
  display: block;
}

main.loiDatasetArchival div#text[data-el=text] div[data-el=body] div[data-el=list] div[data-el=item] {
  margin-bottom: 0;
}

main.loiDatasetArchival div#text[data-el=text] div[data-el=body] div[data-el=list][data-type=fonds] div[data-el=item] div[data-el=list][data-type=file] div[data-el=item]:last-of-type {
  margin-bottom: 0;
}

main.loiDatasetArchival div#text[data-el=text] div[data-el=body] div[data-el=list][data-type=fonds] > div[data-el=item] {
  margin-bottom: 0.5rem;
}

main.loiDatasetArchival div#text[data-el=text] div[data-el=body] div[data-el=list][data-type=fonds] div[data-el=item] div[data-el=list][data-type=series]:nth-child(3) {
  margin-top: 0.5rem;
}

main.loiDatasetArchival div#text div[data-el=body] div[data-type=fonds] > div[data-el=item] > div[data-type=series] > div[data-el=item] {
  margin-bottom: 0.5rem;
  font-size: 0.9rem;
  font-weight: 500;
}

main.loiDatasetArchival div#text div[data-el=body] div[data-type=fonds] > div[data-el=item] > div[data-type=series] > div[data-el=item] > div[data-type=sub-series] > div[data-el=item] {
  margin-bottom: 0.5rem;
}

main.loiDatasetArchival div#text div[data-el=body] div[data-type=fonds] > div[data-el=item] > div[data-type=series] > div[data-el=item] > div[data-type=file] > div[data-el=item] > div[data-type=item] > div[data-el=item] {
  font-size: 0.85rem;
}

main.loiDatasetArchival div#text div[data-el=body] div[data-type=fonds] > div[data-el=item] > div[data-type=series] > div[data-el=item] > div[data-type=file] > div[data-el=item] > div[data-type=item] > div[data-el=item] > a {
  font-style: italic;
}

main.loiDatasetArchival div#text div[data-el=body] div[data-type=fonds] > div[data-el=item] > div[data-type=series] > div[data-el=item] > div[data-type=sub-series] > div[data-el=item] > div[data-type=file] > div[data-el=item] > div[data-type=item] > div[data-el=item] {
  font-size: 0.85rem;
}

main.loiDatasetArchival div#text div[data-el=body] div[data-type=fonds] > div[data-el=item] > div[data-type=series] > div[data-el=item] > div[data-type=sub-series] > div[data-el=item] > div[data-type=file] > div[data-el=item] > div[data-type=item] > div[data-el=item] > a {
  font-style: italic;
}

main.loiDatasetArchival div#text div[data-el=body] div[data-type=fonds] > div[data-el=item] > div[data-type=series] > div[data-el=item] > div[data-type=file] > div[data-el=item] {
  margin-bottom: 0.15rem;
}

main.loiDatasetArchival div#text div[data-el=body] div[data-type=fonds] > div[data-el=item] > div[data-type=series] > div[data-el=item] > div[data-type=sub-series] > div[data-el=item] > div[data-type=item] > div[data-el=item] > a {
  font-style: italic;
}

main.loiDatasetArchival div#text div[data-el=body] div[data-type=fonds] > div[data-el=item] > div[data-type=series] > div[data-el=item] > div[data-type=item] > div[data-el=item] {
  font-size: 0.85rem;
}

main.loiDatasetArchival div#text[data-el=text] div[data-el=body] div[data-el=list][data-type=fonds] div[data-el=item] div[data-el=list][data-type=sub-series]:nth-child(3) {
  margin-top: 0.25rem;
}

main.loiDatasetArchival div#text[data-el=text] div[data-el=body] div[data-type=file][data-el=list] div[data-el=item] div[data-el=list][data-type=item] {
  margin-bottom: 0.25rem;
}

main.loiDatasetArchival div[data-el=list][data-type=fonds] div[data-el=item] div[data-el=list][data-type=file] div[data-el=item],
main.loiDatasetArchival div[data-el=list][data-type=fonds] div[data-el=item] div[data-el=list][data-type=item] div[data-el=item] {
  margin-bottom: 0;
}

main.loiDatasetArchival div#text div[data-el=body] div[data-el=list][data-type=fonds] {
  width: 100%;
  max-width: var(--pageInterfaceWidth);
  font-size: 0.9rem;
}
@media only screen and (min-width: 768px) {
  main.loiDatasetArchival div#text div[data-el=body] div[data-el=list][data-type=fonds] {
    font-size: 1.1rem;
  }
}

main.loiDatasetArchival div[data-el=text] div[data-el=body] > div[data-el=list][data-type=fonds] > div[data-el=item] {
  background-color: #f8f8f8;
  border: 1px solid var(--borderColor);
  padding: 0.5rem;
  font-weight: 400;
}

main.loiDatasetArchival div#text div[data-el=body] div[data-type=series] {
  max-width: 95%;
}

main.loiDatasetArchival div#text div[data-el=body] div[data-type=sub-series] {
  max-width: 96%;
}

main.loiDatasetArchival div#text div[data-el=body] div[data-type=file] {
  max-width: 96%;
}

main.loiDatasetArchival div#text div[data-type=series] > div[data-el=item] {
  font-size: 0.8rem;
  background-color: #ebebeb;
  padding: 0.5rem;
  font-weight: 400;
}
@media only screen and (min-width: 768px) {
  main.loiDatasetArchival div#text div[data-type=series] > div[data-el=item] {
    font-size: 1rem;
  }
}

main.loiDatasetArchival div#text div[data-type=sub-series] > div[data-el=item] {
  padding-right: 0.5rem;
}

main.loiDatasetArchival div[data-type=item] div[data-el=item],
main.loiDatasetArchival div[data-type=series] div[data-type=item] div[data-el=item] {
  font-weight: 300;
}

main.loiDatasetArchival div#text div[data-el=body] div[data-type=fonds] > div[data-el=item] > div[data-el=list][data-type=item] > div[data-el=item] {
  font-weight: 300;
  margin-bottom: 0.5rem;
  font-size: 0.85rem;
  font-style: normal;
}

main.loiDatasetArchival div#text div[data-el=body] div[data-type=fonds] > div[data-el=item] > div[data-el=list][data-type=item] {
  margin-top: 0.5rem;
}

main.loiDatasetArchival div#text div[data-el=body] div[data-type=fonds] > div[data-el=item] > div[data-el=list][data-type=item] > div[data-el=item] a {
  font-style: italic;
}

main.loiDatasetArchival div#text div[data-el=body] div[data-type=fonds] > div[data-el=item] div[data-type=series] div[data-el=list] div[data-el=item] div[data-el=list][data-type=file] div[data-el=item] div[data-el=list][data-type=item] div[data-el=item] {
  margin-bottom: 0;
}

main.loiDatasetArchival div[data-type=file] > div[data-el=item] {
  word-break: break-word;
  font-size: 0.85rem;
  width: 100%;
  max-width: initial;
  font-style: normal;
  display: list-item;
  list-style-type: none;
}

main.loiDatasetArchival div[data-type=file] > div[data-el=item] > a {
  font-style: italic;
}

div[data-type=sub-series] div[data-el=item] {
  font-size: 0.85rem;
  font-weight: 400;
}

div[data-type=file] div[data-el=item] {
  font-weight: 300;
}

div.loiBornDigitalAbout > div[data-el=body] > div {
  display: flex;
  flex-flow: column;
  margin-bottom: 1rem;
}

.hide,
div.loiBornDigitalAbout > div[data-el=body] > div > div[data-el=p]:not(:first-of-type),
.show:target {
  display: none;
}

.show:target + .hide,
div.loiBornDigitalAbout > div[data-el=body] > div .show:target ~ div[data-el=p],
.show:target ~ * {
  display: block;
}

a.show,
a.hide {
  margin-bottom: 0.5rem;
  order: 10;
  font-weight: 600;
}

div#text.loiDataPlaces div[data-el=div] > details:last-child,
div#text.loiDataOrganizations div[data-el=div] > details:last-child {
  margin-bottom: 1rem;
}

div#ssSearching {
  font-weight: 600;
}

div#text.loiBornDigitalAbout a {
  word-break: break-word;
}

main div[id*=surrogates] a::before {
  display: inline-block;
  content: " ";
  background-image: url("../images/archive-icon.svg");
  background-size: 28px 28px;
  height: 28px;
  width: 28px;
  position: relative;
  top: 6px;
  left: -5px;
}

[data-el=unclear],
[data-el=incident],
[data-el=gap]:not(.redaction) {
  opacity: 0.7;
  font-style: italic;
}

[data-el=unclear]::before,
[data-el=supplied]::before,
[data-el=incident]::before {
  content: "[";
}

[data-el=unclear]::after,
[data-el=supplied]::after,
[data-el=incident]::after {
  content: "]";
}

main.loiBornDigital.loiAbout div#text div[data-el=body] div[data-el=p] {
  font-weight: 400;
  width: 100%;
  max-width: var(--pageReadingWidth);
  font-size: 0.9rem;
}
@media only screen and (min-width: 768px) {
  main.loiBornDigital.loiAbout div#text div[data-el=body] div[data-el=p] {
    font-size: 1rem;
  }
}

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