The image Header (Pre header and main header ) is not responsive in tablet or smartphone why ? ... what's the dimension?
Sorry for your troubles, The header area has a background image assigned to it. Background images behave differently to inline images as they are assigned via CSS, and not actually in the page flow like an inline image. This coupled with the defined height of 210px assigned to your header will mean that the header area does not shrink.
A better solution for you is to remove the background image in the header area, leave the height option blank and insert the following as an inline image into the text area
<img src="Your-image-URL-HERE" alt=""/>
This will give you your banner and be responsive as it is an line image.
Best Regards,Hina S.Theme-Canon Support