Make intro section smarter when breaking up (#3667)

* Make intro section smarter when breaking up

* Fixes

* Fix overriding behavior

* Fix newline

overrides/assets/stylesheets/home.css

@@ -90,31 +90,6 @@ body {
   padding-bottom: 5em;
 }
 
-@media only screen and (max-width: 1240px) {
-  .components-container,
-  .calltoaction-container,
-  .usedby-container,
-  .home-container,
-  .features-container,
-  .intro-container {
-    padding: 40px;
-  }
-
-  .rocket {
-    left: -190px;
-  }
-
-  .intro-container {
-    padding-left: 180px;
-  }
-}
-
-@media only screen and (max-width: 800px) {
-  .component-flex {
-    flex-wrap: wrap;
-  }
-}
-
 .home-container .md-button {
   margin-top: 0.5rem;
   margin-right: 0.5rem;
@@ -147,6 +122,12 @@ body {
   display: block;
 }
 
+.intro-container img {
+  height: 10em;
+  float: right;
+  margin: 0 0 0 2em;
+}
+
 .usedby-container {
   background: #fff;
   color: #000;
@@ -165,3 +146,26 @@ body {
   align-items: center;
   margin: 1.2em;
 }
+
+@media only screen and (max-width: 1240px) {
+  .components-container,
+  .calltoaction-container,
+  .usedby-container,
+  .home-container,
+  .features-container,
+  .intro-container {
+    padding: 40px;
+  }
+
+  .intro-container img {
+    display: block;
+    margin:0 auto;
+    float: none;
+  }
+}
+
+@media only screen and (max-width: 800px) {
+  .component-flex {
+    flex-wrap: wrap;
+  }
+}

overrides/home.html

@@ -68,13 +68,11 @@
         src="images/rocket.svg"
         class="rocket"
         alt=""
-        width="140"
         draggable="false"
-        style="position: absolute; right: 200px"
       />
       <div>
         <h2>Make your developers more productive</h2>
-        <p style="max-width: 700px">
+        <p>
           Knative components build on top of Kubernetes,
           <b>abstracting away the complex details and enabling developers to focus on what matters</b>. Built by
           codifying the best practices shared by successful real-world implementations, Knative solves the "boring but