CSS Page Width for iPad

I'm having problems with my page and title on the iPad and on the desktop.

When you look at http://www.photopile.me on a computer, the images and header / footer should stretch 100% of the way to the edge,

When you navigate to it on the iPad, it does not show the full page width, and the header size is 100% resized. I would like the ipad to display the full width of the page.

I'm just starting to optimize the iPad, but what am I missing? I am sure that there is a dumb little rule that I am missing. Here is the HTML header

<header>
    <div id="header-wrapper">
        ... header content ...
    </div>
</header>
<div id="page-content">
        .... photos ....
</div>

and CSS

header {
    background: url('../images/header-bg.jpg') repeat-x top left;
    z-index: 500;
    -moz-box-shadow: 0 5px 10px rgba(0, 0, 0, .9);
    -webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, .9);
    box-shadow: 0 5px 10px rgba(0, 0, 0, .9);
    position: fixed;
    top: 0;
    width: 100%;
}
#header-wrapper {
    padding: 10px;
    position: relative;
}
#page-content {
    margin: 0 auto;
    z-index: 400;
    position: relative;
    margin-top: 91px;
    overflow: hidden;
}

I hope that enough information!