Banner image loading late

Hi everyone,

I want to say thanks again for a great theme and an even better community on the forums. You all have helped me so much.

I’ve added some banner images to my site between the nav and content area using the __before_main_container action hook. I’m happy with how it looks, but it’s loading a little weird. The images seem to be the last thing to load on the page, so it makes the site a little slow and all the elements sort of get pushed down at the last minute to make room for the images.

I’m not sure if this is because of the images or possibly my noobish PHP. Is there a way to make sure the whole page loads from top to bottom?

Here’s the code:

add_action('__before_main_container', 'pec_add_banner_image');
function pec_add_banner_image(){
	if(is_page( 'meet-the-doctors' )){
		echo '<img src="https://georgedumontier.com/PEC/wp-content/uploads/2016/03/precision-01-1-e1460183835535.jpg" class="pec-page-banner"/>';
	}
	else if(is_page( 'procedures-2' )){
		echo '<img src="https://georgedumontier.com/PEC/wp-content/uploads/2016/03/precision-05-1-e1460185813622.jpg" class="pec-page-banner"/>';
	}
	else if(is_home('blog')){
		echo '<img src="https://georgedumontier.com/PEC/wp-content/uploads/2016/03/precision-13-e1460186189876.jpg" class="pec-page-banner"/>';
	}
	else{
		echo '';
	}
}

and here’s the site.

https://georgedumontier.com/PEC/meet-the-doctors/