diff --git a/opentech/apply/funds/templates/funds/submissions.html b/opentech/apply/funds/templates/funds/submissions.html
index 9684cb70f57062930ac2a1ce38091390c97c3bbb..dce637a3a2b414b4adbb2bb203f144c98cb5de21 100644
--- a/opentech/apply/funds/templates/funds/submissions.html
+++ b/opentech/apply/funds/templates/funds/submissions.html
@@ -20,8 +20,8 @@
     {% if object_list|length > 0 or active_filters %}
         <div class="button button--filters button--contains-icons js-open-filters">Filter By</div>
 
-        <div class="wrapper wrapper--filters js-filter-wrapper">
-            <div class="wrapper wrapper--filters-header">
+        <div class="filters js-filter-wrapper">
+            <div class="filters__header">
                 <div class="js-clear-filters">Clear</div>
                 <div>Filter by</div>
                 <div class="js-close-filters">Close</div>
diff --git a/opentech/static_src/src/sass/apply/components/_filters.scss b/opentech/static_src/src/sass/apply/components/_filters.scss
new file mode 100644
index 0000000000000000000000000000000000000000..812e3758fdda9463815598c4d655fe4ae916d40f
--- /dev/null
+++ b/opentech/static_src/src/sass/apply/components/_filters.scss
@@ -0,0 +1,39 @@
+.filters {
+    display: none;
+
+    @include media-query(tablet-landscape) {
+        display: block;
+    }
+
+    &.is-open {
+        position: fixed;
+        top: 0;
+        right: 0;
+        bottom: 0;
+        left: 0;
+        z-index: 20;
+        display: block;
+        width: 100%;
+        height: 100vh;
+        background: $color--white;
+    }
+
+    &__header {
+        display: flex;
+        align-items: center;
+        justify-content: space-around;
+        padding: 20px 0;
+
+        @include media-query(tablet-landscape) {
+            display: none;
+        }
+
+        > div[class^='js-'] {
+            color: $color--primary;
+
+            &:hover {
+                cursor: pointer;
+            }
+        }
+    }
+}
diff --git a/opentech/static_src/src/sass/apply/components/_wrapper.scss b/opentech/static_src/src/sass/apply/components/_wrapper.scss
index cd316173056a4f6eba0e82da04882bf50bc50f8c..34405caaff4c050f88e8c4619ff10636b22f03d6 100644
--- a/opentech/static_src/src/sass/apply/components/_wrapper.scss
+++ b/opentech/static_src/src/sass/apply/components/_wrapper.scss
@@ -176,46 +176,6 @@
         }
     }
 
-    &--filters {
-        display: none;
-
-        @include media-query(tablet-portrait) {
-            display: block;
-        }
-
-        &.is-open {
-            position: fixed;
-            top: 0;
-            right: 0;
-            bottom: 0;
-            left: 0;
-            z-index: 20;
-            display: block;
-            width: 100%;
-            height: 100vh;
-            background: $color--white;
-        }
-    }
-
-    &--filters-header {
-        display: flex;
-        align-items: center;
-        justify-content: space-around;
-        padding: 20px 0;
-
-        @include media-query(tablet-portrait) {
-            display: none;
-        }
-
-        > div[class^='js-'] {
-            color: $color--primary;
-
-            &:hover {
-                cursor: pointer;
-            }
-        }
-    }
-
     &--search {
         display: flex;
         flex-direction: column;
diff --git a/opentech/static_src/src/sass/apply/main.scss b/opentech/static_src/src/sass/apply/main.scss
index 5aea732021064a5754f0dec693b40a92ddf61d70..82e41b6943b1ee57c16d9ff22a7cd1f5040f7928 100755
--- a/opentech/static_src/src/sass/apply/main.scss
+++ b/opentech/static_src/src/sass/apply/main.scss
@@ -18,6 +18,7 @@
 @import 'components/comment';
 @import 'components/button';
 @import 'components/feed';
+@import 'components/filters';
 @import 'components/grid';
 @import 'components/heading';
 @import 'components/icon';