Strange Behavior with Elements

Im using this code to set a 360 inside a container (in this case an Box Element). It also work with an empty HTML widget but the photo appears JUST BELOW the HTML widget.

The Element with an ID seems to work fine, BUT, somehow it is rendered with, maybe, an invisible object in the center that block the click and drag function, it works fine when dragged close to the edges but not from the center.

The code works perfect when creating a DIV with an ID from the HTML head, but it renders the photo on top of everything, not in the background.

Pannelum (1.2 MB)

Live Page here:

I believe I fixed it, unchecking “Protect from external styles” fixes it.