add 404 header

hmillersarah · hmillersarah · commit ab824745c9ad · 2025-10-27T15:08:38.000-04:00
diff --git a/404.html b/404.html
@@ -62,6 +62,7 @@
       href="wp-includes/css/homepage.css" />
     <link rel="stylesheet" href="wp-includes/css/nav.css" />
     <link rel="stylesheet" href="wp-includes/css/dropnav.css" />
+    <link rel="stylesheet" href="wp-includes/css/page.css" />
 
     <link href="wp-includes/css/pages/404.css" rel="stylesheet" />
 
@@ -105,7 +106,7 @@
   <body id="ibm-com" class="ibm-com ibm-type">
     <nav-header></nav-header>
 
-    <main id="content" class="main-content">
+    <main id="content" class="main-content page-404">
       <!-- =========================== IMS Central 404 =========================== -->
       <hero-section
         name="We're sorry!"
@@ -114,6 +115,10 @@
         desc="The page you're looking for might have been moved or deleted.">
       </hero-section>
 
+      <section class="black-bg section-404">
+        <h1>404</h1>
+      </section>
+
       <!-- <div class="bg-404 main-sec">
         <section id="intro-section" class="pure-g zs-section">
           <div class="pure-u-3-25">
diff --git a/wp-includes/css/page.css b/wp-includes/css/page.css
@@ -313,7 +313,7 @@ a {
 /* Content containers */
 /* -------------------------------------------------------- */
 /* Targets all sections after hero */
-.main-content section:not(:first-child):not(.cta-banner) {
+.main-content section:not(:first-child):not(.cta-banner):not(.section-404) {
   padding: 4em;
 }
 
@@ -627,6 +627,27 @@ a {
   display: block;
 }
 
+.page-404 {
+  height: 100vh;
+  display: flex;
+  flex-flow: column nowrap;
+}
+
+.section-404 {
+  display: flex;
+  flex-flow: column nowrap;
+  justify-content: start;
+  align-items: center;
+  flex-grow: 1;
+}
+
+.section-404 h1 {
+    font-weight: bold !important;
+    font-size: 15em !important;
+    color: #8d8d8d;
+    line-height: 0em !important;
+}
+
 /* -------------------------------------------------------- */
 
 /* Media queries */
@@ -646,6 +667,10 @@ a {
   .pure-pad-r {
     padding: 1.2em 0em;
   }
+
+  .section-404 h1 {
+    font-size: 10em !important;
+  }
 }
 
 /* 768px and below screen sizes */
