iPad Media Query does not work in CSS?

iPad Media Query does not work in CSS?

for some reason my media query doesn't work properly on iPad.
the background image is not moving as it should according to the CSS
applied to the page!
the background image is stuck to the to the top left of its container and
it doesn't matter if i change the value of the px in background position.
This is only on iPad and iPhone.
here is the code I am using for iPad only :
@media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px)
and (orientation : portrait) {
#pageContent {
clear:both;
width:100%;
min-width: 918px;
background-image:url(../img/map.png);
height:1300px;
background-repeat:no-repeat;
box-shadow: 6px 0px 5px -5px #CCC, -6px 0px 5px -5px #CCC;
background-position: center top, 1000px;
}
}
what am i doing wrong?