bamboozled over library images

Hey ya,

I need to reference .png images in the media library from a .css file. I’ve looked and looked for a solution in the forums but couldn’t find one similar to this situation.

Here’s what I have:

/* Preload images */
body:after {
content: url(../images/close.png) url(../images/loading.gif) url(../images/prev.png) url(../images/next.png);
display: none;
}

I imagine as the note explains that the images are preloaded. However, they are referenced/called for down the script like this:

background: url(../images/loading.gif) no-repeat;
background: url(../images/prev.png) left 48% no-repeat;
background: url(../images/next.png) right 48% no-repeat;
background: url(../images/close.png) top right no-repeat;

As you probably guess they are part of an image display with previous (<), next (>) and close (X) to operate it.

How do I call them up from the .css file? I’ve referenced them using the library path (https://localhost/wordpress/wp-content/uploads/2016/03/) but likely have some syntax left out.

There’s 5 black jelly beans in it for someone …

TIA