/* default styling example
----------------------------------------------------------------- */

.listNav { margin:0 0 10px; }

.ln-letters { overflow:hidden; }
.ln-letters a { font-size:0.9em; display:block; float:left; padding:2px 6px; border:1px solid silver; border-right:none; text-decoration:none; }
.ln-letters a.ln-last { border-right:1px solid silver; }
.ln-letters a:hover,
.ln-letters a.ln-selected { background-color:#eaeaea; }
.ln-letters a.ln-disabled { color:#ccc; }
.ln-letter-count { text-align:center; font-size:0.8em; line-height:1; margin-bottom:3px; color:#336699; }


/* demo-specific
----------------------------------------------------------------- */
#demoThree-nav { padding-top:2px;}
#demoThree-nav .ln-letters a { font-size:0.9em; display:block; float:left; padding:2px 6px; border:1px; border-style:solid;border-color:#262626; border-right:none; text-decoration:none; }
#demoThree-nav .ln-letters a.ln-last { border-right:1px;border-style:solid;border-color:#262626; }
#demoThree-nav .ln-letters a:hover { }
#demoThree-nav .ln-letters a.ln-selected { background-color:#292929; }
#demoThree-nav .ln-letters a.ln-disabled { color:white; }
#demoThree-nav .ln-letters a.ln-disabled:hover { color:white; }
#demoThree-nav .ln-letter-count { text-align:center; font-size:0.8em; line-height:1; margin-bottom:3px; color:red; }

#demoThree {padding-left:15px; padding-top:10px; margin: 0 0 2px 24px;}
#demoThree li {color:#a4a4a4; list-style-type: decimal;}
#demoThree li a { color:white; text-decoration:none; }
#demoThree li a:hover { text-decoration:underline; }

#demo4 #listWrapper { width:650px }
#demoFour li { float:left; }
#demoFour a { display:block; text-align:center; width:85px; border:1px solid silver; padding:10px; margin:0 10px 10px 0; text-decoration:none }
#demoFour a:hover { background-color:#eee }