Header on embedded Kartra page

Site URL: https://www.jimhjort.com/executive-and-career-coaching

Hi all - I have embedded this Kartra page on my SS site by injecting the code below in the page header.

All is fine except that the Kartra page is displaying on a layer beneath the SS nav bar. Put another way, the SS nav bar is laying across the top of the page, such that the scroll bar disappears beneath the nav bar if you scroll all the way to the top.

By the way, I also tried embedding the page with a code block, and it renders the same way.

How do I make the page render as a single, normal page? Any help *greatly* appreciated! 

<style> 
#page-footer-wrapper,
#page-body-header,
#page-body-footer {
    display: none;
}
</style>
<script type="text/javascript" src="https://jimhjort.kartra.com/page/embed/75pymXQFHVrK"></script>

Hi. Have you solved this yet?

No, not yet. Can you help?

The page looks pretty normal to me.

Thanks, creedon. However, the problem as described still exists. Yesterday I also discovered a new ramification of it: when one clicks the "Book a Call" button and the form pops up, the top of it extends beneath the nav bar, along with the "X" at its top right, which allows one to close the pop-up. Since it's under the nav bar, it's invisible, and un-clickable.