diff --git a/app/assets/javascripts/emailPreviewPane.js b/app/assets/javascripts/emailPreviewPane.js
index 0509efa27..c614bba5a 100644
--- a/app/assets/javascripts/emailPreviewPane.js
+++ b/app/assets/javascripts/emailPreviewPane.js
@@ -15,7 +15,7 @@
   const $form = $('form');
   const $previewPane = $('<iframe src="/_email?' +
                           buildQueryString(['branding_style', branding_style]) +
-                          '" class="email-branding-preview"></iframe>');
+                          '" class="branding-preview"></iframe>');
 
   function buildQueryString () {
     return $.map(arguments, (val, idx) => encodeURI(val[0]) + '=' + encodeURI(val[1])).join('&');
diff --git a/app/assets/stylesheets/components/email-preview-pane.scss b/app/assets/stylesheets/components/preview-pane.scss
similarity index 94%
rename from app/assets/stylesheets/components/email-preview-pane.scss
rename to app/assets/stylesheets/components/preview-pane.scss
index c615df2ad..12b8c28c5 100644
--- a/app/assets/stylesheets/components/email-preview-pane.scss
+++ b/app/assets/stylesheets/components/preview-pane.scss
@@ -1,4 +1,4 @@
-.email-branding-preview {
+.branding-preview {
   width: 100%;
   box-sizing: border-box;
   border: solid 1px $border-colour;
@@ -11,7 +11,7 @@
   background-image: linear-gradient(45deg, $grey-3 25%, transparent 25%), linear-gradient(-45deg, $grey-3 25%, transparent 25%), linear-gradient(45deg, transparent 75%, $grey-3 75%), linear-gradient(-45deg, transparent 75%, $grey-3 75%);
   background-size: 20px 20px;
   background-position: 0 0, 0 10px, 10px -10px, -10px 0px;
-  
+
   img {
     display: block;
   }
diff --git a/app/assets/stylesheets/main.scss b/app/assets/stylesheets/main.scss
index f8fc5787c..1db1fcff1 100644
--- a/app/assets/stylesheets/main.scss
+++ b/app/assets/stylesheets/main.scss
@@ -61,7 +61,7 @@ $path: '/static/images/';
 @import 'components/conditional-radios';
 @import 'components/vendor/breadcrumbs';
 @import 'components/vendor/responsive-embed';
-@import 'components/email-preview-pane';
+@import 'components/preview-pane';
 @import 'components/task-list';
 
 @import 'views/dashboard';
diff --git a/app/templates/views/service-settings/preview-email-branding.html b/app/templates/views/service-settings/preview-email-branding.html
index 20d5478d3..d966d0b03 100644
--- a/app/templates/views/service-settings/preview-email-branding.html
+++ b/app/templates/views/service-settings/preview-email-branding.html
@@ -9,7 +9,7 @@
   <h1 class="heading-large">Preview email branding</h1>
   <div class="grid-row">
     <div class="column-full">
-      <iframe src="{{ url_for('main.email_template', branding_style=form.branding_style.data) }}" class="email-branding-preview"></iframe>
+      <iframe src="{{ url_for('main.email_template', branding_style=form.branding_style.data) }}" class="branding-preview"></iframe>
       {% call form_wrapper(action=action) %}
         <div class="form-group">
           {{ form.hidden_tag() }}
diff --git a/tests/app/main/views/test_service_settings.py b/tests/app/main/views/test_service_settings.py
index 976ddacc8..5df553da4 100644
--- a/tests/app/main/views/test_service_settings.py
+++ b/tests/app/main/views/test_service_settings.py
@@ -2276,7 +2276,7 @@ def test_should_preview_email_branding(
     ))
     assert response.status_code == 200
     page = BeautifulSoup(response.data.decode('utf-8'), 'html.parser')
-    iframe = page.find('iframe', attrs={"class": "email-branding-preview"})
+    iframe = page.find('iframe', attrs={"class": "branding-preview"})
     iframeURLComponents = urlparse(iframe['src'])
     iframeQString = parse_qs(iframeURLComponents.query)