Extract advanced search into a component

app/assets/stylesheets/advanced_search.scss

@@ -0,0 +1,30 @@
+.advanced-search {
+  float: left;
+  margin: $line-height 0;
+  position: inherit;
+
+  @include breakpoint(medium) {
+    float: right;
+    margin-bottom: 0;
+    margin-top: $line-height / 4;
+    position: absolute;
+    right: 0;
+  }
+}
+
+.advanced-search-form {
+
+  @include breakpoint(medium) {
+    > .column {
+      padding: 0;
+    }
+  }
+
+  select {
+    height: $line-height * 2;
+  }
+
+  .column.end.clear {
+    clear: both;
+  }
+}

app/assets/stylesheets/application.scss

@@ -6,6 +6,7 @@
 @import "icons";
 @import "mixins";
 @import "admin";
+@import "advanced_search";
 @import "layout";
 @import "participation";
 @import "milestones";

app/assets/stylesheets/layout.scss

@@ -8,7 +8,6 @@
 // 06. Forms
 // 07. Callout
 // 08. User account
-// 09. Search
 // 10. Official levels
 // 11. Tables
 // 12. Social
@@ -1480,40 +1479,6 @@ form {
   }
 }
 
-// 09. Search
-// ----------
-
-.advanced-search {
-  float: left;
-  margin: $line-height 0;
-  position: inherit;
-
-  @include breakpoint(medium) {
-    float: right;
-    margin-bottom: 0;
-    margin-top: $line-height / 4;
-    position: absolute;
-    right: 0;
-  }
-}
-
-.advanced-search-form {
-
-  @include breakpoint(medium) {
-    > .column {
-      padding: 0;
-    }
-  }
-
-  select {
-    height: $line-height * 2;
-  }
-
-  .column.end.clear {
-    clear: both;
-  }
-}
-
 // 10. Officials levels
 // --------------------