CSS small work.

src/css/minimalist.css

@@ -2,10 +2,13 @@
    Author: Yann Esposito
 */
 
+:root {
+    --font-size: 13px;
+}
 /* Fonts */
 body {
     font-family: Menlo, Monaco, monospace;
-    font-size: 13px;
+    font-size: var(--font-size);
     line-height: 1em;
 }
 code {
@@ -36,11 +39,11 @@ ul, li, p, section, header, footer {
 }
 h1, h2, h3, h4, h5, h6, pre, code, blockquote, p, ul, ol, section, header,
 figure {
-    margin-top: 20px;
+    margin-top: 1em;
-    margin-bottom: 20px;
+    margin-bottom: 1em;
 }
 figure {
-    margin: 20px 0px;
+    margin: 1em 0px;
 }
 figure > img {
     margin: 0px;
@@ -48,14 +51,14 @@ figure > img {
 li {
     position: relative;
     display: block;
-    padding-left: 20px;
+    padding-left: 1.5em;
 }
 ul > li:before {
     content: "– ";
     opacity: 0.5;
     float: left;
     position: relative;
-    left: -20px;
+    left: -1.5em;
     text-align: right;
     width: 0;
 }
@@ -68,7 +71,7 @@ ol > li:before {
     float: left;
     text-align: right;
     position: relative;
-    left: -20px;
+    left: -1.5em;
     width: 0;
 }
 ol > li:nth-child(n+10) {
@@ -80,7 +83,7 @@ ol > li:nth-child(n+10):before {
 img {
     max-width: 100%;
     max-height: 800px;
-    margin: 20px auto;
+    margin: 1em auto;
 }
 p > img, li > img {
     max-height: 1em;
@@ -89,14 +92,14 @@ p > img, li > img {
 }
 table {
     width: 100%;
-    margin: 20px 0;
+    margin: 1em 0;
     border-collapse: collapse;
     border: solid 1px;
     display: block;
     overflow: scroll;
 }
 td, th {
-    height: 20px;
+    height: 1em;
     padding: 0 10px;
     text-align: left;
     vertical-align: middle;
@@ -143,7 +146,7 @@ h6::before {
 }
 hr {
     position: relative;
-    height: 20px;
+    height: 1em;
     font-size: 0;
     line-height: 0;
     overflow: hidden;
@@ -200,30 +203,15 @@ navigation > a {
 
 /* org mode ids and classes */
 .figure {
-    margin-top: 20px;
+    margin-top: 1em;
-    margin-bottom: 20px;
-}
-#preamble {
-    border-bottom: solid 1px;
     margin-bottom: 1em;
 }
-#preamble h1, #preamble h2 {
-    margin: 0;
-}
-#preamble h2 {
-    font-weight: normal;
-    font-style: italic;
-}
-#postamble {
-    border-top: solid 1px;
-    margin-top: 10px;
-}
 #content,.content {
     max-width: 43em;
     margin: 0 1em;
     padding: 1px;
 }
-#content:first-child {
+#content *:first-child {
     margin-top: 0;
 }
 .timestamp-wrapper {
@@ -477,24 +465,24 @@ input#modern:target ~ #labels .content {
 /* Dark raw theme selected */
 input#darkraw:target ~ .main {
     --main-background: #000;
-    --main-foreground: #fff;
+    --main-foreground: #ddd;
-    --second-foreground: #fff;
+    --second-foreground: #ddd;
     --reveal-background: #000;
-    --soft-foreground: #fff;
+    --soft-foreground: #ddd;
-    --border-color: #fff;
+    --border-color: #ddd;
-    --todo-txt: #fff;
+    --todo-txt: #ddd;
-    --color-h1: #fff;
+    --color-h1: #ddd;
-    --color-h2: #fff;
+    --color-h2: #ddd;
-    --color-h3: #fff;
+    --color-h3: #ddd;
-    --color-h4: #fff;
+    --color-h4: #ddd;
-    --color-h5: #fff;
+    --color-h5: #ddd;
-    --color-h6: #fff;
+    --color-h6: #ddd;
     --color-link: var(--yellow);
     font-family: monospace;
 }
 input#darkraw:target ~ #labels {
     background: #000;
-    color: #fff;
+    color: #ddd;
 }
 input#darkraw:target ~ .main code,
 input#darkraw:target ~ .main pre {

src/css/slides.css

@@ -15,3 +15,6 @@
 #content,.content {
     max-width: 53em !important;
 }
+#preamble {
+    margin-bottom: 2em;
+}