@charset "UTF-8";
@import url("https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400..900;1,400..900&display=swap");
/* ----- tables.css ------ */
/*
### Tables
*/
:root {
  --color-table-odd: var(--color-bg-contrast);
  --color-table-even: var(--color-background);
  --color-table-body: var(--color-body);
  --color-table-heading: var(--color-heading);
  --color-table-caption: var(--color-darkred);
  --color-table-sep: var(--color-gray-88);
  --font-table-caption: var(--font-heading);
  --font-table-heading: var(--font-heading);
  --font-table-body: var(--font-body);
}

table {
  width: 100%;
  border-collapse: collapse;
  font-family: var(--font-table-body);
  color: var(--color-table-body);
  margin: 1.5em 0;
}

thead {
  font-family: var(--font-table-heading);
  border-bottom: 1px solid var(--color-table-sep);
}

tbody {
  hyphens: manual;
}

tbody tr:nth-child(odd) {
  background-color: var(--color-table-odd);
}

tbody tr:nth-child(even) {
  background-color: var(--color-table-even);
}

td {
  vertical-align: text-top;
  padding: 5px;
}

th {
  vertical-align: bottom;
  padding-bottom: 0;
  color: var(--color-table-heading);
}

table caption {
  caption-side: top;
  text-align: right;
  font-family: var(--font-table-caption);
  font-style: italic;
  font-weight: 200;
  color: var(--color-table-caption);
  margin-bottom: 0;
}

.table-caption {
  width: max-content;
  padding: 0;
  float: right;
  background-image: linear-gradient(180deg, transparent 75%, var(--color-red-faded) 0);
}

/**********************************************************************************

Tables which are responsive.

**/
/* Table Instagram */
.tbl-resp {
  display: block;
  margin: 2em auto;
  width: 100%;
}

.tbl-resp .flex-table {
  display: flex;
  flex-flow: row wrap;
  /*border-left: solid 1px #5f6874;*/
  transition: 0.5s;
}

.tbl-resp .flex-table:first-of-type {
  border-top: solid 1px #101318;
  /*border-left: solid 1px #101318;*/
}

.tbl-resp .flex-table:first-of-type .flex-row {
  background: #5f6874;
  color: white;
  border-color: #101318;
}

.tbl-resp .flex-table.row:nth-child(odd) .flex-row {
  background: rgba(95, 104, 116, 0.2);
}

.tbl-resp .flex-row {
  width: 20%;
  text-align: center;
  padding: 0.5em 0.5em;
  /*border-right: solid 1px #5f6874;*/
  border-bottom: solid 1px #5f6874;
  flex-grow: 1;
}

.tbl-resp .rowspan {
  display: flex;
  flex-flow: row wrap;
  align-items: flex-start;
  justify-content: center;
}

.tbl-resp .column {
  display: flex;
  flex-flow: column wrap;
  width: 80%;
  padding: 0;
}

.tbl-resp .column .flex-row {
  display: flex;
  flex-flow: row wrap;
  width: 100%;
  padding: 0;
  border: 0;
  border-bottom: solid 1px #5f6874;
}

.tbl-resp .flex-cell {
  width: 25%;
  text-align: center;
  padding: 0.5em 0.5em;
  /*border-right: solid 1px #5f6874;*/
}

@media all and (max-width: 767px) {
  .tbl-resp .flex-row,
  .tbl-resp .flex-cell {
    width: 50%;
  }
  .tbl-resp .flex-row.first,
  .tbl-resp .flex-table.row:nth-child(odd) .flex-row.first {
    width: 100%;
    background: #5f6874;
    color: white;
  }
  .tbl-resp .column {
    width: 100%;
  }
}
@media all and (max-width: 430px) {
  .tbl-resp .flex-table .flex-row {
    border-bottom: 0;
  }
  .tbl-resp .flex-table .flex-row:last-of-type {
    border-bottom: solid 1px #5f6874;
  }
  .tbl-resp .header .flex-row {
    border-bottom: solid 1px;
  }
  .tbl-resp .flex-row {
    width: 100%;
  }
  .tbl-resp .flex-row.first {
    width: 100%;
    border-bottom: solid 1px #5f6874;
  }
  .tbl-resp .column {
    width: 100%;
  }
  .tbl-resp .column .flex-row {
    border-bottom: solid 1px #5f6874;
  }
  .tbl-resp .flex-cell {
    width: 100%;
  }
}
/* Table Resolutions */
.tbl-resolutions {
  display: block;
  margin: 2em auto;
  width: 100%;
}

.tbl-resolutions .flex-table {
  display: flex;
  flex-flow: row wrap;
  /*border-left: solid 1px #5f6874;*/
  transition: 0.5s;
}

.tbl-resolutions .flex-table:first-of-type {
  border-top: solid 1px #101318;
  /*border-left: solid 1px #101318;*/
}

.tbl-resolutions .flex-table:first-of-type .flex-row {
  background: #5f6874;
  color: white;
  border-color: #101318;
}

.tbl-resolutions .flex-table.row:nth-child(odd) .flex-row {
  background: rgba(95, 104, 116, 0.2);
}

.tbl-resolutions .flex-table:hover {
  background: #5f6874;
  transition: 500ms;
}

.tbl-resolutions .flex-row {
  width: 16.6666666667%;
  text-align: center;
  padding: 0.5em 0.5em;
  /*border-right: solid 1px #5f6874;*/
  border-bottom: solid 1px #5f6874;
  flex-grow: 1;
}

.tbl-resolutions .rowspan {
  display: flex;
  flex-flow: row wrap;
  align-items: flex-start;
  justify-content: center;
}

.tbl-resolutions .column {
  display: flex;
  flex-flow: column wrap;
  width: 75%;
  padding: 0;
}

.tbl-resolutions .column .flex-row {
  display: flex;
  flex-flow: row wrap;
  width: 100%;
  padding: 0;
  border: 0;
  border-bottom: solid 1px #5f6874;
}

.tbl-resolutions .column .flex-row:hover {
  background: #F5F5F5;
  transition: 500ms;
}

.tbl-resolutions .flex-cell {
  width: 50%;
  text-align: center;
  padding: 0.5em 0.5em;
  /*border-right: solid 1px #5f6874;*/
}

@media all and (max-width: 767px) {
  .tbl-resolutions .flex-row {
    width: 25%;
  }
  .tbl-resolutions .flex-row.first,
  .tbl-resolutions .flex-table.row:nth-child(odd) .flex-row.first {
    width: 100%;
    background: #5f6874;
    color: white;
  }
  .tbl-resolutions .column {
    width: 100%;
  }
}
@media all and (max-width: 430px) {
  .tbl-resolutions .flex-table .flex-row {
    border-bottom: 0;
  }
  .tbl-resolutions .flex-table .flex-row:last-of-type {
    border-bottom: solid 1px #5f6874;
  }
  .tbl-resolutions .header .flex-row {
    border-bottom: solid 1px;
  }
  .tbl-resolutions .flex-row {
    width: 100%;
  }
  .tbl-resolutions .flex-row.first {
    width: 100%;
    border-bottom: solid 1px #5f6874;
  }
  .tbl-resolutions .column {
    width: 100%;
  }
  .tbl-resolutions .column .flex-row {
    border-bottom: solid 1px #5f6874;
  }
  .tbl-resolutions .flex-cell {
    width: 100%;
  }
}
/**
 * definition lists
 **/
dl {
  font-size: var(--font-size-minus-0);
}

dt {
  color: var(--color-heading);
  font-family: var(--font-heading);
  font-weight: 500;
  margin-bottom: 0rem;
}

dd {
  margin-left: 1em;
}

/**
 * This is what happens when you don't
 * document why you did something because
 * it's obvious.
 **/
ul {
  list-style-type: square;
}

ol {
  list-style-type: decimal;
}

/**
 *  list items should cuddle
 */
#content li {
  padding-bottom: 1rem;
}
#content li:last-child {
  padding-bottom: 0;
}
#content li blockquote {
  margin-top: 1rem;
}

main ol,
main ul {
  padding-left: 1em;
}

/**
 * List of posts
 **/
.posts-list {
  list-style-position: inside;
  list-style-type: none;
  padding-left: 0;
}

.posts-entry-title {
  font-family: var(--font-heading);
  font-weight: 600;
  margin: 0;
}

.posts-entry-title a {
  color: var(--color-gray-30);
}

.posts-entry-summary {
  font-family: var(--font-body);
  font-size: var(--font-size-minus-0);
  color: var(--color-gray-40);
}

.posts-entry-date {
  font-family: var(--font-body);
  font-weight: 400;
  color: var(--color-gray-40);
  font-size: var(--font-size-minus-1);
  font-style: italic;
}

.posts-entry-tag {
  font-family: var(--font-heading);
  font-size: var(--font-size-minus-1);
}

.posts-entry-footer {
  line-height: 1;
}

.posts-entry-summary,
.posts-entry-summary p {
  display: block;
  margin-bottom: 0;
}

.tagslist-tags {
  color: var(--color-red);
}

.footnotes {
  font-size: var(--font-size-minus-2);
}
.footnotes p {
  margin-bottom: 0;
  padding-bottom: 0;
}

.footnote-ref {
  display: inline-block;
  margin: 0;
}

.footnote-ref a, .littlefoot-footnote__button {
  display: inline-block;
  font-size: var(--font-size-minus-2);
  margin-left: 0.2rem;
  border-radius: 0.2rem;
  min-width: 1rem;
  text-align: center;
  text-decoration: none;
  -webkit-font-smoothing: antialiased;
  color: var(--color-white);
  background-color: var(--color-light);
  opacity: 0.6;
}
.footnote-ref a:hover, .littlefoot-footnote__button:hover {
  background-color: var(--color-light);
  opacity: 1;
  text-decoration: none;
}

.footnotes-sep {
  margin-top: 2em;
  border: 0;
  border-top: 1px solid var(--color-light);
  padding-top: 1em;
}

.footnote-backref {
  text-decoration: none;
}
.footnote-backref:hover {
  text-decoration: none;
}

.littlefoot-footnote__content {
  margin: 0;
  padding: 1rem 1.1rem;
}

figure {
  margin: 0;
  margin-bottom: 1em;
}

figure img {
  margin: 0;
  border-radius: 4px;
}

figcaption {
  line-height: 1;
  margin-top: -0.25em;
  margin-right: 0.25em;
  margin-bottom: 0;
  text-align: right;
  font-family: var(--font-caption);
  font-size: var(--font-size-minus-2);
  font-weight: 400;
  color: var(--color-figure-caption);
}

pre {
  max-width: 100%;
  overflow: scroll;
  padding: 0 1em;
  display: block;
  overflow-wrap: normal;
}

code {
  word-break: normal;
}

/*  how to display in-line code:
      apply only to naked <code> blocks
*/
code:not([class]) {
  font-family: var(--font-code);
  font-size: var(--font-code-size);
  color: var(--color-code);
}

/* for naked <code> */
pre:not([class]) code:not([class]) {
  background-color: inherit;
  color: var(--color-darkred);
}

a[href] > code {
  text-decoration: underline;
}

code[class*=language-], pre[class*=language-] {
  background: var(--color-code-bg) !important;
}

pre[class*=language-] {
  border-style: none;
  border-radius: 0.25em;
  margin: 0 0 1em 0 !important;
}

blockquote {
  margin: 0 1.5rem 2rem;
  border-left: 4px solid var(--color-lighter);
  color: var(--color-darkest);
  padding-left: 0.75rem;
  padding-bottom: 0;
}
blockquote p:last-child {
  padding-bottom: 0;
}

blockquote p cite::before {
  content: "— "; /* emdash-punctuationspace */
  white-space: pre;
}

/**
 * blockquote p:last-of-type cite,
 *
 * use this selector to ignore all but the final
 * cite in a blockquote.
 **/
blockquote p cite {
  font-style: italic;
  font-size: var(--font-size-minus-1);
  text-align: right;
  display: inline-block;
  width: 100%;
}

.quote-hero {
  width: 100vw;
  position: relative;
  left: 50%;
  right: 50%;
  margin: 4rem -50vw 6rem;
}
.quote-hero blockquote {
  text-align: center;
  width: calc(var(--content-width) * 2);
  max-width: 90%;
  margin: auto;
  padding: 0;
  border-left: 0;
  font-size: var(--font-size-plus-1);
}
.quote-hero blockquote p cite {
  text-align: center;
}

body > header {
  padding-top: 2rem;
  padding-bottom: 2rem;
}
body > header section.top {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding-bottom: 2rem;
}
@media screen and (max-width: 690px) {
  body > header section.top {
    flex-direction: column;
    gap: 2rem;
  }
}
body > header section.top section.header {
  display: flex;
  justify-content: start;
  align-items: center;
}
body > header section.top section.header #avatar {
  border-radius: 50%;
  width: 5rem;
  height: 5rem;
  margin-right: 1rem;
}
body > header section.top section.header .text {
  text-align: left;
  font-family: var(--font-serif);
}
body > header section.top section.header .text h1 {
  font-family: var(--font-serif);
  margin-bottom: 0;
  padding: 0;
  line-height: 2rem;
}
body > header section.top section.header .text a {
  font-family: var(--font-serif);
  text-decoration: none;
  color: var(--color-body);
  font-weight: bold;
}
body > header section.top section.header .text a:hover {
  text-decoration: none;
}
body > header section.top section.header .text em, body > header section.top section.header .text em a {
  font-weight: normal;
  font-style: normal;
}
body > header section.top section.header .text p {
  text-align: center;
  padding: 0;
  margin: 0;
}
body > header section.top .social {
  display: flex;
  flex-direction: row;
  justify-content: end;
  align-items: center;
}
body > header section.top .social a {
  display: block;
  padding: 0 1rem;
  color: var(--color-foreground);
  font-size: 1.5rem;
}
body > header section.top .social a:hover, body > header section.top .social a::selection {
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  color: var(--color-nav-hover);
  text-decoration: none;
  background: transparent;
}

.navMain.gear ul {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr;
}
@media screen and (max-width: 490px) {
  .navMain.gear ul {
    grid-template-columns: 1fr 1fr 1fr;
  }
}
.navMain ul {
  list-style: none;
  padding: 0;
  margin: 0;
  grid-gap: 0rem 1rem;
  display: flex;
  flex-direction: row;
  justify-content: space-around;
  padding-bottom: 2rem;
}
@media screen and (max-width: 490px) {
  .navMain ul {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
  }
}
.navMain ul li {
  text-align: center;
}
.navMain ul li a {
  display: block;
  padding: 0.3rem 0.3rem;
  color: var(--color-nav-text);
  text-decoration: none;
}
@media screen and (max-width: 490px) {
  .navMain ul li a {
    padding: 0.1rem 0.1rem 0;
  }
}
.navMain ul li a:hover, .navMain ul li a::selection {
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  color: var(--color-nav-hover);
  text-decoration: none;
  background: transparent;
}

footer {
  grid-area: foot;
  font-size: var(--font-size-minus-3);
  color: var(--color-footer);
  font-family: var(--font-footer);
  padding-top: 4rem;
  padding-bottom: 3rem;
}
footer #search {
  margin: 4rem auto;
  width: 100%;
}
footer #search form {
  display: grid;
  grid-gap: 1rem;
  grid-template-columns: 3fr 1fr;
  padding-bottom: 2rem;
}
@media screen and (max-width: 490px) {
  footer #search form {
    grid-template-columns: 1fr;
  }
}
footer ul {
  padding: 0;
  margin: 0;
  list-style: none;
  display: flex;
  justify-content: center;
}
@media screen and (max-width: 700px) {
  footer ul {
    display: block;
    text-align: center;
  }
  footer ul li {
    padding: 0.5rem 0 0;
  }
}
footer li:not(:first-child):before {
  content: "⋅";
  opacity: 0.35;
  margin: 0 0.5rem;
}
@media screen and (max-width: 700px) {
  footer li:not(:first-child):before {
    margin: 0;
    content: "";
  }
}
footer a[href] {
  text-transform: uppercase;
  color: inherit;
  text-decoration: none;
}

/* PrismJS 1.14.0
http://prismjs.com/download.html#themes=prism&languages=markup+css+clike+javascript+abap+actionscript+ada+apacheconf+apl+applescript+c+arff+asciidoc+asm6502+aspnet+autohotkey+autoit+bash+basic+batch+bison+brainfuck+bro+cpp+csharp+arduino+coffeescript+clojure+ruby+csp+css-extras+d+dart+diff+django+docker+eiffel+elixir+elm+markup-templating+erlang+fsharp+flow+fortran+gedcom+gherkin+git+glsl+go+graphql+groovy+haml+handlebars+haskell+haxe+http+hpkp+hsts+ichigojam+icon+inform7+ini+io+j+java+jolie+json+julia+keyman+kotlin+latex+less+liquid+lisp+livescript+lolcode+lua+makefile+markdown+erb+matlab+mel+mizar+monkey+n4js+nasm+nginx+nim+nix+nsis+objectivec+ocaml+opencl+oz+parigp+parser+pascal+perl+php+php-extras+sql+powershell+processing+prolog+properties+protobuf+pug+puppet+pure+python+q+qore+r+jsx+typescript+renpy+reason+rest+rip+roboconf+crystal+rust+sas+sass+scss+scala+scheme+smalltalk+smarty+plsql+soy+stylus+swift+tcl+textile+twig+tsx+vbnet+velocity+verilog+vhdl+vim+visual-basic+wasm+wiki+xeora+xojo+yaml&plugins=line-numbers+toolbar+show-language */
/**
 * prism.js default theme for JavaScript, CSS and HTML
 * Based on dabblet (http://dabblet.com)
 * @author Lea Verou
 */
/*
* Dracula Theme for Prism.JS
*
* @author Gustavo Costa
* e-mail: gusbemacbe@gmail.com
*
* @contributor Jon Leopard
* e-mail: jonlprd@gmail.com
*
* @license MIT 2016-2018
*/
pre::-webkit-scrollbar {
  width: 14px;
}

pre::-webkit-scrollbar-track {
  background-color: #6272a4;
  border-radius: 0px;
}

pre::-webkit-scrollbar-thumb {
  background-color: #bd93f9;
  border-radius: 0px;
}

code[class*=language-],
pre[class*=language-] {
  color: #ccc;
  background: rgb(40, 41, 54);
  text-shadow: none;
  font-family: PT Mono, Consolas, Monaco, "Andale Mono", "Ubuntu Mono", monospace;
  text-align: left;
  white-space: pre;
  word-spacing: normal;
  word-break: normal;
  word-wrap: normal;
  line-height: 1.5;
  -moz-tab-size: 4;
  -o-tab-size: 4;
  tab-size: 4;
  -webkit-hyphens: none;
  -moz-hyphens: none;
  -ms-hyphens: none;
  hyphens: none;
}

pre[class*=language-]::-moz-selection,
pre[class*=language-] ::-moz-selection,
code[class*=language-]::-moz-selection,
code[class*=language-] ::-moz-selection {
  text-shadow: none;
  background-color: #5a5f80;
}

pre[class*=language-]::selection,
pre[class*=language-] ::selection,
code[class*=language-]::selection,
code[class*=language-] ::selection {
  text-shadow: none;
  background-color: #5a5f80;
}

@media print {
  code[class*=language-],
  pre[class*=language-] {
    text-shadow: none;
  }
}
/* Code blocks */
pre[class*=language-] {
  background: rgb(40, 41, 54) !important;
  border-radius: 0.5em;
  padding: 1em;
  margin: 0.5em 0;
  overflow: auto;
  height: auto;
}

:not(pre) > code[class*=language-],
pre[class*=language-] {
  background: rgb(40, 41, 54);
}

/* Inline code */
:not(pre) > code[class*=language-] {
  padding: 4px 7px;
  border-radius: 0.3em;
  white-space: normal;
}

.limit-300 {
  height: 300px !important;
}

.limit-400 {
  height: 400px !important;
}

.limit-500 {
  height: 500px !important;
}

.limit-600 {
  height: 600px !important;
}

.limit-700 {
  height: 700px !important;
}

.limit-800 {
  height: 800px !important;
}

.token.comment {
  color: rgb(98, 114, 164);
}

.token.prolog {
  color: rgb(207, 207, 194);
}

.token.tag {
  color: rgb(220, 104, 170);
}

.token.entity {
  color: rgb(139, 233, 253);
}

.token.atrule {
  color: rgb(98, 239, 117);
}

.token.url {
  color: rgb(102, 217, 239);
}

.token.selector {
  color: rgb(207, 207, 194);
}

.token.string {
  color: rgb(241, 250, 140);
}

.token.property {
  color: rgb(255, 184, 108);
}

.token.important {
  color: rgb(255, 121, 198);
  font-weight: bold;
}

.token.punctuation {
  color: white;
}

.token.number {
  color: rgb(189, 147, 249);
}

.token.function {
  color: rgb(80, 250, 123);
}

.token.class-name {
  color: rgb(255, 184, 108);
}

.token.keyword {
  color: rgb(255, 121, 198);
}

.token.boolean {
  color: rgb(255, 184, 108);
}

.token.operator {
  color: rgb(139, 233, 253);
}

.token.char {
  color: rgb(255, 135, 157);
}

.token.regex {
  color: rgb(80, 250, 123);
}

.token.variable {
  color: rgb(80, 250, 123);
}

.token.constant {
  color: rgb(255, 184, 108);
}

.token.symbol {
  color: rgb(255, 184, 108);
}

.token.builtin {
  color: rgb(255, 121, 198);
}

.token.attr-value {
  color: #7ec699;
}

.token.deleted {
  color: #e2777a;
}

.token.namespace {
  color: #e2777a;
}

.token.bold {
  font-weight: bold;
}

.token.italic {
  font-style: italic;
}

.token {
  color: #ff79c6;
}

.language-cpp .token.string {
  color: #8be9fd;
}

.language-c .token.string {
  color: #8be9fd;
}

.language-css .token.selector {
  color: rgb(80, 250, 123);
}

.language-css .token.property {
  color: rgb(255, 184, 108);
}

.language-java span.token.class-name {
  color: #8be9fd;
}

.language-java .token.class-name {
  color: #8be9fd;
}

.language-markup .token.attr-value {
  color: rgb(102, 217, 239);
}

.language-markup .token.tag {
  color: rgb(80, 250, 123);
}

.language-objectivec .token.property {
  color: #66d9ef;
}

.language-objectivec .token.string {
  color: #50fa7b;
}

.language-php .token.boolean {
  color: #8be9fd;
}

.language-php .token.function {
  color: #ff79c6;
}

.language-php .token.keyword {
  color: #66d9ef;
}

.language-ruby .token.symbol {
  color: #8be9fd;
}

.language-ruby .token.class-name {
  color: #cfcfc2;
}

pre.line-numbers {
  position: relative;
  padding-left: 3.8em;
  counter-reset: linenumber;
}

pre.line-numbers > code {
  position: relative;
  white-space: inherit;
}

.line-numbers .line-numbers-rows {
  position: absolute;
  pointer-events: none;
  top: 0;
  font-size: 100%;
  left: -3.8em;
  width: 3em; /* works for line-numbers below 1000 lines */
  letter-spacing: -1px;
  border-right: 1px solid #999;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.line-numbers-rows > span {
  pointer-events: none;
  display: block;
  counter-increment: linenumber;
}

.line-numbers-rows > span:before {
  content: counter(linenumber);
  color: #999;
  display: block;
  padding-right: 0.8em;
  text-align: right;
}

div.code-toolbar {
  position: relative;
}

div.code-toolbar > .toolbar {
  position: absolute;
  top: 0.3em;
  right: 0.2em;
  transition: opacity 0.3s ease-in-out;
  opacity: 0;
}

div.code-toolbar:hover > .toolbar {
  opacity: 1;
}

div.code-toolbar > .toolbar .toolbar-item {
  display: inline-block;
  padding-right: 20px;
}

div.code-toolbar > .toolbar a {
  cursor: pointer;
}

div.code-toolbar > .toolbar button {
  background: none;
  border: 0;
  color: inherit;
  font: inherit;
  line-height: normal;
  overflow: visible;
  padding: 0;
  -webkit-user-select: none; /* for button */
  -moz-user-select: none;
  -ms-user-select: none;
}

div.code-toolbar > .toolbar a,
div.code-toolbar > .toolbar button,
div.code-toolbar > .toolbar span {
  color: #ccc;
  font-size: 0.8em;
  padding: 0.5em;
  background: rgb(98, 114, 164);
  border-radius: 0.5em;
}

div.code-toolbar > .toolbar a:hover,
div.code-toolbar > .toolbar a:focus,
div.code-toolbar > .toolbar button:hover,
div.code-toolbar > .toolbar button:focus,
div.code-toolbar > .toolbar span:hover,
div.code-toolbar > .toolbar span:focus {
  color: inherit;
  text-decoration: none;
  background-color: var(--verde);
}

.gear-list {
  max-width: calc(3 * var(--content-width));
  width: 100%;
  display: grid;
  grid-template-columns: repeat(auto-fit, 20rem);
  grid-template-rows: auto;
  grid-gap: 2rem;
  justify-content: center;
  justify-items: center;
  padding: 2rem 1rem;
  margin: auto;
}
@media screen and (max-width: 490px) {
  .gear-list {
    display: block;
    width: 100%;
  }
}

.gear-list * {
  font-size: var(--font-size-minus-2);
}

.gear-item {
  width: 100%;
  position: relative;
  padding: 0.5rem;
  text-align: justify;
}
@media screen and (max-width: 490px) {
  .gear-item {
    display: block;
    width: 100%;
  }
}

.gear-item img {
  width: 100%;
  background: #ffffff;
}

.gear-item h3 {
  position: relative;
  z-index: 100;
  letter-spacing: 0;
  margin: 0;
}

.gear-item h3 a {
  display: block;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  width: 100%;
  max-width: 100%;
  font-size: 18px;
  padding: 0.6rem 0 0.2rem;
}

.gear-item .gear-link {
  display: block;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 10;
  color: transparent;
}

.book-list, .movie-list {
  display: flex;
  padding-bottom: 2rem;
}
.book-list .cover-photo img, .movie-list .cover-photo img {
  max-width: 200px;
  width: 20vw;
  border: 1px solid black;
}
.book-list .cover-photo, .movie-list .cover-photo {
  padding-right: 1rem;
}
:root {
  --break-mobile: 490px;
  --content-width: 980px;
  /*
  ### Grays
  */
  --color-gray-07: #111111;
  /* 07%  body text                            */
  --color-gray-20: #333333;
  /* 20%  headings, nav text                   */
  --color-gray-30: #4d4d4d;
  /* 30%  prism background                     */
  --color-gray-40: #666666;
  /* 40% dateline date                         */
  --color-gray-75: #c0c0c0;
  /* 75%  footer                               */
  --color-gray-88: #e0e0e0;
  /* 88%  table head/body sep, border of fold  */
  --color-gray-95: #f2f2f2;
  /* 95%  even row, bg of fold exp fold        */
  /*
  ### Reds
  */
  --color-red: #c22323;
  --color-red-faded: #fde2e2;
  /* folded text bg, table-caption highlight */
  --color-darkred: #7F0036;
  --color-darkred-faded: #7f00364d;
  --color-orange: #cc5630;
  --color-dark: #222830;
  --color-darkest: #101318;
  --color-light: #5f6874;
  --color-lighter: #abb1ba;
  --color-lightest: #f1f2f4;
  /*
  ### Foreground/Background
  */
  --color-white: #fff;
  --color-foreground: #86868b;
  --color-background: #f5f5f7;
  --color-bg-contrast: var(--color-gray-95);
  /* table even row */
  --color-body: var(--color-foreground);
  --color-nav-text: #86868b;
  --color-nav-hover: var(--color-orange);
  --color-heading: var(--color-gray-20);
  --color-figure-caption: var(--color-gray-40);
  --color-link: var(--color-orange);
  --color-footer: var(--color-lighter);
  --color-code: var(--color-lighter);
  /* naked code */
  --color-code-bg: var(--color-dark);
  --color-fold-marker: var(--color-darkred);
  --color-fold-expanded: var(--color-gray-95);
  --color-fold-head: var(--color-red-faded);
  --color-fold-border: var(--color-gray-88);
  --font-system: -apple-system, system-ui, "Helvetica Neue", Helvetica, Arial, sans-serif;
  --font-serif: "Playfair Display", -apple-system-ui-serif, ui-serif, "Georgia", serif;
  --font-sans-serif: -apple-system, system-ui, "Helvetica Neue", Helvetica, Arial, sans-serif;
  --font-mono: Consolas, Menlo, Monaco, "Andale Mono WT", "Andale Mono", "Lucida Console", "Lucida Sans Typewriter", "DejaVu Sans Mono", "Bitstream Vera Sans Mono", "Liberation Mono", "Nimbus Mono L", "Courier New", Courier, monospace;
  --font-body: var(--font-system);
  --font-caption: var(--font-system);
  --font-footer: var(--font-system);
  --font-heading: var(--font-system);
  --font-list: var(--font-system);
  --font-code: var(--font-mono);
  --font-code-size: 1em;
  --font-features: "xnum";
  /*  onum:   Old style numbers */
  /*
  ### Font size scale:
    https://www.modularscale.com/?1&em&1.25
  */
  --font-size-plus-3: 2.93rem;
  --font-size-plus-2: 2.344rem;
  --font-size-plus-1: 1.875rem;
  --font-size-plus-0: 1.5rem;
  --font-size-base: 1.5rem;
  --font-size-minus-0: 1.5rem;
  --font-size-minus-1: 1.2rem;
  --font-size-minus-2: 0.96rem;
  --font-size-minus-3: 0.768rem;
  --font-size-minus-4: 0.614rem;
}

*,
h1,
h2,
h3,
h4,
h5,
h6,
p,
a,
blockquote {
  font-family: var(--font-body);
}

h1 {
  font-size: var(--font-size-plus-1);
}

h2 {
  font-size: var(--font-size-plus-0);
}

h3 {
  font-size: var(--font-size-plus-0);
  color: var(--color-lighter);
}

h1,
h2,
h3,
h4,
h5,
h6 {
  padding: 1rem 0 0.6rem;
}

html {
  box-sizing: border-box;
  font-size: 100%;
  overflow: scroll;
  margin: auto;
  width: 100%;
}

*,
*:before,
*:after {
  box-sizing: inherit;
  margin-top: 0;
  margin-bottom: 0em;
}

p,
ul,
ol,
pre,
.paragraph,
details {
  padding-bottom: 2rem;
}

ul ul {
  padding-bottom: unset;
}

em,
hr,
span,
strong,
em {
  margin: initial;
}

strong {
  font-weight: bold;
}

details {
  cursor: pointer;
}
details aside {
  padding-top: 1rem;
  color: var(--color-lightest);
  border-left: 4px solid var(--color-light);
  margin-left: 0.25rem;
}
details aside ol,
details aside ul {
  padding-bottom: 0;
}

body {
  margin: auto;
  font-family: var(--font-body);
  font-weight: 400;
  line-height: 1.4;
  font-size: var(--font-size-base);
  color: var(--color-body);
  background-color: var(--color-background);
  scroll-behavior: smooth;
  --tt-key: body;
  --tt-ease: linear;
  --tt-max: 1200;
}

/* ----- tables.css ------ */
/*
### Tables
*/
:root {
  --color-table-odd: var(--color-bg-contrast);
  --color-table-even: var(--color-background);
  --color-table-body: var(--color-body);
  --color-table-heading: var(--color-heading);
  --color-table-caption: var(--color-darkred);
  --color-table-sep: var(--color-gray-88);
  --font-table-caption: var(--font-heading);
  --font-table-heading: var(--font-heading);
  --font-table-body: var(--font-body);
}

table {
  width: 100%;
  border-collapse: collapse;
  font-family: var(--font-table-body);
  color: var(--color-table-body);
  margin: 1.5em 0;
}

thead {
  font-family: var(--font-table-heading);
  border-bottom: 1px solid var(--color-table-sep);
}

tbody {
  hyphens: manual;
}

tbody tr:nth-child(odd) {
  background-color: var(--color-table-odd);
}

tbody tr:nth-child(even) {
  background-color: var(--color-table-even);
}

td {
  vertical-align: text-top;
  padding: 5px;
}

th {
  vertical-align: bottom;
  padding-bottom: 0;
  color: var(--color-table-heading);
}

table caption {
  caption-side: top;
  text-align: right;
  font-family: var(--font-table-caption);
  font-style: italic;
  font-weight: 200;
  color: var(--color-table-caption);
  margin-bottom: 0;
}

.table-caption {
  width: max-content;
  padding: 0;
  float: right;
  background-image: linear-gradient(180deg, transparent 75%, var(--color-red-faded) 0);
}

/**********************************************************************************

Tables which are responsive.

**/
/* Table Instagram */
.tbl-resp {
  display: block;
  margin: 2em auto;
  width: 100%;
}

.tbl-resp .flex-table {
  display: flex;
  flex-flow: row wrap;
  /*border-left: solid 1px #5f6874;*/
  transition: 0.5s;
}

.tbl-resp .flex-table:first-of-type {
  border-top: solid 1px #101318;
  /*border-left: solid 1px #101318;*/
}

.tbl-resp .flex-table:first-of-type .flex-row {
  background: #5f6874;
  color: white;
  border-color: #101318;
}

.tbl-resp .flex-table.row:nth-child(odd) .flex-row {
  background: rgba(95, 104, 116, 0.2);
}

.tbl-resp .flex-row {
  width: 20%;
  text-align: center;
  padding: 0.5em 0.5em;
  /*border-right: solid 1px #5f6874;*/
  border-bottom: solid 1px #5f6874;
  flex-grow: 1;
}

.tbl-resp .rowspan {
  display: flex;
  flex-flow: row wrap;
  align-items: flex-start;
  justify-content: center;
}

.tbl-resp .column {
  display: flex;
  flex-flow: column wrap;
  width: 80%;
  padding: 0;
}

.tbl-resp .column .flex-row {
  display: flex;
  flex-flow: row wrap;
  width: 100%;
  padding: 0;
  border: 0;
  border-bottom: solid 1px #5f6874;
}

.tbl-resp .flex-cell {
  width: 25%;
  text-align: center;
  padding: 0.5em 0.5em;
  /*border-right: solid 1px #5f6874;*/
}

@media all and (max-width: 767px) {
  .tbl-resp .flex-row,
  .tbl-resp .flex-cell {
    width: 50%;
  }
  .tbl-resp .flex-row.first,
  .tbl-resp .flex-table.row:nth-child(odd) .flex-row.first {
    width: 100%;
    background: #5f6874;
    color: white;
  }
  .tbl-resp .column {
    width: 100%;
  }
}
@media all and (max-width: 430px) {
  .tbl-resp .flex-table .flex-row {
    border-bottom: 0;
  }
  .tbl-resp .flex-table .flex-row:last-of-type {
    border-bottom: solid 1px #5f6874;
  }
  .tbl-resp .header .flex-row {
    border-bottom: solid 1px;
  }
  .tbl-resp .flex-row {
    width: 100%;
  }
  .tbl-resp .flex-row.first {
    width: 100%;
    border-bottom: solid 1px #5f6874;
  }
  .tbl-resp .column {
    width: 100%;
  }
  .tbl-resp .column .flex-row {
    border-bottom: solid 1px #5f6874;
  }
  .tbl-resp .flex-cell {
    width: 100%;
  }
}
/* Table Resolutions */
.tbl-resolutions {
  display: block;
  margin: 2em auto;
  width: 100%;
}

.tbl-resolutions .flex-table {
  display: flex;
  flex-flow: row wrap;
  /*border-left: solid 1px #5f6874;*/
  transition: 0.5s;
}

.tbl-resolutions .flex-table:first-of-type {
  border-top: solid 1px #101318;
  /*border-left: solid 1px #101318;*/
}

.tbl-resolutions .flex-table:first-of-type .flex-row {
  background: #5f6874;
  color: white;
  border-color: #101318;
}

.tbl-resolutions .flex-table.row:nth-child(odd) .flex-row {
  background: rgba(95, 104, 116, 0.2);
}

.tbl-resolutions .flex-table:hover {
  background: #5f6874;
  transition: 500ms;
}

.tbl-resolutions .flex-row {
  width: 16.6666666667%;
  text-align: center;
  padding: 0.5em 0.5em;
  /*border-right: solid 1px #5f6874;*/
  border-bottom: solid 1px #5f6874;
  flex-grow: 1;
}

.tbl-resolutions .rowspan {
  display: flex;
  flex-flow: row wrap;
  align-items: flex-start;
  justify-content: center;
}

.tbl-resolutions .column {
  display: flex;
  flex-flow: column wrap;
  width: 75%;
  padding: 0;
}

.tbl-resolutions .column .flex-row {
  display: flex;
  flex-flow: row wrap;
  width: 100%;
  padding: 0;
  border: 0;
  border-bottom: solid 1px #5f6874;
}

.tbl-resolutions .column .flex-row:hover {
  background: #F5F5F5;
  transition: 500ms;
}

.tbl-resolutions .flex-cell {
  width: 50%;
  text-align: center;
  padding: 0.5em 0.5em;
  /*border-right: solid 1px #5f6874;*/
}

@media all and (max-width: 767px) {
  .tbl-resolutions .flex-row {
    width: 25%;
  }
  .tbl-resolutions .flex-row.first,
  .tbl-resolutions .flex-table.row:nth-child(odd) .flex-row.first {
    width: 100%;
    background: #5f6874;
    color: white;
  }
  .tbl-resolutions .column {
    width: 100%;
  }
}
@media all and (max-width: 430px) {
  .tbl-resolutions .flex-table .flex-row {
    border-bottom: 0;
  }
  .tbl-resolutions .flex-table .flex-row:last-of-type {
    border-bottom: solid 1px #5f6874;
  }
  .tbl-resolutions .header .flex-row {
    border-bottom: solid 1px;
  }
  .tbl-resolutions .flex-row {
    width: 100%;
  }
  .tbl-resolutions .flex-row.first {
    width: 100%;
    border-bottom: solid 1px #5f6874;
  }
  .tbl-resolutions .column {
    width: 100%;
  }
  .tbl-resolutions .column .flex-row {
    border-bottom: solid 1px #5f6874;
  }
  .tbl-resolutions .flex-cell {
    width: 100%;
  }
}
/**
 * definition lists
 **/
dl {
  font-size: var(--font-size-minus-0);
}

dt {
  color: var(--color-heading);
  font-family: var(--font-heading);
  font-weight: 500;
  margin-bottom: 0rem;
}

dd {
  margin-left: 1em;
}

/**
 * This is what happens when you don't
 * document why you did something because
 * it's obvious.
 **/
ul {
  list-style-type: square;
}

ol {
  list-style-type: decimal;
}

/**
 *  list items should cuddle
 */
#content li {
  padding-bottom: 1rem;
}

#content li:last-child {
  padding-bottom: 0;
}

#content li blockquote {
  margin-top: 1rem;
}

main ol,
main ul {
  padding-left: 1em;
}

/**
 * List of posts
 **/
.posts-list {
  list-style-position: inside;
  list-style-type: none;
  padding-left: 0;
}

.posts-entry-title {
  font-family: var(--font-heading);
  font-weight: 600;
  margin: 0;
}

.posts-entry-title a {
  color: var(--color-gray-30);
}

.posts-entry-summary {
  font-family: var(--font-body);
  font-size: var(--font-size-minus-0);
  color: var(--color-gray-40);
}

.posts-entry-date {
  font-family: var(--font-body);
  font-weight: 400;
  color: var(--color-gray-40);
  font-size: var(--font-size-minus-1);
  font-style: italic;
}

.posts-entry-tag {
  font-family: var(--font-heading);
  font-size: var(--font-size-minus-1);
}

.posts-entry-footer {
  line-height: 1;
}

.posts-entry-summary,
.posts-entry-summary p {
  display: block;
  margin-bottom: 0;
}

.tagslist-tags {
  color: var(--color-red);
}

.footnotes {
  font-size: var(--font-size-minus-2);
}

.footnotes p {
  margin-bottom: 0;
  padding-bottom: 0;
}

.footnote-ref {
  display: inline-block;
  margin: 0;
}

.footnote-ref a, .littlefoot-footnote__button {
  display: inline-block;
  font-size: var(--font-size-minus-2);
  margin-left: 0.2rem;
  border-radius: 0.2rem;
  min-width: 1rem;
  text-align: center;
  text-decoration: none;
  -webkit-font-smoothing: antialiased;
  color: var(--color-white);
  background-color: var(--color-light);
  opacity: 0.6;
}

.footnote-ref a:hover, .littlefoot-footnote__button:hover {
  background-color: var(--color-light);
  opacity: 1;
  text-decoration: none;
}

.footnotes-sep {
  margin-top: 2em;
  border: 0;
  border-top: 1px solid var(--color-light);
  padding-top: 1em;
}

.footnote-backref {
  text-decoration: none;
}

.footnote-backref:hover {
  text-decoration: none;
}

.littlefoot-footnote__content {
  margin: 0;
  padding: 1rem 1.1rem;
}

figure {
  margin: 0;
  margin-bottom: 1em;
}

figure img {
  margin: 0;
  border-radius: 4px;
}

figcaption {
  line-height: 1;
  margin-top: -0.25em;
  margin-right: 0.25em;
  margin-bottom: 0;
  text-align: right;
  font-family: var(--font-caption);
  font-size: var(--font-size-minus-2);
  font-weight: 400;
  color: var(--color-figure-caption);
}

pre {
  max-width: 100%;
  overflow: scroll;
  padding: 0 1em;
  display: block;
  overflow-wrap: normal;
}

code {
  word-break: normal;
}

/*  how to display in-line code:
      apply only to naked <code> blocks
*/
code:not([class]) {
  font-family: var(--font-code);
  font-size: var(--font-code-size);
  color: var(--color-code);
}

/* for naked <code> */
pre:not([class]) code:not([class]) {
  background-color: inherit;
  color: var(--color-darkred);
}

a[href] > code {
  text-decoration: underline;
}

code[class*=language-], pre[class*=language-] {
  background: var(--color-code-bg) !important;
}

pre[class*=language-] {
  border-style: none;
  border-radius: 0.25em;
  margin: 0 0 1em 0 !important;
}

blockquote {
  margin: 0 1.5rem 2rem;
  border-left: 4px solid var(--color-lighter);
  color: var(--color-darkest);
  padding-left: 0.75rem;
  padding-bottom: 0;
}

blockquote p:last-child {
  padding-bottom: 0;
}

blockquote p cite::before {
  content: "— "; /* emdash-punctuationspace */
  white-space: pre;
}

/**
 * blockquote p:last-of-type cite,
 *
 * use this selector to ignore all but the final
 * cite in a blockquote.
 **/
blockquote p cite {
  font-style: italic;
  font-size: var(--font-size-minus-1);
  text-align: right;
  display: inline-block;
  width: 100%;
}

.quote-hero {
  width: 100vw;
  position: relative;
  left: 50%;
  right: 50%;
  margin: 4rem -50vw 6rem;
}

.quote-hero blockquote {
  text-align: center;
  width: calc(var(--content-width) * 2);
  max-width: 90%;
  margin: auto;
  padding: 0;
  border-left: 0;
  font-size: var(--font-size-plus-1);
}

.quote-hero blockquote p cite {
  text-align: center;
}

body > header {
  padding-top: 2rem;
  padding-bottom: 2rem;
}

body > header section.top {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding-bottom: 2rem;
}

@media screen and (max-width: 690px) {
  body > header section.top {
    flex-direction: column;
    gap: 2rem;
  }
}
body > header section.top section.header {
  display: flex;
  justify-content: start;
  align-items: center;
}

body > header section.top section.header #avatar {
  border-radius: 50%;
  width: 5rem;
  height: 5rem;
  margin-right: 1rem;
}

body > header section.top section.header .text {
  text-align: left;
  font-family: var(--font-serif);
}

body > header section.top section.header .text h1 {
  font-family: var(--font-serif);
  margin-bottom: 0;
  padding: 0;
  line-height: 2rem;
}

body > header section.top section.header .text a {
  font-family: var(--font-serif);
  text-decoration: none;
  color: var(--color-body);
  font-weight: bold;
}

body > header section.top section.header .text a:hover {
  text-decoration: none;
}

body > header section.top section.header .text em, body > header section.top section.header .text em a {
  font-weight: normal;
  font-style: normal;
}

body > header section.top section.header .text p {
  text-align: center;
  padding: 0;
  margin: 0;
}

body > header section.top .social {
  display: flex;
  flex-direction: row;
  justify-content: end;
  align-items: center;
}

body > header section.top .social a {
  display: block;
  padding: 0 1rem;
  color: var(--color-foreground);
  font-size: 1.5rem;
}

body > header section.top .social a:hover, body > header section.top .social a::selection {
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  color: var(--color-nav-hover);
  text-decoration: none;
  background: transparent;
}

.navMain.gear ul {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr;
}

@media screen and (max-width: 490px) {
  .navMain.gear ul {
    grid-template-columns: 1fr 1fr 1fr;
  }
}
.navMain ul {
  list-style: none;
  padding: 0;
  margin: 0;
  grid-gap: 0rem 1rem;
  display: flex;
  flex-direction: row;
  justify-content: space-around;
  padding-bottom: 2rem;
}

@media screen and (max-width: 490px) {
  .navMain ul {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
  }
}
.navMain ul li {
  text-align: center;
}

.navMain ul li a {
  display: block;
  padding: 0.3rem 0.3rem;
  color: var(--color-nav-text);
  text-decoration: none;
}

@media screen and (max-width: 490px) {
  .navMain ul li a {
    padding: 0.1rem 0.1rem 0;
  }
}
.navMain ul li a:hover, .navMain ul li a::selection {
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  color: var(--color-nav-hover);
  text-decoration: none;
  background: transparent;
}

footer {
  grid-area: foot;
  font-size: var(--font-size-minus-3);
  color: var(--color-footer);
  font-family: var(--font-footer);
  padding-top: 4rem;
  padding-bottom: 3rem;
}

footer #search {
  margin: 4rem auto;
  width: 100%;
}

footer #search form {
  display: grid;
  grid-gap: 1rem;
  grid-template-columns: 3fr 1fr;
  padding-bottom: 2rem;
}

@media screen and (max-width: 490px) {
  footer #search form {
    grid-template-columns: 1fr;
  }
}
footer ul {
  padding: 0;
  margin: 0;
  list-style: none;
  display: flex;
  justify-content: center;
}

@media screen and (max-width: 700px) {
  footer ul {
    display: block;
    text-align: center;
  }
  footer ul li {
    padding: 0.5rem 0 0;
  }
}
footer li:not(:first-child):before {
  content: "⋅";
  opacity: 0.35;
  margin: 0 0.5rem;
}

@media screen and (max-width: 700px) {
  footer li:not(:first-child):before {
    margin: 0;
    content: "";
  }
}
footer a[href] {
  text-transform: uppercase;
  color: inherit;
  text-decoration: none;
}

/* PrismJS 1.14.0
http://prismjs.com/download.html#themes=prism&languages=markup+css+clike+javascript+abap+actionscript+ada+apacheconf+apl+applescript+c+arff+asciidoc+asm6502+aspnet+autohotkey+autoit+bash+basic+batch+bison+brainfuck+bro+cpp+csharp+arduino+coffeescript+clojure+ruby+csp+css-extras+d+dart+diff+django+docker+eiffel+elixir+elm+markup-templating+erlang+fsharp+flow+fortran+gedcom+gherkin+git+glsl+go+graphql+groovy+haml+handlebars+haskell+haxe+http+hpkp+hsts+ichigojam+icon+inform7+ini+io+j+java+jolie+json+julia+keyman+kotlin+latex+less+liquid+lisp+livescript+lolcode+lua+makefile+markdown+erb+matlab+mel+mizar+monkey+n4js+nasm+nginx+nim+nix+nsis+objectivec+ocaml+opencl+oz+parigp+parser+pascal+perl+php+php-extras+sql+powershell+processing+prolog+properties+protobuf+pug+puppet+pure+python+q+qore+r+jsx+typescript+renpy+reason+rest+rip+roboconf+crystal+rust+sas+sass+scss+scala+scheme+smalltalk+smarty+plsql+soy+stylus+swift+tcl+textile+twig+tsx+vbnet+velocity+verilog+vhdl+vim+visual-basic+wasm+wiki+xeora+xojo+yaml&plugins=line-numbers+toolbar+show-language */
/**
 * prism.js default theme for JavaScript, CSS and HTML
 * Based on dabblet (http://dabblet.com)
 * @author Lea Verou
 */
/*
* Dracula Theme for Prism.JS
*
* @author Gustavo Costa
* e-mail: gusbemacbe@gmail.com
*
* @contributor Jon Leopard
* e-mail: jonlprd@gmail.com
*
* @license MIT 2016-2018
*/
pre::-webkit-scrollbar {
  width: 14px;
}

pre::-webkit-scrollbar-track {
  background-color: #6272a4;
  border-radius: 0px;
}

pre::-webkit-scrollbar-thumb {
  background-color: #bd93f9;
  border-radius: 0px;
}

code[class*=language-],
pre[class*=language-] {
  color: #ccc;
  background: rgb(40, 41, 54);
  text-shadow: none;
  font-family: PT Mono, Consolas, Monaco, "Andale Mono", "Ubuntu Mono", monospace;
  text-align: left;
  white-space: pre;
  word-spacing: normal;
  word-break: normal;
  word-wrap: normal;
  line-height: 1.5;
  -moz-tab-size: 4;
  -o-tab-size: 4;
  tab-size: 4;
  -webkit-hyphens: none;
  -moz-hyphens: none;
  -ms-hyphens: none;
  hyphens: none;
}

pre[class*=language-]::-moz-selection,
pre[class*=language-] ::-moz-selection,
code[class*=language-]::-moz-selection,
code[class*=language-] ::-moz-selection {
  text-shadow: none;
  background-color: #5a5f80;
}

pre[class*=language-]::selection,
pre[class*=language-] ::selection,
code[class*=language-]::selection,
code[class*=language-] ::selection {
  text-shadow: none;
  background-color: #5a5f80;
}

@media print {
  code[class*=language-],
  pre[class*=language-] {
    text-shadow: none;
  }
}
/* Code blocks */
pre[class*=language-] {
  background: rgb(40, 41, 54) !important;
  border-radius: 0.5em;
  padding: 1em;
  margin: 0.5em 0;
  overflow: auto;
  height: auto;
}

:not(pre) > code[class*=language-],
pre[class*=language-] {
  background: rgb(40, 41, 54);
}

/* Inline code */
:not(pre) > code[class*=language-] {
  padding: 4px 7px;
  border-radius: 0.3em;
  white-space: normal;
}

.limit-300 {
  height: 300px !important;
}

.limit-400 {
  height: 400px !important;
}

.limit-500 {
  height: 500px !important;
}

.limit-600 {
  height: 600px !important;
}

.limit-700 {
  height: 700px !important;
}

.limit-800 {
  height: 800px !important;
}

.token.comment {
  color: rgb(98, 114, 164);
}

.token.prolog {
  color: rgb(207, 207, 194);
}

.token.tag {
  color: rgb(220, 104, 170);
}

.token.entity {
  color: rgb(139, 233, 253);
}

.token.atrule {
  color: rgb(98, 239, 117);
}

.token.url {
  color: rgb(102, 217, 239);
}

.token.selector {
  color: rgb(207, 207, 194);
}

.token.string {
  color: rgb(241, 250, 140);
}

.token.property {
  color: rgb(255, 184, 108);
}

.token.important {
  color: rgb(255, 121, 198);
  font-weight: bold;
}

.token.punctuation {
  color: white;
}

.token.number {
  color: rgb(189, 147, 249);
}

.token.function {
  color: rgb(80, 250, 123);
}

.token.class-name {
  color: rgb(255, 184, 108);
}

.token.keyword {
  color: rgb(255, 121, 198);
}

.token.boolean {
  color: rgb(255, 184, 108);
}

.token.operator {
  color: rgb(139, 233, 253);
}

.token.char {
  color: rgb(255, 135, 157);
}

.token.regex {
  color: rgb(80, 250, 123);
}

.token.variable {
  color: rgb(80, 250, 123);
}

.token.constant {
  color: rgb(255, 184, 108);
}

.token.symbol {
  color: rgb(255, 184, 108);
}

.token.builtin {
  color: rgb(255, 121, 198);
}

.token.attr-value {
  color: #7ec699;
}

.token.deleted {
  color: #e2777a;
}

.token.namespace {
  color: #e2777a;
}

.token.bold {
  font-weight: bold;
}

.token.italic {
  font-style: italic;
}

.token {
  color: #ff79c6;
}

.language-cpp .token.string {
  color: #8be9fd;
}

.language-c .token.string {
  color: #8be9fd;
}

.language-css .token.selector {
  color: rgb(80, 250, 123);
}

.language-css .token.property {
  color: rgb(255, 184, 108);
}

.language-java span.token.class-name {
  color: #8be9fd;
}

.language-java .token.class-name {
  color: #8be9fd;
}

.language-markup .token.attr-value {
  color: rgb(102, 217, 239);
}

.language-markup .token.tag {
  color: rgb(80, 250, 123);
}

.language-objectivec .token.property {
  color: #66d9ef;
}

.language-objectivec .token.string {
  color: #50fa7b;
}

.language-php .token.boolean {
  color: #8be9fd;
}

.language-php .token.function {
  color: #ff79c6;
}

.language-php .token.keyword {
  color: #66d9ef;
}

.language-ruby .token.symbol {
  color: #8be9fd;
}

.language-ruby .token.class-name {
  color: #cfcfc2;
}

pre.line-numbers {
  position: relative;
  padding-left: 3.8em;
  counter-reset: linenumber;
}

pre.line-numbers > code {
  position: relative;
  white-space: inherit;
}

.line-numbers .line-numbers-rows {
  position: absolute;
  pointer-events: none;
  top: 0;
  font-size: 100%;
  left: -3.8em;
  width: 3em; /* works for line-numbers below 1000 lines */
  letter-spacing: -1px;
  border-right: 1px solid #999;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.line-numbers-rows > span {
  pointer-events: none;
  display: block;
  counter-increment: linenumber;
}

.line-numbers-rows > span:before {
  content: counter(linenumber);
  color: #999;
  display: block;
  padding-right: 0.8em;
  text-align: right;
}

div.code-toolbar {
  position: relative;
}

div.code-toolbar > .toolbar {
  position: absolute;
  top: 0.3em;
  right: 0.2em;
  transition: opacity 0.3s ease-in-out;
  opacity: 0;
}

div.code-toolbar:hover > .toolbar {
  opacity: 1;
}

div.code-toolbar > .toolbar .toolbar-item {
  display: inline-block;
  padding-right: 20px;
}

div.code-toolbar > .toolbar a {
  cursor: pointer;
}

div.code-toolbar > .toolbar button {
  background: none;
  border: 0;
  color: inherit;
  font: inherit;
  line-height: normal;
  overflow: visible;
  padding: 0;
  -webkit-user-select: none; /* for button */
  -moz-user-select: none;
  -ms-user-select: none;
}

div.code-toolbar > .toolbar a,
div.code-toolbar > .toolbar button,
div.code-toolbar > .toolbar span {
  color: #ccc;
  font-size: 0.8em;
  padding: 0.5em;
  background: rgb(98, 114, 164);
  border-radius: 0.5em;
}

div.code-toolbar > .toolbar a:hover,
div.code-toolbar > .toolbar a:focus,
div.code-toolbar > .toolbar button:hover,
div.code-toolbar > .toolbar button:focus,
div.code-toolbar > .toolbar span:hover,
div.code-toolbar > .toolbar span:focus {
  color: inherit;
  text-decoration: none;
  background-color: var(--verde);
}

.gear-list {
  max-width: calc(3 * var(--content-width));
  width: 100%;
  display: grid;
  grid-template-columns: repeat(auto-fit, 20rem);
  grid-template-rows: auto;
  grid-gap: 2rem;
  justify-content: center;
  justify-items: center;
  padding: 2rem 1rem;
  margin: auto;
}

@media screen and (max-width: 490px) {
  .gear-list {
    display: block;
    width: 100%;
  }
}
.gear-list * {
  font-size: var(--font-size-minus-2);
}

.gear-item {
  width: 100%;
  position: relative;
  padding: 0.5rem;
  text-align: justify;
}

@media screen and (max-width: 490px) {
  .gear-item {
    display: block;
    width: 100%;
  }
}
.gear-item img {
  width: 100%;
  background: #ffffff;
}

.gear-item h3 {
  position: relative;
  z-index: 100;
  letter-spacing: 0;
  margin: 0;
}

.gear-item h3 a {
  display: block;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  width: 100%;
  max-width: 100%;
  font-size: 18px;
  padding: 0.6rem 0 0.2rem;
}

.gear-item .gear-link {
  display: block;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 10;
  color: transparent;
}

.book-list, .movie-list {
  display: flex;
  padding-bottom: 2rem;
}

.book-list .cover-photo img, .movie-list .cover-photo img {
  max-width: 200px;
  width: 20vw;
  border: 1px solid black;
}

.book-list .cover-photo, .movie-list .cover-photo {
  padding-right: 1rem;
}

a {
  text-decoration: none;
  color: var(--color-link);
  text-decoration: underline;
}
a:hover {
  cursor: pointer;
  pointer-events: auto;
  text-decoration: underline;
}

a.permalink {
  text-decoration: none;
}
a.permalink:hover {
  text-decoration: none;
}

h1 a,
h1 a:hover,
h1 a:visited,
h1 a:active,
h2 a,
h2 a:hover,
h2 a:visited,
h2 a:active,
h3 a,
h3 a:hover,
h3 a:visited,
h3 a:active,
h4 a,
h4 a:hover,
h4 a:visited,
h4 a:active,
h5 a,
h5 a:hover,
h5 a:visited,
h5 a:active,
h6 a,
h6 a:hover,
h6 a:visited,
h6 a:active {
  text-decoration: none;
  color: var(--color-body);
}

article header {
  text-align: left;
}
article header h1,
article header h2,
article header h3 {
  padding: 0;
}
article header p time {
  color: var(--color-code);
}

.image-hero {
  width: 100vw;
  position: relative;
  left: 50%;
  right: 50%;
  margin-left: -50vw;
  margin-right: -50vw;
  text-align: center;
}
.image-hero img {
  width: calc(var(--content-width) * 2) !important;
  max-width: 100%;
  margin: auto;
  width: 100%;
  margin: auto;
  padding: 0;
}

.container {
  width: 90%;
  max-width: var(--content-width);
  margin: auto;
}

.padding-bottom {
  padding-bottom: 2rem;
}

.padding-top {
  padding-top: 2rem;
}

.padding-left {
  padding-left: 2rem;
}

.padding-right {
  padding-right: 2rem;
}

img[src*="#signature"],
.signature img {
  margin-left: 40px;
  width: 200px;
}

h2 {
  margin-bottom: 0;
  padding-top: 8rem;
}
h2 a {
  color: var(--color-body);
  text-decoration: none;
}
h2 a:hover {
  text-decoration: none;
}

pre,
code {
  font-family: var(--font-code);
  line-height: 1.5;
}

pre {
  font-size: 14px;
  line-height: 1.375;
  direction: ltr;
  text-align: left;
  white-space: pre;
  word-spacing: normal;
  word-break: normal;
  -moz-tab-size: 2;
  -o-tab-size: 2;
  tab-size: 2;
  -webkit-hyphens: none;
  -moz-hyphens: none;
  -ms-hyphens: none;
  hyphens: none;
  padding: 1em;
  margin: 0.5em 0;
  background-color: #f6f6f6;
}

p code {
  background: var(--color-code-bg) !important;
  border-radius: 0.2em;
  padding: 0.1rem 0.3rem 0.3rem;
  color: var(--color-code);
}

.highlight-line {
  display: inline-block;
  /* del, ins, mark default styles */
  text-decoration: none;
  color: inherit;
}

/* allow highlighting empty lines */
.highlight-line:empty:before {
  content: " ";
}

.highlight-line:not(:last-child) {
  min-width: 100%;
}

.highlight-line .highlight-line:not(:last-child) {
  min-width: 0;
}

/*
 * Dark theme
 */
.highlight-line-isdir {
  color: #b0b0b0;
  background-color: #222;
}

.highlight-line-active {
  background-color: #444;
  background-color: hsla(0, 0%, 27%, 0.8);
}

.highlight-line-add {
  background-color: #45844b;
}

.highlight-line-remove {
  background-color: #902f2f;
}

.image {
  background-color: green;
}

.post.blog {
  padding-bottom: 6rem;
}

.post p img {
  width: 100%;
}

.linkBack,
.feedback,
.linkBack a,
.feedback a {
  padding-top: 4rem;
  text-align: center;
  text-decoration: none;
}

.text-center {
  text-align: center;
}

.side-by-side {
  display: grid;
  grid-gap: 1rem;
  grid-template-columns: 1fr 1fr;
  padding-bottom: 2rem;
}
@media screen and (max-width: 490px) {
  .side-by-side {
    grid-template-columns: 1fr;
  }
}

.cal-scheduling {
  width: 100vw;
  position: relative;
  left: 50%;
  right: 50%;
  margin-left: -50vw;
  margin-right: -50vw;
}

.header-image-three {
  width: 100vw;
  position: relative;
  left: 50%;
  right: 50%;
  margin-left: -50vw;
  margin-right: -50vw;
}
.header-image-three p {
  width: calc(var(--content-width) * 3);
  max-width: 100vw;
  margin: auto;
  display: flex;
  padding: 0;
}
.header-image-three img {
  width: 33.3333333333%;
  height: 33.3333333333%;
}
.header-image-three br {
  width: 0;
  display: none;
}

#newsletter-embed #mlb2-6177287.ml-form-embedContainer .ml-form-embedWrapper .ml-form-embedBody .ml-form-embedSubmit button,
.formkit-form button,
.btn {
  text-align: center !important;
  color: var(--color-body) !important;
  text-decoration: none !important;
  border: 2px solid var(--color-link) !important;
  background-color: transparent !important;
  padding: 0.5rem 1rem !important;
  letter-spacing: 0.1rem !important;
  font-weight: bold !important;
}

#newsletter-embed #mlb2-6177287.ml-form-embedContainer .ml-form-embedWrapper .ml-form-embedBody .ml-form-embedSubmit button:hover,
.formkit-form button:hover,
.btn:hover {
  color: var(--color-white) !important;
  background-color: var(--color-light) !important;
  text-decoration: none !important;
}

.btn-block {
  width: 100% !important;
  display: block !important;
}

.btn-center {
  margin: auto;
}

#newsletter-embed {
  padding: 3rem 0 4rem;
}

#newsletter-embed #mlb2-6177287.ml-form-embedContainer .ml-form-embedWrapper .ml-form-embedBody .ml-form-fieldRow input,
input:not([type=submit]) {
  height: inherit !important;
  line-height: inherit !important;
  font-family: inherit !important;
  width: 100% !important;
  padding: 0.5rem !important;
  margin: 0.5rem 0 !important;
  font-size: var(--font-size-base) !important;
  color: var(--color-body) !important;
  border: 2px solid var(--color-light) !important;
  background-color: transparent !important;
  border-radius: 0% !important;
}

::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
  color: var(--color-lighter) !important;
  opacity: 0.5 !important; /* Firefox */
}

input[type=submit] {
  font-family: inherit !important;
  padding: 0.5rem !important;
  margin: 0.5rem 0 !important;
}

#newsletter-embed #mlb2-6177287.ml-form-embedContainer .ml-form-embedWrapper .ml-form-embedBody .ml-form-embedSubmit button,
.formkit-form button,
input[type=submit],
.btn,
.btn-block {
  font-family: inherit !important;
  cursor: pointer !important;
  font-size: var(--font-size-minus-1) !important;
}

.formkit-form [data-style=clean],
#mlb2-6177287.ml-form-embedContainer .ml-form-embedWrapper .ml-form-embedBody,
#mlb2-6177287.ml-form-embedContainer .ml-form-embedWrapper .ml-form-successBody {
  padding: 0 !important;
}

.formkit-form {
  max-width: 100% !important;
}

.formkit-form .formkit-fields {
  display: grid;
  grid-gap: 1rem !important;
}

.formkit-form .formkit-field,
.formkit-form input,
.formkit-form button {
  margin: 0 !important;
}

.formkit-form button {
  border-radius: 0 !important;
}

.formkit-form button span,
.formkit-form button span:hover {
  display: block !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  background-color: transparent !important;
}

.formkit-form .formkit-alert {
  margin-bottom: 0 !important;
}

.formkit-form div[data-style=clean] {
  display: flex;
  flex-direction: column-reverse;
}

.formkit-powered-by-convertkit-container {
  display: none !important;
}