How do I make a fixed background?

I am having a problem with my background. I want it to be fixed, so no scrolling. It does this in the designer but when I publish and look at my site with my laptop or phone the background does scroll. Why is this? I have included a share link.

Website is is doing it the worst in mobile portrait mode.

Here is my site Read-Only: LINK
(how to share your site Read-Only link)

You set the styles to scroll change to fixed

.body-class {
    /* change this */
    background-attachment: scroll;

mobile and fixed (some issues):

The article says

Fixed-backgrounds have huge repaint cost and decimate scrolling performance, which is, I believe, why it was disabled

Is that really true? Fixed backgrounds are a problem for mobile browsers? That means I cant use fixed backgrounds at all because I need my website to work with mobile portrait.

Is there a way I can make all backgrounds fixed except for mobile portrait?

Yes by breakpoints (change to this breakpoint and change to scroll).