From d1dea7fecdaf3279d47e13d984ad91af71a4b2ef Mon Sep 17 00:00:00 2001
From: igorkorenfeld <igor.korenfeld@gsa.gov>
Date: Mon, 8 May 2023 11:54:31 -0400
Subject: [PATCH] Add 404 page template

---
 src/registrar/templates/404.html | 24 ++++++++++++++++++++----
 1 file changed, 20 insertions(+), 4 deletions(-)

diff --git a/src/registrar/templates/404.html b/src/registrar/templates/404.html
index f715e0fa9..c6bf6f5a8 100644
--- a/src/registrar/templates/404.html
+++ b/src/registrar/templates/404.html
@@ -1,15 +1,31 @@
-
 {% extends "base.html" %}
-{% load i18n %}
+{% load i18n static %}
 
 {% block title %}{% translate "Page not found" %}{% endblock %}
 
 {% block content %}
 <main id="main-content" class="grid-container">
+  <div class="grid-row grid-gap">
+    <div class="tablet:grid-col-6 usa-prose margin-bottom-3">
+      <h1>
+        {% translate "We couldn’t find that page" %}
+      </h1>
+      <h2>
+        {% translate "Status 404" %}
+      </h2>
 
-<h1>{% translate "Page not found" %}</h1>
+      <p> Try going to the <a href="/">homepage</a>. If you can’t find what you’re looking for, <a href= "https://federalist-877ab29f-16f6-4f12-961c-96cf064cf070.sites.pages.cloud.gov/site/cisagov/getgov-home/contact/">contact us.</a>
+      </p>
+    </div>
+
+    <div class="tablet:grid-col-4">
+      <img 
+         src="{% static 'img/registrar/dotgov_404_illo.svg' %}"
+         alt=""
+      />
+    </div>
+  </div>
 
-  <p>{% translate "The requested page could not be found." %}</p>
 
 </main>
 {% endblock %}