There are different ways to add a background image.
Add a background image through the Customizer
Go to the Customizer and add a Background image.
I adjusted to Fill Screen and Image Position top left.
The background image is seen in the header and footer area.

To remove the remaining white background. Check out the CSS. (Right click and select Inspect and look at the code.)
There are two places the white background is seen.
In the tm-main and the uk-panel-box classes. I adjusted these to become:
.tm-main,
.uk-panel-box {
background-color: transparent;
}
The result on the frontend looks like this:

Add a background image manually through CSS
Instead of adding a background image through the Customizer I added the following to the style.css.
body {
background-image: url('/wp-content/uploads/colorful-grunge-texture-17-copy.jpg') !important;
background-color: #fff;
background-repeat:no-repeat;
background-attachment: fixed;
/* Comment out this line to make the image scroll with the content. */ background-size: cover;
background-position: 80% 80%;
/* Adjust the height and width position. */
}
.tm-main,
.uk-panel-box {
background-color: transparent;
}
To add multiple background images:
w3schools.com/Css/css3_backgrounds.asp
No comment yet, add your voice below!