/* Markdown */
@imprt url("./modus_operandi_tinted.css")
:root{
--maincolor: var(--red-warmer);
--bordercl:rebeccapurple;
--callouctcolor:dodgerblue;
--hovercolor:navy;
--darkMaincolor: #50fa7b;
}
html {
  color: #232333;
  font-family: 'Roboto Mono', monospace;
  font-size: 15px;
  line-height: 1.6em;
}
body{
  display: block;
  margin: 8px;
}
* {
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

::selection {
  background: var(--maincolor);
  color: #fff;
}

p {
  font-family: 'Fira Sans', sans-serif;
  line-height: 1.5;
}

hr {
  border: 0;
  border-top: 3px dotted var(--bordercl);
  margin: 1em 0;
}

blockquote {
  border-left: 3px solid var(--bordercl);
  color: #737373;
  margin: 0;
  padding-left: 1em;
}

/* a { */
/*   border-bottom: 3px solid var(--maincolor); */
/*   color: inherit; */
/*   text-decoration: none; */
/* } */
/* a:hover { */
/*     background-color: var(--hovercolor); */
/*     color: #fff; */
/* } */

ul {
  list-style: none;
  padding-left: 2ch;
}
ul li {
  text-indent: -2ch;
}
ul > li::before {
  content: '* ';
  font-weight: bold;
}

/* Images */
img {
  border: 3px solid #ececec;
  max-width: 100%;
}

figure {
  box-sizing: border-box;
  display: inline-block;
  margin: 0;
  max-width: 100%;
}

figure img {
  max-height: 500px;
}

@media screen and (min-width: 600px) {
  figure {
    padding: 0 40px;
  }
}

figure h4 {
  font-size: 1rem;
  margin: 0;
  margin-bottom: 1em;
}
figure h4::before {
  content: '↳ ';
}

pre {
  background-color: #ececec;
  line-height: 1.4;
  overflow-x: auto;
  padding: 1em;
}

.highlight pre ::selection {
  background: rgba(255, 255, 255, 0.2);
  color: inherit;
}

pre code {
  background-color: transparent;
  color: inherit;
  font-size: 100%;
  padding: 0;
}

/* Containers */
.content {
  margin-bottom: 4em;
  margin-left: auto;
  margin-right: auto;
  max-width: 800px;
  padding: 0 1ch;
  word-wrap: break-word;
}

/* Header */
header {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  margin: 1em 0;
  line-height: 2.5em;
}

header .main {
  font-size: 1.5rem;
}
/* h1, h2, h3, h4, h5, h6 { */
/*   font-size: 1.2rem; */
/*   margin-top: 2em; */
/* } */


.meta {
  color: #999;
  letter-spacing: -0.5px;
}

/* Footer */
footer {
  display: flex;
  align-items: center;
  border-top: 0.4rem dotted var(--bordercl);
  padding: 2rem 0rem;
  margin-top: 2rem;
}
.soc {
  display: flex;
  align-items: center;
  border-bottom: none;
}
.border {
  margin-left: 0.5rem;
  margin-right: 0.5rem;
  border: 1px solid;
}
.footer-info {
  padding: var(--footer-padding);
}

/* Common */
.title h1 {
  margin-bottom: 0;
}

time {
  color: grey;
}

/* Posts */
article .title {
  margin-bottom: 1em;
}


/* Callout */
.callout {
  background-color: var(--callouctcolor);
  color: #fff;
  padding: 1em;
}

.callout p {
  font-family: 'IBM Plex Mono', monospace;
  margin: 0;
}

.callout a {
  border-bottom: 3px solid #fff;
}

.callout a:hover {
  background-color: #fff;
  color: var(--callouctcolor);
}

.site-description {
display: flex;
justify-content: space-between;
}
.tags li::before{
  content: "🏷 ";
}
.tags a{
  border-bottom: 3px solid var(--maincolor);
}
.tags a:hover{
  color:white;
  background-color: var(--hovercolor);
}
svg{
  max-height: 15px;
}
.soc:hover{
  color: white;
}
.draft-label{
    color: var(--bordercl);
    text-decoration: none;
    padding: 2px 4px;
    border-radius: 4px;
    margin-left: 6px;
    background-color: #f9f2f4;
}
.highlight {
  position: relative;
  -webkit-overflow-scrolling: touch;
}
.highlight pre code[class*="language-"] {
  -webkit-overflow-scrolling: touch;
}
.highlight pre code[class*="language-"]::before {
  background: black;
  border-radius: 0 0 0.25rem 0.25rem;
  color: white;
  font-size: 12px;
  letter-spacing: 0.025rem;
  padding: 0.1rem 0.5rem;
  position: absolute;
  right: 1rem;
  text-align: right;
  text-transform: uppercase;
  top: 0;
}

.highlight pre code[class=language-javaScript]::before,
.highlight pre code[class="language-js"]::before {
content: "js";
background: #f7df1e;
color: black;
}
.highlight pre code[class*='language-yml']::before,
.highlight pre code[class*='language-yaml']::before {
content: 'yaml';
background: #f71e6a;
color: white;
}
.highlight pre code[class*='language-shell']::before,
.highlight pre code[class*='language-bash']::before,
.highlight pre code[class*='language-sh']::before {
content: 'shell';
background: green;
color:white
}
.highlight pre code[class*='language-json']::before{
content: 'json';
background: dodgerblue;
 color: #000000
}
.highlight pre code[class*='language-python']::before,
.highlight pre code[class*='language-py']::before {
content: 'py';
background: blue;
color: yellow ;
}
.highlight pre code[class*='language-css']::before{
content: 'css';
background: cyan;
color: black ;
}
.highlight pre code[class*='language-go']::before{
content: 'Go';
background: cyan;
color: royalblue ;
}
.highlight pre code[class*='language-md']::before,
.highlight pre code[class*='language-md']::before{
content: 'Markdown';
background: royalblue;
color: whitesmoke ;
}

/* table */
table {
  border-spacing: 0;
  border-collapse: collapse;
}

table th{
  padding: 6px 13px;
  border: 1px solid #dfe2e5;
  font-size: large;
}

table td{
  padding: 6px 13px;
  border: 1px solid #dfe2e5;
}
/* Markdown */
/* :root { */
/*     font-family: "Rosario"; */
/*     --bg-main: #fbf7f0; */
/*     --bg-dim: #efe9dd; */
/*     --fg-main: #000000; */
/*     --fg-dim: #595959; */
/*     --fg-alt: #193668; */
/*     --bg-active: #c9b9b0; */
/*     --bg-inactive: #dfd5cf; */
/*     --border: #9f9690; */
/*     --red: #a60000; */
/*     --red-warmer: #972500; */
/*     --red-cooler: #a0132f; */
/*     --red-faint: #7f0000; */
/*     --red-intense: #d00000; */
/*     --green: #006800; */
/*     --green-warmer: #316500; */
/*     --green-cooler: #00663f; */
/*     --green-faint: #2a5045; */
/*     --green-intense: #008900; */
/*     --yellow: #6f5500; */
/*     --yellow-warmer: #884900; */
/*     --yellow-cooler: #7a4f2f; */
/*     --yellow-faint: #624416; */
/*     --yellow-intense: #808000; */
/*     --blue: #0031a9; */
/*     --blue-warmer: #3548cf; */
/*     --blue-cooler: #0000b0; */
/*     --blue-faint: #003497; */
/*     --blue-intense: #0000ff; */
/*     --magenta: #721045; */
/*     --magenta-warmer: #8f0075; */
/*     --magenta-cooler: #531ab6; */
/*     --magenta-faint: #7c318f; */
/*     --magenta-intense: #dd22dd; */
/*     --cyan: #005e8b; */
/*     --cyan-warmer: #3f578f; */
/*     --cyan-cooler: #005f5f; */
/*     --cyan-faint: #005077; */
/*     --cyan-intense: #008899; */
/*     --rust: #8a290f; */
/*     --gold: #80601f; */
/*     --olive: #56692d; */
/*     --slate: #2f3f83; */
/*     --indigo: #4a3a8a; */
/*     --maroon: #731c52; */
/*     --pink: #7b435c; */
/*     --bg-red-intense: #ff8f88; */
/*     --bg-green-intense: #8adf80; */
/*     --bg-yellow-intense: #f3d000; */
/*     --bg-blue-intense: #bfc9ff; */
/*     --bg-magenta-intense: #dfa0f0; */
/*     --bg-cyan-intense: #a4d5f9; */
/*     --bg-red-subtle: #ffcfbf; */
/*     --bg-green-subtle: #b3fabf; */
/*     --bg-yellow-subtle: #fff576; */
/*     --bg-blue-subtle: #ccdfff; */
/*     --bg-magenta-subtle: #ffddff; */
/*     --bg-cyan-subtle: #bfefff; */
/*     --bg-red-nuanced: #ffe8e8; */
/*     --bg-green-nuanced: #e0f6e0; */
/*     --bg-yellow-nuanced: #f8f0d0; */
/*     --bg-blue-nuanced: #ecedff; */
/*     --bg-magenta-nuanced: #f8e6f5; */
/*     --bg-cyan-nuanced: #e0f2fa; */
/*     --bg-clay: #f1c8b5; */
/*     --fg-clay: #63192a; */
/*     --bg-ochre: #f0e3c0; */
/*     --fg-ochre: #573a30; */
/*     --bg-lavender: #dfcdfa; */
/*     --fg-lavender: #443379; */
/*     --bg-sage: #c0e7d4; */
/*     --fg-sage: #124b41; */
/*     --bg-graph-red-0: #ef7969; */
/*     --bg-graph-red-1: #ffaab4; */
/*     --bg-graph-green-0: #45c050; */
/*     --bg-graph-green-1: #75ef30; */
/*     --bg-graph-yellow-0: #ffcf00; */
/*     --bg-graph-yellow-1: #f9ff00; */
/*     --bg-graph-blue-0: #7f90ff; */
/*     --bg-graph-blue-1: #a6c0ff; */
/*     --bg-graph-magenta-0: #e07fff; */
/*     --bg-graph-magenta-1: #fad0ff; */
/*     --bg-graph-cyan-0: #70d3f0; */
/*     --bg-graph-cyan-1: #afefff; */
/*     --bg-completion: #f0c1cf; */
/*     --bg-hover: #b2e4dc; */
/*     --bg-hover-secondary: #f5d0a0; */
/*     --bg-hl-line: #f1d5d0; */
/*     --bg-region: #c2bcb5; */
/*     --fg-region: #000000; */
/*     --bg-char-0: #7feaff; */
/*     --bg-char-1: #ffaaff; */
/*     --bg-char-2: #dff000; */
/*     --bg-mode-line-active: #cab9b2; */
/*     --fg-mode-line-active: #000000; */
/*     --border-mode-line-active: #545454; */
/*     --bg-mode-line-inactive: #dfd9cf; */
/*     --fg-mode-line-inactive: #585858; */
/*     --border-mode-line-inactive: #a59a94; */
/*     --modeline-err: #7f0000; */
/*     --modeline-warning: #5f0070; */
/*     --modeline-info: #002580; */
/*     --bg-tab-bar: #e0d4ce; */
/*     --bg-tab-current: #fbf7f0; */
/*     --bg-tab-other: #c8b8b2; */
/*     --bg-added: #c3ebc1; */
/*     --bg-added-faint: #dcf8d1; */
/*     --bg-added-refine: #acd6a5; */
/*     --bg-added-fringe: #6cc06c; */
/*     --fg-added: #005000; */
/*     --fg-added-intense: #006700; */
/*     --bg-changed: #ffdfa9; */
/*     --bg-changed-faint: #ffefbf; */
/*     --bg-changed-refine: #fac090; */
/*     --bg-changed-fringe: #c0b200; */
/*     --fg-changed: #553d00; */
/*     --fg-changed-intense: #655000; */
/*     --bg-removed: #f4d0cf; */
/*     --bg-removed-faint: #ffe9e5; */
/*     --bg-removed-refine: #f3b5a7; */
/*     --bg-removed-fringe: #d84a4f; */
/*     --fg-removed: #8f1313; */
/*     --fg-removed-intense: #aa2222; */
/*     --bg-diff-context: #efe9df; */
/*     --bg-paren-match: #7fdfcf; */
/*     --fg-paren-match: #000000; */
/*     --bg-paren-expression: #efd3f5; */
/*     --underline-paren-match: #ffffff; */
/*     --fringe: #efe9dd; */
/*     --cursor: #d00000; */
/*     --keybind: #a60000; */
/*     --name: #721045; */
/*     --identifier: #7a4f2f; */
/*     --err: #a60000; */
/*     --warning: #884900; */
/*     --info: #005f5f; */
/*     --underline-err: #d00000; */
/*     --underline-warning: #808000; */
/*     --underline-note: #008899; */
/*     --bg-prominent-err: #ff8f88; */
/*     --fg-prominent-err: #000000; */
/*     --bg-prominent-warning: #f3d000; */
/*     --fg-prominent-warning: #000000; */
/*     --bg-prominent-note: #a4d5f9; */
/*     --fg-prominent-note: #000000; */
/*     --bg-active-argument: #f8f0d0; */
/*     --fg-active-argument: #884900; */
/*     --bg-active-value: #e0f2fa; */
/*     --fg-active-value: #3f578f; */
/*     --builtin: #8f0075; */
/*     --comment: #7f0000; */
/*     --constant: #0000b0; */
/*     --docstring: #2a5045; */
/*     --docmarkup: #7c318f; */
/*     --fnname: #721045; */
/*     --keyword: #531ab6; */
/*     --preprocessor: #a0132f; */
/*     --string: #3548cf; */
/*     --type: #005f5f; */
/*     --variable: #005e8b; */
/*     --rx-construct: #00663f; */
/*     --rx-backslash: #721045; */
/*     --accent-0: #0031a9; */
/*     --accent-1: #8f0075; */
/*     --accent-2: #005e8b; */
/*     --accent-3: #a60000; */
/*     --fg-button-active: #000000; */
/*     --fg-button-inactive: #595959; */
/*     --bg-button-active: #c9b9b0; */
/*     --bg-button-inactive: #efe9dd; */
/*     --fg-completion-match-0: #0031a9; */
/*     --fg-completion-match-1: #8f0075; */
/*     --fg-completion-match-2: #005e8b; */
/*     --fg-completion-match-3: #a60000; */
/*     --bg-completion-match-0: #ffffff; */
/*     --bg-completion-match-1: #ffffff; */
/*     --bg-completion-match-2: #ffffff; */
/*     --bg-completion-match-3: #ffffff; */
/*     --date-common: #005e8b; */
/*     --date-deadline: #a60000; */
/*     --date-event: #193668; */
/*     --date-holiday: #a0132f; */
/*     --date-holiday-other: #0031a9; */
/*     --date-now: #000000; */
/*     --date-range: #193668; */
/*     --date-scheduled: #884900; */
/*     --date-weekday: #005e8b; */
/*     --date-weekend: #7f0000; */
/*     --fg-line-number-inactive: #595959; */
/*     --fg-line-number-active: #000000; */
/*     --bg-line-number-inactive: #efe9dd; */
/*     --bg-line-number-active: #c9b9b0; */
/*     --fg-link: #3548cf; */
/*     --bg-link: #ffffff; */
/*     --underline-link: #3548cf; */
/*     --fg-link-symbolic: #005e8b; */
/*     --bg-link-symbolic: #ffffff; */
/*     --underline-link-symbolic: #005e8b; */
/*     --fg-link-visited: #721045; */
/*     --bg-link-visited: #ffffff; */
/*     --underline-link-visited: #721045; */
/*     --mail-cite-0: #003497; */
/*     --mail-cite-1: #884900; */
/*     --mail-cite-2: #005f5f; */
/*     --mail-cite-3: #a0132f; */
/*     --mail-part: #005e8b; */
/*     --mail-recipient: #531ab6; */
/*     --mail-subject: #8f0075; */
/*     --mail-other: #7c318f; */
/*     --bg-mark-delete: #ffcfbf; */
/*     --fg-mark-delete: #a60000; */
/*     --bg-mark-select: #bfefff; */
/*     --fg-mark-select: #005e8b; */
/*     --bg-mark-other: #fff576; */
/*     --fg-mark-other: #6f5500; */
/*     --fg-prompt: #005f5f; */
/*     --bg-prompt: #ffffff; */
/*     --bg-prose-block-delimiter: #efe9dd; */
/*     --fg-prose-block-delimiter: #595959; */
/*     --bg-prose-block-contents: #efe9dd; */
/*     --bg-prose-code: #ffffff; */
/*     --fg-prose-code: #005f5f; */
/*     --bg-prose-macro: #ffffff; */
/*     --fg-prose-macro: #531ab6; */
/*     --bg-prose-verbatim: #ffffff; */
/*     --fg-prose-verbatim: #8f0075; */
/*     --prose-done: #006800; */
/*     --prose-todo: #a60000; */
/*     --prose-metadata: #595959; */
/*     --prose-metadata-value: #193668; */
/*     --prose-table: #193668; */
/*     --prose-table-formula: #8f0075; */
/*     --prose-tag: #7c318f; */
/*     --rainbow-0: #000000; */
/*     --rainbow-1: #dd22dd; */
/*     --rainbow-2: #008899; */
/*     --rainbow-3: #972500; */
/*     --rainbow-4: #808000; */
/*     --rainbow-5: #531ab6; */
/*     --rainbow-6: #008900; */
/*     --rainbow-7: #3548cf; */
/*     --rainbow-8: #8f0075; */
/*     --bg-search-current: #f3d000; */
/*     --bg-search-lazy: #a4d5f9; */
/*     --bg-search-replace: #ff8f88; */
/*     --bg-search-rx-group-0: #bfc9ff; */
/*     --bg-search-rx-group-1: #8adf80; */
/*     --bg-search-rx-group-2: #ffcfbf; */
/*     --bg-search-rx-group-3: #ffddff; */
/*     --bg-space: #ffffff; */
/*     --fg-space: #9f9690; */
/*     --bg-space-err: #ff8f88; */
/*     --bg-term-black: #000000; */
/*     --fg-term-black: #000000; */
/*     --bg-term-black-bright: #595959; */
/*     --fg-term-black-bright: #595959; */
/*     --bg-term-red: #a60000; */
/*     --fg-term-red: #a60000; */
/*     --bg-term-red-bright: #972500; */
/*     --fg-term-red-bright: #972500; */
/*     --bg-term-green: #006800; */
/*     --fg-term-green: #006800; */
/*     --bg-term-green-bright: #00663f; */
/*     --fg-term-green-bright: #00663f; */
/*     --bg-term-yellow: #6f5500; */
/*     --fg-term-yellow: #6f5500; */
/*     --bg-term-yellow-bright: #884900; */
/*     --fg-term-yellow-bright: #884900; */
/*     --bg-term-blue: #0031a9; */
/*     --fg-term-blue: #0031a9; */
/*     --bg-term-blue-bright: #3548cf; */
/*     --fg-term-blue-bright: #3548cf; */
/*     --bg-term-magenta: #721045; */
/*     --fg-term-magenta: #721045; */
/*     --bg-term-magenta-bright: #531ab6; */
/*     --fg-term-magenta-bright: #531ab6; */
/*     --bg-term-cyan: #005e8b; */
/*     --fg-term-cyan: #005e8b; */
/*     --bg-term-cyan-bright: #005f5f; */
/*     --fg-term-cyan-bright: #005f5f; */
/*     --bg-term-white: #a6a6a6; */
/*     --fg-term-white: #a6a6a6; */
/*     --bg-term-white-bright: #ffffff; */
/*     --fg-term-white-bright: #ffffff; */
/*     --fg-heading-0: #005f5f; */
/*     --fg-heading-1: #000000; */
/*     --fg-heading-2: #624416; */
/*     --fg-heading-3: #193668; */
/*     --fg-heading-4: #721045; */
/*     --fg-heading-5: #2a5045; */
/*     --fg-heading-6: #7f0000; */
/*     --fg-heading-7: #3f578f; */
/*     --fg-heading-8: #595959; */
/*     --bg-heading-0: #ffffff; */
/*     --bg-heading-1: #ffffff; */
/*     --bg-heading-2: #ffffff; */
/*     --bg-heading-3: #ffffff; */
/*     --bg-heading-4: #ffffff; */
/*     --bg-heading-5: #ffffff; */
/*     --bg-heading-6: #ffffff; */
/*     --bg-heading-7: #ffffff; */
/*     --bg-heading-8: #ffffff; */
/*     --overline-heading-0: #ffffff; */
/*     --overline-heading-1: #ffffff; */
/*     --overline-heading-2: #ffffff; */
/*     --overline-heading-3: #ffffff; */
/*     --overline-heading-4: #ffffff; */
/*     --overline-heading-5: #ffffff; */
/*     --overline-heading-6: #ffffff; */
/*     --overline-heading-7: #ffffff; */
/*     --overline-heading-8: #ffffff; */
/* } */


* {
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

::selection {
    background: var(--border);
}

p {
    font-family: "Iosevka Aile";
    line-height: 2em;
}

hr {
    border: 0;
    border-top: 3px dotted var(--bordercl);
    margin: 1em 0;
}

blockquote {
    border-left: 3px solid var(--bordercl);
    color: #737373;
    margin: 0;
    padding-left: 1em;
}

/* a { */
/*     border-bottom: 2px solid var(--maincolor); */
/*     color: inherit; */
/*     text-decoration: none; */
/* } */
/* a:hover { */
/*     background-color: var(--hovercolor); */
/*     color: #fff; */
/* } */
n ul {
    list-style: none;
    padding-left: 2ch;
}
ul li {
    text-indent: 0ch;
}
ul > li::before {
  content: "- ";
  font-weight: bold;
}

/* Images */
img {
    border: 3px solid #ececec;
    max-width: 100%;
}

figure {
    box-sizing: border-box;
    display: inline-block;
    margin: 0;
    max-width: 100%;
}

figure img {
    max-height: 500px;
}

@media screen and (min-width: 600px) {
    figure {
        padding: 0 40px;
    }
}

/* figure h4 { */
/*     font-size: 1rem; */
/*     margin: 0; */
/*     margin-bottom: 1em; */
/* } */
/* figure h4::before { */
/*     content: "↳ "; */
/* } */

/* Code blocks */
code {
    /* background-color: var(--bg-dim); */
    font-family: "Iosevka Fixed";
    text-emphasis: bold;
    color: var(--magenta-warmer);
    padding: 0.1em 0.2em;
}


.highlight pre ::selection {
    color: inherit;
}



/* Containers */
.content {
    margin-bottom: 4em;
    margin-left: auto;
    margin-right: auto;
    max-width: 800px;
    padding: 0 1ch;
    word-wrap: break-word;
}

/* Header */
header {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    margin: 2em 0;
    line-height: 2.5em;
    background: var(--bg-dim);
    border-radius: 5px;
    border: solid var(--yellow);
    padding: 10px;
    color: var(--header);
}

header .main {
    font-size: 1.75rem;
}
h1,
h2,
h3,
h4,
h5,
h6 {
    font-size: 1.2rem;
    margin-top: 2em;
    color: var(--header);
}

h1::before {
    color: var(black);
    content: "* ";
}
h2::before {
    color: var(--yellow);
    content: "✱✱ ";
}

h2 {
    color: var(--yellow);
}

h3::before {
    color: var(--fg-alt);
    content: "*** ";
}
h3 {
    color: var(--fg-alt);
}

h4::before {
    color: var(--magenta);
    content: "**** ";
}
h4 {
    color: var(--magenta);
}

h5::before {
    color: var(--green);
    content: "****** ";
}
h5 {
    color: var(--green);
}
h6::before {
    color: var(--red);
    content: "******* ";
}
h6 {
    color: var(--red);
}

.meta {
    color: #999;
    letter-spacing: -0.5px;
}

/* Footer */
footer {
    display: flex;
    align-items: center;
    border-top: 0.4rem dotted var(--bordercl);
    padding: 2rem 0rem;
    margin-top: 2rem;
}
.soc {
    display: flex;
    align-items: center;
    border-bottom: none;
}
.border {
    margin-left: 0.5rem;
    margin-right: 0.5rem;
    border: 1px solid;
}
.footer-info {
    padding: var(--footer-padding);
}

/* Common */
.title h1 {
    margin-bottom: 0;
}

time {
    color: var(--green);
}

/* Posts */
article .title {
    margin-bottom: 1em;
}

/* Callout */
.callout {
    background-color: var(--callouctcolor);
    color: #fff;
    padding: 1em;
}

.callout p {
    font-family: "IBM Plex Mono", monospace;
    margin: 0;
}
.callout a {
    border-bottom: 3px solid #fff;
}
.callout a:hover {
    background-color: var(--bg-dim);
    color: var(--callouctcolor);
}

.site-description {
    display: flex;
    justify-content: space-between;
}
.tags li::before {
    content: "🏷 ";
}
.tags a {
    border-bottom: 3px solid var(--maincolor);
}
.tags a:hover {
    color: white;
    background-color: var(--hovercolor);
}
svg {
    max-height: 15px;
}
.soc:hover {
    color: white;
}
.draft-label {
    color: var(--bordercl);
    text-decoration: none;
    padding: 2px 4px;
    border-radius: 4px;
    margin-left: 6px;
    background-color: var(--bg-red-subtle);
}

highlight {
    position: relative;
    background: var(--bg-dim);
    -webkit-overflow-scrolling: touch;
}




/* table */
table {
    border-spacing: 0;
    border-collapse: collapse;
}
p table th {
    padding: 6px 13px;
    border: 1px solid #dfe2e5;
    font-size: large;
}

table td {
    padding: 6px 13px;
    border: 1px solid #dfe2e5;
}