diff --git a/packages/create-sitecore-jss/src/templates/nextjs-sxa/src/assets/basic/_about.scss b/packages/create-sitecore-jss/src/templates/nextjs-sxa/src/assets/basic/_about.scss
deleted file mode 100644
index 56e5b1b7fa..0000000000
--- a/packages/create-sitecore-jss/src/templates/nextjs-sxa/src/assets/basic/_about.scss
+++ /dev/null
@@ -1,18 +0,0 @@
-@import "variables";
-
-.about-page {
-  padding-bottom: 20px;
-
-  .title {
-    display: block;
-    font-size:$text-size-36;
-    font-weight: 600;
-    line-height: 72px;
-  }
-  .text {
-    display: block;
-    font-size: $text-size-16;
-    font-weight: 500;
-    line-height: 32px;
-  }
-}
diff --git a/packages/create-sitecore-jss/src/templates/nextjs-sxa/src/assets/basic/_common.scss b/packages/create-sitecore-jss/src/templates/nextjs-sxa/src/assets/basic/_common.scss
deleted file mode 100644
index 3ee36d009f..0000000000
--- a/packages/create-sitecore-jss/src/templates/nextjs-sxa/src/assets/basic/_common.scss
+++ /dev/null
@@ -1,75 +0,0 @@
-@import "@sass/abstracts/mixins";
-@import "variables";
-
-* {
-  font-family: Roboto;
-}
-
-main {
-  position: relative;
-  min-height: calc(100vh - 352px);
-  margin-bottom: 50px;
-  padding-top: 50px;
-
-  @include respond-to(all-mobile) {
-    padding-top: 0;
-    margin-bottom: 0;
-  }
-
-  #container {
-    margin-top: 60px;
-  }
-
-  .rich-text {
-    .main-header {
-      margin-bottom: 30px;
-
-      @include respond-to(all-mobile) {
-        margin-bottom: 0px;
-      }
-
-      .title {
-        font-size: $text-size-24;
-        font-weight: 500;
-        line-height: 50px;
-        margin-bottom: 30px;
-
-        @include respond-to(all-mobile) {
-          font-size: $text-size-16;
-          line-height: 32px;
-        }
-      }
-    }
-  }
-
-  .main-news {
-    padding-top: 50px;
-
-    @include respond-to(all-mobile) {
-      padding-top: 0;
-    }
-
-    .title {
-      display: block;
-      font-size: $text-size-36;
-      font-weight: 500;
-      line-height: 62px;
-
-      @include respond-to(all-mobile) {
-        font-size: $text-size-18;
-        line-height: 22px;
-      }
-    }
-
-    .text {
-      font-size: $text-size-16;
-      font-weight: 500;
-
-      @include respond-to(all-mobile) {
-        font-size: $text-size-14;
-        line-height: 24px;
-        font-weight: 400;
-      }
-    }
-  }
-}
diff --git a/packages/create-sitecore-jss/src/templates/nextjs-sxa/src/assets/basic/_container.scss b/packages/create-sitecore-jss/src/templates/nextjs-sxa/src/assets/basic/_container.scss
new file mode 100644
index 0000000000..fdf175081c
--- /dev/null
+++ b/packages/create-sitecore-jss/src/templates/nextjs-sxa/src/assets/basic/_container.scss
@@ -0,0 +1,24 @@
+@import "@sass/abstracts/mixins";
+@import "variables";
+
+* {
+  font-family: Roboto;
+}
+h1 {
+  font-size: 36px;
+}
+.max-height {
+  .container {
+    margin-top: 60px;
+  }
+  position: relative;
+  min-height: calc(100vh - 388px);
+  margin-bottom: 50px;
+  padding-top: 50px;
+
+  @include respond-to(all-mobile) {
+    padding-top: 0;
+    margin-bottom: 0;
+  }
+
+}
diff --git a/packages/create-sitecore-jss/src/templates/nextjs-sxa/src/assets/basic/_footer.scss b/packages/create-sitecore-jss/src/templates/nextjs-sxa/src/assets/basic/_footer.scss
index 3df5ae5d43..0b04f90065 100644
--- a/packages/create-sitecore-jss/src/templates/nextjs-sxa/src/assets/basic/_footer.scss
+++ b/packages/create-sitecore-jss/src/templates/nextjs-sxa/src/assets/basic/_footer.scss
@@ -9,6 +9,10 @@ footer {
   .rich-text {
     font-size: $text-size-14;
     color: $text-white;
+
+    a {
+      color: $text-white;
+    }
   }
 
   .indent-inner {
diff --git a/packages/create-sitecore-jss/src/templates/nextjs-sxa/src/assets/basic/_promo.scss b/packages/create-sitecore-jss/src/templates/nextjs-sxa/src/assets/basic/_promo.scss
index 4723a86d86..02c0a4b6ae 100644
--- a/packages/create-sitecore-jss/src/templates/nextjs-sxa/src/assets/basic/_promo.scss
+++ b/packages/create-sitecore-jss/src/templates/nextjs-sxa/src/assets/basic/_promo.scss
@@ -9,6 +9,20 @@
 
     >.component-content {
       @include border-basic(all, 'none', 0);
+      
+      .promo-text {
+        .field-promotext {
+          font-size: 14px;
+
+          h3 {
+            font-size: 18px;
+            margin: 10px 0;
+          }
+          p {
+            margin: 10px 0;
+          }
+        }
+      }
       @include respond-to(all-mobile) {
         > div {
           padding: 0;
@@ -18,14 +32,6 @@
           padding: 15px 10px 10px 25px;
         }
       }
-
-      .promo-text {
-        .field-promotext {
-          p {
-            margin: 10px 0;
-          }
-        }
-      }
     }
   }
 }
diff --git a/packages/create-sitecore-jss/src/templates/nextjs-sxa/src/assets/basic/_rich-text.scss b/packages/create-sitecore-jss/src/templates/nextjs-sxa/src/assets/basic/_rich-text.scss
index 12d9fc47bc..77940fb316 100644
--- a/packages/create-sitecore-jss/src/templates/nextjs-sxa/src/assets/basic/_rich-text.scss
+++ b/packages/create-sitecore-jss/src/templates/nextjs-sxa/src/assets/basic/_rich-text.scss
@@ -3,8 +3,14 @@
 
 .rich-text {
   color: $text-gray;
+  font-size: 16px;
+  
+  h4 {
+    line-height: 50px;
+  }
+
   @include respond-to(all-mobile) {
-    padding: 15px 10px 10px 25px;
+    padding: 15px 30px 10px 25px;
 
     h2 {
       font-size: $text-size-18;
diff --git a/packages/create-sitecore-jss/src/templates/nextjs-sxa/src/assets/basic/main.scss b/packages/create-sitecore-jss/src/templates/nextjs-sxa/src/assets/basic/main.scss
index ddc2cd558f..2987a815de 100644
--- a/packages/create-sitecore-jss/src/templates/nextjs-sxa/src/assets/basic/main.scss
+++ b/packages/create-sitecore-jss/src/templates/nextjs-sxa/src/assets/basic/main.scss
@@ -1,10 +1,7 @@
-@import "common";
+@import "container";
 @import "header";
 @import "promo";
 @import "navigation";
 @import "component";
 @import "rich-text";
 @import "footer";
-
-/**pages**/
-@import "about";
diff --git a/packages/create-sitecore-jss/src/templates/nextjs-sxa/src/components/Container.tsx b/packages/create-sitecore-jss/src/templates/nextjs-sxa/src/components/Container.tsx
index 2deca47f2a..5df2cb26c0 100644
--- a/packages/create-sitecore-jss/src/templates/nextjs-sxa/src/components/Container.tsx
+++ b/packages/create-sitecore-jss/src/templates/nextjs-sxa/src/components/Container.tsx
@@ -12,12 +12,13 @@ const BACKGROUND_REG_EXP = new RegExp(
 
 interface ComponentProps {
   rendering: ComponentRendering & { params: ComponentParams };
-  params?: ComponentParams;
+  params: ComponentParams;
 }
 
 const Container = (props: ComponentProps): JSX.Element => {
   const { sitecoreContext } = useSitecoreContext();
-  const styles = `${props.params.GridParameters} ${props.params?.Styles}`.trimEnd();
+  const containerStyles = props.params && props.params.Styles ? props.params.Styles : '';
+  const styles = `${props.params.GridParameters} ${containerStyles}`.trimEnd();
   const phKey = `container-${props.params.DynamicPlaceholderId}`;
   const backgroundImage = props.params.BackgroundImage as string;
   let backgroundStyle: { [key: string]: string } = { backgroundImage: '' };