Need help in removing a bg image

[kotkowski]

Hello!
I have a WARP6 Joomlaplates’ JP-X2 template and I’m on a latest version of Joomla. I used to have a big bg image of a lady on every site page. So one has to scroll down to see the actual pages’ content. So I decided to leave the lady bg image just on a main page and to remove it from the other pages. In backend of Joomla in Template Manager in current template’s settings I have a way of assigning a bg image just for a main page. So now it’s there (and it’s fine!), BUT… on the rest of the pages I see a huge and ugly white space where the lady’s image used to be. And I don’t know why white space is there and how to get rid of it. Here’s the link to the site:
https://apostasia.ru/ru/
I’ll attach an image file to demonstrate the problem. Like how it is without bg-image. Plus I’ll attach current template’s custom.css file.

Link to template’s custom.css file:
http://apostasia.ru/templates/jp-x2/css/custom.css

[David_Mac1]

You need to have different css for your home page only.

On all other pages remove the link to background image from .header-outer style and add

height: 2em;
margin-bottom: 10em;

This answer here might help you on the various ways you can do this with joomla

Adding custom CSS styling on some of my pages

[kotkowski]

David_Mac1,
Thanks! But I did this:

Added a page class for the home page “home-page”
In the custom.css file, replaced this:

.header-outer {background: #fff url(https://apostasia.ru/images/1.jpg) no-repeat top center;background-size: cover;height: 100vh;}

with this:

.header-outer {
    background: none;
    height: 0;
}

.home-page .header-outer {
    background: #fff url(https://apostasia.ru/images/1.jpg) no-repeat top center;
    background-size: auto;
    background-size: cover;
    height: 100vh;
}

[David_Mac1]

Well done, looking exactly as you would like it to now