embedded getty images

Hi,
im working on post draft and embeded getty images (copied and pasted code in the text editor) but when I preview the post, only the link to the getty images shows but not the image itself.
I embedded images from Imgur, and they work fine.
is it a theme issue or the code from getty?

the standard code is:

<a id="K7Wn54-4SAZXnsBEOqnJqQ" class="gie-single" style="color: #a7a7a7; text-decoration: none; font-weight: normal !important; border: none; display: inline-block;" href="https://www.gettyimages.co.uk/detail/183527731" target="_blank" rel="noopener noreferrer">Embed from Getty Images</a><script>window.gie=window.gie||function(c){(gie.q=gie.q||[]).push(c)};gie(function(){gie.widgets.load({id:'K7Wn54-4SAZXnsBEOqnJqQ',sig:'s2T64kJ35FKDJC2J9QWsHaJyuqbI_VguZ5XVJ1koKKw=',w:'532px',h:'325px',items:'183527731',caption: true ,tld:'co.uk',is360: false })});</script><script src='//embed-cdn.gettyimages.com/widgets.js' charset='utf-8' async></script>

and legacy code is:

<div style="padding: 0; margin: 0; text-align: left;"><a style="color: #a7a7a7; text-decoration: none; font-weight: normal !important; border: none; display: inline-block;" href="https://www.gettyimages.co.uk/detail/998502390" target="_blank" rel="noopener noreferrer">Embed from Getty Images</a></div>
<div style="overflow: hidden; position: relative; height: 0; padding: 66.60118% 0 0 0; width: 100%;"><iframe style="display: inline-block; position: absolute; top: 0; left: 0; width: 100%; height: 100%; margin: 0;" src="//embed.gettyimages.com/embed/998502390?et=MPARh1w1RltD3crET-ZrLQ&tld=co.uk&sig=QdhQFVwRCsaMIwtInk72BLhQrgWA7dqXhkizQWZh0lk=&caption=false&ver=1" width="509" height="339" frameborder="0" scrolling="no"></iframe></div>
</div>

thanks!

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