update docs css

docs/style.css

 /*
     override css elements of daux.io blue theme
-    version 2022-11-30
+    version 2023-10-09
 */
 :root {
     /* Axels Overrides */
-    --color-text: #222;
+    --color-text: #234;
     --link-color: #822;
-    --brand-color: var(--color-secondary);
+    --brand-color: var(--color-text);
     --brand-background: var(--body-background);
     --hr-color: none;
     --search-field-background: none;
@@ -24,27 +24,29 @@
     --axel_brand-pre-background-hover: rgb(255, 0, 51);
     ;
     --axel_h1_header: none;
-    --axel_h1: #345;
+    --axel_h1: #111;
     --axel_h1-bg: none;
     --axel_h1-bottom: 3px solid none;
-    --axel_h2: #156;
-    --axel_h2-bg: #f8fafb;
-    --axel_h2-bottom: 2px solid #467;
+    --axel_h2: #222;
+    --axel_h2-bg: none;
+    --axel_h2-bottom: 0px solid #467;
     --axel_h2-hero-bottom: 2px solid #912;
-    --axel_h3: #278;
-    --axel_h3-bottom: 1px solid #ddd;
+    --axel_h3: #333;
+    --axel_h3-bottom: 0px solid #ddd;
+    --axel_h4: #444;
     --axel_hero_bg: #f8f8f8;
+    --axel_img-border: 2px dashed #ccc;
     --axel_nav-bg: #fcfcfc;
     --axel_nav-buttomborder: #ddd;
     --axel_pre-background: #f8f8f8;
-    --axel-th-background: #d0e0e8;
+    --axel-th-background: #e0e4e8;
     --axel-article-nav-border-top: 0px dotted #ddd;
 }
 
 .dark {
     /* Axels Overrides */
     --color-text: #c0c0c0;
-    --link-color: #b44;
+    --link-color: #c66;
     --brand-color: var(--color-text);
     --brand-background: var(--body-background);
     --hr-color: none;
@@ -63,16 +65,17 @@
     --axel_brand-pre-background-hover: rgb(255, 0, 51);
     ;
     --axel_h1_header: none;
-    --axel_h1: #777;
+    --axel_h1: #578;
     --axel_h1-bg: none;
     --axel_h1-bottom: none;
     --axel_h2: #467;
-    --axel_h2-bg: #202020;
-    --axel_h2-bottom: 2px solid #256;
+    --axel_h2-bg: none;
+    --axel_h2-bottom: 0px solid #256;
     --axel_h2-hero-bottom: 2px solid #712;
     --axel_h3: #589;
-    --axel_h3-bottom: 1px solid #333;
+    --axel_h3-bottom: 0px solid #333;
     --axel_hero_bg: #242424;
+    --axel_img-border: 2px dashed #555;
     --axel_nav-bg: #242424;
     --axel_nav-buttomborder: #555;
     --axel_pre-background: #bcc;
@@ -133,7 +136,7 @@ a.Brand {
 .s-content h2 {
     background: var(--axel_h2-bg);
     color: var(--axel_h2);
-    font-size: 180%;
+    font-size: 190%;
     font-weight: bold;
     margin-top: 4em;
     border-bottom: var(--axel_h2-bottom);
@@ -147,6 +150,12 @@ h2:first-of-type {
     margin-top: 0em;
 }
 
+img{
+    border: var(--axel_img-border);
+    border-radius: 1.5em;
+    padding: 0.7em;
+}
+
 .s-content h3 {
     background: var(--axel_h3-bg);
     color: var(--axel_h3);
@@ -156,14 +165,24 @@ h2:first-of-type {
     border-bottom: var(--axel_h3-bottom);
 }
 
-.s-content h4 {
-    margin: 0;
+
+.s-content > h4 {
+    color: var(--axel_h4);
+    font-size: 135%;
+    font-weight: bold;
+    margin: 2em 0;
+}
+
+.s-content .TableOfContentsContainer h4 {
+    margin: 1em 0;
     font-size: 100%;
     text-align: center;
     background-color: rgba(0, 0, 0, 0.05);
     padding: 0.3em;
 }
-
+ul.TableOfContents a{
+    color: var(--color-text);
+}
 .s-content pre {
     background: var(--axel_pre-background);
 }