Restructuring of file hierachy and cleanup

style.css

@@ -41,6 +41,11 @@ pre{
     margin: 0;
 }
 
+.ascii-art{
+    white-space: pre;
+    text-align: center;
+}
+
 .site-head{
     margin-bottom: 1em;
 }
@@ -68,7 +73,7 @@ nav{
     font-size: 1.1em;
 }
 
-li{
+ul>li{
     list-style: square;
 }
 
@@ -110,7 +115,7 @@ a.highlight{
     min-height: 180px;
 }
 
-.project, .social, .question{
+.project, .social, .question, .three-gallery>figure>figcaption{
     padding: 5px;
     background: var(--contrast-bg);
 }
@@ -158,11 +163,30 @@ footer{
     flex-grow: 1;
     min-width: 20%;
     height: fit-content;
-}
-
-.tags{
     padding: 0 5px;
 }
+
+.three-gallery{
+    display: flex;
+    gap: 5%;
+    justify-content: center;
+    align-items: center;
+}
+
+.three-gallery>figure{
+    margin:0;
+    background: var(--contrast-bg);
+    max-width: 27.5%;
+}
+
+.three-gallery>figure>img{
+    width: 100%;
+}
+
+#author_date, #blog-body, #tags, .overview-backlink{
+    margin: 10px;
+}
+
 /* FAQ-specific */
 
 .question{
@@ -339,15 +363,9 @@ footer{
     }
 }
 
-@media (max-width: 1000px) and (min-width: 750px){
-    .site-head{
-        font-size: 0.75em;
-    }
-}
-
-@media (max-width: 749px) and (min-width: 510px){
-    .site-head{
-        font-size: 0.5em;
+@media (max-width: 1000px){
+    header{
+        font-size: 1.8vw;
     }
 }
 
@@ -361,15 +379,24 @@ footer{
         flex-direction: column;
         white-space: collapse;
     }
-}
-
-@media (max-width: 509px){
-    .site-head{
-        font-size: 0.35em;
+    
+    .three-gallery{
+        flex-direction: column;
+    }
+    
+    .three-gallery>figure{
+        margin-bottom: 10px;
     }
 }
 
-@media (max-width: 570px){
+@media (max-width: 800px){
+    .three-gallery>figure{
+        max-width: 100%;
+    }
+}
+
+
+@media (max-width: 700px){
     .links-nav{
         flex-direction: column;
     }