How do you add a background image in the margins and top of the page behind the body? (Html, Css)

I am building a webpage and I am attempting to add an image behind the container in the margins on the left, right and top.

The closest example of my current webpage is found in this demo: https://html5up.net/phantom.

I wish to ass a background image similar to the blue in this image: https://i.stack.imgur.com/NHbqU.png

So I want the image to be behind a floating page.