Media запросы для телефона не срабатывают?

есть медиа запрос:

@media screen and (max-width: 768px) {
...
}
@media screen and (max-width: 1000px){
}

Но когда открываю с телефона ( iphone 4s ), где экран 640×960 на сколько мне известно...

Медиазапрос не срабатывает, точнее срабатывает, но не тот что 768, а тот что max-width 1000px

Почему так?
мб я как-то не правильно строю медиазапросы?

<meta name="viewport" content="width=device-width, initial-scale=1.0">

Указан.

Вот пример:
Полная версия: cssdeck.com/labs/full/gs1xp8rr
Версия с кодом: cssdeck.com/labs/gs1xp8rr

Помогите пожалуйста, в чем проблема?