.Page {
   width: 100%;
   height: 100%;
   display: flex;
   flex-direction: column;
   flex-wrap: nowrap;
   overflow-y: hidden
}

.Page .Fixed.Layout {
  width: 100%;
  background-color: #256e84;
  color: #ffffff;
  text-align: center;
  overflow-x: hidden;
  overflow-y: hidden
}

.Page .Fixed.Layout .Responsive.Layout {
  width: 100%;
  background-color: #256e84;
  color: #ffffff;
}

@media not all and (max-width: 40em) {
  .Page .Fixed.Layout .Responsive.Layout {
    display: flex;
    flex-direction: row
  }
}

.Page .Fixed.Layout .Logo {
  margin-top: 1.5em;
  margin-left: 1em;
  width: 3em;
  height: 1.3125em
}

@media only screen and (max-width: 40em) {
  .Page .Fixed.Layout .Logo {
    width: 100%
  }
}

.Page .Fixed.Layout .Title {
   width: 100%;
   text-align: center;
   padding-top: 0.5em;
   padding-bottom: 0.5em;
   font-weight: 600;
   font-size: 2em
}

.Page .Body {
   flex: 1;
}

@media screen and (max-width: 40em) {
   .Page .Body {
      width: 100%;
      overflow-y: auto;
      max-height: calc(100vh - 9em);
      margin-bottom: 0.25em
   }
}

@media not all and (max-width: 40em) {
   .Page .Body {
      display: flex;
      overflow-y: hidden
   }
}




.TOC {
   background-color: #f2f2f2;
   padding: 1.0em 0.5em 0.5em 0.75em
}


@media not all and (max-width: 40em) {
   .TOC {
      max-height: calc(100vh - 8em)
   }
}

@media not all and (max-width: 40em) {
  .TOC {
    flex-shrink: 0;
  }
}

@media not all and (max-width: 40em) {
  .TOC .Scrollable.Layout {
    height: 100%;
    overflow-y: auto;
    max-height: calc(100vh - 8em)
  }
}

.TOC .Heading {
   padding-bottom: 0.25em;
}

.TOC li {
  list-style: none
}

.TOC ul {
  padding-left: 1.3em
}

.TOC > ul {
  padding-left: 0
}

.TOC a:not(:hover) {
  text-decoration: none
}

.TOC li {
  padding-top: 0.5em
}




@media not all and (max-width: 40em) {


   .Contents {
      width: 100%;
      height: 100%;
      border-left: solid 1px #222;
      padding: 0.25em 0.5em 0em 0.5em
   }

   .Contents .Scrollable.Layout {
      width: auto;
      overflow-y: auto;
      max-height: calc(100vh - 9em);
      margin-bottom: 0.25em
   }
}

.Contents .Frame {
  max-width: 50em;
  padding: 0 0.5em;
  line-height: 1.5;
  font-family: Georgia, serif;
  font-size: 1.25em;
  color: #1a1a1a
}

.Contents .sourceCode {
  background-color: transparent;
  overflow: visible
}

.Contents hr {
  background-color: #1a1a1a;
  border: none;
  height: 1px;
  margin: 1em 0
}

.Contents h1,
.Contents h2,
.Contents h3,
.Contents h4,
.Contents h5,
.Contents h6 {
  line-height: inherit;
  font-family: inherit;
  margin-bottom: 0.25em
}

.Contents h5,
.Contents h6 {
  font-size: 1em;
  font-style: italic
}

.Contents h6 {
   font-weight: normal
}

.Contents ol, .Contents ul {
  padding-left: 1.7em;
  margin-top: 0.5em
}

.Contents li {
  list-style-type: disc
}

.Contents table {
  margin: 1em 0;
  border-collapse: collapse;
  width: 100%;
  overflow-x: auto;
  display: block;
  font-variant-numeric: lining-nums tabular-nums
}

.Contents table caption {
  margin-bottom: 0.75em
}

.Contents tbody {
  margin-top: 0.5em;
  border-top: 1px solid #1a1a1a;
  border-bottom: 1px solid #1a1a1a
}

.Contents th {
  border-top: 1px solid #1a1a1a;
  padding: 0.25em 0.5em 0.25em 0.5em
}

.Contents td {
  padding: 0.125em 0.5em 0.25em 0.5em
}


.Contents header {
  margin-bottom: 2em;
  text-align: center
}

.Contents code {
  white-space: pre-wrap
}

.Contents span.smallcaps {
  font-variant: small-caps
}

.Contents div.columns {
   display: flex;
   gap: min(4vw, 1.5em)
}

.Contents div.column {
   flex: auto;
   overflow-x: auto
}

.Contentsdiv.hanging-indent {
  margin-left: 1.5em;
  text-indent: -1.5em
}

.Contents footer {
  border-top: solid 1px #222
}
