Проблема с версткой на смартах

Forever

Новичок
В общем, наконец я почти доделал свой сайт,
и т.к. я перенес его сразу на хостинг с локального сервера, то не имел возможности в процессе написания посмотреть, как верстка выглядит на смартфонах.
Сейчас вот посмотрел, и там жесть.

В принципе, на сайте блоки расположены почти стандартным способом -
сверху идет шапка на всю щирину , по центру идет блок чуть более узкий (80%),
ну и снизу подвал тоже на всю ширину .

Еще есть fixed блок с изображением позади центрального блока с z-index: -1.
Если кто хочет - можете посмотреть по ссылке выше.

Так вот. почему-то на смарте в Опере центральный блок не центрируется (ну вы поняли) , а липнет к левому краю страницы. в Хроме все нормально.

fixed-блок показывается в Хроме не полностью, а в Опере слишком большим.
Его фоновое изображение имеет размер 1400 пикселей в ширину,и 470 в высоту, если это важно.

Вот CSS:

Код:
//Шапка
#header {
    
    margin: 0 auto;
    border-bottom: 2px solid #292827;
    background-image: linear-gradient(to top,#171717,#111,#040404,#010101);
    box-shadow: 0 10px 18px #131313;
    
}

//Центральный блок
.content {
    
    margin: 0 auto;
    width:77%;
    min-height:1000px;
    background: #3c3c3c;
    padding:10px;
}

//Подвал
#footer{
    border-top: 2px solid #292827;
    background-image: linear-gradient(to top,#171717,#111,#040404,#010101);
    box-shadow: 0 10px 18px #131313;
    height: 30px;
}


//fixed-блок
#title{
    background: url(/images/interface/main.jpg) no-repeat ;
    position: absolute;
    z-index:-1;
    width: 100%;
    height: 90%;
    margin: 0 auto;
    
}
 
Сверху