footer: tweak columns a bit

The columns look a bit confusing when they're not either fully
horizontal or fully vertical. So let's change this so they stack
horizontally on wide displays, and vertically on narrow displays.

layouts/partials/footer.html

@@ -2,7 +2,7 @@
   <div class="container">
     <div class="row">
 
-      <div class="col">
+      <div class="col-12 col-lg-3">
         <h6 class="text-dark">Documentation</h6>
         <ul class="list-unstyled">
           <li><a href="{{ .Site.Params.DocsURL }}/license.html">License</a></li>
@@ -11,7 +11,7 @@
         </ul>
       </div>
 
-      <div class="col">
+      <div class="col-12 col-lg-3">
         <h6 class="text-dark">Community</h6>
         <ul class="list-unstyled">
           <li><a href="https://gitlab.freedesktop.org/mesa">GitLab</a></li>
@@ -20,7 +20,7 @@
         </ul>
       </div>
 
-      <div class="col">
+      <div class="col-12 col-lg-3">
         <h6 class="text-dark">More</h6>
         <ul class="list-unstyled">
           <li><a href="{{ "/website/" | relURL }}">About Mesa3D.org</a></li>
@@ -29,7 +29,7 @@
         </ul>
       </div>
 
-      <div class="col">
+      <div class="col-12 col-lg-3">
         <p>Hosted by <a href="https://www.freedesktop.org/">Freedesktop.org</a></p>
         {{ if .Page.Path }}
         <p><a href="{{ .Site.Params.GitLabURL }}/-/blob/main/content/{{ .Page.Path }}">Edit this page</a></p>