CSS cleanup

static/css/base.css

@@ -1,41 +1,55 @@
+h1, h2, h3 {
+  margin: 0;
+}
+
 a {
   color: #E0E0E0;
   font-weight: 600;
   text-decoration: none;
 }
 
-a > h2 {
-  color: white;
-}
-
-h2, h3, p {
-  margin: 0;
-}
-
 body {
   background-color: #212121;
   color: white;
   font-size: 18px;
   font-family: -apple-system, BlinkMacSystemFont, avenir next, avenir, segoe ui, helvetica neue, helvetica, Ubuntu, roboto, noto, arial, sans-serif; 
+  margin: 0 24vw;
 }
 
 nav {
-  display: flex;
-  align-items: center;
+  margin: 0.75rem;
 }
 
 .logo, .icon {
   filter: invert(1) hue-rotate(180deg);
 }
 
-section,
-header,
-main {
-  margin: 0 24vw;
+.text-center {
+  text-align: center;
 }
 
-.errorTitle {
-  text-align: center;
+.flex {
+  display: flex;
+}
+.flex-center {
+  align-items: center;
+  justify-content: center;
+}
+.flex-center-y {
+  align-items: center;
+}
+.flex-col {
+  flex-direction: column;
+}
+
+.p-2 {
+  padding: 0.5rem;
+}
+.gap-2 {
+  gap: 0.5rem;
+}
+.gap-4 {
+  gap: 1rem;
 }
 
 .posts {
@@ -65,12 +79,6 @@ main {
   overflow: hidden;
 }
 
-.post__meta {
-  padding: 6px;
-  display: flex;
-  gap: 10px;
-}
-
 .pageSelector {
   display: flex;
   justify-content: space-between;
@@ -78,15 +86,12 @@ main {
 }
 
 footer {
-  display: flex;
-  justify-content: center;
-  flex-direction: row;
   gap: 5rem;
   margin: 2em 0;
 }
 
 @media only screen and (max-width: 812px) {
-  section, header, main {
+  body {
     margin: 0 !important;
   }
 }