@import url(https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css);
@import url(https://fonts.googleapis.com/css?family=Roboto:400,700);
treemenu{
	/* font-family: 'Roboto', sans-serif; */
	font-size: 12px;
	/* line-height:2em; */
	/* text-transform: uppercase; */
	}
treemenu-begin{
	display:block;
	overflow:hidden;
	width:auto;
	max-width:390px;
} 
treemenu-begin,
treemenu-begin nav1 a,
treemenu-begin nav2 a,
treemenu-begin nav3 a,
treemenu-begin nav4 a{
	/* white-space:nowrap; */
	overflow:hidden;
}
/**Global Variable********************************************************/
treemenu-begin a{
	display:block;
	text-decoration: none;
	color: #333;
    font-size: 12px; 
}
treemenu-begin a.current{
	color:#0e5caa; 
	font-weight:bold; 
	}
/**Dropdown Wrapper********************************************************/
wrapper{ 
	display:block;
	padding-left:10px;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #0e5caa; 
	}


/**Arrow********************************************************/
treemenu-begin arw{
	float:right;
	}
treemenu-begin arw:after{
	font-family: FontAwesome; 
	content:'\f107'; 
	}
treemenu-begin arw.xclose:after{
	font-family: FontAwesome;
	content:'\f00d';
	}
/**Sub Level 1********************************************************/
nav1 {
	cursor:pointer;
	display:block;
	padding: 5px 10px;
	outline:none;
	margin-bottom:3px;
	text-decoration: none;
	background-color: #CCC;
	color: #333;
	min-width:250px;
}
nav1:hover{
	color:#fff;
	background-color: #0e5caa;
}
nav1:hover a{
	color:#fff;
	}
/**Sub Level 2********************************************************/
nav2{
	cursor:pointer;
	display:block;
	padding: 5px 20px;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #CCC;
	}
nav2:hover a,
nav2:hover{
	color:#0089d3;
	}
/**Sub Level 3********************************************************/
nav3 a{
	cursor:pointer;
	display:block;
	padding: 5px 20px;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #CCC;	
	}
nav3 a:hover{
	color:#0089d3;
	}
nav3 a:before{
	content:'- ';}
/**Sub Level 4********************************************************/
nav4 a{
	cursor:pointer;
	display:block;
	padding: 5px 20px;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #CCC;	
	}
nav4 a:hover{
	color:#0089d3;
	}
nav4 a:before{
	content:'- ';}

	
/*Burger temporary act as title first****************************************/
burger{
	display:block;
	border-bottom-width: 1px;
	border-bottom-style: dotted;
	border-bottom-color: #999;
	padding:10px 0px;
	font-size: 16px;
}
burger:before{
	content:'Select Category';
	text-transform: uppercase;
	}
	
treemenu-begin nav1>a{
	font-size:12px
	color:#333333;
	
}
@media only screen and (max-width: 620px) {
/**Mobile Burger Menu********************************************************/
burger{
	padding:10px 20px;
	background-color:#333333;
	color:#fff;
}
burger:after{
	float:right;
	font-family: FontAwesome;
	content:'\f0c9';
}
treemenu-begin{
	width:auto;
}

}