diff --git a/apps/firefox/templates/firefox/installer-help.html b/apps/firefox/templates/firefox/installer-help.html
new file mode 100644
index 00000000000..0334745fcb2
--- /dev/null
+++ b/apps/firefox/templates/firefox/installer-help.html
@@ -0,0 +1,29 @@
+{% extends "/firefox/base-resp.html" %}
+
+{% block page_title %}Your download was interrupted{% endblock %}
+{% block body_id %}installer-help{% endblock %}
+
+{% block site_css %}
+ {{ css('installer_help') }}
+{% endblock %}
+
+{% block content %}
+
+
+
+ Your download was interrupted
+ Please click the download button to continue.
+
+
+
+
+
+
+
+
+{% endblock %}
diff --git a/apps/firefox/urls.py b/apps/firefox/urls.py
index 0282f9b8785..21be062b916 100644
--- a/apps/firefox/urls.py
+++ b/apps/firefox/urls.py
@@ -32,6 +32,7 @@
page('firefox/organizations', 'firefox/organizations/organizations.html'),
page('firefox/performance', 'firefox/performance.html'),
page('firefox/security', 'firefox/security.html'),
+ page('firefox/installer-help', 'firefox/installer-help.html'),
page('firefox/speed', 'firefox/speed.html',
latest_version=product_details.firefox_versions['LATEST_FIREFOX_VERSION']),
page('firefox/technology', 'firefox/technology.html'),
diff --git a/media/css/firefox/installer-help.less b/media/css/firefox/installer-help.less
new file mode 100644
index 00000000000..2476189a95e
--- /dev/null
+++ b/media/css/firefox/installer-help.less
@@ -0,0 +1,74 @@
+@import "../sandstone/variables-resp.less";
+@import "../sandstone/mixins-resp.less";
+@import "../sandstone/buttons.less";
+
+#main-content {
+ background: #fff;
+ padding: 40px (@gridColumnWidth * 6) 40px 40px;
+ margin: 0 auto @baseLine;
+ @shadow: 0 0 1px rgba(0,0,0,.05);
+ .box-shadow(@shadow);
+ border-bottom: 1px solid #ddd;
+ hgroup {
+ margin: 0 0 (@baseLine * 2);
+ h1 {
+ font-size: 32px;
+ letter-spacing: -1px;
+ margin: 0 0 .25em;
+ }
+ h2 {
+ font-size: 24px;
+ letter-spacing: -0.25px;
+ margin: 0 0 .25em;
+ }
+ }
+
+ .download-button {
+ position: absolute;
+ right: 40px;
+ top: 40px;
+ }
+
+ .help {
+ .span(4);
+ margin: 0;
+ padding: 20px 20px 0;
+ background: #fafafa;
+ border: 1px solid #efefef;
+ box-shadow: inset 0 0 6px rgba(0,0,0,.05);
+
+ h3 {
+ font-size: 20px;
+ }
+ }
+
+}
+
+
+/* Tablet Layout: 760px */
+@media only screen and (min-width: @breakTablet) and (max-width: @breakDesktop) {
+
+ #main-content {
+ width: auto;
+ padding: 40px 50% 40px 40px;
+ }
+
+}
+
+/* Mobile layout: 320px */
+@media only screen and (max-width: @breakTablet) {
+
+ #main-content {
+ padding: 20px 25px;
+ .download-button {
+ position: static;
+ margin: 0 auto (@baseLine * 2);
+ }
+ .help {
+ width: auto;
+ float: none;
+ margin: 0;
+ }
+ }
+
+}
diff --git a/media/css/sandstone/buttons.less b/media/css/sandstone/buttons.less
index 4732ffd8616..b1899ae3c5a 100644
--- a/media/css/sandstone/buttons.less
+++ b/media/css/sandstone/buttons.less
@@ -244,6 +244,8 @@
letter-spacing: -0.02em;
padding-right: 32px;
background: url(/media/img/sandstone/buttons/arrow-large.png) no-repeat 100% 0;
+ min-height: 28px;
+ margin-bottom: -2px;
}
.download-info {
display: block;
diff --git a/settings/base.py b/settings/base.py
index 4740f53e56c..3976d5bbe5b 100644
--- a/settings/base.py
+++ b/settings/base.py
@@ -181,6 +181,10 @@ def JINJA_CONFIG():
'css/firefox/whatsnew.less',
'css/firefox/whatsnew-android.less',
),
+ 'installer_help': (
+ 'css/firefox/template-resp.less',
+ 'css/firefox/installer-help.less',
+ ),
'home': (
'css/home.less',
),