Nav Bar Submenu Compressed in Chrome and Safari

In my infinite wisdom, I just figured out that the Header is what is hanging up the Nav Bar submenus. Because once one has scrolled past the header, the Nav Bar with accessible submenus is fine.

So now I would like to know how to put the nav bar below the Header. I will have to sacrifice a good look for functionality.

Do I need a code snippet or is there a simpler way to do this?

https://www.julietrump.com

So the upshot is that it has nothing to do with the device or computer. The nav bar looks fine in Firefox, but not in Chrome or Safari. I had to compromise Firefox to make it right in Chrome. But the drop down sub menu does is still compressed at the top in Chrome or Safari due to the large Header image.

I did figure out how to place the nav bar under the Header image with the code snippet below. But it looked hideous. So I just put a message in the content of my Homepage to either use Firefox or scroll past the Header to access the menu items. Kind of a hackneyed solution, but what else can you do when it looks perfect in one browser and not the other?

I put this code snippet in the Edit CSS stylesheet using Genesis Prose to make the nav menu bar appear below the header. (But there was some strange shadow “bar” that stayed at the top as I scrolled down (my nav bar scrolls). Anyway, it ruined the look of the Website, so I switched it back. But in case anyone out there is interested:

//* Reposition the primary navigation menu
remove_action( ‘genesis_before_header’, ‘genesis_do_nav’ );
add_action( ‘genesis_after_header’, ‘genesis_do_nav’ );