css3 - CSS simplify giant > list? -

i have bunch of css code, , want try , simplify can't seem figure out how it. simplify i'd have maybe 1 or 2 "statements" rather 15. browser support need latest chrome. there anyway it?

body.app .tree ul li li {     padding-left: 25px; }  body.app .tree ul li li li {     padding-left: 50px; }  body.app .tree ul li li li li {     padding-left: 75px; }  body.app .tree ul li li li li li {     padding-left: 100px; }  body.app .tree ul li li li li li li {     padding-left: 125px; }  body.app .tree ul li li li li li li li {     padding-left: 150px; }  body.app .tree ul li li li li li li li li li {     padding-left: 175px; }  body.app .tree ul li li li li li li li li li li {     padding-left: 200px; } 

the display type of <li> ignore padding or margin because you're supposed create new sub-levels in list using <ul> inside <li>.

<ul>     <li>         item 1-1         <ul>             <li>               item 2-1             </li>             <li>               item 2-2             </li>         </ul>     </li>     <li>         item 1-2     </li> <ul> 

here's fiddle showing behavior.

note in fiddle can define custom padding each sub-level, 25px wanted:

li > ul {     padding-left:25px; }