title: Custom Class Not Overriding Other CSS
body: <p>I am by no means a CSS expert, so I probably just don't understand something simple here. </p>
  
  <p>I have a site I am maintaining. Most of the site has a dark background with white text. I was asked to change a couple of pages to black text on white background. </p>
  
  <p>I created a class named .blog in the CSS, it looks like this:</p>
  
  <pre><code>.blog{
  color:rgb(0,0,0);
  background-color:rgb(255,255,255);
  }
  .blog h1,h2,h3,h4,h5,h6
   {
  color:rgb(0,0,0);
  }
  .blog a:link,a:visited,a:hover
  {
  color:rgb(0,0,0);
  }   
  </code></pre>
  
  <p>Earlier in the file is this:</p>
  
  <pre><code>body,a,.white{color:#fff;}
  </code></pre>
  
  <p>When I wrap a chunk of a page in  the text and background change but the links and headlines remain white (and are thus invisible on the white page).</p>
  
  <p>When I check using Firebug it shows my blog class being applied, including when I select the headline or link elements. Yet of course it is not. </p>
  
  <p>Can anyone suggest a reason for this? Or perhaps where I should look for the most likely solution?</p>