diff --git a/web/components/filters/filters.tsx b/web/components/filters/filters.tsx
index 1700c9b6..6becfcb0 100644
--- a/web/components/filters/filters.tsx
+++ b/web/components/filters/filters.tsx
@@ -222,7 +222,7 @@ function Filters(props: {
   const [noMinAge, noMaxAge] = getNoMinMaxAge(filters.pref_age_min, filters.pref_age_max)
 
   return (
-    <Col className="mb-[calc(var(filter-offset)+env(safe-area-inset-bottom))] mt-[calc(var(filter-offset)+env(safe-area-inset-top))] pt-3">
+    <Col className="mb-[calc(var(filter-offset)+env(safe-area-inset-bottom))] mt-[calc(var(--filter-offset)+env(safe-area-inset-top))] pt-3 pb-1">
       <SelectedFiltersSummary
         filters={filters}
         locationFilterProps={locationFilterProps}
diff --git a/web/styles/globals.css b/web/styles/globals.css
index dcdfd49d..50c008ce 100644
--- a/web/styles/globals.css
+++ b/web/styles/globals.css
@@ -8,13 +8,13 @@
   --bnh: env(safe-area-inset-bottom); /* native bottom nav height */
   --tnh: env(safe-area-inset-top); /* native top nav height */
   --hloss: calc(var(--bnh) + var(--tnh)); /* mobile height loss due to native top and bottom bars */
-  --filter-offset: 20px; /* padding for filters on mobile */
+  --filter-offset: 0px; /* padding for filters on mobile */
   touch-action: pan-y;
 }
 
-/*@media (width < 600px) {*/
-/*  --filter-offset: 0px;*/
-/*}*/
+@media (width < 600px) {
+  --filter-offset: 20px;
+}
 
 .safe-top {
   /*padding-top: calc(20px);*/