Hi Eri

Both images are set to cover the background so they will only shrink if the height is reduced on smaller screens.

Ciaran

Hi Ciaran and thank you for your reply.

I changed the image from Header Parallax Background to Header Slideshow Image(s) and the problem was solved, i.e. it is shrinked in mobile or tablet version.

I did not find a solution for the Bottom-1 Background Image though. Do have any workaround for this?

Thank you again.

Best regards,

Eri

Hi Eri

To amend try adding the following to the Custom CSS field of your templates parameters (Extensions -> Templates -> [YourTemplateStyle] -> Custom CSS)....

#container_bottom1_modules #jarallax-container-2 div {

    background-size: contain !important;

}

Ciaran

Thank you Ciaran,

It seems though that in iphone 6 screen and ipad it does not work..

Do you have any idea on this?

Thank you again for your help.

Best regards,

Eri

Hello

Have you added the CSS to the Custom CSS tab?

Ciaran

Yes, I have added it to all fields of Custom CSS and Responsive Custom CSS.

In android it works fine. I have also deleted cookies from my iphone 6 and ipad..Did you tried yourself?

Hello Ciaran, kind reminder on my request above.

Thank you again.

Best regards,

Eri

Hi Eri

Strangely we are unable to replicate this issue on both phone and tablet iOS devices. Is this still an issue for you?

Ciaran

Actually yes. I also tried to delete cookies in case this is the issue but the issue is still there.

I will try and check again the cookies in case this causes the problem and I will come back to you..

Thank you anyway,

Eri

Hello again Ciaran,

Is it possible to check if the responsive css code works ok as I have deleted cookies both from my iphone6 and mini ipad and the problem insists. The picture does not shrink as it does in the desktop version.

If you need temporary access to the site's backend please let me know.

Best regards,

Eri

Hi Eri

A shot in the dark this but try also adding the following...

#container_bottom1_modules {

    background-size: contain !important;

}

Ciaran

Actually when I add in the responsive settings the code above, the background photo seems to disappear and not shown at all..

Any other idea?

Hi Ciaran, should it happen that you looked at my issue above?

Do you want to give you temporary access to the backend of the site to check if I have added correctly the css code?

Thank you again,

Eri