title: Nested lists with indenting dynamic paddings
body: <p>Take a look at my code example at js bin:
  <a href="http://jsbin.com/iritep/3/edit" rel="nofollow">http://jsbin.com/iritep/3/edit</a></p>
  
  <p>I'd like to indent the yellow colored  item without continuing my hard coded css-rule:</p>
  
  <pre><code>ul li a {padding-left: 20px;}
  ul li ul li a {padding-left: 40px;}
  ul li ul li ul li a {padding-left: 60px;}
  ul li ul li ul li ul li a {padding-left: 80px;}   /* don't want this line! */
  </code></pre>
  
  <p>Can I possibly make this css more dynamic without having to add the last line of css?</p>