/**
 * "Yet Another Multicolumn Layout" - YAML CSS Framework
 *
 * (en) Vertical list navigation "vlist"
 * (de) Vertikale Navigationsliste "vlist"
 *
 * @copyright       Copyright 2005-2012, Dirk Jesse
 * @license         CC-BY 2.0 (http://creativecommons.org/licenses/by/2.0/),
 *                  YAML-CDL (http://www.yaml.de/license.html)
 * @link            http://www.yaml.de
 * @package         yaml
 * @version         v4.0
 * @revision        $Revision: 686 $
 * @lastmodified    $Date: 2012-01-22 13:09:37 +0100 (So, 22 Jan 2012) $

@media all
  /* title
  h6.ym-vlist
    font-family: Arial, Helvetica, sans-serif
    font-weight: bold
    font-size: 100%
    width: 90%
    padding: 3px 0px 3px 10%
    /* LTR
    margin: 0
    color: #444
    background-color: #fff
    border-top: 2px #ddd solid
    border-bottom: 4px #888 solid
  .ym-vlist
    width: 100%
    overflow: hidden
    margin: 0 0 1.5em 0
    list-style-type: none
    border-bottom: 2px #ddd solid
    ul
      list-style-type: none
      margin: 0
      padding: 0
    li
      float: left
      /* LTR
      width: 100%
      margin: 0
      padding: 0
    a, strong, span
      display: block
      padding: 3px 0px 3px 10%
      text-decoration: none
      border-bottom: 1px #ddd solid
    a
      color: #444
      &:visited
        color: #444
    li
      span
        display: block
        font-weight: bold
        border-bottom: 1px #ddd solid
      &.active
        color: #fff
        background-color: #444
        strong
          font-weight: bold
      a, strong, span
        width: 90%
        padding-left: 10%
      a
        &:focus, &:hover, &:active
          background-color: #888
          color: #fff
          outline: 0 none
      ul li
        a, strong, span
          width: 80%
          padding-left: 20%
        a
          background-color: #f8f8f8
          color: #333
          &:visited
            background-color: #f8f8f8
            color: #333
          &:focus, &:hover, &:active
            background-color: #888
            color: #fff
        ul li
          a, strong, span
            width: 70%
            padding-left: 30%
          a
            background-color: #f0f0f0
            color: #222
            &:visited
              background-color: #f0f0f0
              color: #222
            &:focus, &:hover, &:active
              background-color: #888
              color: #fff
          ul li
            a, strong, span
              width: 60%
              padding-left: 40%
            a
              background-color: #e8e8e8
              color: #111
              &:visited
                background-color: #e8e8e8
                color: #111
              &:focus, &:hover, &:active
                background-color: #888
                color: #fff
  /* active list element
  /* Level 1
  /* LTR
  /* Level 2
  /* LTR
  /* Level 3
  /* LTR
  /* Level 4
  /* LTR