Как избавиться от горизонтальной прокрутки?

Здравствуйте,

Я хотел, чтобы моя картинка фона на сайте была видна полностью на экранах с любым разрешением и мне посоветовали внести этот код в файл custom.css

Код (CODE):

1. body {background:none !important;}
2. .header-outer { background: #fffurl(http://idevsky.com/images/1.jpg) no-repeat
3. center center;background-size: contain;width: 100vw;height: calc(100vw / 1.5);}

Это сработало, но появилась маленькая горизонтальная прокрутка, что меня, конечно, не устраивает.

Тогда мне посоветовали тот код убрать, а внести этот

Код (CODE):

1. .header-outer {
2.     background: #fff url(http://idevsky.com/images/1.jpg) no-repeat center center;
3.     background-size: cover;
4.     height: 100vh;
5. }

Теперь прокрутка исчезла, но на моем разрешении 1366х768 картинка фона стала слишком высока и её верха не видно (где кисть девушки и её лоб). Но, видимо, на экранах с высокой резолюцией видно всё. Вот URL моего сайта:

http://idevsky.com

 

Понятия не имею... А Вы бы как сделали?