1 files changed, 575 insertions, 0 deletions
diff --git a/assets/css/main.css b/assets/css/main.css
new file mode 100644
index 0000000..55167ef
--- /dev/null
+++ b/assets/css/main.css
@@ -0,0 +1,575 @@
+/* Basic */
+html {
+    /* 1 */
+    -ms-text-size-adjust: 100%;
+    /* 2 */
+    -webkit-text-size-adjust: 100%;
+    /* 2 */
+}
+
+.container {
+    margin: 1rem;
+}
+
+.sr-only {
+  position: absolute;
+  white-space: nowrap;
+  width: 1px;
+  height: 1px;
+  overflow: hidden;
+  border: 0;
+  padding: 0;
+  clip: rect(0 0 0 0);
+  clip-path: inset(50%);
+  margin: -1px;
+}
+
+body {
+    margin: 0;
+    font-size: 1.2em;
+    line-height: 1.5;
+    -webkit-font-smoothing: antialiased;
+    color: var(--font-color);
+    background: var(--bg-color);
+}
+
+article,
+aside,
+details,
+figcaption,
+figure,
+footer,
+header,
+hgroup,
+menu,
+nav,
+section {
+    display: block;
+}
+
+
+/* Links */
+
+a {
+    color: var(--link-color);
+}
+
+a:hover,
+a:focus,
+a:active {
+    color: var(--link-state-color);
+    text-decoration-style: dashed;
+}
+
+a:active,
+a:hover {
+    outline: 1px;
+}
+
+a:active {
+    opacity: 0.9;
+}
+a:visited {
+    color: var(--visited-color);
+}
+footer a:visited, nav a:visited:not(.site-title) {
+    color: var(--link-color);
+}
+
+a.skip-main {
+    left:-999px;
+    position:absolute;
+    top:auto;
+    width:1px;
+    height:1px;
+    overflow:hidden;
+    z-index:-999;
+}
+
+a.skip-main:focus, 
+a.skip-main:active {
+    left: auto;
+    top: 0px;
+    width: auto;
+    height: auto;
+    overflow:auto;
+    z-index:999;
+    padding: 4px 6px 4px 6px;
+}
+
+/* Table */
+thead {
+    background: var(--thead-bg-color);
+}
+
+table {
+    display: block;
+    max-width: 100%;
+    border-collapse: collapse;
+    overflow: auto;
+}
+
+
+th, td {
+    padding: 0.5em 1em;
+    border: 1px double var(--table-border-color);
+}
+
+/* Code */
+pre {
+    padding: 1em;
+    max-width: 100%;
+    overflow: auto;
+    border: 1px dashed red;
+    color: var(--pre-color);
+    background-color: var(--pre-bg-color);
+}
+
+code,
+pre {
+    font-family: monospace, monospace;
+    font-size: 1rem;
+}
+
+kbd {
+    border: 1px solid var(--font-color);
+    border-bottom: 2px solid var(--font-color);
+    border-radius: 5px;
+    padding: 0.1rem;
+}
+
+p code {
+    color: var(--inline-code-color);
+}
+
+/* Styles */
+
+blockquote {
+    border-left: 2px solid var(--bq-color);
+    padding: 0.1em 1em;
+    margin-left: 0.75em;
+}
+
+p {
+    margin-top: 0.5em;
+    margin-bottom: 0.5em;
+}
+
+hr {
+    color: var(--hr-color);
+    background-color: var(--hr-color);
+    border: none;
+    height: 1px;
+    border-bottom: thin solid var(--hr-color);
+}
+
+/* Header */
+
+.common-header {
+    marg
+}
+
+header {
+    margin-top: 1em;
+}
+
+header .site-title {
+    color: var(--font-color);
+    font-size: 1em;
+    margin-bottom: 0;
+    font-weight: normal;
+}
+
+header nav:not(:empty){
+    margin-top: 1em;
+    max-width: 100%;
+    padding: 0.5em 0;
+}
+
+header nav a {
+    display: inline-block;
+    margin: 0 1rem;
+}
+
+/* Social icons */
+table.social-icons {
+    float: right
+}
+table.social-icons th {
+    text-align: right;
+}
+table.social-icons th, td {
+    border: none;
+    padding: 0.5rem;
+}
+
+.inline-svg {
+    display: inline-block;
+    height: 1.15rem;
+    width: 1.15rem;
+    top: 0.15rem;
+    position: relative;
+}
+
+/* Pages */
+main h1 {
+    margin-top: 1em;
+    font-weight: normal;
+    line-height: 1.1em;
+    margin-bottom: 0.5em;
+    font-weight: 600;
+}
+
+/* Articles */
+
+a:hover, a:focus, a:active {
+    color: var(--link-state-color);
+}
+
+.post-title.draft::after {
+    content: "✎";
+    display: inline-block;
+    margin-left: 0.2em;
+}
+
+article.embedded {
+    border: 1px dashed red;
+    padding: 1rem;
+}
+
+article:not(:last-of-type) {
+    padding-bottom: 2em;
+}
+header h1, header .post-translations {
+    margin-left: 2.5rem;
+}
+
+h1 a, h2 a, h3 a, h4 a, h5 a, h6 a,
+h1 a:visited, h2 a:visited, h3 a:visited, h4 a:visited, h5 a:visited, h6 a:visited{
+    color: var(--font-color);
+}
+
+.post-info {
+    color: var(--post-info-color);
+    font-size: 0.75em;
+    margin-top: 1em;
+}
+
+.post-info a {
+    color: var(--post-info-color);
+}
+
+.post-info a:hover {
+    color: var(--link-state-color);
+}
+
+.post-taxonomies {
+    display: inline;
+}
+
+.post-categories {
+    display: inline;
+    list-style-type: none;
+    padding: 0;
+}
+
+.post-categories li {
+    display: inline;
+    margin-left: 1em;
+}
+
+.post-tags {
+    display: inline;
+    list-style-type: none;
+    padding: 0;
+}
+
+.post-tags li {
+    display: inline;
+    margin-left: 1em;
+}
+
+article img {
+    max-width: 100%;
+    display: block;
+    height: auto;
+    margin: 0 auto .5em;
+}
+
+article figcaption {
+    color: grey;
+    text-align: center;
+    font-size: 0.85em;
+    margin-bottom: 2em;
+}
+
+.read-more {
+    margin: 1em 0;
+}
+
+.post-translations {
+    margin-left: 0.5em;
+    list-style: none;
+    padding: 0;
+    display: inline;
+    font-size: 14px;
+}
+
+.post-translations > li {
+    display: inline;
+}
+
+.post-translations > li:not(:last-child)::after {
+    content: "|";
+    display: inline-block;
+}
+
+.post-translations > li a {
+    color: var(--link-color);
+}
+
+.post-translations > li a:hover, 
+.post-translations > li a:focus {
+    color: var(--link-state-color);
+}
+
+/* Other pages */
+.terms {
+    list-style-type: none;
+    padding: 0;
+    line-height: 2em;
+}
+
+/* Footer */
+
+#footer {
+    max-width: 80rem;
+    margin: 0 auto;
+    border-top: thin solid var(--hr-color);
+    padding-top: 1.5em;
+    margin-top: 3em;
+}
+
+.common-footer-bottom {
+    align-items: center;
+    justify-content: space-between;
+}
+
+ul.language-select, ul.footer-menu {
+    padding-left: 0;
+    list-style: none;
+    display: flex;
+}
+
+ul.language-select > li, ul.footer-menu > li {
+    margin-right: 1em;
+}
+
+/* Media Queries */
+
+@media screen, print {
+    h2 .decorative::before {
+        content: '# ';
+    }
+
+    h3 .decorative::before {
+        content: '## ';
+    }
+
+    h4 .decorative::before {
+        content: '### ';
+    }
+    .decorative::before {
+        color: gray;
+    }
+}
+
+@media speech {
+    .decorative::before {
+        display: none;
+    }
+}
+
+@media print {
+    aside, .language-select, .post-translations {
+        display: None;
+    }
+    article .content a:not(.heading-anchor):visited, article header a:visited {
+        color: var(--link-color);
+    }
+    .webring {
+        display: none;
+    }
+}
+@media (min-width: 780px) {
+
+    #toc {
+        position: sticky;
+        top: 10px;
+    }
+    .container {
+        display: grid;
+        grid-template-columns: 1fr 4fr 1fr;
+        grid-gap: 2rem;
+    }
+    .common-footer-bottom {
+        display: grid;
+        grid-template-columns: 1fr 1fr;
+    }
+}
+
+@media (max-width: 500px) {
+    table.social-icons .inline-svg {
+        display: none;
+    }
+}
+
+@media (max-width: 840px) {
+    .main-wrapper {
+        margin: 0;
+        max-width: none;
+        overflow-x: hidden;
+        padding-left: 25px;
+        padding-right: 25px;
+    }
+
+    .post-navigation {
+        text-align: center;
+        padding: 0.5em 0;
+    }
+
+    .post-navigation a {
+        margin-left: 0.5em;
+    }
+}
+
+/* Webring---doesn't make sense if you don't use openring */
+
+.webring {
+  margin-top: 2rem;
+}
+
+.webring h2 {
+  font-size: 1.2rem;
+}
+
+.webring .articles {
+  width: 95%;
+}
+
+.webring .title {
+  margin: 0;
+}
+
+.webring .article {
+  width: 100%;
+  padding: 0.5rem;
+  border: 1px solid #333;
+  margin: 0.5rem 0;
+}
+
+@media (max-width: 640px) {
+  .webring .article {
+    margin: 0.5rem 0;
+  }
+}
+
+.webring .article:first-child {
+  margin-left: 0;
+}
+
+.webring .article:last-child {
+  margin-right: 0;
+}
+
+.webring .summary {
+  font-size: 1rem;
+  flex: 1 1 0;
+}
+
+.webring .attribution {
+  float: right;
+  font-size: 0.8rem;
+  color: #555;
+  line-height: 3;
+}
+
+dl dt {
+  font-weight: bold;
+}
+dl dd {
+  text-indent: 1em;
+}
+
+/* Book data format */
+
+dl.data {
+  border: 3px double #ccc;
+  padding: 0.5em;
+}
+dl.data dt {
+  float: left;
+  clear: left;
+  max-width: 40%;
+  text-align: right;
+  font-weight: bold;
+}
+dl.data dd {
+  margin: 0 0 0 110px;
+  padding: 0 0 0.5em 0;
+}
+
+.text-red {
+  color: var(--red);
+}
+
+.text-green {
+  color: var(--green);
+}
+
+details {
+  margin-top: 1em;
+  margin-bottom: 1em;
+  border: 1px solid #aaa;
+  border-radius: 4px;
+  padding: .5em .5em 0;
+}
+
+summary {
+  font-weight: bold;
+  margin: -.5em -.5em 0;
+  padding: .5em;
+}
+
+details[open] {
+  padding: .5em;
+}
+
+details[open] summary {
+  border-bottom: 1px solid #aaa;
+  margin-bottom: .5em;
+}
+
+a.site-title::before {
+  content: "[";
+}
+
+a.site-title::after {
+  content: "]";
+}
+
+a.prev-link::before {
+  content: "← ";
+}
+
+a.next-link.float {
+  float: right;
+}
+
+a.random-link::before {
+    content: "🎲 ";
+}
+
+a.next-link::after {
+  content: " →";
+}