The jumbotron picture not showing in mobile

Hi riikkamarkkula (damn, had to look twice to get the spelling right :-)),

the Zeal theme does not resize the image on smaller screen sizes. That has pros and cons. It just displays the center of it with the width the screen size offers. Basically, the theme says, go to the middle of the image and show aas much as you can to the left and right. Unfortunately, the image you use on the Natasha site has the main motiv (Natashas face) not in the middle of the image.

So there are two things you can do:

1. Use a different image where the main motiv is in the center and not wider than the smallest screen.

2. Tell Zeal not to ake the center of the image and spread to the left and right until the screen width is reached. You can alter that position in the file inc/css/styles.css. Look at line 348 where you will find this style:

div.col-md-12.hero-banner {
    height: 450px;
    background-size: cover;
    background-position: 50% 50%;
    padding: 0px;
    display: table;
    width: 100%;
}

Play around with the first value of background-position. Start with 0%:

div.col-md-12.hero-banner {
    height: 450px;
    background-size: cover;
    background-position: 0% 50%;
    padding: 0px;
    display: table;
    width: 100%;
}