update hero

Author: hmillersarah

index.html

@@ -89,41 +89,28 @@
       <!-- =========================== Banner =========================== -->
        <section class="blue-bg home-banner">
         <div>
-          <img src="wp-content/Icon_02_IMS GoldPage.svg" alt="">
+          <img src="wp-content/icons/icon_trial.svg" alt="">
           <a href="https://early-access.ibm.com/software/support/trial/cst/welcomepage.wss?siteId=2047&tabId=5718&w=1" target="_blank" rel="noopener noreferrer">New! IBM IMS Z Trial →</a>
         </div>
         <div>
-          <img src="wp-content/Icon_02_IMS GoldPage.svg" alt="">
+          <img src="wp-content/icons/icon_upgrade.svg" alt="">
           <a href="https://forms.office.com/r/GVb90wUSXf" target="_blank" rel="noopener noreferrer">IMS modernization survey →</a> 
         </div>
        </section>
 
-      <!-- - Update the Advocacy content block in the Engage section on the homepage -->
-
-      <!-- Welcome banner -->
-      <div class="banner welcome-banner">
-        <section id="intro-section" class="zs-section index-hero">
-          <div id="intro-header" class="pure-u-1"></div>
-          <!-- Banner text and buttons -->
-          <div class="pure-u-1 pure-u-md-18-24 pure-u-lg-12-24 index-hero-container">
-            <div id="intro-info" class="pure-u-1">
-              <h1 class="pure-u-4-6 pure-u-lg-2-3">IBM <b>IMS Central</b></h1>
-              <p>Welcome! IMS™ Central is your hub for all things IMS.</p>
-              <p>Build your skills, find documentation, get help, and engage with the team.</p>
-            </div>
+      <!-- =========================== Hero =========================== -->
+      <section class="black-bg">
+        <div class="pure-u-1 pure-g">
+          <div class="pure-u-md-11-24">
+            <h1>IBM <b>IMS Central</b></h1>
+            <p>Welcome! IMS™ Central is your hub for all things IMS.</p>
+            <p>Build your skills, find documentation, get help, and engage with the team.</p>
           </div>
-          <!-- Banner vid preview container -->
-          <div class="pure-u-1 pure-u-lg-11-24">
-            <!-- Video window -->
-            <div class="vid-margin vid-preview-container">
-              <a href="https://mediacenter.ibm.com/media/Intro+to+IMS+-+What+is+IMSF/0_beoagp8k/139456202" target="_blank" rel="noopener noreferrer">
-                <img src="wp-content/introIMS.png" class="image-preview" alt="Video preview of Intro to IMS, opens in new window"></img>
-                <img src="wp-content/introIMSclip.gif" class="vid-preview" alt="Video preview of Intro to IMS, opens in new window"></img>
-              </a>
-            </div>
+          <div class="pure-u-md-11-24">
+            <h2 class="h2-normal">Video</h2>
           </div>
-        </section>
-      </div>
+        </div>
+      </section>
 
       <!-- =========================== Learn / Education =========================== -->
       <div class="zs-gray-section learn-bg-home learn-section">

wp-content/icons/icon_trial.svg

@@ -3,7 +3,7 @@
 :root {
   /* Color */
   --white: #fff;
-  --black: #000;
+  --black: #1c1c1c;
   --blue: #0f62fe;
     /* Background Color */
     --bg-light-gray: #F9F9F9;
@@ -121,6 +121,11 @@ h6 {
     font-size: var(--plex-24) !important;
   }
 
+.black-bg {
+  background-color: var(--black);
+  color: var(--white);
+}
+
 .blue-bg {
   background-color: var(--bg-dark-blue);
   color: var(--white);
@@ -404,15 +409,11 @@ h6 {
 
 /* Banner */
 /* -------------------------------------------------------- */
-.home-banner-g {
-  padding: 1em;
-}
-
 .home-banner {
   display: flex;
   flex-flow: row wrap;
   align-items: center;
-  padding: 2em 2em;
+  padding: 1em 2em;
   background-color: #0072c3;
 }
 
@@ -426,7 +427,6 @@ h6 {
   margin-right: auto;
 }
 
-
 .home-banner img {
   filter: invert(100%);
 }
@@ -449,6 +449,7 @@ h6 {
   height: 0.3125em;
 }
 
+/* non-bold h2 header */
 .h2-normal {
   font-weight: normal;
   margin-bottom: 0.2em;