diff --git a/app/assets/stylesheets/_grids.scss b/app/assets/stylesheets/_grids.scss
new file mode 100644
index 000000000..f210f4693
--- /dev/null
+++ b/app/assets/stylesheets/_grids.scss
@@ -0,0 +1,7 @@
+.column-one-quarter {
+  @include grid-column(1/4);
+}
+
+.column-three-quarters {
+  @include grid-column(3/4);
+}
diff --git a/app/assets/stylesheets/main.scss b/app/assets/stylesheets/main.scss
index 0c7b102ca..d6f59934b 100644
--- a/app/assets/stylesheets/main.scss
+++ b/app/assets/stylesheets/main.scss
@@ -28,6 +28,7 @@
 @import '../govuk_elements/public/sass/elements/tables';
 
 // Specific to this application
+@import 'grids';
 @import 'components/template-picker';
 @import 'components/placeholder';
 @import 'components/sms-message';
diff --git a/app/templates/withnav_template.html b/app/templates/withnav_template.html
index ecaca2eaf..43f4d7b10 100644
--- a/app/templates/withnav_template.html
+++ b/app/templates/withnav_template.html
@@ -3,10 +3,10 @@
 
 {% block fullwidth_content %}
 	<div class="grid-row">
-	  <div class="column-third">
+	  <div class="column-one-quarter">
 	    {{ main_nav() }}
 	  </div>
-	  <div class="column-two-thirds">
+	  <div class="column-three-quarters">
 	    {% block maincolumn_content %}{% endblock %}
 	  </div>
 	</div>