CSS Doesn't seem to be working in specific case

I'm making a website for my own enjoyment. I like doing it, but I know very little about CSS etc. In this sense I'm like a guy who likes cars but knows nothing about mechanics. So I'm going to try to explain what's wrong without knowing the terminology.

I'm using a template that I've used before with no problem, HTML5, and I've just started with my current site. I can't figure out why this specific case of CSS isn't functioning properly.

It is evident on my 404 page, which is the only page I've worked on customizing so far.

My 404 Page

At first I had all of my CSS files in a directory called HTML. Since the template comes only with relative links, ie images/picture.jpg or css/style.css this meant I had to add The Empedocles Effect | 404 Page Not Found to each of these in the style sheets etc. But I couldn't get the Menu icons to show. There are only two, one for the menu and one for the search. They show up as only empty boxes.

I've loaded all the pages from my template to my root directory and you can see from these that most everything is working except for these. They used to work when I had everything in the HTML directory. The link below is to one of those pages which I haven't touched, from the template.

Another Page

So these were fine, the buttons were working in that HTML/ directory so I moved my 404 page back to that directory and went through each of my style sheets removing the from the code one at a time and when I got to the problem was solved. The images for the buttons appeared as they were supposed to. Trouble is they wouldn't work in the root directory no matter how I changed the link rel= code.

Normally I tinker around with this sort of thing and figure it out, and it's usually something simple, but I'm baffled at this and have been messing around with it for 2 or 3 days. Can anyone here help me? I sure would appreciate it.

Thanks,

DLH