Reorder the footer styles in root.css

static/styles/root.css

@@ -94,6 +94,48 @@ figure .youtube {
     width: 100%;
 }
 
+footer.site {
+    align-items: center;
+    display: flex;
+    flex-direction: column;
+    font-size: 1.6rem;
+    margin-block-start: 2rem;
+    text-align: center;
+}
+
+footer.site > div {
+    border-top: 1px solid var(--footer-border-color);
+    padding-block-start: 2rem;
+    max-width: var(--content-width);
+    width: 100%;
+}
+
+footer.site ul {
+    align-items: center;
+    display: flex;
+    flex-wrap: wrap;
+    justify-content: center;
+    list-style: none;
+}
+
+footer.site .slogans li {
+    margin-inline-start: 0.5em;
+}
+
+footer.site p {
+    margin: 0;
+}
+
+footer.site p + p {
+    margin-top: 0.25rem;
+}
+
+@media (max-width: 740px) {
+    footer.site .slogans span {
+        white-space: nowrap;
+    }
+}
+
 h1, h2, h3, h4, h5, h6 {
     font-family: var(--font-family-heading);
     margin: 0;
@@ -205,47 +247,6 @@ nav.bulleted li::before {
 p { margin-block-end: 1em; }
 p:last-child { margin-block-end: 0; }
 
-footer.site {
-    align-items: center;
-    display: flex;
-    flex-direction: column;
-    font-size: 1.6rem;
-    margin-block-start: 2rem;
-    text-align: center;
-}
-
-footer.site > div {
-    border-top: 1px solid var(--footer-border-color);
-    padding-block-start: 2rem;
-    max-width: var(--content-width);
-}
-
-footer.site ul {
-    align-items: center;
-    display: flex;
-    flex-wrap: wrap;
-    justify-content: center;
-    list-style: none;
-}
-
-footer.site .slogans li {
-    margin-inline-start: 0.5em;
-}
-
-footer.site p {
-    margin: 0;
-}
-
-footer.site p + p {
-    margin-top: 0.25rem;
-}
-
-@media (max-width: 740px) {
-    footer.site .slogans span {
-        white-space: nowrap;
-    }
-}
-
 .platter {
     background: var(--background-color);
     border: 1px solid var(--header-border-color);