Sam, Yes that did correct the issue... A space made all the difference. Thank you.
Now for my next challenge.... I have a module.css that could be used in either the darkbackground or Lightbackground. The module generates a grid and I would like the grid header to have a light background on the DarkBackground container and a darkbackground on the lightBackground container. Rather standard stuff I believe. So where is the appropriate location to implement the classes. It seems that the Module.css is declared before the container.css. I believe the order is significant and may cause some difficulty. So I will end up with:
Container.css
.darkbackground .gridheader { color:black; background:white; ...}
.lightbackground .gridheader { color:white background:black ; ...}
module.css
.gridheader { font-family: Tahoma, Arial, Helvetica; font-size: 11px; font-weight: bold; }
OK so far? This seems to work.
Well the grid allows sorting so, the header must handle link, visited, active and hover. This too will be conditional on the background class - so how does that work as the following does not 
.lightbackground a.gridheader:hover { color: yellow; }
Any help would be appreciated.