/**
 * "Yet Another Multicolumn Layout" - (X)HTML/CSS Framework
 *
 * (en) Horizontal list navigation based on "Sliding Door II" from von "A List Apart"
 * (de) Horizontale Navigationsliste basierend auf "Sliding Door II" von "A List Apart"
 *
 * @copyright       Copyright 2005-2010, Dirk Jesse
 * @license         CC-A 2.0 (http://creativecommons.org/licenses/by/2.0/),
 *                  YAML-C (http://www.yaml.de/en/license/license-conditions.html)
 * @link            http://www.yaml.de
 * @package         yaml
 * @version         3.2.1
 * @revision        $Revision:392 $
 * @lastmodified    $Date:2009-07-05 12:18:40 +0200 (So, 05. Jul 2009) $

@media all
  .hlist
    /* (en) This image is mainly transparent
    /* (de) Dieses Bild ist größtenteils transparent
    background: transparent url("#{$yaml_img_dir}/sliding_door/round/bg.gif") repeat-x bottom
    float: left
    width: 100%
    ul
      margin: 0
      padding: 0
      line-height: 1em
      list-style: none
      white-space: nowrap
    li
      /* (en) Repeat the main color from the image
      /* (de) Wiederholung der Hauptfarbe aus der Bilddatei
      list-style-type: none !important
      background: #e0ecf8 url("#{$yaml_img_dir}/sliding_door/round/left.png") no-repeat top left
      border-bottom: 1px solid #000
      float: left
      /* LTR
      margin: 0
      padding: 0 0 0 3px
    a, strong
      /* (en) This image is mainly transparent
      /* (de) Dieses Bild ist größtenteils transparent
      background: transparent url("#{$yaml_img_dir}/sliding_door/round/right.png") no-repeat top right
      color: #667
      display: block
      font-weight: normal
      padding: 5px 11px 3px 8px
      text-decoration: none
      text-transform: none
      /**
       * @bugfix
       * @affected   IE5.x, IE6
       * @css-for    all browsers
       * @valid      yes
      width: auto
      /* only IE 5.x
      width/**/: .1em
      /* only IE 6.0
    a
      &:link, &:visited
        background-color: transparent
        color: #667
    > ul
      a, strong
        width: auto
    ul li
      &:focus, &:hover, &:active
        /* (en) Repeat the main color from the image
        /* (de) Wiederholung der Hauptfarbe aus der Bilddatei
        background-color: #c4d0dc
        background-position: 0 -150px
      &:focus a, &:hover a, &:active a
        background-position: 100% -150px
    a
      &:focus, &:hover, &:active
        background: transparent url("#{$yaml_img_dir}/sliding_door/round/right.png") no-repeat top right
        color: #223
        outline: 0 none
        text-decoration: none
    ul li.active
      /* (en) Repeat the main color from the image
      /* (de) Wiederholung der Hauptfarbe aus der Bilddatei
      background: white url("#{$yaml_img_dir}/sliding_door/round/left_on.png") no-repeat top left
      border: 0 none
      &:focus, &:hover, &:active
        /* (en) Repeat the main color from the image
        /* (de) Wiederholung der Hauptfarbe aus der Bilddatei
        background: white url("#{$yaml_img_dir}/sliding_door/round/left_on.png") no-repeat top left
        border: 0 none
    li.active strong
      /* (en) This image is mainly transparent
      /* (de) Dieses Bild ist größtenteils transparent
      background: transparent url("#{$yaml_img_dir}/sliding_door/round/right_on.png") no-repeat top right
      color: #334
      font-weight: bold
      padding-bottom: 4px
      padding-top: 5px
  /**
   * @bugfix
   * @affected   IE5.x, IE6
   * @css-for    all browsers
   * @valid      yes
  /* for other browsers