struggling with header image in twenty seventeen

Twenty Seventeen theme recommends a header image of 2000×1200 px. I want to use an image that is 200×271. I’ve uploaded it and it kind of works on pages other than the homepage.

On the homepage, the header image is giant and cropped and I don’t know why. On other pages the header looks okay on my laptop in a maximized window, but it doesn’t adjust when the window is resized. The actual header image resizes nicely.

Also, the image has just one shade of yellow, but in the header it is obscured by a gradient gray band (which had plagued earlier attempts to correct these problems by hovering over the menu and making those links unclickable).

I’ve tried many css fixes without real success. But I presently only this custom css (which is somewhat helpful) :

.site-branding, .wp-custom-header{
	height: 165px;
}

The page I need help with: [log in to see the link]