How to make mouseover buttons in header?

I’ve been trying to edit a style.cc from a WordPress theme to have a top banner with mouse-over buttons instead of just an image. I’ve made a start for the banner, and I have the code to make mouseover effects, that’s not the problem.

The problem is: How can I replace the standard image in the stylesheet with my .html file? Is that possible at all? (It should be, but my knowledge of .css scripting is close to zero).

Here’s the start of my .html menu: (no mouseover effects yet):

https://sjeng.onedot.nl/blog/wp-content/themes/Rays%20Spring/spring.html

Here’s the part of the stylesheet where the top image is defined:

style.css:
———-

/* Body Classes Start*/
body {
font-size: 62.5%; /* Resets 1em to 10px */
font-family: Arial, Sans-Serif;
color: #000000;
text-align: center;
background: #DFE2E7 url(‘images/page_background.jpg’)

}
#wrapper {
background: url(‘images/header_background.jpg’) top

center no-repeat;
}

If anyone can show me the code I need to use in order to make it all work, I’d be really greatfull! I tried changing:
background: url(‘images/header_background.jpg’)
into
background: url(‘spring.html’)
but that doesn’t work…

Thanks! Sjeng.