title: override inherited h1 and h3 values in CSS
body: <p>I have the following CSS that is being inherited (the original CSS):</p>
  
  
  
  <pre class="lang-css prettyprint-override"><code>h1 { 
      font-size:30px;
      line-height:36px;
  }
  h1 small {
      font-size:18px;
  }
  </code></pre>
  
  <p>I have a class whereby i want to override the <code>h1</code> property like so:</p>
  
  <pre class="lang-css prettyprint-override"><code>.logo h1 {
    font-family: "Euphemia UCAS";
    font-size: 200px !important;
    font-weight: normal;
    color: #222222;
  }
  </code></pre>
  
  <p>How can I do this without modifying the original CSS? The <code>!important</code> value did not help.</p>
  
  <p>link: <a href="https://dl.dropbox.com/u/3417415/Storify/mockups/screen1.html" rel="nofollow">https://dl.dropbox.com/u/3417415/Storify/mockups/screen1.html</a></p>