/*--------------------------------------------------------------------------------------------
	@bcthemes
	http://bcthem.es
	
	v1.0 Updated: 201300425
	
	http://css-tricks.com/examples/ConvertMenuToDropdown/
	
	nav {.block-group|.inline-group|.button-group|.stacked-group} {.active} {.buttons|.blocks}
--------------------------------------------------------------------------------------------*/

	/* Normalise */
	nav ul {margin:0; padding:0;}
	nav li { list-style: none }
   
   
   /* nav.block-group.dropdown */
   
	/*.onphone [class*="block-group"] ul ul:before { font-family: FontAwesome; content: '\f0d7'; position: absolute; display: inline-block; right:1em; top:0; z-index: 10; color: inherit; background-color: red; padding: 0 1em;}*/
	
	nav[data-enable="toggle-dropdown"].dropdown > a {display: none;}
	.onphone [class*="block-group"] a {padding:1em; display: block}
    
	
	/*
	 *  <a id="open" href="#primary">Show navigation</a>
		<a href="#open" title="Hide navigation">Hide navigation</a>
	*/
	
	nav[class*="block-group"].dropdown {position: relative}
	
	/* TODO: Add open/close classes */
	.onphone [data-enable="toggle-dropdown"] ul { overflow: hidden; max-height: 0;}
	[data-enable="toggle-dropdown"] ul { 
										-webkit-transition: max-height 1s; transition: max-height 1s;
	}
	.onphone [data-enable="toggle-dropdown"] a#open {display: block}
	.onphone [data-enable="toggle-dropdown"]:target ul { max-height: 999px;}
	.onphone [data-enable="toggle-dropdown"]:target a#open {display: none}
	.onphone [data-enable="toggle-dropdown"]:target a[href='#open'] {display: block}
	
	

@media only screen and (min-width: 480px) {

    
	/* 	nav.block-group.dropdown
	 * 
     * TODO: Add JS to determine ul width?
     */
	
	[data-enable="toggle-dropdown"] > a {display: none;}
	[class*="block-group"] ul ul { height:0; overflow: hidden}
	
	nav[class*="block-group"].dropdown .close {display: none;}
	
	nav[class*="block-group"].dropdown a {/* Add Padding */}
	nav[class*="block-group"].dropdown ul ul { height:0; width: auto; overflow: hidden}
    
	/*nav[class*="block-group"].dropdown > ul:before { content:'*'; background:red; width:2em; height: 2em; position: absolute; right:0; top: 0; display: block;}
	nav[class*="block-group"].dropdown:focus ul ul { height: auto}*/

	/* Block Group wDropDown
     * TODO: Add JS to determine ul width?
     */
    nav[class*="block-group"].dropdown li a {white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
    nav[class*="block-group"].dropdown li li { float: none}
	nav[class*="block-group"].dropdown li:hover > ul { height: auto}
    nav[class*="block-group"].dropdown ul ul { position: absolute; top:100%; z-index: 1}
    nav[class*="block-group"].dropdown ul ul ul { position: absolute; top:0; left:100%; z-index: 2}
	
	/*nav[class*="block-group"].dropdown > ul:active:before { background:blue !important;}
	nav[class*="block-group"].dropdown > ul:focus:before { background:green !important;}
	nav[class*="block-group"].dropdown > ul:target:before { background:orange !important;}
	nav[class*="block-group"].dropdown > ul:active:before ul,
	nav[class*="block-group"].dropdown > ul:focus:before ul,
	nav[class*="block-group"].dropdown > ul:target:before ul {height:auto; }*/
    
        
    /* 	.block-group.buttons
     */
    [class*="block-group"].buttons li+li a	{
            -webkit-border-top-left-radius: 0;
            -webkit-border-bottom-left-radius: 0;
            -moz-border-radius-topleft: 0;
            -moz-border-radius-bottomleft: 0;
            border-top-left-radius: 0;
            border-bottom-left-radius: 0;
    }
    [class*="block-group"].buttons li:not(:last-child) a {
            -webkit-border-top-right-radius: 0;
            -webkit-border-bottom-right-radius: 0;
            -moz-border-radius-topright: 0;
            -moz-border-radius-bottomright: 0;
            border-top-right-radius: 0;
            border-bottom-right-radius: 0;
    }
	
	/* .block-group.blocks
    */
    [class*="block-group"].blocks a { border:0; padding:1em .5em;border-left-color: rgba(0,0,0,1); border-left-color: rgba(255,255,255,1) }
    [class*="block-group"].blocks li+li a {border-left-color:rgba(255,255,255,.6)}
    [class*="block-group"].blocks li:not(.first-child) a { border-right-color:rgba(255,255,255,.2) }
    
 
 
    /*	.button-group
	 */ 
    
	/*.button-group li { display: inline-block; *zoom:1} */
    
    
    /* .stacked
	 */
    [class*="stacked"] li { display: block; clear: both; width: 100% }
    [class*="stacked"][class*="block-group"] li > * {width: 100% }
    
    
    /* Nav Styles
    * nav {active} {.tabs|.buttons|.pills} {spacers|dividers}
    */
 
   
}

@media only screen and (min-width: 1024px) {
	

}

