diff --git a/app/assets/stylesheets/css/base.css b/app/assets/stylesheets/css/base.css
index d4f77cad..b197854c 100644
--- a/app/assets/stylesheets/css/base.css
+++ b/app/assets/stylesheets/css/base.css
@@ -48,3 +48,12 @@ a.link {
 .highlight {
   color: var(--colour-red-jam-500);
 }
+
+footer {
+  display: flex;
+  align-items: center;
+  background-color: var(--colour-slate-300);
+  margin-top: var(--s2);
+  min-height: var(--s4);
+  box-shadow: 0 50vh 0 50vh var(--colour-slate-300);
+}
diff --git a/app/views/layouts/new.html.erb b/app/views/layouts/new.html.erb
index f9fcb41b..3bdc9873 100644
--- a/app/views/layouts/new.html.erb
+++ b/app/views/layouts/new.html.erb
@@ -58,20 +58,19 @@
 
         <%= yield %>
       </div>
-      <footer>
-        <div>
-          <p><%= link_to "About", about_url %></p>
-          <p><%= link_to "Terms of use", terms_url %></p>
-        </div>
-        <div>
-          <p>A <a href="https://gofreerange.com">Go Free Range</a> project</p>
-        </div>
-      </footer>
+    </div>
+    <footer>
+      <div class="center cluster" style="--measure: 40ch;">
+        <%= link_to "About", about_url, class: 'link' %>
+        <%= link_to "Terms of use", terms_url, class: 'link' %>
+        <span>A <%= link_to "Go Free Range", 'https://gofreerange.com' %> project</span>
+      </div>
+
       <% if Current.user&.admin? && content_for(:admin) %>
       <div>
         <%= content_for :admin %>
       </div>
       <% end %>
-    </div>
+    </footer>
   </body>
 </html>