diff --git a/src/js/example/index.html b/src/js/example/index.html
index f900937..f719632 100644
--- a/src/js/example/index.html
+++ b/src/js/example/index.html
@@ -3,6 +3,8 @@
+
+
Nim on JS
diff --git a/src/js/example/sandbox.nim b/src/js/example/sandbox.nim
index 2518277..881696c 100644
--- a/src/js/example/sandbox.nim
+++ b/src/js/example/sandbox.nim
@@ -39,7 +39,7 @@ proc toMarkUp(x: OrgInlineBlock): ReactNode =
of orgUnderlineText: u(Attrs{}, x.content)
of orgVerbatimText: pre(Attrs{}, x.content)
of orgCodeText: code(Attrs{}, x.content)
- of orgStrikeThroughText: p(Attrs{}, x.content)
+ of orgStrikeThroughText: span(Attrs{className: "strike-through"}, x.content)
# # Links
# of orgLink: "Link"
@@ -68,7 +68,7 @@ proc makeTopLevel(): ReactNode {.exportc.} =
let text = myUseState[cstring]("""* TODO Level 1
Some stuff inbetween
-** DONE Regular *bold* [[https://some.url]] /italic/ _underline_ =verbatim= ~code~ +strikethrough+ [[https://some.url][title]]""")
+** DONE Regular *bold* [[https://placeholder.com]] /italic/ _underline_ =verbatim= ~code~ +strikethrough+ [[https://placeholder.com][title]]""")
let val = text.getter
let orgItems = makeItems($val)
diff --git a/src/js/example/style-custom.css b/src/js/example/style-custom.css
new file mode 100644
index 0000000..791377e
--- /dev/null
+++ b/src/js/example/style-custom.css
@@ -0,0 +1,12 @@
+h1 pre, h2 pre, h3 pre, h4 pre, h5 pre, h6 pre {
+ display: inline;
+}
+
+h1 code, h2 code, h3 code, h4 code, h5 code, h6 code {
+ display: inline;
+}
+
+.strike-through {
+ text-decoration: line-through;
+ display: inline;
+}
diff --git a/src/js/example/style.css b/src/js/example/style.css
new file mode 100644
index 0000000..9d279c1
--- /dev/null
+++ b/src/js/example/style.css
@@ -0,0 +1,2376 @@
+/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */
+html {
+ line-height: 1.15;
+ -webkit-text-size-adjust: 100%
+}
+
+body {
+ margin: 0
+}
+
+
+h1 {
+ font-size: 2em;
+ margin: .67em 0
+}
+
+hr {
+ box-sizing: content-box;
+ height: 0
+}
+
+code,
+kbd,
+pre,
+samp {
+ font-family: monospace, monospace;
+ font-size: 1em
+}
+
+b {
+ font-weight: bolder
+}
+
+small {
+ font-size: 80%
+}
+
+sub,
+sup {
+ font-size: 75%;
+ line-height: 0;
+ position: relative;
+ vertical-align: baseline
+}
+
+sub {
+ bottom: -.25em
+}
+
+sup {
+ top: -.5em
+}
+
+button,
+input,
+optgroup,
+select,
+textarea {
+ font-family: inherit;
+ font-size: 100%;
+ line-height: 1.15;
+ margin: 0
+}
+
+button,
+select {
+ text-transform: none
+}
+
+button {
+ -webkit-appearance: button
+}
+
+button::-moz-focus-inner {
+ border-style: none;
+ padding: 0
+}
+
+button:-moz-focusring {
+ outline: 1px dotted ButtonText
+}
+
+details {
+ display: block
+}
+
+summary {
+ display: list-item
+}
+
+/*! end normalise.css */
+#page {
+ --accent: #002642;
+ --accent-dark: #00151c;
+ --code-foreground: #2c3e50;
+ --code-background: #efefef;
+ --code-func: #6c3163;
+ --code-const: #4e3163;
+ --code-regex: #655370;
+ --back-white: #fff;
+ --back-light: #f0eeed;
+ --back-medium: #c8c8c8;
+ --text-light: #7b7b7b;
+ --text-gray: #444;
+ --text-medium: #222;
+ --text-dark: #000;
+ --switch-icon: "🌚";
+ --switch-shadow-color: #373d4e;
+ --switch-text: "dark mode?"
+}
+
+#theme-switch:checked~#page {
+ --accent: #002642;
+ --accent-dark: #daf1ff;
+ --code-foreground: #a1a8ae;
+ --code-background: #222;
+ --code-func: #bd56ad;
+ --code-const: #8755ab;
+ --code-regex: #a184b3;
+ --back-white: #000;
+ --back-light: #181818;
+ --back-medium: #444;
+ --text-light: #7b7b7b;
+ --text-gray: #c8c8c8;
+ --text-medium: #ddd;
+ --text-dark: #efefef;
+ --switch-icon: "🌝";
+ --switch-shadow-color: #fce477;
+ --switch-text: "light mode?"
+}
+
+#theme-switch:checked~#page img.invertible,
+#theme-switch:checked~#page object[type="image/svg+xml"].invertible {
+ filter: invert(90%) hue-rotate(180deg) sepia(1%)
+}
+
+#theme-switch {
+ display: none
+}
+
+#switch-label {
+ position: fixed;
+ bottom: 4rem;
+ left: 3rem
+}
+
+#switch-label::before {
+ content: var(--switch-icon);
+ font-size: 20px;
+ transition: text-shadow .2s
+}
+
+#switch-label::after {
+ content: var(--switch-text);
+ color: var(--switch-shadow-color);
+ font-size: 12px;
+ visibility: hidden;
+ margin-left: .5em;
+ z-index: 1;
+ position: fixed;
+ bottom: calc(4rem - 25px);
+ left: calc(3rem - 10px)
+}
+
+@media (max-width:1000px) {
+ #switch-label {
+ left: auto;
+ bottom: auto;
+ right: 1vw;
+ top: 1vh
+ }
+
+ #switch-label::after {
+ position: fixed;
+ top: calc(1vh + 3px);
+ right: calc(1vw + 30px);
+ left: auto;
+ bottom: auto
+ }
+}
+
+#switch-label:hover::before,
+#theme-switch:focus~#page #switch-label::before {
+ text-shadow: 0 0 15px var(--switch-shadow-color)
+}
+
+#switch-label:hover::after,
+#theme-switch:focus~#page #switch-label::after {
+ visibility: visible
+}
+
+@font-face {
+ font-family: "Merriweather";
+ src: url(https://tecosaur.com/resources/org/Merriweather-TextRegular.woff2) format("woff2");
+ font-weight: 400;
+ font-style: normal;
+ font-display: fallback
+}
+
+@font-face {
+ font-family: "Merriweather";
+ src: url(https://tecosaur.com/resources/org/Merriweather-TextItalic.woff2) format("woff2");
+ font-weight: 400;
+ font-style: italic;
+ font-display: fallback
+}
+
+@font-face {
+ font-family: "Merriweather";
+ src: url(https://tecosaur.com/resources/org/Merriweather-TextBold.woff2) format("woff2");
+ font-weight: 700;
+ font-style: normal;
+ font-display: fallback
+}
+
+@font-face {
+ font-family: "et-book";
+ src: url(https://tecosaur.com/resources/org/etbookot-roman-webfont.woff2) format("woff2");
+ font-weight: 400;
+ font-style: normal;
+ font-display: fallback
+}
+
+@font-face {
+ font-family: "et-book";
+ src: url(https://tecosaur.com/resources/org/etbookot-italic-webfont.woff2) format("woff2");
+ font-weight: 400;
+ font-style: italic;
+ font-display: fallback
+}
+
+::selection {
+ background: var(--back-medium)
+}
+
+.pace .pace-progress {
+ background-color: var(--accent) !important
+}
+
+body,
+html {
+ height: 100%
+}
+
+body {
+ display: flex;
+ flex-direction: column;
+ font-size: 16px;
+ font-family: "Merriweather", serif
+}
+
+#page {
+ color: var(--text-dark);
+ background-color: var(--back-light);
+ transition-property: color, background-color;
+ transition-duration: 100ms
+}
+
+#content,
+.page-header,
+header {
+ margin: 32px;
+ flex: 1 0 auto
+}
+
+#content {
+ margin-top: 4rem;
+ min-height: calc(100vh - 4rem - 48px)
+}
+
+.clearfix::after {
+ clear: both
+}
+
+.clearfix::after,
+.clearfix::before {
+ content: " ";
+ display: table
+}
+
+.page-header {
+ margin-top: 80px;
+ margin-left: 0 !important
+}
+
+.page-header h1 {
+ font-size: 40px;
+ margin-bottom: 10px;
+ margin-top: 10px;
+ text-transform: none
+}
+
+.page-header .subtitle {
+ font-size: 24px;
+ color: var(--text-light);
+ margin: 0
+}
+
+.page-meta,
+figure figcaption .figure-number,
+header .site-nav {
+ font-family: "Open Sans", sans;
+ font-weight: 400;
+ font-style: normal;
+ font-size: 12px;
+ line-height: 1.9;
+ color: var(--text-light)
+}
+
+header .site-nav {
+ font-weight: 700;
+ line-height: 2;
+ margin-top: 22px
+}
+
+header .site-nav a {
+ color: var(--text-light);
+ text-decoration: none;
+ margin-left: 10px
+}
+
+header .site-nav a:hover {
+ color: var(--text-gray)
+}
+
+header .site-nav a.active {
+ border-bottom: solid;
+ border-bottom-width: 2px
+}
+
+header .site-nav a:first-child {
+ margin-left: 0
+}
+
+header>div {
+ display: inherit
+}
+
+.site-title {
+ font-size: 16px
+}
+
+.site-title span {
+ display: none !important
+}
+
+.site-title ul {
+ display: block !important;
+ list-style: none;
+ padding: 0;
+ margin: 0
+}
+
+.site-title ul img {
+ border-radius: 2px;
+ max-width: 32px
+}
+
+.site-header nav a {
+ color: var(--text-light);
+ font-family: "Open Sans", sans;
+ font-size: 12px;
+ font-weight: 700;
+ text-transform: uppercase
+}
+
+.site-header nav a:hover {
+ border: 0;
+ color: var(--accent)
+}
+
+@media (max-width:1000px) {
+ header * {
+ display: inline
+ }
+}
+
+@media (min-width:1000px) {
+
+ #content,
+ .page-header,
+ header {
+ max-width: 720px;
+ margin-left: 164px
+ }
+
+ header .site-title {
+ float: left
+ }
+
+ header .site-nav {
+ float: right;
+ margin-top: 0
+ }
+}
+
+@media (min-width:2800px) {
+
+ #content,
+ .page-header,
+ header {
+ margin-left: auto;
+ margin-right: auto
+ }
+}
+
+#content .page-intro {
+ font-family: "Open Sans", sans;
+ font-weight: 400;
+ font-size: 15px;
+ line-height: 1.6;
+ color: var(--text-gray);
+ margin-bottom: 40px
+}
+
+#content dd,
+#content li,
+#content p {
+ line-height: 1.9
+}
+
+#footer {
+ margin-top: 70px;
+ height: 10px;
+ background: var(--accent-dark)
+}
+
+.archive-item {
+ margin: 50px 0
+}
+
+.archive-item .archive-title {
+ font-size: 25px;
+ margin: 5px 0
+}
+
+.archive-item .archive-title,
+.archive-item .archive-title:hover {
+ background: 0 0;
+ text-shadow: none;
+ text-decoration: none
+}
+
+#postamble,
+details.code[open] summary .lang {
+ display: none
+}
+
+aside {
+ background-color: var(--code-background);
+ border-radius: 5px;
+ margin: 20px 0;
+ padding: 5px 20px 10px
+}
+
+#footnotes li,
+#footnotes p,
+.org-ref-bib,
+.org-ref-bib-h1,
+aside,
+aside p,
+blockquote footer {
+ font-family: "Open Sans", sans;
+ font-weight: 400;
+ color: var(--text-gray)
+}
+
+aside,
+aside p {
+ font-size: 15px;
+ line-height: 1.6 !important
+}
+
+aside pre {
+ font-size: 12px;
+ border: 0;
+ padding-left: 0
+}
+
+@media (min-width:1280px) {
+ aside {
+ float: right;
+ clear: right;
+ background-color: var(--back-white);
+ max-width: 45% !important;
+ margin-right: -52%
+ }
+
+ aside::before {
+ content: ''
+ }
+}
+
+blockquote {
+ border-left-style: solid;
+ border-width: 0 0 0 1px;
+ border-left-color: var(--back-medium);
+ margin: 20px 0;
+ padding: 0 0 0 15px
+}
+
+blockquote p {
+ display: inline;
+ font-size: 13px
+}
+
+blockquote footer {
+ font-style: normal;
+ font-size: 12px;
+ line-height: 1.9;
+ color: var(--text-light);
+ text-transform: none
+}
+
+div.info {
+ background: rgba(58, 129, 195, .15);
+ border-left: 4px solid rgba(58, 129, 195, .45);
+ margin: 1.8rem 0 1.25rem 15px;
+ padding: .8em;
+ line-height: 1.4;
+ text-align: center;
+ position: relative;
+ clear: both
+}
+
+div.error p,
+div.info p,
+div.success p,
+div.warning p {
+ margin: 0
+}
+
+div.error::before,
+div.info::before,
+div.success::before,
+div.warning::before {
+ color: var(--back-white);
+ align-items: flex-end;
+ top: -1rem;
+ font-weight: 700;
+ font-size: 1.4rem;
+ display: inline-flex;
+ justify-content: center;
+ position: absolute;
+ left: -1.2rem;
+ text-align: center
+}
+
+div.info::before {
+ content: "i";
+ background: rgba(58, 129, 195, .8);
+ -webkit-clip-path: circle(50% at 50% 50%);
+ clip-path: circle(50% at 50% 50%);
+ width: 30px;
+ height: 30px;
+ line-height: 1.3
+}
+
+div.success {
+ background: rgba(45, 149, 116, .15);
+ border-left: 4px solid rgba(45, 149, 116, .45)
+}
+
+div.error::before,
+div.success::before,
+div.warning::before {
+ width: 35px
+}
+
+div.success::before {
+ content: "✔";
+ background: rgba(45, 149, 116, .8);
+ -webkit-clip-path: polygon(50% 0, 100% 50%, 50% 100%, 0 50%);
+ clip-path: polygon(50% 0, 100% 50%, 50% 100%, 0 50%);
+ height: 35px;
+ line-height: 1.5
+}
+
+div.error,
+div.success,
+div.warning {
+ margin: 1.8rem 0 1.25rem 15px;
+ padding: .8em;
+ line-height: 1.4;
+ text-align: center;
+ position: relative;
+ clear: both
+}
+
+div.warning {
+ background: rgba(220, 117, 47, .15);
+ border-left: 4px solid rgba(220, 117, 47, .45)
+}
+
+div.error::before,
+div.warning::before {
+ content: "!";
+ line-height: 1.1
+}
+
+div.warning::before {
+ background: rgba(220, 117, 47, .8);
+ -webkit-clip-path: polygon(50% 0, 0 100%, 100% 100%);
+ clip-path: polygon(50% 0, 0 100%, 100% 100%);
+ height: 35px
+}
+
+div.error {
+ background: rgba(186, 47, 89, .15);
+ border-left: 4px solid rgba(186, 47, 89, .45)
+}
+
+div.error::before {
+ background: rgba(186, 47, 89, .8);
+ -webkit-clip-path: polygon(25% 0, 75% 0, 100% 50%, 75% 100%, 25% 100%, 0 50%);
+ clip-path: polygon(25% 0, 75% 0, 100% 50%, 75% 100%, 25% 100%, 0 50%);
+ height: 30px
+}
+
+#footnotes li,
+#footnotes p,
+.org-ref-bib,
+.org-ref-bib-h1 {
+ line-height: 1.6
+}
+
+.org-ref-bib-h1 {
+ margin-top: 70px;
+ padding-top: 30px;
+ border-top-style: solid;
+ border-width: 1px 0 0;
+ border-color: var(--back-light);
+ font-size: 20px
+}
+
+#footnotes li,
+#footnotes p,
+.org-ref-bib {
+ font-size: 15px
+}
+
+.org-ref-bib li>a:nth-child(2),
+.org-ref-bib li>a:nth-child(2):hover {
+ background: 0 0;
+ text-shadow: none;
+ text-decoration: none
+}
+
+.org-ref-bib .bib-link {
+ font-family: "Open Sans", sans;
+ font-weight: 400;
+ font-style: normal;
+ font-size: 12px;
+ line-height: 1.9;
+ color: var(--text-light);
+ background: 0 0;
+ text-shadow: none;
+ text-decoration: none
+}
+
+pre.example,
+pre.src {
+ border-left-style: solid;
+ border-width: 0 0 0 1px;
+ border-left-color: var(--back-medium);
+ margin: 20px 0;
+ padding: 0 0 0 15px;
+ font-family: SFMono-Regular, Consolas, Liberation Mono, Menlo, monospace;
+ font-size: 14px;
+ line-height: 1.9;
+ overflow-x: visible;
+ box-shadow: none;
+ white-space: pre-wrap;
+ position: relative
+}
+
+pre.example {
+ border-left-style: dotted;
+ border-width: 0 0 0 2px
+}
+
+pre.src::before {
+ display: inline-block;
+ position: absolute;
+ background-color: transparent;
+ top: unset;
+ bottom: -16px;
+ left: 20px;
+ padding: 0;
+ border: 0;
+ font-size: 80%;
+ font-style: italic;
+ color: var(--text-light)
+}
+
+pre.src:empty {
+ display: none
+}
+
+code {
+ color: var(--code-foreground);
+ padding: 0 5px
+}
+
+kbd {
+ display: inline-block;
+ padding: .25em .35em;
+ font: 80% SFMono-Regular, Consolas, Liberation Mono, Menlo, monospace;
+ font-weight: inherit;
+ line-height: 80%;
+ color: var(--text-gray);
+ vertical-align: middle;
+ background-color: var(--back-light);
+ border: 1px solid #91959a88;
+ border-radius: .35em;
+ box-shadow: inset 0 -1px 0 #91959a88
+}
+
+li code {
+ font-size: 14px
+}
+
+code,
+dl li p,
+li p code,
+ol li p,
+ul li p {
+ font-size: 15px
+}
+
+details.code {
+ position: relative
+}
+
+details.code summary {
+ position: relative;
+ left: -2.5px;
+ padding-left: 10px;
+ padding-bottom: 4px;
+ margin-left: -10px;
+ z-index: 1;
+ outline: 0;
+ font-family: "Open Sans", sans;
+ font-weight: 400;
+ font-style: normal;
+ font-size: 12px;
+ line-height: 1.9;
+ color: var(--text-light)
+}
+
+details.code summary .name {
+ font-size: 14px;
+ color: var(--text-medium);
+ margin-right: .7em
+}
+
+code,
+details.code summary .lang {
+ font-family: SFMono-Regular, Consolas, Liberation Mono, Menlo, monospace
+}
+
+details.code summary .lang {
+ font-style: italic
+}
+
+details.code summary::marker {
+ color: var(--back-medium)
+}
+
+details.code[open] summary {
+ margin-bottom: -32px
+}
+
+details.code[open] summary.named {
+ margin-bottom: -26px
+}
+
+details.code:not([open]) summary {
+ margin-bottom: -5px
+}
+
+p+details.code {
+ margin-top: -20px
+}
+
+li p+details.code {
+ margin-top: -5px
+}
+
+.example,
+.src {
+ color: var(--code-foreground)
+}
+
+.example .org-keyword,
+.src .org-keyword {
+ color: #3a81c3
+}
+
+.example .org-variable-name,
+.src .org-variable-name {
+ color: #715ab1
+}
+
+.example .org-rainbow-delimiters-depth-1,
+.example .org-rainbow-delimiters-depth-2,
+.example .org-rainbow-delimiters-depth-3,
+.example .org-rainbow-delimiters-depth-4,
+.example .org-rainbow-delimiters-depth-5,
+.example .org-rainbow-delimiters-depth-6,
+.example .org-rainbow-delimiters-depth-7,
+.example .org-rainbow-delimiters-depth-8,
+.example .org-rainbow-delimiters-depth-9,
+.src .org-rainbow-delimiters-depth-1,
+.src .org-rainbow-delimiters-depth-2,
+.src .org-rainbow-delimiters-depth-3,
+.src .org-rainbow-delimiters-depth-4,
+.src .org-rainbow-delimiters-depth-5,
+.src .org-rainbow-delimiters-depth-6,
+.src .org-rainbow-delimiters-depth-7,
+.src .org-rainbow-delimiters-depth-8,
+.src .org-rainbow-delimiters-depth-9 {
+ color: #555
+}
+
+.example .org-string,
+.src .org-string {
+ color: #2d9574
+}
+
+.example .org-comment,
+.example .org-comment-delimiter,
+.src .org-comment,
+.src .org-comment-delimiter {
+ color: #555
+}
+
+.example .org-function-name,
+.src .org-function-name {
+ color: var(--code-func)
+}
+
+.example .org-constant,
+.example .org-highlight-numbers-number,
+.src .org-constant,
+.src .org-highlight-numbers-number {
+ color: var(--code-const)
+}
+
+.gutter {
+ position: absolute;
+ top: 0;
+ left: -2.5rem;
+ width: 2rem;
+ padding-right: .3rem;
+ padding-top: 5px;
+ height: calc(100% - 10px);
+ z-index: 1;
+ transition: opacity 200ms;
+ opacity: 0;
+ font-size: 15px
+}
+
+.gutter:hover {
+ opacity: 1
+}
+
+.gutter * {
+ display: block;
+ width: 100%;
+ text-align: right;
+ padding: 0;
+ margin: 0;
+ color: var(--text-light)
+}
+
+#content .page-intro p a:hover:visited,
+#content .page-intro p a:visited,
+#footnotes a:hover:visited,
+#footnotes a:visited,
+.gutter :hover {
+ color: var(--text-gray)
+}
+
+.gutter :active {
+ font-weight: 700
+}
+
+.gutter a {
+ text-decoration: none;
+ font-size: 110%
+}
+
+.gutter button {
+ background: 0 0;
+ border: 0
+}
+
+pre.src-asymptote::before {
+ content: 'Asymptote'
+}
+
+pre.src-authinfo::before {
+ content: 'Authinfo'
+}
+
+pre.src-awk::before {
+ content: 'Awk'
+}
+
+pre.src-C::before {
+ content: 'C'
+}
+
+pre.src-clojure::before {
+ content: 'Clojure'
+}
+
+pre.src-css::before {
+ content: 'CSS'
+}
+
+pre.src-D::before {
+ content: 'D'
+}
+
+pre.src-ditaa::before {
+ content: 'ditaa'
+}
+
+pre.src-dot::before {
+ content: 'Graphviz'
+}
+
+pre.src-calc::before {
+ content: 'Emacs Calc'
+}
+
+pre.src-emacs-lisp::before {
+ content: 'Emacs Lisp'
+}
+
+pre.src-fortran::before {
+ content: 'Fortran'
+}
+
+pre.src-gnuplot::before {
+ content: 'gnuplot'
+}
+
+pre.src-haskell::before {
+ content: 'Haskell'
+}
+
+pre.src-hledger::before {
+ content: 'hledger'
+}
+
+pre.src-java::before {
+ content: 'Java'
+}
+
+pre.src-js::before {
+ content: 'Javascript'
+}
+
+pre.src-latex::before {
+ content: 'LaTeX'
+}
+
+pre.src-ledger::before {
+ content: 'Ledger'
+}
+
+pre.src-lisp::before {
+ content: 'Lisp'
+}
+
+pre.src-lilypond::before {
+ content: 'Lilypond'
+}
+
+pre.src-lua::before {
+ content: 'Lua'
+}
+
+pre.src-matlab::before {
+ content: 'MATLAB'
+}
+
+pre.src-mscgen::before {
+ content: 'Mscgen'
+}
+
+pre.src-ocaml::before {
+ content: 'Objective Caml'
+}
+
+pre.src-octave::before {
+ content: 'Octave'
+}
+
+pre.src-org::before {
+ content: 'Org mode'
+}
+
+pre.src-oz::before {
+ content: 'OZ'
+}
+
+pre.src-plantuml::before {
+ content: 'Plantuml'
+}
+
+pre.src-processing::before {
+ content: 'Processing.js'
+}
+
+pre.src-python::before {
+ content: 'Python'
+}
+
+pre.src-R::before {
+ content: 'R'
+}
+
+pre.src-ruby::before {
+ content: 'Ruby'
+}
+
+pre.src-sass::before {
+ content: 'Sass'
+}
+
+pre.src-scheme::before {
+ content: 'Scheme'
+}
+
+pre.src-screen::before {
+ content: 'Gnu Screen'
+}
+
+pre.src-sed::before {
+ content: 'Sed'
+}
+
+pre.src-sh::before {
+ content: 'shell'
+}
+
+pre.src-sql::before {
+ content: 'SQL'
+}
+
+pre.src-sqlite::before {
+ content: 'SQLite'
+}
+
+pre.src-forth::before {
+ content: 'Forth'
+}
+
+pre.src-io::before {
+ content: 'IO'
+}
+
+pre.src-J::before {
+ content: 'J'
+}
+
+pre.src-makefile::before {
+ content: 'Makefile'
+}
+
+pre.src-maxima::before {
+ content: 'Maxima'
+}
+
+pre.src-perl::before {
+ content: 'Perl'
+}
+
+pre.src-picolisp::before {
+ content: 'Pico Lisp'
+}
+
+pre.src-scala::before {
+ content: 'Scala'
+}
+
+pre.src-shell::before {
+ content: 'Shell Script'
+}
+
+pre.src-systemd::before {
+ content: 'Systemd'
+}
+
+pre.src-ebnf2ps::before {
+ content: 'ebfn2ps'
+}
+
+pre.src-cpp::before {
+ content: 'C++'
+}
+
+pre.src-abc::before {
+ content: 'ABC'
+}
+
+pre.src-coq::before {
+ content: 'Coq'
+}
+
+pre.src-groovy::before {
+ content: 'Groovy'
+}
+
+pre.src-bash::before {
+ content: 'bash'
+}
+
+pre.src-csh::before {
+ content: 'csh'
+}
+
+pre.src-ash::before {
+ content: 'ash'
+}
+
+pre.src-dash::before {
+ content: 'dash'
+}
+
+pre.src-ksh::before {
+ content: 'ksh'
+}
+
+pre.src-mksh::before {
+ content: 'mksh'
+}
+
+pre.src-posh::before {
+ content: 'posh'
+}
+
+pre.src-ada::before {
+ content: 'Ada'
+}
+
+pre.src-asm::before {
+ content: 'Assembler'
+}
+
+pre.src-caml::before {
+ content: 'Caml'
+}
+
+pre.src-delphi::before {
+ content: 'Delphi'
+}
+
+pre.src-html::before {
+ content: 'HTML'
+}
+
+pre.src-idl::before {
+ content: 'IDL'
+}
+
+pre.src-mercury::before {
+ content: 'Mercury'
+}
+
+pre.src-metapost::before {
+ content: 'MetaPost'
+}
+
+pre.src-modula-2::before {
+ content: 'Modula-2'
+}
+
+pre.src-pascal::before {
+ content: 'Pascal'
+}
+
+pre.src-ps::before {
+ content: 'PostScript'
+}
+
+pre.src-prolog::before {
+ content: 'Prolog'
+}
+
+pre.src-simula::before {
+ content: 'Simula'
+}
+
+pre.src-tcl::before {
+ content: 'tcl'
+}
+
+pre.src-tex::before {
+ content: 'LaTeX'
+}
+
+pre.src-plain-tex::before {
+ content: 'TeX'
+}
+
+pre.src-verilog::before {
+ content: 'Verilog'
+}
+
+pre.src-vhdl::before {
+ content: 'VHDL'
+}
+
+pre.src-nxml::before,
+pre.src-xml::before {
+ content: 'XML'
+}
+
+pre.src-conf::before {
+ content: 'Configuration File'
+}
+
+.dropcap {
+ float: left;
+ font-size: 55px;
+ font-style: normal;
+ line-height: .1;
+ margin-right: .2em;
+ margin-top: .5em;
+ padding: 0
+}
+
+figure,
+th.org-center,
+th.org-left,
+th.org-right {
+ text-align: center
+}
+
+#footnotes,
+figure figcaption {
+ margin-top: 10px;
+ font-family: "Open Sans", sans;
+ font-weight: 400;
+ font-size: 15px;
+ line-height: 1.6;
+ color: var(--text-gray)
+}
+
+img.zoomTarget:hover {
+ cursor: default !important
+}
+
+img,
+object[type="image/svg+xml"] {
+ filter: invert(7%) sepia(4%);
+ max-width: 100%
+}
+
+.org-svg {
+ width: 90%
+}
+
+#footnotes {
+ margin-top: 70px;
+ padding-top: 30px;
+ border-top-style: solid;
+ border-width: 1px 0 0;
+ border-color: var(--back-light)
+}
+
+#footnotes h2.footnotes {
+ margin-top: 0;
+ margin-bottom: 30px;
+ font-family: "Open Sans", sans;
+ font-size: 18px;
+ letter-spacing: 5px;
+ display: none
+}
+
+#footnotes .footnum {
+ color: var(--text-dark)
+}
+
+h1,
+h2,
+h3,
+h4,
+h5,
+h6 {
+ font-family: "et-book", serif;
+ font-weight: 400;
+ margin-bottom: 0;
+ margin-top: 60px;
+ padding-left: 30px;
+ margin-left: -30px;
+ position: relative
+}
+
+h1>a[aria-hidden=true],
+h2>a[aria-hidden=true],
+h3>a[aria-hidden=true],
+h4>a[aria-hidden=true],
+h5>a[aria-hidden=true],
+h6>a[aria-hidden=true] {
+ color: var(--back-medium);
+ position: relative;
+ top: .06em;
+ line-height: 1;
+ font-size: 110%;
+ padding-left: .2em;
+ text-decoration: none;
+ visibility: hidden
+}
+
+h1>a[aria-hidden=true]:hover,
+h2>a[aria-hidden=true]:hover,
+h3>a[aria-hidden=true]:hover,
+h4>a[aria-hidden=true]:hover,
+h5>a[aria-hidden=true]:hover,
+h6>a[aria-hidden=true]:hover {
+ color: var(--text-light)
+}
+
+h1:hover>a[aria-hidden=true],
+h2:hover>a[aria-hidden=true],
+h3:hover>a[aria-hidden=true],
+h4:hover>a[aria-hidden=true],
+h5:hover>a[aria-hidden=true],
+h6:hover>a[aria-hidden=true] {
+ visibility: visible
+}
+
+h1 {
+ font-size: 40px
+}
+
+.outline-2 h2,
+h2 {
+ font-size: 30px
+}
+
+h3 {
+ font-size: 24px
+}
+
+h4,
+h5,
+h6 {
+ font-size: 20px
+}
+
+h4,
+h6 {
+ font-style: italic
+}
+
+h5 {
+ font-variant: small-caps
+}
+
+h6 {
+ font-size: 18px
+}
+
+.section-number-1,
+.section-number-2,
+.section-number-3,
+.section-number-4,
+.section-number-5,
+.section-number-6 {
+ font-family: "Open Sans", sans;
+ font-weight: 400;
+ font-style: normal;
+ font-size: inherit;
+ color: var(--text-light);
+ line-height: 1
+}
+
+@media (min-width:1000px) {
+
+ .section-number-1,
+ .section-number-2,
+ .section-number-3,
+ .section-number-4,
+ .section-number-5,
+ .section-number-6 {
+ position: absolute;
+ transform: translateX(-100%) translateX(-10px)
+ }
+}
+
+.outline-text-2:-moz-only-whitespace+.outline-3>h3,
+.outline-text-2:empty+.outline-3>h3 {
+ margin-top: 20px
+}
+
+.outline-text-3:-moz-only-whitespace+.outline-4>h4,
+.outline-text-3:empty+.outline-4>h4,
+.outline-text-4:-moz-only-whitespace+.outline-5>h5,
+.outline-text-4:empty+.outline-5>h5 {
+ margin-top: 15px
+}
+
+.outline-text-5:-moz-only-whitespace+.outline-6>h6,
+.outline-text-5:empty+.outline-6>h6 {
+ margin-top: 10px
+}
+
+hr {
+ border: 0;
+ border-top-style: solid;
+ border-top-width: 1px;
+ color: var(--back-medium);
+ margin-bottom: 30px;
+ margin-top: 40px
+}
+
+a {
+ color: inherit
+}
+
+dl a,
+figcaption a,
+li a,
+p a,
+table a {
+ border-radius: 1px
+}
+
+.page-tags a,
+dl a,
+figcaption a,
+li a,
+p a,
+table a {
+ background-image: linear-gradient(var(--text-dark), var(--text-dark));
+ background-size: 1px 1px;
+ background-repeat: repeat-x;
+ background-position: 0 95%;
+ text-decoration: none
+}
+
+#content .page-intro p a::selection,
+#footnotes a::selection,
+.page-tags a::selection,
+dl a::selection,
+figcaption a::selection,
+li a::selection,
+p a::selection,
+table a::selection {
+ background: var(--back-medium)
+}
+
+#content .page-intro p a *,
+#content .page-intro p a :after,
+#content .page-intro p a :before,
+#content .page-intro p a:after,
+#content .page-intro p a:before,
+#footnotes a *,
+#footnotes a :after,
+#footnotes a :before,
+#footnotes a:after,
+#footnotes a:before,
+.page-tags a *,
+.page-tags a :after,
+.page-tags a :before,
+.page-tags a:after,
+.page-tags a:before,
+dl a *,
+dl a :after,
+dl a :before,
+dl a:after,
+dl a:before,
+figcaption a *,
+figcaption a :after,
+figcaption a :before,
+figcaption a:after,
+figcaption a:before,
+li a *,
+li a :after,
+li a :before,
+li a:after,
+li a:before,
+p a *,
+p a :after,
+p a :before,
+p a:after,
+p a:before,
+table a *,
+table a :after,
+table a :before,
+table a:after,
+table a:before {
+ text-shadow: none
+}
+
+.page-tags a:visited,
+dl a:visited,
+figcaption a:visited,
+li a:visited,
+p a:visited,
+table a:visited {
+ color: var(--text-dark)
+}
+
+.page-tags a:hover,
+dl a:hover,
+figcaption a:hover,
+li a:hover,
+p a:hover,
+table a:hover {
+ opacity: .9;
+ filter: drop-shadow(1px 1px 1px var(--back-white));
+ background-image: linear-gradient(var(--text-dark), var(--text-dark));
+ background-repeat: repeat-x;
+ background-image: url("data:image/svg+xml;charset=utf8,%3Csvg id='squiggle-link' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' xmlns:ev='http://www.w3.org/2001/xml-events' viewBox='0 0 20 4'%3E%3Cstyle type='text/css'%3E.squiggle{animation:shift .3s linear infinite;}@keyframes shift {from {transform:translateX(0);}to {transform:translateX(-20px);}}%3C/style%3E%3Cpath fill='none' stroke='%23000000' stroke-width='2' class='squiggle' d='M0,3.5 c 5,0,5,-3,10,-3 s 5,3,10,3 c 5,0,5,-3,10,-3 s 5,3,10,3'/%3E%3C/svg%3E") !important;
+ background-position: 0 100%;
+ background-size: .8em auto;
+ text-decoration: none
+}
+
+.page-tags a:hover::selection,
+.page-tags a[href^="#"]::selection,
+.page-tags a[href^="#"]:hover::selection,
+dl a:hover::selection,
+dl a[href^="#"]::selection,
+dl a[href^="#"]:hover::selection,
+figcaption a:hover::selection,
+figcaption a[href^="#"]::selection,
+figcaption a[href^="#"]:hover::selection,
+li a:hover::selection,
+li a[href^="#"]::selection,
+li a[href^="#"]:hover::selection,
+p a:hover::selection,
+p a[href^="#"]::selection,
+p a[href^="#"]:hover::selection,
+table a:hover::selection,
+table a[href^="#"]::selection,
+table a[href^="#"]:hover::selection {
+ background: var(--back-white)
+}
+
+.page-tags a[href^="#"],
+dl a[href^="#"],
+figcaption a[href^="#"],
+li a[href^="#"],
+p a[href^="#"],
+table a[href^="#"] {
+ background-image: linear-gradient(var(--text-gray), var(--text-gray));
+ background-size: 1px 1px;
+ background-repeat: repeat-x;
+ background-position: 0 95%
+}
+
+.page-tags a[href^="#"]:hover,
+dl a[href^="#"]:hover,
+figcaption a[href^="#"]:hover,
+li a[href^="#"]:hover,
+p a[href^="#"]:hover,
+table a[href^="#"]:hover {
+ opacity: .9;
+ filter: drop-shadow(1px 1px 1px var(--back-white));
+ background-image: linear-gradient(var(--text-medium), var(--text-medium));
+ background-size: 1px 1px;
+ background-repeat: repeat-x;
+ background-position: 0 95%
+}
+
+#theme-switch:checked~#page #breadcrumbs a:hover,
+#theme-switch:checked~#page #crosslinks a:not(.highlight):hover,
+#theme-switch:checked~#page .page-tags a:hover,
+#theme-switch:checked~#page dl a:hover,
+#theme-switch:checked~#page figcaption a:hover,
+#theme-switch:checked~#page li a:hover,
+#theme-switch:checked~#page p a:hover,
+#theme-switch:checked~#page table a:hover {
+ background-image: url("data:image/svg+xml;charset=utf8,%3Csvg id='squiggle-link' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' xmlns:ev='http://www.w3.org/2001/xml-events' viewBox='0 0 20 4'%3E%3Cstyle type='text/css'%3E.squiggle{animation:shift .3s linear infinite;}@keyframes shift {from {transform:translateX(0);}to {transform:translateX(-20px);}}%3C/style%3E%3Cpath fill='none' stroke='%23ffffff' stroke-width='2' class='squiggle' d='M0,3.5 c 5,0,5,-3,10,-3 s 5,3,10,3 c 5,0,5,-3,10,-3 s 5,3,10,3'/%3E%3C/svg%3E")
+}
+
+:target::before {
+ content: "🠖";
+ position: absolute;
+ left: -7rem;
+ top: calc(.5em - 2rem);
+ line-height: 1;
+ color: #e65353aa;
+ font-size: 3rem;
+ font-style: normal
+}
+
+@media (max-width:1000px) {
+ :target::before {
+ content: "🠔";
+ left: unset;
+ right: 0
+ }
+}
+
+#content .page-intro p a,
+#content .page-intro p a:hover,
+#footnotes a,
+#footnotes a:hover {
+ background-image: linear-gradient(var(--text-gray), var(--text-gray));
+ background-size: 1px 1px;
+ background-repeat: repeat-x;
+ background-position: 0 95%;
+ border-radius: 1px;
+ text-decoration: none
+}
+
+#content .page-intro p a:hover::selection,
+#footnotes a:hover::selection {
+ background: var(--back-medium)
+}
+
+#content .page-intro p a:hover *,
+#content .page-intro p a:hover :after,
+#content .page-intro p a:hover :before,
+#content .page-intro p a:hover:after,
+#content .page-intro p a:hover:before,
+#footnotes a:hover *,
+#footnotes a:hover :after,
+#footnotes a:hover :before,
+#footnotes a:hover:after,
+#footnotes a:hover:before {
+ text-shadow: none
+}
+
+.btn,
+.btn:hover {
+ background-image: none
+}
+
+.btn {
+ padding: 7px 14px;
+ border-style: solid;
+ border-width: 1px;
+ border-color: var(--back-light);
+ border-radius: 1px;
+ font-family: "Open Sans", sans;
+ font-variant: all-small-caps;
+ font-size: 14px;
+ font-style: normal;
+ letter-spacing: 2px;
+ cursor: pointer
+}
+
+.btn:hover {
+ background-color: var(--back-light)
+}
+
+.btn.disabled,
+div.link-preview small {
+ color: var(--text-light)
+}
+
+.btn.disabled:hover {
+ cursor: default
+}
+
+.btn.small {
+ border-style: solid;
+ border-width: 1px;
+ border-color: var(--back-light);
+ border-radius: 1px;
+ font-family: "Open Sans", sans;
+ font-variant: all-small-caps;
+ font-size: 12px;
+ font-style: normal;
+ letter-spacing: 2px;
+ background-image: none;
+ padding: 3px 9px
+}
+
+.btn.small:hover {
+ background-color: var(--back-light);
+ background-image: none
+}
+
+.btn.highlight,
+.btn.primary {
+ text-shadow: none;
+ text-decoration: none
+}
+
+.btn.highlight {
+ color: var(--text-dark);
+ background-color: #ff0
+}
+
+.btn.primary {
+ color: var(--back-white);
+ background-color: var(--accent)
+}
+
+.btn.primary:hover,
+.done.active:hover,
+.page-tags a.active:hover,
+.tag>span.active:hover,
+.todo.active:hover {
+ background-color: var(--back-light);
+ background-image: none;
+ color: var(--text-dark)
+}
+
+.image-link,
+.image-link:hover {
+ background: 0 0;
+ text-shadow: none;
+ text-decoration: none
+}
+
+div.link-preview {
+ border: 1px solid var(--back-medium);
+ border-radius: .5em;
+ overflow: hidden;
+ position: relative;
+ max-height: 5em;
+ padding-left: .5em
+}
+
+div.link-preview a {
+ color: initial;
+ text-decoration: none
+}
+
+div.link-preview img {
+ border-right: 1px solid var(--back-medium);
+ float: left;
+ height: 5em;
+ margin-left: -.5em;
+ margin-right: .5em
+}
+
+div.link-preview p {
+ margin: 0;
+ font-size: 10pt
+}
+
+div.link-preview p b {
+ font-size: 11pt
+}
+
+div.link-preview small {
+ float: right;
+ font-family: sans;
+ margin: .45em .6em
+}
+
+dl,
+ol,
+ul {
+ list-style: none;
+ list-style-position: outside;
+ padding: 0
+}
+
+dl dt::before,
+dl li::before,
+ol dt::before,
+ol li::before,
+ul dt::before,
+ul li::before {
+ display: inline-block;
+ width: 1em;
+ font-family: "Open Sans", sans;
+ font-weight: 400;
+ font-size: 15px;
+ line-height: 1.6;
+ color: var(--text-gray)
+}
+
+dl li,
+ol li,
+ul li {
+ margin: 5px 0;
+ font-size: 14px
+}
+
+dl dt::before,
+ul li::before {
+ content: "•";
+ margin-left: -1em
+}
+
+ol {
+ counter-reset: li
+}
+
+ol li::before {
+ content: counter(li);
+ margin-left: -1.5em;
+ margin-right: .5em;
+ text-align: right;
+ direction: rtl
+}
+
+ol li {
+ counter-increment: li
+}
+
+ol ol,
+ul ul {
+ padding-left: 20px
+}
+
+ol ol ol,
+ul ul ul {
+ padding-left: 30px
+}
+
+li p:first-child {
+ display: inline-block;
+ margin-bottom: 0
+}
+
+dl dt {
+ font-weight: 400;
+ margin-bottom: 10px
+}
+
+dl dd {
+ font-style: italic;
+ margin-bottom: 20px
+}
+
+li .checkbox {
+ display: inline-block;
+ width: .9em;
+ height: .9em;
+ border-radius: 3px;
+ margin: 3px;
+ top: 4px;
+ position: relative
+}
+
+li.on>.checkbox {
+ background: #2d9574;
+ box-shadow: 0 0 2px #2d9574
+}
+
+li.trans>.checkbox {
+ background: #dc752f;
+ box-shadow: 0 0 2px #dc752f
+}
+
+li.off>.checkbox {
+ background: #ba2f59;
+ box-shadow: 0 0 2px #ba2f59;
+ top: 6px
+}
+
+li.on>.checkbox::after {
+ content: '';
+ height: .45em;
+ width: .225em;
+ -webkit-transform-origin: left top;
+ transform-origin: left top;
+ transform: scaleX(-1) rotate(135deg);
+ border-right: 2.8px solid #fff;
+ border-top: 2.8px solid #fff;
+ opacity: .9;
+ left: .1em;
+ top: .45em;
+ position: absolute
+}
+
+li.trans>.checkbox::after {
+ content: '';
+ font-weight: 700;
+ font-size: 1.6em;
+ position: absolute;
+ top: .2em;
+ left: .11em;
+ width: .35em;
+ height: .12em;
+ background: #fff;
+ opacity: .9;
+ border-radius: .1em
+}
+
+li.off>.checkbox::after {
+ content: '✖';
+ color: #fff;
+ opacity: .9;
+ position: relative;
+ top: -.5rem;
+ left: .17em;
+ font-size: .75em
+}
+
+#org-div-home-and-up {
+ display: none !important
+}
+
+.outline-3 h3 {
+ font-style: normal
+}
+
+.outline-2 .section-number-2 {
+ font-size: 30px
+}
+
+.outline-3 .section-number-3,
+.outline-3 h3 {
+ font-size: 24px
+}
+
+.done,
+.timestamp,
+.timestamp-kwd,
+.todo {
+ border-radius: 1px;
+ font-family: "Open Sans", sans;
+ font-style: normal;
+ background-color: var(--back-white)
+}
+
+.timestamp,
+.timestamp-kwd {
+ font-weight: 400;
+ font-size: 12px;
+ line-height: 1.9;
+ color: var(--text-light)
+}
+
+.done,
+.todo {
+ border-color: var(--back-light);
+ font-variant: all-small-caps;
+ font-size: max(.4em, 10px);
+ letter-spacing: 2px;
+ background-image: none;
+ line-height: 1;
+ white-space: nowrap;
+ vertical-align: middle;
+ padding: .1em .5em;
+ background-color: transparent;
+ border: 0;
+ font-weight: 700
+}
+
+.page-tags a:hover {
+ background-color: var(--back-light)
+}
+
+.done:hover,
+.tag>span:hover,
+.todo:hover {
+ background-color: var(--back-light);
+ background-image: none
+}
+
+.done:not(.active),
+.page-tags a:not(.active),
+.tag>span:not(.active),
+.todo:not(.active) {
+ border-color: var(--back-white)
+}
+
+.done.active,
+.page-tags a.active,
+.tag>span.active,
+.todo.active {
+ text-shadow: none;
+ text-decoration: none;
+ color: var(--back-white);
+ background-color: var(--code-foreground)
+}
+
+.outline-2,
+.outline-3,
+.outline-4 {
+ contain: layout
+}
+
+.outline-2 .done,
+.outline-2 .todo,
+.outline-3 .done,
+.outline-3 .todo,
+.outline-4 .done,
+.outline-4 .todo {
+ font-size: 18px
+}
+
+.todo {
+ color: #e33
+}
+
+.done,
+.priority {
+ color: var(--text-light)
+}
+
+.tag>span {
+ border-style: solid;
+ border-width: 1px;
+ border-color: var(--back-light);
+ font-family: "Open Sans", sans;
+ font-variant: all-small-caps;
+ font-size: max(.4em, 10px);
+ font-style: normal;
+ letter-spacing: 2px;
+ background-image: none;
+ line-height: 1;
+ white-space: nowrap;
+ vertical-align: middle;
+ padding: .1em .5em;
+ background-color: var(--back-white);
+ border-radius: 100px
+}
+
+.priority {
+ font-family: SFMono-Regular, Consolas, Liberation Mono, Menlo, monospace
+}
+
+.footref {
+ text-shadow: none
+}
+
+.footpara {
+ display: inline
+}
+
+.footdef {
+ margin-bottom: 1em
+}
+
+td.org-right {
+ text-align: right
+}
+
+td.org-left {
+ text-align: left
+}
+
+div.org-center,
+td.org-center {
+ text-align: center
+}
+
+span.acr {
+ font-variant-caps: all-small-caps;
+ letter-spacing: .1em
+}
+
+.music-track {
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ flex-wrap: wrap
+}
+
+.music-track img {
+ height: 6rem;
+ margin-right: 2rem
+}
+
+.music-track a {
+ text-decoration: none
+}
+
+.music-track span {
+ min-width: 35%
+}
+
+div.table {
+ position: relative
+}
+
+div.table .gutter {
+ left: calc(20px - 2.5rem);
+ padding-top: 18px
+}
+
+div.table .tabular {
+ max-width: 100%;
+ overflow-x: auto
+}
+
+table,
+table thead {
+ font-family: "Open Sans", sans;
+ font-size: 15px
+}
+
+table {
+ border-color: var(--text-light);
+ border-left: transparent;
+ border-right: transparent;
+ border-style: solid;
+ border-width: 2px;
+ border-collapse: collapse;
+ margin: 20px;
+ padding: 20px
+}
+
+table thead {
+ font-weight: 400;
+ font-style: normal;
+ line-height: 1.9;
+ color: var(--text-light)
+}
+
+table thead tr th {
+ padding: 4px 10px;
+ background-color: #9991
+}
+
+table thead tr:last-of-type th {
+ border-bottom: solid 1px var(--text-light)
+}
+
+table td,
+table th,
+table tr {
+ border: 0
+}
+
+table tbody tr td {
+ border-top: 0;
+ padding: 0 10px
+}
+
+table tr {
+ line-height: 1.9
+}
+
+table caption,
+table caption .table-number {
+ font-family: "Open Sans", sans;
+ font-weight: 400
+}
+
+table caption {
+ margin-bottom: 10px;
+ font-size: 15px;
+ line-height: 1.6;
+ color: var(--text-gray)
+}
+
+table caption .table-number {
+ font-style: normal;
+ font-size: 12px;
+ line-height: 1.9;
+ color: var(--text-light)
+}
+
+::-webkit-scrollbar {
+ width: 10px;
+ height: 8px
+}
+
+::-webkit-scrollbar-track {
+ background: #9992
+}
+
+::-webkit-scrollbar-thumb {
+ background: #ccc
+}
+
+::-webkit-scrollbar-thumb:hover {
+ background: #888
+}
+
+@media (min-width:1280px) {
+ #table-of-contents {
+ position: fixed;
+ width: 18rem;
+ right: 1rem;
+ top: 0;
+ padding: 1em;
+ line-height: 1.5;
+ margin-top: 4rem
+ }
+
+ #table-of-contents h2 {
+ margin-top: 0
+ }
+
+ #table-of-contents #text-table-of-contents {
+ position: relative
+ }
+
+ #table-of-contents #text-table-of-contents::after,
+ #table-of-contents #text-table-of-contents::before {
+ position: absolute;
+ content: '';
+ width: calc(100% - 10px);
+ height: .7rem;
+ left: 0;
+ z-index: 1
+ }
+
+ #table-of-contents #text-table-of-contents::before {
+ top: 0;
+ background: linear-gradient(180deg, var(--back-light) 0%, var(--back-light) 35%, transparent 100%)
+ }
+
+ #table-of-contents #text-table-of-contents::after {
+ bottom: 0;
+ background: linear-gradient(0deg, var(--back-light) 0%, var(--back-light) 35%, transparent 100%)
+ }
+
+ #table-of-contents #text-table-of-contents>ul {
+ list-style: none;
+ padding: 0;
+ margin: 0;
+ max-height: calc(100vh - 5rem - 50px);
+ overflow-y: auto;
+ overflow-x: hidden;
+ scrollbar-width: thin
+ }
+
+ #table-of-contents #text-table-of-contents>ul ul {
+ padding-left: 2em
+ }
+
+ #table-of-contents #text-table-of-contents>ul li.active>ul,
+ #table-of-contents #text-table-of-contents>ul ul.active {
+ display: inline-block
+ }
+
+ #table-of-contents #text-table-of-contents>ul li.active>a,
+ #table-of-contents #text-table-of-contents>ul li.active>label a {
+ color: var(--text-dark)
+ }
+
+ #table-of-contents #text-table-of-contents>ul li.active>input:not(:checked)~label::after {
+ transform: rotate(90deg);
+ top: 5px;
+ opacity: .35
+ }
+
+ #table-of-contents #text-table-of-contents>ul>li:last-child {
+ margin-bottom: 2rem
+ }
+}
+
+@media (min-width:1440px) {
+ #table-of-contents {
+ width: 20rem;
+ right: 2rem
+ }
+}
+
+@media (min-width:1640px) {
+ #table-of-contents {
+ right: 5rem
+ }
+}
+
+@media (min-width:2000px) {
+ #table-of-contents {
+ width: 25rem
+ }
+}
+
+#table-of-contents #text-table-of-contents ul {
+ width: 100%
+}
+
+#table-of-contents #text-table-of-contents li input[type=checkbox],
+#table-of-contents #text-table-of-contents>ul ul {
+ display: none
+}
+
+#table-of-contents #text-table-of-contents li label {
+ display: inline-block;
+ width: 100%;
+ position: relative
+}
+
+#table-of-contents #text-table-of-contents li a {
+ display: inline-block;
+ color: var(--text-gray);
+ text-decoration: none !important;
+ text-shadow: none;
+ background: 0 0 !important
+}
+
+#table-of-contents #text-table-of-contents li label::after {
+ content: "\25b6";
+ color: var(--text-gray);
+ margin-left: .5em;
+ font-size: 10px;
+ display: inline-block;
+ position: absolute;
+ top: 3.4px;
+ left: -20px;
+ opacity: .8
+}
+
+#table-of-contents #text-table-of-contents li input:checked~ul {
+ display: inline-block !important
+}
+
+#table-of-contents #text-table-of-contents li input:checked~label a {
+ font-weight: 700
+}
+
+#table-of-contents #text-table-of-contents li input:checked~label::after {
+ transform: rotate(90deg);
+ top: 5px
+}
+
+#table-of-contents #text-table-of-contents li::before {
+ content: "" !important
+}
+
+.page-tags a {
+ border-style: solid;
+ border-width: 1px;
+ border-color: var(--back-light);
+ border-radius: 1px;
+ font-family: "Open Sans", sans;
+ font-variant: all-small-caps;
+ font-size: max(.4em, 10px);
+ font-style: normal;
+ letter-spacing: 2px;
+ background-image: none;
+ white-space: nowrap;
+ vertical-align: middle;
+ padding: .1em .5em;
+ background-color: var(--back-white);
+ margin-right: 5px;
+ line-height: 3em
+}
+
+@media print {
+ h2 {
+ page-break-before: always
+ }
+
+ h1,
+ h2,
+ h3,
+ h4,
+ h5 {
+ page-break-after: avoid
+ }
+
+ #switch-label,
+ #table-of-contents #text-table-of-contents li label::after {
+ display: none
+ }
+
+ #content,
+ #page-header {
+ margin-top: 0
+ }
+
+ #table-of-contents #text-table-of-contents>ul ul {
+ display: inline-block
+ }
+
+ #table-of-contents #text-table-of-contents>ul a::after {
+ content: leader(".") target-counter(attr(href), page)
+ }
+
+ img {
+ filter: none
+ }
+}
+
+@page {
+ size: auto;
+ margin-top: 4mm;
+ margin-bottom: 4mm
+}
diff --git a/src/org/index.html b/src/org/index.html
index 7482075..44dad40 100644
--- a/src/org/index.html
+++ b/src/org/index.html
@@ -6,21 +6,11 @@
Untitled
-
-
-
-