Fix up header markup and CSS.

Works better in Firefox now.

_assets/stylesheets/includes/layout.css.sass

@@ -2,15 +2,19 @@ $max-width: 800px !default
 $pad-min: 8.5% !default
 
 header[role=banner]
+  padding: 0.52em 0 0.42em
   h1
     font-size: 3.43em
-    line-height: 0
+    margin: 0
-    color: white
+    a
-    margin: 0.52em 0 0.42em
+      color: white
-    text-shadow: 0 0 10px rgba(0, 0, 0, 0.2)
+      line-height: 0
-    span
+      text-decoration: none
-      position: absolute
+      text-shadow: 0 0 10px rgba(0, 0, 0, 0.2)
-      right: 100%
+      span
+        width: 0
+        font-size: 0
+        overflow: hidden
 
 article img
   max-width: 100%
@@ -24,7 +28,7 @@ article img.right
   float: right
   margin-left: 1em
 
-#content, hgroup, footer
+#content, .container, footer
   padding: 0 $pad-min
   margin: 0 auto
   max-width: $max-width

_assets/stylesheets/includes/styles.css.sass

@@ -18,11 +18,11 @@ body > header
   box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2), inset 0 -1px 0px rgba(255, 255, 255, 0.4)
   padding-top: 0.8em
   padding-bottom: 0.9em
-  h1
+  h1 a
-    display: inline-block
+    //display: inline-block
     margin-top: 0
     font-weight: 700
-    line-height: 0
+    //line-height: 0
 
 a
   +transition(color 0.25s 0s ease)

_includes/header.html

@@ -1,6 +1,6 @@
   <header role="banner">
-    <hgroup>
+    <div class="container">
-      <a href="/"><h1 class="icon-logomark"><span>Dan Barber</span></h1></a>
       <nav role="navigation">{% include navigation.html %}</nav>
-    </hgroup>
+      <h1><a class="icon-logomark" href="/"><span>Dan Barber</span></a></h1>
+    </div>
   </header>