update css

public_html/main.css

 :root{
     --color-0: #345;
-    --color-h1: #c54;
-    --color-h2: #569;
+    --color-h1: #abc;
+    --color-h2: #579;
     --color-links: #349;
 
     --bg-0: #ddd;
@@ -25,18 +25,34 @@ button:active{ border:1px solid #fc2;}
 input{ border:1px solid #ccc; padding: 0.4em;}
 
 footer{ position: fixed; bottom: 0; left: 0; width: 100%; padding: 1em; background: var(--bg-footer); border-top: 2px solid rgba(255,255,255,0.5); text-align: center;}
-h1{color: var(--color-h1); border-bottom: 1px solid; background: linear-gradient(#fff, #f0f4f8);}
+h1{color: var(--color-h1); border-bottom: 1px solid; background: linear-gradient(#fff, #f0f4f8); margin-top: 0;}
 h2{color: var(--color-h2); margin-left: 0em;}
 
-h1>span, h2>span{font-size: 200%;}
+h1>span, h2>span{font-size: 130%;}
 section{
-    margin: 0 0 2em ;
+    margin: 0 0 1em ;
     padding: 1em 2em;
     border-top: 0px dashed #e0e4f0;
     background: linear-gradient(10deg, #fff, #f0f4f8, #fff);
     border-radius: 1em;
 }
 
+section input[type=checkbox]{ display: none; }
+section input[type=checkbox] + label { 
+    border: 1px solid  rgba(0,0,0,0.05); background: #f8f8f8; border-radius: 0.3em; margin: 0 0.5em 0.5em 0; padding: 0.5em;
+    opacity: 0.6;
+    transition: all 0.3s;
+}
+section input[type=checkbox]:checked + label {
+    background: #fff; 
+    box-shadow: 0.1em 0.1em 0.2em #ddd inset;
+    border-color: #cde;
+    opacity: 1;
+}
+section input[type=checkbox]+ label:hover {
+    border-color: #89a;
+}
+
 td{vertical-align: top;}
 
 #main{