/*----------------------
CUSTOM
----------------------*/
.cmsVerticalMenuCustom li a {
    line-height: 200%;
    margin: 1px;
    text-decoration: none;
    display: block;
    padding: 5px;
    box-sizing: border-box;
}



.cmsVerticalMenuCustom li a{margin:0;}

.cmsVerticalMenuCustom ul#nav li button {
    background: none;
    border: none;
    color: [WSCOL_BUTTON_TEXT];
    font-size: 150%;
    width: 42px;
    height: 42px;
}

.cmsVerticalMenuCustom ul#nav ul li button {
    width: 36px;
    height: 36px;
}


.plus{transition:transform 0.3s ease;}

li.active > button >.plus,
#menu li.menuliactive:not(.inactive) > button >.plus{
	    transform: rotate(45deg);
}

body #menu ul#nav li button.toggle{
	z-index:100;
	border:1px solid [WSCOL_BUTTON_TEXT];
	cursor:pointer;
}

body #menu ul#nav li button.toggle:hover{
	background-color:[WSCOL_BUTTON_TEXT_HOVER];
}


.catsubmenu{width:100%;}


/*----------------------
MENU
----------------------*/

#menu {
	margin: 0 auto;
	min-height: 45px;
	padding: 0;
	margin: auto;
        position:relative;
        z-index:400;	
}
#menu ul {
	list-style: none;
	margin: 0;
	padding: 0;
	line-height: 1;
	width:100%;
}

#menu ul#nav{
	background-color:[WSCOL_MENU];
}

#menu > ul > li{
         margin: 3px 0;
}
#menu li {
	display: flex;
	flex-wrap:wrap;
	position: relative;
	padding:0px;
}
#menu li:hover{
        position:relative;
        z-index:5;
  
}

#menu li a{
	flex:1;
}

#menu li a.catmenu-active,
#menu li a.menu-active{border-bottom: 1px solid [WSCOL_BUTTON_TEXT];}

#menu li a{
	color: [WSCOL_BUTTON_TEXT];
	padding:5px;
    	text-decoration: none;
    	display: inline-block;
}


#menu li a:hover {
	background-color: [WSCOL_BUTTON_HOVER];
	color:[WSCOL_BUTTON_TEXT_HOVER];
}
#menu li.menuliactive > a,
#menu li.menuliparentactive > a,
#menu li a.catmenu-selectedCategory,
#menu li.selectedCategory {
	background-position:0px bottom ;
        background-color:[WSCOL_BUTTON_HOVER];
	color:[WSCOL_BUTTON_TEXT_HOVER];
}

#menu a.catmenu-selectedCategory{
       color:[WSCOL_BUTTON_TEXT_HOVER]!important;
}



#menu li.menuliparentactive li.menuliactive{
	background-position:0px top;
	border:1px solid;
	border-color: [WSCOL_BUTTON_TEXT];
}

#menu li.menuliactive > a.menuactive, #menu li.menuliparentactive > a{
	background-color: [WSCOL_BUTTON_HOVER];
}

#menu li.menuliactive.hassubmenu > a.menuactive, #menu li.menuliparentactive.hassubmenu > a,
#menu li a.catmenu-menuactive{
       color:[WSCOL_BUTTON_TEXT_HOVER];
}


#menu li.menuliparentactive a{
	background-position: left -52px;
}

#menu li.menuliactive > ul, #menu li.menuliparentactive > ul{
        margin-left:0;
}


#menu ul ul {
	display:none;
	padding: 0;
	border-left:1px solid;
	border-color: [WSCOL_BUTTON_TEXT];
	border-color: [WSCOL_PAGE_BORDER];
	text-align: left;
}

/*----------------------
TOGGLE
----------------------*/





#menu .active > ul,
#menu li.menuliactive:not(.inactive) > ul,
#menu li.selectedCategoryPath:not(.inactive) > ul,
#menu ul ul li:not(.inactive) > ul.submenu-selectedCategoryPath{
	display:block;
	position: relative;
}



/*----------------------
SUBMENU
----------------------*/


#menu ul ul li{
	padding: 2px 0 2px 10px;
}


#menu ul ul li:hover >a{
	background-color: [WSCOL_BUTTON_HOVER];
}

#menu ul ul ul li a {
	font-size:90%;
}
#menu ul ul ul {
    border-left: 0;
    padding: 0;
}
#menu ul ul a:hover, #menu ul ul a:visited:hover {
    
}

#menu li:hover ul ul, #menu li:hover ul ul ul, #menu li.sfhover ul ul, #menu li.sfhover ul ul ul {

}
#menu li:hover ul, #menu li li:hover ul, #menu li li li:hover ul, #menu li.sfhover ul, #menu li li.sfhover ul, #menu li li li.sfhover ul {
    left: auto;
}