/*@import url('https://fonts.googleapis.com/css2?family=Ibarra+Real+Nova&display=swap');*/

@font-face {
    font-family: 'font';
    src: url(/URW_Palladio.ttf);
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

* {
    padding: 0;
    margin: 0;
    font-family: 'font';
    font-weight: 400;
}

:root {
    --bg: #ffffff;
    --text: #111111;
    --titletext: #ffffff;
    --textalt: #e6e6e6;
    --blockbg: #f2f2f2;
    --blockbgalt: #5c5c5c;
    --textAccent: #00AAD4;
    --accentA: #03acd6;
    --accentB: #3aad3a;
    --gradientA1: #0079D6;
    --gradientA2: #00C9FE;
  }
  
  body {
      background-color: var(--bg);
  }

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

  a:hover {
      text-decoration: underline;
  }

  h1.brand {
      color: inherit;
      font-size: 3.2em;
      margin-left: .4em;
  }

  h1.block {
    font-size: 2.6em;
    color: inherit;
    margin: .2em;
    font-style: normal;
  }

  h2.block {
      font-size: 2.2em;
      margin: .7em;
      color: inherit;
  }

  h3.block {
      font-size: 1.8em;
      margin-top: .2em;
      margin-left: .6em;
      /*color: #00AAD4;
      color: var(--textAccent);*/
  }
  
  h4.block {
      font-size: 1.4em;
      margin-top: .2em;
      margin-left: .6em;
  }
  p {
      margin: .8em;
  }
  ul.p {
      margin: 1em;
      margin-left: 2em;
  }
  div.p {
    padding: .3em;
      padding-left: 1em;
      padding-right: 1em;
  }
  .tcenter {
      text-align: center;
      margin: .4em;
  }

  div.block {
      margin: .35em;
      background-color: #eee;
      background-color: var(--blockbg);
      padding: .3em;
      border-radius: 1em;
      min-height: 3em;
      color: var(--text);
  }

  div.md-blog > ol{
      padding-left: 2em;
  }

  div.md-blog > ul{
    padding-left: 2em;
  }

  div.md-blog {
      padding: 1em;
  }

  .footnotes > ol {
    padding-left: 2em;
    font-size: 13px;
  }

  code {
      overflow-y: auto;
      margin-bottom: -6px;
      font-size: 13px;
      font-family: monospace;
      display: inline-block;
      max-width:45em;
      word-wrap: break-word;
      padding: 2px;
      background-color: #dddddd33;
      border-radius: 2px;
      border: #bbbbbb55 1px solid;
  }

  div.footer {
      margin: .6em;
      margin-top: 4em;
      margin-bottom: 2em;
      background-color: #eee;
      background-color: var(--blockbg);
      padding: .3em;
      border-radius: 1em;
      text-align: center;
  }
  div.footer > * {
      margin: 0px;
      color: #797979;

  }

  div.page {
      width: 100%;
  }
  
  div.grid {
    max-width: 50em;
    margin: 0 auto;
    display: grid;
  }

  div.logo {
      background: #0079D6;
      background: linear-gradient(to right, var(--gradientA1), var(--gradientA2));
      color: white;
      color: var(--titletext);
      user-select: none;
  }

  div.alt {
      background-color: #808080;
      background-color: var(--blockbgalt);
  }
  .altt > *{
      color: #e6e6e6;
      color: var(--textalt);
  }

  div.green {
      background-color:#37c837;
      background-color: var(--accentB);
      color: white;
      color: var(--titletext);
  }
  div.green > * {
      color: white;
      color: var(--titletext);
  }
  div.blue {
      background-color: #00ccff;
      background-color: var(--accentA);
      color: white;
      color: var(--titletext);
  }
  div.blue > * {
    color: #fff;
}

  div.clk {
      transition: 0s;
      user-select: none;
      display: flex;
      justify-content: center;
      align-items: center;
  }

  ul.b-p {
    font-size: 1em;
    margin: .2em;
    margin-left: 1.5em;
  }
  ul.b-p > li {
    margin: .5em;
  }
  ul.normal {
      font-size: 1.2em;
      margin: .3em;
      margin-left: 1.2em;
  }
  ul.normal > li {
      list-style-type: none;
      margin: .5em;
  }
  li > a {
    color: inherit;
    text-decoration: none;
    border-radius: .4em;
    padding: .2em;
    padding-right: .4em;
    padding-left: .4em;
    cursor: pointer;
}
li > a:hover {
  background-color: rgba(0, 0, 0, 0.15);
}
li > a:active {
    background-color:  rgba(0, 0, 0, 0.3);
  }

  ul.horizontal {
    font-size: 1.1em;
    margin: .6em;
    margin-left: 2em;
  }
  ul.horizontal > li {
      display: inline;
      margin: .1em;
  }

  @media (prefers-color-scheme: dark) {
    :root {
        --bg: #1b1b1b;
        --text: #ececec;
        --titletext: #ffffff;
        --textalt: #e6e6e6;
        --blockbg: #363636;
        --blockbgalt: #4d4d4d;
        --textAccent: #2dc7ee;
        --accentA: #1a5463;
        --accentB: #205a20;
        --gradientA1: #0079D6;
        --gradientA2: #00C9FE;
    }
}