@charset "UTF-8";



/**

 * JYAML - Template Framework includes YAML for Joomla!

 *

 * All rights reserved. The JYAML project is a template to manage and

 * configure Joomla!-Templates with the YAML XHTML/CSS Framework

 * - http://www.yaml.de

 *

 * -----------------------------------------------------------------------------

 *

 * @version       $Id$

 *

 * @author        Reinhard Hiebl

 * @copyright     Copyright (C) 2006 - 2012, HieblMedia (Reinhard Hiebl)

 * @license       Creative Commons Attribution 3.0 Unported License

 *                  > http://www.jyaml.de/en/license-conditions.html

 * @link          http://www.jyaml.de

 * @package       JYAML

 * @subpackage    JYAML.Dropdown.Stylesheet

 *

 */



@media all

{



  .dropdown {

    width: 100%;

    overflow: visible;

    float: left;

    display: block;

    position: relative;

    line-height: 0;

    text-align: left;

    font-size: 1em;



    z-index: 800;

  }

  .dropdown:hover {

    z-index: 801;

  }



  .dropdown ul,

  .dropdown li {

    /* reset */

    list-style: none;

    list-style-type: none;

    list-style-image: none;



    margin: 0;

    padding: 0;

    border: 0;

  }



  .dropdown,

  .dropdown ul,

  .dropdown li,

  .dropdown a {

    /* fix some hover issues for all browsers (lost background focus on absolute elements) */

     

  }



  .dropdown ul {

    position: relative;

    display: inline;

    float: left;

  }



  .dropdown li {

    display:block;

    position: relative; /* important for having right dimensions from beginning */



    float: left; /* LTR */

    font-size:1.0em;

    line-height:1em;

  }



  .dropdown-vertical ul,

  .dropdown-vertical li  {

    display: block;

    float: none;

  }



  .dropdown li.hover,

  .dropdown li:hover {

    /* position: relative; */

    z-index: 857;

    cursor: default;

  }



  .dropdown li a {

    display: block;

    width: 100%;

    float: left;

    font-size:1em;

    cursor: pointer;

  }

  .dropdown li span.item-title {

    display: block;

    width: auto;

  }



  .dropdown .dropitem {

    position: absolute;

    visibility: hidden;



    /* optional fallback? width: 150px; */



    /* defaults (open right) */

    top: 0px;

    bottom: auto;

    left: 100%;

    right: auto;



    z-index: 856;

    width: 100%;

  }

  .dropdown .dropitem .dropitem,

  .dropdown-vertical .dropitem {

    width: auto; /* from view level 2 or vertical always auto width */

  }



  #dropdownSubMenusContainer .dropdown .dropitem {

    width: auto;

    visibility: visible;

    top: 0px;

    bottom: auto;

    left:0px;

    right: auto;

  }



  .dropdown .dropitem ul {

    width: 100%;

  }



  .dropdown-horizontal .viewLevel0 .dropitem {

    /* horizontal level0 (open down by default) */

    top: 100%;

    bottom: auto;

    left: 0px;

    right: auto;

  }

  .dropdown-horizontal .viewLevel1 .dropitem {

    /* horizontal level0 (open right by default) */

    top: 0px;

    bottom: auto;

    left: 100%;

    right: auto;

  }



  .dropdown li:hover > .dropitem,

  .dropdown li a:focus + .dropitem {

     visibility: visible;

  }



  .dropdown .dropitem-content {

    position: absolute;

    top:-32768px;

    left:-32768px;

  }

  .dropdown li:hover > .dropitem > .dropitem-content,

  .dropdown li.hover > .dropitem > .dropitem-content,

  .dropdown li a:focus + .dropitem > .dropitem-content,

  .dropdown-linear .viewLevel1 .dropitem .dropitem-content,

  #dropdownSubMenusContainer .dropitem-content,

  .js .dropdown .dropitem-content {

    position: static;

    top:auto;

    left:auto;

  }



  .dropdown .dropitem li {

    width: 100%;

  }



  .dropdown li li .dropitem {

    top: 0px;

    bottom: auto;

    left: 100%;

    right: auto;

  }



  .dropdown-linear li,

  .dropdown-linear li.hover,

  .dropdown-linear li:hover {

    position: static !important;

  }



  .dropdown-linear .dropitem li {

    width: auto;

    float: left;

  }



  .dropdown-linear .viewLevel1 .dropitem {

    position: relative;

    visibility: visible;

    left: 0;

    top: 0;

  }

  .dropdown-linear .viewLevel1 .dropitem li {

    width: 100%;

  }



  /**

   * @Experimental: Specail mix with important rules and specificity to Inherit parent direction

   */

  .dropdown .dropitem-up {

     top: auto !important; bottom: 100% !important;

     left: 0px !important; right: auto !important;

  }



  .dropdown .dropitem-right {

     top: 0px !important; bottom: auto !important;

     left: 100% !important; right: auto !important;

  }



  .dropdown .dropitem-left {

     top: 0px !important; bottom: auto !important;

     left: auto !important; right: 100% !important;

  }



  .dropdown .dropitem-down {

    top: 100% !important; bottom: auto !important;

    left: 0px !important; right: auto !important;

  }



  .js #dropdownSubMenusContainer .dropdown .dropitem {

    top: auto !important; bottom: auto !important;

    left: auto !important; right: auto !important;

  }





  /* debug/test */

  /*

  .dropdown ul li { background: red; }

  .dropdown ul li.parent ul {

    border:1px solid #000;

    border-top:0;

    padding:0 10px 10px 10px;

    margin:0 -11px -11px -11px;

  }

  .dropdown ul li ul li { background: green; }



  */



  #dropdownSubMenusContainer {

    display: block;

    position: absolute;

    top: 0;

    left: 0;

    width: 100%;

    height: 0;

    overflow: visible;

    z-index: 900;

    background: transparent;

  }



  .dropdownHelperContainer {

    display: none;

    position: absolute;

    overflow: hidden;

    background: transparent;

  }



}

