@charset "UTF-8";
* {
  box-sizing: border-box; }

html {
  font-family: "Helvetica", sans-serif; }

body {
  margin: 0;
  padding: 0; }

p {
  text-align: justify; }

.top-nav {
  display: flex;
  flex-direction: row-reverse;
  flex-wrap: wrap;
  background-color: #d0d0d0;
  padding: 0 1rem;
  justify-content: space-between; }
  .top-nav > ul {
    list-style: none;
    padding: 0;
    margin: 0; }
    .top-nav > ul > li {
      display: inline-block;
      padding: 0;
      margin: 0; }
      .top-nav > ul > li > a:link, .top-nav > ul > li > a:visited {
        display: block;
        padding: 0.5rem 0;
        color: #000; }
    .top-nav > ul.lhs {
      flex-grow: 1; }
      .top-nav > ul.lhs > li:not(:first-child) {
        padding-left: 0.5rem; }

@media only screen and (width < 25em) {
  .top-nav > ul > li {
    display: block; }
    .top-nav > ul > li > a:link, .top-nav > ul > li > a:visited {
      padding-left: 0; }
  .top-nav > ul.lhs > li:not(:first-child) {
    padding-left: 0; } }
main {
  padding: 0 1rem; }

footer {
  font-size: 0.8rem;
  color: #666;
  padding-bottom: 0.5rem;
  padding-right: 1rem; }
  footer > ul {
    list-style: none;
    margin: 0;
    padding: 0;
    text-align: right; }
    footer > ul > li {
      display: inline; }
      footer > ul > li:not(.nodot):not(:first-child)::before {
        content: " · "; }

.cross-slash-icon-link {
  vertical-align: bottom;
  color: #000 !important; }
  .cross-slash-icon-link > span {
    vertical-align: bottom;
    width: 20px;
    height: 20px;
    margin-right: 4px;
    margin-left: 10px;
    display: inline-block;
    background-image: url("slash.svg");
    background-color: #000;
    background-repeat: no-repeat;
    background-position: center left; }

footer .cross-slash-icon-link {
  text-decoration: none; }

nav.rhs ul, nav.rhs li {
  list-style: none;
  margin: 0;
  padding: 0; }
nav.rhs ul ul {
  padding-left: 1rem; }
nav.rhs a:link, nav.rhs a:visited {
  display: block;
  text-decoration: none;
  padding: 0.2rem 0.5rem;
  padding-right: 1rem; }

.logo-img {
  text-align: center;
  margin-top: 3rem;
  margin-bottom: 0; }

article.has-logo > p:first-child {
  margin-top: 0.2rem; }

.logotext {
  font-weight: bold;
  text-decoration: none; }

.slogan {
  text-align: center;
  font-style: italic; }

@media only screen and (width >= 45em) {
  .main-wrap {
    display: grid;
    grid-template-columns: [lpad] 4rem [lhs] minmax(auto, max-content) [rhs] auto;
    grid-template-rows: [topnav] auto [a] auto [b] auto [c] auto; }

  .top-nav {
    display: contents; }
    .top-nav > ul.lhs {
      grid-column: lpad / span 2;
      grid-row: topnav;
      background-color: #d0d0d0;
      padding-left: 5rem; }
    .top-nav > ul.rhs {
      grid-column: rhs;
      grid-row: topnav;
      background-color: #d0d0d0;
      margin-right: 0; }

  main {
    max-width: 37rem;
    grid-column: lhs;
    grid-row: b; }

  nav.rhs {
    grid-column: rhs;
    grid-row: b; }

  footer {
    grid-row: c;
    grid-column: lhs / span 2; }

  .prealign {
    grid-row: a;
    grid-column: lhs;
    max-width: 37rem;
    padding: 0 1rem; } }
@media only screen and (width < 45em) {
  .swipe-reminder {
    display: block;
    visibility: visible;
    background-color: #88dd88;
    padding: 0.2rem 1rem;
    font-size: 0.9rem;
    padding: 0.3rem 1rem;
    color: #005500; }
    .swipe-reminder p {
      margin: 0;
      text-align: center; }

  .main-wrap {
    display: grid;
    grid-template-columns: [l] 100vw [r] max-content;
    grid-template-rows: [topnav] auto [a] min-content [b] auto; }

  .top-nav {
    grid-row: topnav;
    grid-column: l; }

  .swipe-reminder, .prealign, main, footer {
    grid-column: l; }

  nav.rhs {
    background-color: #dadada;
    box-shadow: inset 3px 0 3px #a0a0a0;
    grid-column: r;
    grid-row: topnav / span 10;
    padding-top: 2.5rem; }
    nav.rhs > ul {
      position: sticky;
      top: 0;
      bottom: 0; }
    nav.rhs > ul > li {
      padding-left: 0.5rem; } }
.examples {
  width: 100%; }

.examples td {
  vertical-align: top;
  padding: 0.33rem 0.5rem 0.5rem 0.5rem; }

.examples tr:nth-child(odd) {
  background-color: #dfdfdf; }
  .examples tr:nth-child(odd) td {
    border-top: solid 1px #989898; }
  .examples tr:nth-child(odd) th, .examples tr:nth-child(odd) td {
    border-bottom: solid 1px #989898; }

.examples .outputs {
  list-style: none;
  padding: 0;
  margin: 0;
  font-size: small;
  padding-left: 1rem; }

/*# sourceMappingURL=dedoc-website.css.map */