diff --git a/pages/_error.js b/pages/_error.js
index 8e16f147..23377c1d 100644
--- a/pages/_error.js
+++ b/pages/_error.js
@@ -1,11 +1,45 @@
-function Error({ statusCode }) {
+import Link from "next/link";
+import Head from "next/head";
+import Header from "../components/header";
+import Banner from "../components/banner";
+import CookieBanner from "../components/cookieBanner";
+import useTranslation from "next-translate/useTranslation";
+import Footer from "../components/footer";
+
+function Error({ statusCode }, props) {
+    let { t, lang } = useTranslation();
+    const { footerLinks, pages } = props;
+
     return (
-        <p>
-            An error....
-            {statusCode
-                ? `An error ${statusCode} occurred on server`
-                : "An error occurred on client"}
-        </p>
+        <div>
+            <Head>
+                <title>
+                    {t("case:page-title")} - {t("common:service-name")}
+                </title>
+            </Head>
+            <div id="page_wrapper">
+                <CookieBanner />
+                <Header courseName={t("common:service-name")} />
+                <div className="govuk-width-container govuk-!-padding-bottom-9">
+                    <main className="govuk-main-wrapper govuk-!-padding-top-9 govuk-!-padding-bottom-9">
+                        <div className="govuk-grid-row">
+                            <div className="govuk-grid-column-two-thirds ">
+                                <h1>Error</h1>
+                                <p className="govuk-body">
+                                    {statusCode
+                                        ? `An error ${statusCode} occurred on server`
+                                        : "An error occurred on the client"}
+                                </p>
+                                <Link href="/">
+                                    <a>Go back home</a>
+                                </Link>
+                            </div>
+                        </div>
+                    </main>
+                </div>
+                <Footer footerLinks={footerLinks} />
+            </div>
+        </div>
     );
 }
 
diff --git a/pages/dns/index.js b/pages/dns/index.js
index 86e8ce54..831920ac 100644
--- a/pages/dns/index.js
+++ b/pages/dns/index.js
@@ -20,23 +20,27 @@ const Home = (props) => {
 
     const router = useRouter();
     const { locale } = router;
-
-    return (
-        <div>
-            <Head>
-                <title>Developments of National Significance</title>
-            </Head>
-            <div id="page_wrapper">
-                <CookieBanner />
-                <Header serviceName="Developments of National Significance" />
-                <div className="govuk-width-container">
-                    <Banner />
-                    <Main />
+    try {
+        return (
+            <div>
+                <Head>
+                    <title>Developments of National Significance</title>
+                </Head>
+                <div id="page_wrapper">
+                    <CookieBanner />
+                    <Header serviceName="Developments of National Significance" />
+                    <div className="govuk-width-container">
+                        <Banner />
+                        <Main />
+                    </div>
+                    <Footer footerLinks={footerLinks} />
                 </div>
-                <Footer footerLinks={footerLinks} />
             </div>
-        </div>
-    );
+        );
+    } catch (e) {
+        console.log(e);
+        return <h1>oooops</h1>;
+    }
 };
 
 export default Home; //connect(mapStateToProps)(Home);
