/* Menu Styles */

/* Init Logic */
.menu-toggle-button{padding: 5px 0px 10px 10px;cursor:pointer;}
.menu-toggle-button{display:none;}
.menu-toggle-button.active{border:1px solid #777;color:#777;}

ul.menu-list{list-style:none;position:relative;display:inline-table;padding:0px;margin:2px 0px 2px 5px;z-index:500;}
ul.menu-list li{float:left;position:relative;}
ul.menu-list li a{display:inline-block;}
ul.menu-list li a{display:block;}

/* Handling Submenu */
ul.menu-list ul{display:none;padding:0px;margin:0px;position:absolute;top:100%;left:0%;list-style:none;z-index: 700}
.menu-list > li.has-submenu > ul.sub-menu{padding: 7px 0px 0px 0px !important;}
ul.menu-list ul li{position:relative;float:none;padding:0px;margin:0px;}
ul.menu-list ul ul{position:absolute;top:0%;left:100%;z-index: 700}
ul.menu-list li:hover>ul{display:inline-block;}
/* End Init Logic */

/* Style */

ul.menu-list li:hover>ul{background:#fff!ie;} /* Fix for IE7 */

/* Submenu Expand Icon */
ul.menu-list li.has-submenu>a>span.menu-expand{font-size: 0.6em;float:right;padding-left:10px;line-height:2.2em;} /* All levels */
ul.menu-list li.has-submenu>a>span.menu-expand{float:left; padding: 0px 2px 0px 0px;} /* Fix for IE9 and below */
ul.menu-list>li.has-submenu>a>span.menu-expand{} /* Level 1 */
ul.menu-list>li.has-submenu>a>span.menu-expand:after{content:'\25BC'} /* Level 1 */
ul.menu-list li li.has-submenu>a>span.menu-expand{} /* Level 2 */
ul.menu-list li li.has-submenu>a>span.menu-expand:after{content:'\25BA'} /* Level 2 */

/* You can manage with of elements by width of a-tag */
/*ul.menu-list li a{color:#373737;text-decoration:none;padding:5px;} */ /* All levels */
ul.menu-list li ul a{color:#373737;text-decoration:none;padding:5px;} 
ul.menu-list li>a{} /* Level 1 */

ul.menu-list li li>a{width:150px;} /* Level 2 */
ul.menu-list li li li>a{} /* Level 3 */

/* First Level*/
ul.menu-list>li{margin:5px 0px 0px 5px; border-right: solid #7f7e7e 1px; padding: 0px 6px 0px 0px;}
ul.menu-list>li>a{}
ul.menu-list>li:hover{}
ul.menu-list>li:hover>a{}
ul.menu-list>li>a:hover{}
ul.menu-list li a:hover{color:#fff; background-color:#7f7e7e;}
/* End First Level*/

/* Second Level*/
ul.menu-list>li>ul{}
ul.menu-list>li>ul>li{}
ul.menu-list>li>ul>li>a{}
ul.menu-list>li>ul>li:hover{}
ul.menu-list>li>ul>li:hover>a{}
ul.menu-list>li>ul>li>a:hover{}
ul.menu-list li li, ul.menu-list li ul {
	background: white;
}
/* End Second Level*/
/* Third Level*/
ul.menu-list>li>ul>li>ul{}
ul.menu-list>li>ul>li>ul>li{}
ul.menu-list>li>ul>li>ul>li>a{}
ul.menu-list>li>ul>li>ul>li:hover{}
ul.menu-list>li>ul>li>ul>li:hover>a{}
ul.menu-list>li>ul>li>ul>li>a:hover{}
/* End Third Level*/

/* End Style */


/* End Menu Styles */


/* RESPONSIVE MEDIA QUERIES */
@media screen and (max-width: 768px){

ul.menu-list li li, ul.menu-list li ul, ul.menu-list > li{
	background: white;
}
ul.menu-list li a:hover{
	color:#fff; 
	background-color:#7f7e7e;
}


/* Menu Styles */

/* Init Logic */
.menu-toggle-button{display:block;}
.show-for-devices{display:block!important;}

ul.menu-list{display:none;}
ul.menu-list li{clear:both;float:none;}

/* Handling Submenu */
ul.menu-list ul{display:none;position:relative;}
ul.menu-list ul li{}
ul.menu-list ul ul{position:relative;top:100%;left:0%;}
ul.menu-list li:hover>ul{display:none;}
/* End Init Logic */

/* Style */

ul.menu-list li:hover>ul{} /* Fix for IE7 */

/* Submenu Expand Icon */
ul.menu-list li.has-submenu>a>span.menu-expand{font-size: 0.6em;padding:0.8em;line-height:1em;position:absolute;right:0;z-index: 700} /* All levels */
ul.menu-list>li.has-submenu>a>span.menu-expand{} /* Level 1 */
ul.menu-list li li.has-submenu>a>span.menu-expand{} /* Level 2 */
ul.menu-list li li.has-submenu>a>span.menu-expand:after{content:'\25BC';} /* Level 2 */

/* You can manage with of elements by width of a-tag */
ul.menu-list li a{color:#333;position:relative} /* All levels */
ul.menu-list li>a{} /* Level 1 */
ul.menu-list li li>a{width:auto;} /* Level 2 */
ul.menu-list li li li>a{} /* Level 3 */

/* First Level*/
ul.menu-list>li{}
ul.menu-list>li>a{}
ul.menu-list>li:hover{}
ul.menu-list>li:hover>a{}
ul.menu-list>li>a:hover{}
/* End First Level*/

/* Second Level*/
ul.menu-list>li>ul{border:none;}
ul.menu-list>li>ul>li{padding-left:5px;}
ul.menu-list>li>ul>li>a{}
ul.menu-list>li>ul>li:hover{}
ul.menu-list>li>ul>li:hover>a{}
ul.menu-list>li>ul>li>a:hover{}
/* End Second Level*/

/* Third Level*/
ul.menu-list>li>ul>li>ul{border:none;}
ul.menu-list>li>ul>li>ul>li{padding-left:5px;}
ul.menu-list>li>ul>li>ul>li>a{}
ul.menu-list>li>ul>li>ul>li:hover{}
ul.menu-list>li>ul>li>ul>li:hover>a{}
ul.menu-list>li>ul>li>ul>li>a:hover{}
/* End Third Level*/

/* End Style */


/* End Menu Styles */

}

ul.menu-list > li > a{
    color:#373737;
    text-decoration:none;
    text-align: center;
}

@media (min-width: 1200px) { 
    ul.menu-list{font-weight:700;font-size:12px;}
    ul.menu-list > li > a {
        padding:0px 2px 0px 2px;
    }
}
@media (min-width: 980px) and (max-width: 1199px) {
    ul.menu-list{font-weight:700;font-size:10px;}
    ul.menu-list > li > a {
        padding:0px 2px 0px 2px;
    }
}
     
/* Portrait tablet to landscape and desktop */
@media (min-width: 768px) and (max-width: 979px) { 
    ul.menu-list{font-weight:700;font-size:8px;}
    ul.menu-list > li > a {
        padding:0px 0px 0px 0px;    
    }
}
     
/* Landscape phone to portrait tablet */
@media (max-width: 767px) { 
    ul.menu-list{font-weight:700;font-size:12px;}
    ul.menu-list > li > a {
        padding:0px 2px 0px 2px;
    }
	ul.menu-list{background-color:white;position:absolute;width:300px;}
}
     
/* Landscape phones and down */
@media (max-width: 480px) { 
    ul.menu-list{font-weight:700;font-size:12px;}
    ul.menu-list > li > a {
        padding:0px 2px 0px 2px;
    }
	ul.menu-list{background-color:white;position:absolute;width:300px;}
}



/* EDITOR PROPERTIES - PLEASE DON'T DELETE THIS LINE TO AVOID DUPLICATE PROPERTIES */
