headre image on mobile devices

Hi
When I check using the customizer, my header images are not responsive when viewed on mobile devices, that is you see a small part of the header image rather than the entire picture. Is there a bit of CSS that can sort this out.
Thanks

Hi there,

I hope you are having an awesome day and thanks for contacting us regarding your query.

This should be possible with the help of some Custom CSS. Could you please provide me with a link to a your site so that I may be able to write up some CSS that should work for your setup?

Looking forward to your reply :slight_smile:

Best Regards,
Support

Hi
You will be able to access it as I am developing a new site and am using a WAMP local server so the URL is simply http://localhost/mysite/. If you pass on the custom CSS I can have a go or do you need to see the site?
Thanks

Hi there,
Thanks for keeping in touch with us.

It’s a bit difficult to provide code while being unable to actually view the site and test it, but attempt to add and save the following code to Appearance > Customize > Additional CSS:

@media only screen and (max-width:31.25em) { 
	.parallax-mirror {
    height: 429px!important;
}
}

You may adjust the height to your preference.

I hope this helps :slight_smile:

Best Regards,
Support

Thanks, it doesn’t appear to have had any effect (according to the reduced mobile screens on the customizer). Can I just check that the above code apply to the header images on the various pages as well as the parallax images on the home page?
Thanks again