template background temporarily covers whole page on load

Hi, getting a strange issue. We are using elementor pro and generatepress pro. For headers and footers we are using an elementor template put in place using gphooks. When the page loads it displays all the content but when the image that is the background of the template loads it covers the whole screen for a second or two before it shows the correct size. I've tried a background-size css directive for the template, changed from an image to a solid colour, and tried cropping the image into a thin strip but the behaviour does not change. I don't get any similar problems with the footer and when I have the header template with no background at all the page loads normally. I am unsure if this is a generatepress, elementor or css based issue. It is happening in a few sites, you can see http://www.housedepot.ca and http://www.housedepots.com.