title: H3 is aligning right of center, need a fresh set of eyes
body: <p>I have a potentially stupid question here.</p>
  
  <p>I've got a fiddle with a block of welcome text coming up off-center. I'm usually excellent at trouble-shooting my own CSS but this is making me absolutely batty. I've stripped all of the extra margin autos and text-align centers away to make this clearer. You can actually delete the entire JS segment and set the #welcome DIV opacity back to 1 for further clarity.</p>
  
  <p><a href="http://jsfiddle.net/Imperative/29Aat/88/" rel="nofollow">http://jsfiddle.net/Imperative/29Aat/88/</a></p>
  
  <p>Here's the relevant CSS:</p>
  
  <pre><code>html, body {
      height: 100%;
      margin: 0 auto;
  }
  body {
      margin: 0;
      padding: 0;
      font-family: sans-serif;
  }
  #wrap {
      zoom: 1;
      position: relative;
      min-height: 100%;
      overflow: hidden;
  }
  #welcome {
      position: relative;
      opacity: 0;
      top: 0px;
  }
  #welcome h3 {
      font-family:'Alegreya SC', serif;
      font-size: 42px;
      color: rgb(230, 230, 230);
  }
  </code></pre>
  
  <p>I'm clearly missing something really novice and really obvious but I'm too close to this thing 88 iterations in and I'm completely missing the boat.</p>
  
  <p>What is cascading downwards from html, body, wrap and causing the whole #welcome block to shift right? I would have expected a lot of positions without any efforts at centering anything but a 50% shift to the right? What the frack?</p>