diff --git a/app/views/public/contact_us.blade.php b/app/views/public/contact_us.blade.php
index 6f9d695baff2..a044bd199df1 100644
--- a/app/views/public/contact_us.blade.php
+++ b/app/views/public/contact_us.blade.php
@@ -55,14 +55,20 @@ var contactForm = {
 
 </script>
 
-<section class="hero4" data-speed="2" data-type="background">
+@section('content')
+
+<section class="hero background hero4" data-speed="2" data-type="background">
+  <div class="caption-side"></div>
   <div class="container">
-    <div class="caption">
-     <h1>Contact us
-     </h1>
-   </div>
- </div>
-</section>
+    <div class="row" style="margin:0;">
+      <div class="caption-wrap">
+        <div class="caption">
+          <h1>Contact<span style="color:#ecd816"> us</span></h1>
+            </div>
+          </div>
+        </div>
+      </div>
+    </section>
 
 <section class="about contact">
   <div class="container">
diff --git a/public/css/splash.css b/public/css/splash.css
index dd164fef6d2a..76a5feac43a8 100644
--- a/public/css/splash.css
+++ b/public/css/splash.css
@@ -182,6 +182,11 @@ a .cta:hover span {
     background-size: cover;
 }
 
+.hero2 h1 {
+    color: #fff;
+    margin: 0;
+}
+
 .hero3 {
     text-align: center;
     background-image: url(/images/hero-bg-3.jpg);
@@ -192,7 +197,6 @@ a .cta:hover span {
 }
 
 .hero4 {
-    text-align: center;
     background-image: url(/images/hero-bg-4.jpg);
     padding: 150px 0;
     background-repeat: no-repeat;
@@ -208,11 +212,6 @@ a .cta:hover span {
     background-size: cover;
 }
 
-.hero2 h1,.hero3 h1,.hero4 h1 {
-    color: #fff;
-    margin: 0;
-}
-
 .hero1.background {
     background-repeat: no-repeat;
     background-position: center center;