diff --git a/.github/workflows/gh-pages.yml b/.github/workflows/gh-pages.yml
index bcad93e9..817bf8a6 100644
--- a/.github/workflows/gh-pages.yml
+++ b/.github/workflows/gh-pages.yml
@@ -30,7 +30,7 @@ jobs:
   build:
     runs-on: ubuntu-latest
     env:
-      HUGO_VERSION: 0.124.1
+      HUGO_VERSION: v0.134.1
     steps:
       - name: Install Hugo CLI
         run: |
diff --git a/themes/bootstrap/layouts/_default/_markup/render-table.html b/themes/bootstrap/layouts/_default/_markup/render-table.html
new file mode 100644
index 00000000..da56a55f
--- /dev/null
+++ b/themes/bootstrap/layouts/_default/_markup/render-table.html
@@ -0,0 +1,37 @@
+{{/*
+Extends the defaul Hugo table rendering
+(https://gohugo.io/render-hooks/tables/#example) to support Bootstrap 5's
+responsive tables by adding a wrapper div with a "table-responsive" class and
+by adding the class "table" to the table element.
+*/}}
+<div class="table-responsive">
+  <table class="table">
+    {{- range $k, $v := .Attributes }}
+      {{- if $v }}
+        {{- printf " %s=%q" $k $v | safeHTMLAttr }}
+      {{- end }}
+    {{- end }}
+    <thead>
+      {{- range .THead }}
+        <tr>
+          {{- range . }}
+            <th {{ printf "style=%q" (printf "text-align: %s" .Alignment) | safeHTMLAttr }}>
+              {{- .Text -}}
+            </th>
+          {{- end }}
+        </tr>
+      {{- end }}
+    </thead>
+    <tbody>
+      {{- range .TBody }}
+        <tr>
+          {{- range . }}
+            <td {{ printf "style=%q" (printf "text-align: %s" .Alignment) | safeHTMLAttr }}>
+              {{- .Text -}}
+            </td>
+          {{- end }}
+        </tr>
+      {{- end }}
+    </tbody>
+  </table>
+</div>
diff --git a/themes/bootstrap/layouts/_default/tools.html b/themes/bootstrap/layouts/_default/tools.html
index b5a6a44c..7de210f7 100644
--- a/themes/bootstrap/layouts/_default/tools.html
+++ b/themes/bootstrap/layouts/_default/tools.html
@@ -119,18 +119,20 @@
         <p class="lead" id="search-result-message">
           Loading...
         </p>
-        <table class="table table-striped" aria-label="tools table">
-          <thead>
-          <tr>
-            <th scope="col">Tool</th>
-            <th scope="col">Description</th>
-            <th scope="col">License</th>
-          </tr>
-          </thead>
-          <tbody id="tools-table">
+        <div class="table-responsive">
+          <table class="table table-striped" aria-label="tools table">
+            <thead>
+            <tr>
+              <th scope="col">Tool</th>
+              <th scope="col">Description</th>
+              <th scope="col">License</th>
+            </tr>
+            </thead>
+            <tbody id="tools-table">
 
-          </tbody>
-        </table>
+            </tbody>
+          </table>
+        </div>
       </div>
     </div>
   </div>
diff --git a/themes/bootstrap/static/css/theme.css b/themes/bootstrap/static/css/theme.css
index 8f507e55..061209f7 100644
--- a/themes/bootstrap/static/css/theme.css
+++ b/themes/bootstrap/static/css/theme.css
@@ -84,18 +84,9 @@ dl dd {
 }
 
 td, th {
-  padding: 8px;
-  line-height: 1.428571429;
-  vertical-align: top;
   border-top: 1px solid #ddd;
 }
 
-table {
-  width: 100%;
-  margin-top: 20px;
-  margin-bottom: 20px;
-}
-
 footer {
   width: 100%;
   padding: 20px 0;
@@ -213,43 +204,3 @@ footer {
 .goat svg {
   font-size: 14px;
 }
-
-/** 
- * Bootsrap 5 has table styles as opt-in by adding the class .table to <table>.
- * However Hugo converts Markdown tables to HTML directly, and there are
- * currently no Hugo render hooks for tables. As a workaround, we copy the
- * styles for .table in bootstrap.css to the table tag here.
- */
-table {
-  --bs-table-color-type: initial;
-  --bs-table-bg-type: initial;
-  --bs-table-color-state: initial;
-  --bs-table-bg-state: initial;
-  --bs-table-color: var(--bs-emphasis-color);
-  --bs-table-bg: var(--bs-body-bg);
-  --bs-table-border-color: var(--bs-border-color);
-  --bs-table-accent-bg: transparent;
-  --bs-table-striped-color: var(--bs-emphasis-color);
-  --bs-table-striped-bg: rgba(var(--bs-emphasis-color-rgb), 0.05);
-  --bs-table-active-color: var(--bs-emphasis-color);
-  --bs-table-active-bg: rgba(var(--bs-emphasis-color-rgb), 0.1);
-  --bs-table-hover-color: var(--bs-emphasis-color);
-  --bs-table-hover-bg: rgba(var(--bs-emphasis-color-rgb), 0.075);
-  width: 100%;
-  margin-bottom: 1rem;
-  vertical-align: top;
-  border-color: var(--bs-table-border-color);
-}
-table > :not(caption) > * > * {
-  padding: 0.5rem 0.5rem;
-  color: var(--bs-table-color-state, var(--bs-table-color-type, var(--bs-table-color)));
-  background-color: var(--bs-table-bg);
-  border-bottom-width: var(--bs-border-width);
-  box-shadow: inset 0 0 0 9999px var(--bs-table-bg-state, var(--bs-table-bg-type, var(--bs-table-accent-bg)));
-}
-table > tbody {
-  vertical-align: inherit;
-}
-table > thead {
-  vertical-align: bottom;
-}