diff --git a/system-addon/content-src/components/Base/_Base.scss b/system-addon/content-src/components/Base/_Base.scss
index 4c076550cb..c7a9dffbd2 100644
--- a/system-addon/content-src/components/Base/_Base.scss
+++ b/system-addon/content-src/components/Base/_Base.scss
@@ -8,6 +8,14 @@
 main {
   margin: auto;
 
+  @media (min-width: $break-point-smallest) {
+    width: $wrapper-max-width-smallest;
+  }
+
+  @media (min-width: $break-point-small) {
+    width: $wrapper-max-width-small;
+  }
+
   @media (min-width: $break-point-medium) {
     width: $wrapper-max-width-medium;
   }
diff --git a/system-addon/content-src/components/ManualMigration/ManualMigration.scss b/system-addon/content-src/components/ManualMigration/ManualMigration.scss
index b67b94f881..851394fee0 100644
--- a/system-addon/content-src/components/ManualMigration/ManualMigration.scss
+++ b/system-addon/content-src/components/ManualMigration/ManualMigration.scss
@@ -1,34 +1,56 @@
 .manual-migration-container {
   background: rgba(215, 215, 219, .5);
   font-size: 13px;
-  height: 50px;
   border-radius: 2px;
   margin-bottom: $search-margin-bottom;
+  padding: 20px;
+  text-align: center;
 
-  display: flex;
-  justify-content: space-between;
+  @media (min-width: $break-point-medium) {
+    display: flex;
+    justify-content: space-between;
+    height: 100px;
+    padding: 0;
+    text-align: left;
+  }
+
+  @media (min-width: $break-point-large) {
+    height: 50px;
+  }
 
   p {
     margin: 0;
-    margin-inline-end: 4px;
-    margin-inline-start: 12px;
-    align-self: center;
-    display: flex;
-    justify-content: space-between;
+    @media (min-width: $break-point-medium) {
+      margin-inline-end: 4px;
+      margin-inline-start: 12px;
+      align-self: center;
+      display: flex;
+      justify-content: space-between;
+    }
   }
 
   .icon {
-    margin: 0;
-    margin-inline-end: 12px;
-    align-self: center;
+    display: none;
+    @media (min-width: $break-point-medium) {
+      display: block;
+      margin: 0;
+      margin-inline-end: 12px;
+      align-self: center;
+    }
   }
 }
 
 .manual-migration-actions {
-  display: flex;
-  justify-content: space-between;
   border: none;
-  padding: 0;
+  display: block;
+  padding: 10px 0 0 0;
+  line-height: 34px;
+
+  @media (min-width: $break-point-medium) {
+    display: flex;
+    justify-content: space-between;
+    padding: 0;
+  }
 
   button {
     align-self: center;
diff --git a/system-addon/content-src/components/Sections/_Sections.scss b/system-addon/content-src/components/Sections/_Sections.scss
index c8809e62aa..35db7521b1 100644
--- a/system-addon/content-src/components/Sections/_Sections.scss
+++ b/system-addon/content-src/components/Sections/_Sections.scss
@@ -72,9 +72,11 @@
   }
 
   .section-list {
-    width: $wrapper-card-outer;
     clear: both;
     margin: 0;
+    display: grid;
+    grid-template-columns: repeat(auto-fit, $card-width);
+    grid-gap: $base-gutter;
   }
 
   .section-empty-state {
diff --git a/system-addon/content-src/styles/_variables.scss b/system-addon/content-src/styles/_variables.scss
index dcbc83c8c3..b1ccddd036 100644
--- a/system-addon/content-src/styles/_variables.scss
+++ b/system-addon/content-src/styles/_variables.scss
@@ -29,8 +29,12 @@ $icon-size: 16px;
 $smaller-icon-size: 12px;
 
 $wrapper-top-padding: 62px;
-$wrapper-max-width-medium: $grid-unit * 5 + $base-gutter * 4; // 5 top sites
+$wrapper-max-width-smallest: $grid-unit * 2 + $base-gutter * 1; // 2 top sites
+$wrapper-max-width-small: $grid-unit * 3 + $base-gutter * 2; // 3 top sites
+$wrapper-max-width-medium: $grid-unit * 4 + $base-gutter * 3; // 4 top sites
 $wrapper-max-width-large: $grid-unit * 6 + $base-gutter * 5; // 6 top sites
+$break-point-smallest: $wrapper-max-width-smallest + $base-gutter * 2;
+$break-point-small: $wrapper-max-width-small + $base-gutter * 2;
 $break-point-medium: $wrapper-max-width-medium + $base-gutter * 2;
 $break-point-large: $wrapper-max-width-large + $base-gutter * 2;
 $wrapper-card-outer: 768px;