Background Image Effects Issue (Bug) Tilt effect vs Parallax

Site URL: https://www.parkbrewing.company/

I have been using a custom script (https://schwartz-edmisten.com/blog/how-to-add-parallax-to-squarespace-7-1) for background image parallax, but recently it became buggy and started having lots of issues displaying correctly. I fought with it for a while and had some success, but finally decided to dump the script and revert back to the native square-space image effects.

Our site mostly uses the tilt effect, but when I apply native image effects on background images, the image often flips horizontally (or vertically?) it displays upside down. What gives, why is this happening and what can I do? I just want to have slight parallax on background images to add some depth to our artwork. 

I've also noticed that the background images that are flipped (displaying upside down), travel or tilt in the opposite direction (or correct direction for proper parallax). I've tested on a couple of different devices and browsers and the issue isn't isolated to the editing browser. Can you change the native tilt direction of the image, assuming we can sort out these other issues first?

Also the first image on this page https://www.parkbrewing.company/lineup is somehow cut off by a white box, I imagine its some type element style - overflow "hidden" issue or image card wrapper, but I can't resolve this. 

Hi,

Image cut off

You mean top banner or image under banner?

Hey tuanphan, 

I mean the image of the dark lager cans, when this image is in design "overlap" it has the issue, I'll revert the image to overlap, as I had changed it to "card" to temporarily avoid the issue.  There seems to be an overflow issue.

I can not recreate the issues I am having with the banners and tilt effect on other devices, it seems to only be my devices which are logged in that display the issue. 

I've uploaded screenshots for reference. 

Yeah. Just saw a similar problem on my friend site this morning.

If you haven't sovled this yet, you can duplicate the page & add image there, then share url again, we can check again.

The issue seems to be solved with the image in overlap design. I appreciate the assistance.

Why or what can I do to solve the issue of my banners (or any image) which I apply a native effect to. It displays on my monitor as upside down? I have cleared cache etc. The issue is on any devices I am logged into square space with my account, except mobile (mobile view or desktop). Also experiencing the issue on multiple browsers, even though not logged in to my Square space account. Any image with a any native effect displays upside down.