Как сделать главный экран на сайте

[mankutila]

Добрый день. Есть макет, в котором предусмотрен главный экран (верхняя часть сайта без основного контента). Нужно, чтобы этот экран занимал весь вьюпорт по высоте и ширине и был адаптивным, то есть на всех экранах (начиная с ширины в 1000px) при открытии сайта все пространство должен занимать этот экран. Также нужно, чтобы картинка на фоне тоже была адаптивной (background-size: cover дал не совсем тот эффект, сама картинка должна центрироваться, а не уменьшаться пропорционально). Как это реализовать? Заранее спасибо.

P.S. На картинке тот самый главный экран (шапка, блок с "можем-получаете" и блок "хотите..."). Ниже в макете идет основной контент (простой текст).

[mrnobody]

http://jsbin.com/qafelu/1/edit?css,output

 

Не понятно на счет картинки, может через медиазапросы регулировать background-size?

[kattiperk]

Как должна вести себя картинка?

Просто не уменьшаясь оставаться по центру?

[mankutila]

Как должна вести себя картинка?

Просто не уменьшаясь оставаться по центру?

Картинка сама по себе шириной 1920px, так вот на меньших экранах она должна не уменьшаться, а просто выходить за края, но быть центрированной. Но это по-моему уже не проблема, спасибо)