improve title centering

Author: mco9734

_sass/_splash.scss

@@ -1,26 +1,29 @@
 $size: 350px;
 
 .splash {
-    height: $size;
-    text-align: center;
-    & h1 {
-        width: 100%;
-        height: 100%;
-        background: url('#{$CSHPUBSITE_ASSETS_URL}/hallway_blurred.jpg') 30% 30% no-repeat;
-        background-size: cover;
-        line-height: calc(#{$size} + 50px);
-        text-align: center;
-        color: white;
-        font-size: 3em;
-        vertical-align: bottom;
-    }
+  height: $size;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  text-align: center;
+  background: url('#{$CSHPUBSITE_ASSETS_URL}/hallway_blurred.jpg') 30% 30% no-repeat;
+  background-size: cover;
+
+  h1 {
+    color: white;
+    font-size: 3em;
+    margin: 0;
+    padding: 0 1rem;
+    max-width: 100%;
+    word-wrap: break-word;
+  }
+
+  @media (max-width: 992px) {
+    height: 400px;
 
-    @media(max-width: 992px) {
-        height: 400px;
-        & h1 {
-            font-size: 2em;
-            line-height: 1.2;
-            padding-top: 50%;
-        }
+    h1 {
+      font-size: 2em;
+      padding: 0 1rem;
     }
+  }
 }