css html to files problem

[wheel]

I've bought a custom template for my site; when I change the css from html to being file based, the system breaks. Pretty sure it's got to do with paths to the background images in the css files. In fact, when I display the css file here's an example of what I think is the problem:
background: #848589 url(../../{IF}/gradients/gradient_tcat.gif) repeat-x top left;

The background image urls have this {IF} buried in there - and that's in the css file that's being linked to from the HTML. THat means that css file isn't being parsed somehow to remove that - it's being displayed like that raw to the browser and the browser can't find the path.

How do I remedy this?

change the {IF} with the official path of the files... if your theme is in /images/thistheme/ ... change {IF} with images/thistheme ...

[wheel]

Thanks, I'll do that. It seems to be a clunky solution though. Are these css files only generated once?