skeletonize frontpage welcome

mediagoblin/static/css/base.css

@@ -161,6 +161,10 @@ a.logo {
   margin: 6px 8px 6px 0;
 }
 
+.welcomeimage {
+  float: right;
+}
+
 .fine_print {
   font-size: 0.8em;
 }
@@ -816,6 +820,7 @@ pre {
   
   .button_action, .button_action_highlight, .button_form { 
     padding: 5px 14px;
+    margin-bottom: 0.5em;
   }
     
 }
@@ -861,6 +866,14 @@ pre {
   .header_right {
     text-align: center;
   }
+
+  .welcomeimage {
+    float: none;
+    display: inherit;
+    margin-left: auto;
+    margin-right: auto;
+    margin-top: 1em;
+  }
 }
 
 /* Exif display */

mediagoblin/templates/mediagoblin/bits/frontpage_welcome.html

@@ -19,7 +19,8 @@
 {% if request.user %}
     <h1>{% trans %}Explore{% endtrans %}</h1>
   {% else %}
-    <img class="right_align" src="{{ request.staticdirect('/images/home_goblin.png') }}" />
+    <div class="row hell">
+      <div class="eleven columns">
         <h1>{% trans %}Hi there, welcome to this MediaGoblin site!{% endtrans %}</h1>
         <p>{% trans %}This site is running <a href="http://mediagoblin.org">MediaGoblin</a>, an extraordinarily great piece of media hosting software.{% endtrans %}</p>
         {% if auth %}
@@ -41,7 +42,11 @@
           {% trans %}
             <a class="button_action" href="http://mediagoblin.readthedocs.org/">Set up MediaGoblin on your own server</a>
           {%- endtrans %}
-
+      </div>
+      <div class="four columns offset-by-one">
+        <img class="welcomeimage" src="/mgoblin_static/images/home_goblin.png">
+      </div>
+    </div>
     <div class="clear"></div>
   {% endif %}