SVG rendering issues on Firefox

Design help General
#1

Hi everybody! I need some help with SVG + Webflow.

I’m trying to implement this design layout

Screen-Shot-2020-12-02-at-07-09-28
Screen-Shot-2020-12-02-at-07-09-281246×618 87.7 KB

I use SVG white triangle (position:absolute) to cover blue background in hero image.

Screen-Shot-2020-12-02-at-07-20-15
Screen-Shot-2020-12-02-at-07-20-15706×214 7.64 KB

For some reasons I saw this grey stripe on the bottom. But I’ve fixed it by negative margin -1.

Now I’ve got this issue with Firefox: this SVG-triangle loads with short delay once I scroll down

Here is the video how it works on my side

Here is my site Read-Only: https://preview.webflow.com/preview/zingtree-web?utm_medium=preview_link&utm_source=designer&utm_content=zingtree-web&preview=a2aa5cee41922a1541a68b23a391f2a9&mode=preview

Does anybody know how to manage this?

Thanks in advance