/* ubuntu-300italic - latin */
@font-face {
  font-family: 'Ubuntu';
  font-style: italic;
  font-weight: 300;
  src: local(''),
       url('/fonts/ubuntu-v15-latin-300italic.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
       url('/fonts/ubuntu-v15-latin-300italic.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
  font-display: swap;
}
/* ubuntu-regular - latin */
@font-face {
  font-family: 'Ubuntu';
  font-style: normal;
  font-weight: 400;
  src: local(''),
       url('/fonts/ubuntu-v15-latin-regular.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
       url('/fonts/ubuntu-v15-latin-regular.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
  font-display: swap;
}
/* ubuntu-italic - latin */
@font-face {
  font-family: 'Ubuntu';
  font-style: italic;
  font-weight: 400;
  src: local(''),
       url('/fonts/ubuntu-v15-latin-italic.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
       url('/fonts/ubuntu-v15-latin-italic.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
  font-display: swap;
}
/* ubuntu-500 - latin */
@font-face {
  font-family: 'Ubuntu';
  font-style: normal;
  font-weight: 500;
  src: local(''),
       url('/fonts/ubuntu-v15-latin-500.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
       url('/fonts/ubuntu-v15-latin-500.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
  font-display: swap;
}
/* ubuntu-500italic - latin */
@font-face {
  font-family: 'Ubuntu';
  font-style: italic;
  font-weight: 500;
  src: local(''),
       url('/fonts/ubuntu-v15-latin-500italic.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
       url('/fonts/ubuntu-v15-latin-500italic.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
  font-display: swap;
}
/* ubuntu-700 - latin */
@font-face {
  font-family: 'Ubuntu';
  font-style: normal;
  font-weight: 700;
  src: local(''),
       url('/fonts/ubuntu-v15-latin-700.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
       url('/fonts/ubuntu-v15-latin-700.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
  font-display: swap;
}
/* ubuntu-700italic - latin */
@font-face {
  font-family: 'Ubuntu';
  font-style: italic;
  font-weight: 700;
  src: local(''),
       url('/fonts/ubuntu-v15-latin-700italic.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
       url('/fonts/ubuntu-v15-latin-700italic.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
  font-display: swap;
}
/* ubuntu-300 - latin */
@font-face {
  font-family: 'Ubuntu';
  font-style: normal;
  font-weight: 300;
  src: local(''),
       url('/fonts/ubuntu-v15-latin-300.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
       url('/fonts/ubuntu-v15-latin-300.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
  font-display: swap;
}

/* ubuntu-mono-regular - latin */
@font-face {
  font-family: 'Ubuntu Mono';
  font-style: normal;
  font-weight: 400;
  src: local(''),
       url('/fonts/ubuntu-mono-v10-latin-regular.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
       url('/fonts/ubuntu-mono-v10-latin-regular.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
  font-display: swap;
}
/* ubuntu-mono-italic - latin */
@font-face {
  font-family: 'Ubuntu Mono';
  font-style: italic;
  font-weight: 400;
  src: local(''),
       url('/fonts/ubuntu-mono-v10-latin-italic.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
       url('/fonts/ubuntu-mono-v10-latin-italic.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
  font-display: swap;
}

/* ubuntu-mono-700italic - latin */
@font-face {
  font-family: 'Ubuntu Mono';
  font-style: italic;
  font-weight: 700;
  src: local(''),
       url('/fonts/ubuntu-mono-v10-latin-700italic.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
       url('/fonts/ubuntu-mono-v10-latin-700italic.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
  font-display: swap;
}
/* ubuntu-mono-700 - latin */
@font-face {
  font-family: 'Ubuntu Mono';
  font-style: normal;
  font-weight: 700;
  src: local(''),
       url('/fonts/ubuntu-mono-v10-latin-700.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
       url('/fonts/ubuntu-mono-v10-latin-700.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
  font-display: swap;
}

:root {
    /* light mode */
  --apricot-main: #C1600A;
  --apricot-main-darker: #955501;
  --grey: #d5d5d5;
    /* dark mode */
  --dark-mode-apricot-main: #EE913A;
  --dark-mode-apricot-main-darker: #C1600A;
  --dark-mode-grey: #393939;
}

body
{
  font-family: 'Ubuntu', serif;
  font-size: 24px;
  line-height: 1.3em;
}

div.code
{
  position: relative;
  background: floralwhite;
  padding: 2rem;
  border-radius: 1rem;
  margin: 1.5rem auto;
}

div.code pre
{
    margin: 0;
}

div.code button.copy
{
    background: inherit;
    color: black;
    border-radius: 0.5rem;
    border: dashed 0.2rem #797979;
    padding: 0.4rem 0.8rem;
    position: absolute;
    top: 16px;
    right: 16px;
    font-size: 70%;
    cursor: pointer;
    font-family: inherit;
}

div.code button.copy:hover
{
    border-color: black;
}

pre.literal-block:not(.code)
{
    font-family: "Courier New", monospace;
}

tt.docutils.literal
{
  background-color: var(--grey);
  padding: 2px;
  padding-left: 4px;
  padding-right: 4px;
  border-radius: 8px;
}

tt,
kbd,
pre,
nav > div.container,
span.category,
span.tag
{
  font-family: 'Ubuntu Mono', "Courier New", monospace;
}

ul,
ol,
dl,
body > footer > address.attribution,
article > header > p.author-cat-tag
{
  line-height: 1.5em;
}

/*****/
/* a */
/*****/

a
{
  color: var(--apricot-main);
  text-decoration: none;
}

a:hover
{
  text-decoration: underline;
}

a:visited
{
  color: var(--apricot-main-darker);
}

kbd
{
  padding: 0.125ex 0.25ex 0 0.325ex;
  border: 1px solid #D67113;

  border-radius: 0.5ex;
}

blockquote
{
  margin-left: 2ex;
  padding-left: 1ex;
  border-left: 1ex solid #F0923B;
}

pre
{
  overflow: auto;
}


/*********/
/* table */
/*********/

table
{
  display: block;

  overflow-x: auto;
}

table,
th,
td
{
  border: none;
}

th,
td
{
  padding: 0 0.5ex 0 0.5ex;
}

th
{
  background-color: #FFAD61;
  font-weight: normal;
}

/****************************************************************
 * For tables that look like tickets
 * Ideally should be in a separate css file and with its own class
 ****************************************************************/

table:not(.footnote)
{
  border: 2px dashed grey;
  border-radius: 1rem;
}

table:not(.footnote) td
{
  padding:0.5rem;
  padding-left:1rem;
}

table:not(.footnote) td + td 
{
  border-left: 2px dashed grey;
}

/*
* https://developer.mozilla.org/en-US/docs/Web/CSS/Specificity#increasing_specificity_by_duplicating_selector
*
* Increase Specificity for borderless tables
*/

table.borderless.borderless
{
  border: none;
}

table.borderless.borderless td
{
  border: none;
}

/*********************/
/* rst linenos table */
/*********************/

td.linenos,
td.code
{
  padding: 0;
  background-color: transparent;
}

td.linenos > div.linenodiv > pre,
td.code > div > pre
{
  margin: 0 auto;
}

td.linenos
{
  padding-right: 1ex;
}

/******************/
/* figure / image */
/******************/

div.figure
{
  text-align: center;
}

div.figure p.caption
{
  margin: 0.5em auto;
}

/*************************/
/* footnotes & citations */
/*************************/

table.footnote,
table.citation
{
  margin-top: 1em;
  padding-top: 1em;
  border-top: 0.2em dotted #FFC38B;
}

table.footnote + table.footnote,
table.citation + table.citation
{
  margin-top: 0;
  padding-top: 0;
  border-top: 0;
}

table.footnote th,
table.footnote td,
table.citation th,
table.citation td
{
  background-color: transparent;
}

table.footnote td > p.first,
table.citation td > p.first
{
  margin-top: 0;
}

table.footnote td > p.last,
table.citation td > p.last
{
  margin-bottom: 0;
}

a.footnote-reference
{
  vertical-align: super;
  font-size: .83em;
}

/***************/
/* admonitions */
/***************/
/* http://docutils.sourceforge.net/docs/ref/rst/directives.html#admonitions */

div.attention,
div.caution,
div.danger,
div.error,
div.hint,
div.important,
div.note,
div.tip,
div.warning
{
  margin: 1em auto 1em auto;
  padding-top: 0.25em;
  padding-bottom: 0.5em;
  padding-left: 0.5em;
  border-bottom: 0.25ex dashed #FFC38B;
  border-left: 0.25ex dashed #FFC38B;
}

p.admonition-title
{
  margin: 0;
}

div.attention > p.first + p,
div.caution > p.first + p,
div.danger > p.first + p,
div.error > p.first + p,
div.hint > p.first + p,
div.important > p.first + p,
div.note > p.first + p,
div.tip > p.first + p,
div.warning > p.first + p
{
  margin-top: 0;
}

div.attention > p.last,
div.caution > p.last,
div.danger > p.last,
div.error > p.last,
div.hint > p.last,
div.important > p.last,
div.note > p.last,
div.tip > p.last,
div.warning > p.last
{
  margin-bottom: 0;
}

/***************/
/* blog header */
/***************/

#header,
body > main,
#paginator,
body > footer
{
  margin: 0 auto;
  width: 1024px;
}

#header header
{
  text-align: center;
}

#header header a
{
  text-decoration: none;
}

/* don't change the header color */
#header a:visited
{
  color: var(--apricot-main);
}

#publisher-name
{
  color: inherit;
}

#publisher-description
{
  margin: 0;
  color: #A85206;
}

/***************/
/* blog footer */
/***************/

body > footer
{
  margin-top: 5rem;
}

footer img
{
  padding: 1rem;
}

/*******************/
/* blog navigation */
/*******************/

h1
{
  margin-bottom: 1rem;
}

nav div.container
{
  text-align: center;
}

nav span.navitem a::before
{
  content: "[";
  color: black;
}

nav span.navitem a::after
{
  content: "]";
  color: black;
}

nav span.navitem a:hover::before
{
  content: "[";
  color: inherit;
}

nav span.navitem a:hover::after
{
  content: "]";
  color: inherit;
}

nav span.navitem a.active::before
{
  content: "]";
}

nav span.navitem a.active::after
{
  content: "[";
}

div.breadcrumb
{
  margin: 2rem auto;
}

/********/
/* main */
/********/

#content-title
{
  text-align: center;
}

#content-title,
article:first-child,
article > header > h2
{
  margin-top: 1.25rem;
}

/**************/
/* paginatior */
/**************/

div#paginator
{
  text-align: center;
  margin-top: 3rem;
}

/***************/
/* blog footer */
/***************/

body > footer
{
  text-align: center;
}

body > footer > address
{
}

/***********/
/* article */
/***********/

article
{
  margin: 2em auto;
}

article > header
{
  position: relative;
  text-align: center;
}

time::before
{
  content: "🗓️ ";
  font-style: normal;
}

article .date
{
  font-style: italic;
}

article .modified
{
  margin-top: 2.5rem;
}
/****************/
/* translations */
/****************/

article > header > div.translations
{
  position: absolute;
  right: 0;
}

/******************************************/
/* type link styles:                      */
/* translation, author, category, and tag */
/******************************************/

span.translation::before
{
  content: "[";
}

span.translation::after
{
  content: "]";
}

span.author span.name::before
{
  content: "@";
}

span.category::before
{
  content: "{";
}

span.category::after
{
  content: "\7D";
}

span.tag::before
{
  content: "#";
}

span.author:hover::before,
span.category:hover::after,
span.category:hover::before,
span.tag:hover::before,
span.translation:hover::after,
span.translation:hover::before
{
  color: #F0923B;
}

span.author > a:hover,
span.category > a:hover,
span.tag > a:hover,
span.translation > a:hover
{
  text-decoration: none;
}

/*******************/
/* article summary */
/*******************/

article.summary > img.thumbnail
{
  padding: 0 0 2ex 2ex;
  float: right;
}

article.summary > header
{
  text-align: left;
}

article.summary > header > h2,
article.summary > header > p
{
  margin: 0.5em auto;
}

article > div.summary
{
  position: relative;  /* for fading out to work */
}

article > div.summary > p
{
  margin-top: 0;
  max-height: calc(5 * 1.25em + 1em);  /* 5 lines */
  overflow: hidden;
}

article > div.summary > p::after
{
  position: absolute;
  right: 0;
  bottom: 0;  /* match margin-bottom */
  width: 100%;
  height: 100%;  /* match line-height */
  content: "";
  background: transparent
              linear-gradient(
                to bottom,
                rgba(255, 255, 255, 0.0)   0%,
                rgba(255, 255, 255, 0.1)  40%,
                rgba(255, 255, 255, 1.0) 100%
              );
  text-align: right;
}

article > div.summary > span.readmore
{
  position: absolute;
  right: 0;
  bottom: 0;
  z-index: 1;  /* above div.summary > p */
}

article > div.summary > span.readmore > a
{
  color: #F0923B;
}

/*****************/
/* blog archives */
/*****************/

  dd{
    border-left: #a6a6a6 solid;
    padding: 1rem;
  }

  dd:hover{
    border-left: #514e4e solid;
  }
  
/***********************************************/
/* Solarized Pygments Style                    */
/* https://github.com/john2x/solarized-pygment */
/***********************************************/

pre > .hll { background-color: #ffffcc }
pre > .c { color: #93a1a1; font-style: italic } /* Comment */
pre > .g { color: #d33682 } /* Generic */
pre > .k { color: #859900 } /* Keyword */
pre > .l { color: #2aa198 } /* Literal */
pre > .n { color: #268bd2 } /* Name */
pre > .cm { color: #93a1a1; font-style: italic } /* Comment.Multiline */
pre > .cp { color: #93a1a1; font-style: italic } /* Comment.Preproc */
pre > .c1 { color: #93a1a1; font-style: italic } /* Comment.Single */
pre > .cs { color: #93a1a1; font-style: italic } /* Comment.Special */
pre > .gd { color: #d33682 } /* Generic.Deleted */
pre > .ge { color: #d33682 } /* Generic.Emph */
pre > .gr { color: #d33682 } /* Generic.Error */
pre > .gh { color: #d33682 } /* Generic.Heading */
pre > .gi { color: #d33682 } /* Generic.Inserted */
pre > .go { color: #d33682 } /* Generic.Output */
pre > .gp { color: #d33682 } /* Generic.Prompt */
pre > .gs { color: #d33682 } /* Generic.Strong */
pre > .gu { color: #d33682 } /* Generic.Subheading */
pre > .gt { color: #d33682 } /* Generic.Traceback */
pre > .kc { color: #859900; font-weight: bold } /* Keyword.Constant */
pre > .kd { color: #859900 } /* Keyword.Declaration */
pre > .kn { color: #dc322f; font-weight: bold } /* Keyword.Namespace */
pre > .kp { color: #859900 } /* Keyword.Pseudo */
pre > .kr { color: #859900 } /* Keyword.Reserved */
pre > .kt { color: #859900; font-weight: bold } /* Keyword.Type */
pre > .ld { color: #2aa198 } /* Literal.Date */
pre > .m { color: #2aa198; font-weight: bold } /* Literal.Number */
pre > .s { color: #2aa198 } /* Literal.String */
pre > .na { color: #268bd2 } /* Name.Attribute */
pre > .nb { color: #cb4b16 } /* Name.Builtin */
pre > .nc { color: #cb4b16 } /* Name.Class */
pre > .no { color: #268bd2 } /* Name.Constant */
pre > .nd { color: #268bd2 } /* Name.Decorator */
pre > .ni { color: #268bd2 } /* Name.Entity */
pre > .ne { color: #268bd2 } /* Name.Exception */
pre > .nf { color: #268bd2 } /* Name.Function */
pre > .nl { color: #268bd2 } /* Name.Label */
pre > .nn { color: #268bd2 } /* Name.Namespace */
pre > .nx { color: #268bd2 } /* Name.Other */
pre > .py { color: #268bd2 } /* Name.Property */
pre > .nt { color: #268bd2; font-weight: bold } /* Name.Tag */
pre > .nv { color: #268bd2 } /* Name.Variable */
pre > .ow { color: #859900 } /* Operator.Word */
pre > .w { color: #586e75 } /* Text.Whitespace */
pre > .mb { color: #2aa198; font-weight: bold } /* Literal.Number.Bin */
pre > .mf { color: #2aa198; font-weight: bold } /* Literal.Number.Float */
pre > .mh { color: #2aa198; font-weight: bold } /* Literal.Number.Hex */
pre > .mi { color: #2aa198; font-weight: bold } /* Literal.Number.Integer */
pre > .mo { color: #2aa198; font-weight: bold } /* Literal.Number.Oct */
pre > .sb { color: #2aa198 } /* Literal.String.Backtick */
pre > .sc { color: #2aa198 } /* Literal.String.Char */
pre > .sd { color: #2aa198 } /* Literal.String.Doc */
pre > .s2 { color: #2aa198 } /* Literal.String.Double */
pre > .se { color: #2aa198 } /* Literal.String.Escape */
pre > .sh { color: #2aa198 } /* Literal.String.Heredoc */
pre > .si { color: #2aa198 } /* Literal.String.Interpol */
pre > .sx { color: #2aa198 } /* Literal.String.Other */
pre > .sr { color: #2aa198 } /* Literal.String.Regex */
pre > .s1 { color: #2aa198 } /* Literal.String.Single */
pre > .ss { color: #2aa198 } /* Literal.String.Symbol */
pre > .bp { color: #cb4b16 } /* Name.Builtin.Pseudo */
pre > .vc { color: #268bd2 } /* Name.Variable.Class */
pre > .vg { color: #268bd2 } /* Name.Variable.Global */
pre > .vi { color: #268bd2 } /* Name.Variable.Instance */
pre > .il { color: #2aa198; font-weight: bold } /* Literal.Number.Integer.Long */

img.align-center {
    margin-left: auto;
    margin-right: auto;
    display: block;
}

/*************/
/* responsive /
/*************/

@media not screen and (min-width: 1043px)
{
  body
  {
    font-size: 20px;
  }

  #header,
  body > main,
  #paginator,
  body > footer
  {
    margin-right: 10px;
    margin-left: 10px;
    width: calc(100% - 2 * 10px);
  }

  img
  {
    max-width: 100%;
  }
}

svg#github-logo{
  vertical-align: middle;
  padding: 1rem;
}

footer #socials a{
  text-decoration: none;
  color: transparent;
}

footer div#thanks{
  font-size: 0.8em;
  margin: 1rem auto;
}

iframe {
  display: block;
  border-radius: 2rem;
  margin: 0 auto;
  height: 50vh;
  width: 50vw;
}

/*************/
/* Dark mode */
/*************/
@media (prefers-color-scheme: dark){

  *{
    scrollbar-color: #454a4d #202324;
   }

  html, body{
    background-color: #181a1b;
    color: #e8e6e3;
    }

  a{
    color: var(--dark-mode-apricot-main);
  }

  a:visited{
    color: var(--dark-mode-apricot-main-darker);
  }

  #header a:visited {
    color: var(--dark-mode-apricot-main);
  }

  tt.docutils.literal{
    background-color: var(--grey);
    }

  article > div.summary > p::after {
    background: transparent
                linear-gradient(
                  rgba(24, 26, 27, 0) 0%,
                  rgba(24, 26, 27, 0.1) 40%,
                  rgb(24, 26, 27) 100%
                );
    }

  svg#github-logo path#logo{
    fill: white;
    }

  div.code{
    background-color: #0d0d0d;
    }
    
  div.code button.copy
  {
    color: white;
  }

  div.code button.copy:hover
  {
      border-color: white;
  }

  div.code button.clicked
  {
    border-color: #34b233;
  }
  
  dd{
    border-left: #514e4e solid;
  }
  
  dd:hover{
    border-left: #a6a6a6 solid;
  }

  nav span.navitem a::before
  {
    color: white;
  }
  
  nav span.navitem a::after
  {
    color: white;
  }

  tt.docutils.literal
  {
    background-color: var(--dark-mode-grey);
  }

  div.code button.copy:hover
  {
    border-color: white;
  }
}


/*****************/
/* Mobile phones */
/*****************/
@media screen and (max-width: 767px){

    div.code button.copy:hover
    {
        border-color: #797979;
    }

    iframe {
      height: 40vh;
      width: 80vw;
    }
}
