diff --git a/app/assets/stylesheets/components/banner.scss b/app/assets/stylesheets/components/banner.scss
index 0e709d02c..4c0ea6c5e 100644
--- a/app/assets/stylesheets/components/banner.scss
+++ b/app/assets/stylesheets/components/banner.scss
@@ -111,59 +111,6 @@
 
 }
 
-.banner-intro {
-
-  margin: -10px 0 0 0;
-  padding: $gutter-half $gutter;
-  background: $govuk-blue;
-  color: $white;
-  overflow: hidden;
-
-  .heading-medium {
-    @include core-24;
-  }
-
-  a {
-    &:link,
-    &:visited {
-      color: $white;
-    }
-
-    &:hover,
-    &:active {
-      color: $light-blue-25;
-    }
-  }
-
-  .button-block {
-    line-height: 3.68em;
-  }
-
-  .button {
-
-    @include core-19;
-    background: $white;
-    padding: 0.3684210526em 0.8421052632em 0.2105263158em 0.7421052632em;
-    display: inline-block;
-    margin-top: $gutter-half;
-    margin-right: 0.3em;
-    box-shadow: 0 2px 0 mix($govuk-blue, $text-colour);
-
-    &:link,
-    &:visited,
-    &:hover {
-      color: $govuk-blue;
-    }
-
-    &:hover {
-      background: $light-blue-25;
-      outline: none;
-    }
-
-  }
-
-}
-
 .banner-tour {
 
   @extend %banner;
diff --git a/app/assets/stylesheets/main.scss b/app/assets/stylesheets/main.scss
index f5a0e4d4f..01e593a16 100644
--- a/app/assets/stylesheets/main.scss
+++ b/app/assets/stylesheets/main.scss
@@ -66,6 +66,7 @@ $path: '/static/images/';
 @import 'views/dashboard';
 @import 'views/users';
 @import 'views/api';
+@import 'views/product-page';
 
 // TODO: break this up
 @import 'app';
diff --git a/app/assets/stylesheets/views/product-page.scss b/app/assets/stylesheets/views/product-page.scss
new file mode 100644
index 000000000..1b4eafc1c
--- /dev/null
+++ b/app/assets/stylesheets/views/product-page.scss
@@ -0,0 +1,66 @@
+.product-page {
+
+  &-intro {
+
+    margin: -10px 0 $gutter * 1.5 0;
+    padding: $gutter 0 $gutter * 1.5 0;
+    background: $govuk-blue;
+    color: $white;
+
+    &-wrapper {
+      @extend %site-width-container;
+    }
+
+    h1 {
+      @include bold-36;
+    }
+
+    p {
+      margin: $gutter-half 0 $gutter;
+    }
+
+    .button-container {
+      line-height: 35px;
+    }
+
+    .button {
+
+      @include button($white);
+      color: $govuk-blue;
+      margin-right: 5px;
+
+      &:link,
+      &:visited,
+      &:hover {
+        color: $govuk-blue;
+      }
+
+      &:hover {
+        background: $light-blue-25;
+        outline: none;
+      }
+
+    }
+
+    a {
+
+      &:link,
+      &:visited {
+        color: $white;
+      }
+
+      &:hover,
+      &:active {
+        color: $light-blue-25;
+      }
+
+    }
+
+  }
+
+  &-section {
+    @extend %site-width-container;
+    margin-bottom: $gutter * 1.5;
+  }
+
+}
diff --git a/app/templates/views/signedout.html b/app/templates/views/signedout.html
index ca69f4ee3..7553a9a5d 100644
--- a/app/templates/views/signedout.html
+++ b/app/templates/views/signedout.html
@@ -9,22 +9,30 @@
 
 {% block maincolumn_content %}
 
-  {% call banner_wrapper(type='intro') %}
-    <h1 class="heading-medium">
-      GOV.UK Notify makes it easy to send text messages and emails to
-      your users.
-    </h1>
-    <p class="heading-medium">
-      If you work for a UK government department or agency you can try
-      it now.
-    </p>
-    <p class="button-block">
-      <a class="button button-start" href='{{ url_for('.register' )}}'>
-        Create an account
-      </a>
-      or <a href="{{ url_for('.sign_in' )}}">sign in</a> if you’ve used
-      it before
-    </p>
-  {% endcall %}
+  <div class="product-page-intro">
+    <div class="product-page-intro-wrapper">
+      <div class="grid-row">
+        <div class="column-two-thirds">
+          <h1>
+            Send text messages and emails to your users
+          </h1>
+          <p>
+            If you work for a UK government department or agency you can try
+            it now.
+          </p>
+          <div class="button-container">
+            <a class="button button-start" href='{{ url_for('.register' )}}'>
+              Create an account
+            </a>
+            or <a href="{{ url_for('.sign_in' )}}">sign in</a> if you’ve used
+            it before
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+
+  <div class="product-page-section">
+  </div>
 
 {% endblock %}