如何为移动设备修复此响应式背景图片？

Question

this site上的标题图片工作正常，直到我在移动设备上添加了以下代码，因此它会尊重我的媒体查询。

<meta name="viewport" content="width=device-width">

现在，如果你将它加载到iPhone上，除了标题之外的所有内容都可以正常工作。

我需要添加哪些代码来修复此问题？

CSS：

#header {
    height: 100%;
    width: 100%;
    background-image:url(images/5pointz_white_door.jpg);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    display: table;
    vertical-align: middle;
    text-align: center;
    padding-top: 40px;

}