title: CSS related; targetting a special li class
body: <p>Need a bit of help with the following situation. 
  I've a slider who's setup is like this (simplified):</p>
  
  <pre><code>&lt;div class="slider"&gt;
      &lt;ul&gt;
          &lt;li&gt;...&lt;/li&gt;
          &lt;li class="current"&gt;...&lt;/li&gt;
          &lt;li class="center active"&gt;...&lt;/li&gt;
          &lt;li class="current"&gt;...&lt;/li&gt;
          &lt;li&gt;...&lt;/li&gt;
      &lt;/ul&gt;
  &lt;/div&gt;
  
  
  .slider li {opacity: 0.3;}
  .slider li.center.active {opacity: 1;}
  .slider li.current:first-child {opacity: 1;}  // this here doesn't work.
  </code></pre>
  
  <p>I can't use <code>.slider li:nth-child(2).current {opacity: 1;}</code>
  because I'm using a slider, so the number if <code>li</code> tags is different. </p>
  
  <p>Is there another way, other than changing the li classes, to change the opacity of  the first <code>current</code> class only.</p>