how to convert lighting effects in psd to xhtml?

i have a psd that i am converting now to xhtml. the design开发者_开发知识库 is great and the coding is fun but the psd is full of lighting effects layers. each element in the page (header,footer,content,buttons and menus) has at least 2 lighting effects which is basically a white brush spot with overlay mode.

i tried to do it by getting each light effect in a separate image and make them backgrounds for multiple Devs and position them where it should be but the code is getting complex which i don't like and images starts to be huge effect on page load.

i tried to get all the effects in one very big image and position it once on the whole page because the design is fixed width. thank God for that. but again the image is huge and some elements are not always there in the page to have its lighting effect.

i really don't know what else to do with them. help plz.

thanks

Try to flatten the lighting effect onto the image that it's highlighting. That way it's only one image, which it sounds like you already have the position for.