интересно взглянуть как прописаны
media queries, особенно на расширение меньше 768px, для iPad и iPhone они прописывается вот так:
iPad горизонтальный и вертикальный режимы:
media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px) { ...}
iPad mini:
media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px)
and (-webkit-min-device-pixel-ratio: 1) {...}
кроме того в head не задан обязательный параметр:
<meta name="viewport" content="width=device-width, initial-scale=1.0">
Средний
Простой
