[Resolvido] @media screen

Boa noite

Estou com um problema em um css simples de uma página de construção, esta funcionando normalmente no computador, mas quando abro no iphone a página não abre 100%, o site fica pequeno no canto esquerdo e tenho que ampliar... O que tenho que fazer no código para a página ficar ampliada totalmente no iphone?

Código css:

* { margin: 0 auto; padding: 0; border: 0; font-family: "Arial", Verdana, sans-serif }
body { background: #000E28; }

#content{ width:600px; height: 550px; position: absolute; top:50%; left: 50%; margin: -302px 0 0 -302px; background: url(images/background.jpg) no-repeat #000E28; }
#info { width: 600px; height: auto; text-align: center; padding: 100px 0 0 0; }
#info h1 { padding: 30px 0 0 0; font-size: 23px; color:#FFF; text-shadow: 2px 2px #000; }

img { width: 300px; height: 165px; margin: 20px 0 0 0; }

#mais { width: 600px; height: auto; margin:10px 0 0 0; }
#mais p { text-align: center; color:#FFF; font-size:13px; padding:3px 0; }

@media only screen and (max-device-width: 450px) {
* { width: 100%; max-width: 450px; }
body{ width: 100%; max-width: 450px; background: url(images/bg_phone.jpg) repeat-x #000E28; -webkit-text-size-adjust:none; direction: rtl; }
#content { width: auto; max-width: 450px; background: none; position: absolute; top:0; left:0; margin: 0; display:block; }
#info, #mais { width: auto; height: 300px; margin:0; padding:0; left:0; top:0; display:block; }
img { width: 100%; height:100%; max-width: 300px; max-height: 165px; }
#mais { height: auto; }
}

Obrigado pela atenção.