fix symmetry on the index page

index.html

@@ -44,13 +44,13 @@
       </div>
     </nav>
 
-    <div class="jumbotron" style="padding-top: 16px; padding-bottom: 0;">
+    <div class="jumbotron">
       <div class="container mascot">
         <div class="row">
           <div class="col-lg-2">
           </div>
-          <div class="col-lg-8" style="text-align: center">
+          <div class="col-lg-8">
-            <h1 style="padding-top: 32px;">Go Ethereum</h1>
+            <h1>Go Ethereum</h1>
             <h2>Official Go implementation of the Ethereum protocol</h2>
             <br/>
             <a href="https://github.com/ethereum/go-ethereum" target="_blank" class="btn btn-success" style="margin: 4px;"><i class="fa fa-github" aria-hidden="true"></i> View on GitHub</a>
@@ -61,7 +61,7 @@
     </div>
 
     <div class="container mascot-mobile">
-      <img src="./static/images/mascot.png" height="300px" />
+      <img src="./static/images/mascot.png" height="200px" />
     </div>
 
     <div class="container marketing">
@@ -77,11 +77,14 @@
       </div>
       <hr/>
       <div class="row featurette">
-        <div class="col-md-7">
+        <div class="col-md-7 col-md-push-5">
           <h2 class="featurette-heading">What is Go Ethereum?</h2>
           <p class="lead">Go Ethereum is one of the three original implementations (along with C++ and Python) of the Ethereum protocol. It is written in Go, fully open source and licensed under the GNU LGPL v3.</p>
           <p class="lead">See <a href="https://github.com/ethereum/go-ethereum" target="_blank">our repository</a> and <a href="./downloads">downloads section</a> for the code!</p>
         </div>
+        <div class="col-md-5 col-md-pull-7 hide-on-small-screen">
+          <img class="featurette-image center-block" src="./static/images/mascot.png" height="300px">
+        </div>
       </div>
       <hr/>
       <div class="row featurette">

static/styles/custom/home.css

@@ -1,21 +1,16 @@
-.jumbotron .mascot {
+.jumbotron {
-  background-size: auto 300px;
+  text-align: center;
-  background-repeat: no-repeat;
+  padding: 20pt 0;
-  background-position: 0 -30px;
-  height: 280px;
 }
 
 .jumbotron h1 {
   font-size: 56px;
   font-weight: bold;
   margin-top: 0;
-  margin-bottom: 12px;
 }
 
 .jumbotron h2 {
   font-size: 28px;
-  max-width: 500px;
-  margin: auto;
 }
 
 .mascot-mobile {
@@ -31,9 +26,6 @@
 }
 
 @media (min-width: 768px) {
-  .jumbotron .mascot {
-    background-image: url('../../images/mascot.png');
-  }
   .mascot-mobile {
     display: none;
   }