Embedding iframe for HeyZine Flipbook causing mobile page to reload & crash.

Hey guys, 

I have created a "Zine" page on my customer's website https://www.nicholasjhanson.com/zines . The embed for the digital flipbook is causing the page to reload a few times, ultimately resulting in the page crashing... I am using the recommended embed code that https://heyzine.com/ provides. It looks like this: 

<iframe allowfullscreen="allowfullscreen" scrolling="no" class="fp-iframe" src="https://heyzine.com/flip-book/bbd6681174.html" style="border: 1px solid lightgray; width: 800px; height: 600px;"></iframe>

It seems like the page is loading fine on desktop and the embeds/zines are fully functional. However, it is not like that for mobile. 

I have attached a few screenshots on what happens on mobile and what the network and console look like on this page when i dig a little bit in the inspector. 

Has anyone else experienced anything similar?

Any tips or advice is greatly appreciated. Thank you!!

Hello @LadyMeek

don't use embed code using normal code Block and 

<div style="position: relative; padding-bottom: 75%; height: 0; overflow: hidden; max-width: 100%; height: auto;">
    <iframe allowfullscreen="allowfullscreen" scrolling="no" class="fp-iframe" src="https://heyzine.com/flip-book/bbd6681174.html" style="border: 1px solid lightgray; position: absolute; top: 0; left: 0; width: 100%; height: 100%;"></iframe>
</div>
<style>
@media only screen and (max-width: 600px) {
    .fp-iframe {
        width: 100% !important;
        height: auto !important;
    }
}

  </style>

this code using Media Query