Responsive Embed Code not working properly

The below code is copied directly from Stream

"<div style='max-width: 640px'><div style='position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden;'><iframe width="640" height="360" src="https://web.microsoftstream.com/embed/video/2cded409-af9e-409a-ba17-e9a7096a4580?autoplay=false&showinfo=true" frameborder="0" allowfullscreen style='position: absolute; top: 0; left: 0; right: 0; bottom: 0; height: 100%; max-width: 100%;'></iframe></div></div>"

I actually noticed that there's an overlaping image which could be the cause of the scroll bars, i've attached a screen shot below, I think this image is replaced by the actual responsive video when a user clicks play. 

Overlapping Image causing the scroll bars