increased sizes of elements and additional styling on mobile.

css/base.css

@@ -88,6 +88,8 @@ a.fill_div {
 }
 
 nav {
+  display: flex;
+  flex-direction: row;
   position: sticky;
   width: 100%;
   padding: 0;
@@ -710,6 +712,11 @@ hr {
 }
 
 @media screen and (max-width: 992px) {
+  body {
+    padding-bottom: 160px;
+    box-sizing: border-box;
+  }
+
   h1 {
     font-size: 8vw;
   }
@@ -752,9 +759,33 @@ hr {
     bottom: 0;
     width: 100%;
     margin: 0;
+    padding: 50px 0px 50px 0px;
     backdrop-filter: blur(50px);
   }
 
+  nav ul li a {
+    font-size: 3vw;
+  }
+
+  .site_navigation ul {
+    display: flex;
+    flex-direction: row-reverse;
+  }
+
+  .row_no_margin {
+    flex-direction: row-reverse;
+  }
+
+  .nav_right_hand {
+    flex-direction: row-reverse;
+    align-items: center;
+    justify-content: center;
+  }
+
+  .nav_right_hand * {
+    margin: 0px 0px 0px 15px;
+  }
+
   .article_card,
   .form_card,
   .view_card,
@@ -772,6 +803,13 @@ hr {
     margin: 15px 0px 15px 0px;
   }
 
+  .article_cards_grid {
+    margin: 0;
+    display: flex;
+    flex-direction: column-reverse;
+    width: 100%;
+  }
+
   .article_card .row {
     display: flex;
     flex-direction: column;