.tree-nav {
 
   width: 260px;
   height: 100%;
   height: 100vh;   
   font-size: 15px;
       background: #fff;
   /* overflow: auto; */
   display:none;
   position:absolute;
   top: 57px;
    left: 110px;
	    border-right: solid 1px #ccc;
	-webkit-transition: left 200ms ease-in;
    -moz-transition: left 200ms ease-in;
    -ms-transition: left 200ms ease-in;
    transition: left 200ms ease-in;
}

/* Color Scheme */
.tree-nav.default{
  --color: rgba(255, 255, 255, 0.75);
  --background: rgb(22, 12, 12);
  --folder-color: rgb(230, 195, 0);
}

.tree-nav a {
   color: var(--color);
   text-decoration: none;
}
/* Custom Scrollbar For TreeNav */
.tree-nav .main-items::-webkit-scrollbar {
  width: 8px;
  height:8px;
}

.tree-nav .main-items::-webkit-scrollbar-track {
  background: #f1f1f1; 
}
 
.tree-nav .main-items::-webkit-scrollbar-thumb {
  background: #888; 
}

.tree-nav .main-items::-webkit-scrollbar-thumb:hover {
  background: #555; 
}
.tree-nav ul li{
   list-style: none;   
   position: relative;
    padding: 8px;
	width:100%;
}

#menu ul .tree-nav ul li a, #menu ul li.active .tree-nav ul li a {
    display: inline-block;
    padding: 0px;
}
.tree-nav li ul li a:before{
   content: "—";
   margin-left: -5px;
}
.tree-nav li ul li {
border-left: 1px dotted #ccc;
margin-left: 32px;

}
.tree-nav li ul{
display: none;

}
/* Folder Icon Design */
.folder{
  cursor: pointer;
  position:relative;

}
.folder:after{
   font-family: FontAwesome;
   content: "\f07b";
   color: var(--folder-color);
   margin-right: 5px;
   display: inline-block;
   padding: 3px;
}
.folder.open:after{
   content: "\f07c";
}

.folder:before{
   font-family: FontAwesome;
   content: "\f067";
   color: var(--folder-color);
   margin-right: 5px;
   display: inline-block;
   padding: 3px;
}
.folder.open:before{
   content: "\f068";
}

.tree-nav .main-items li ul{
	position: inherit !important;
    left: inherit !important;
    top: inherit !important;
    min-width: inherit !important;
    z-index: inherit !important;
}
.tree-nav .closeNav{
	position: absolute;
    top: 0px;
    right: 6px;
}
.tree-nav .closeNav:hover{
	    color: red;
    border-left: solid 3px red;
}
#menu ul .tree-nav .main-items{
	margin-top: 40px;
    margin-left: 20px;
	overflow: auto;
    width: 239px;
    height: 600px;
}
#menu ul li .tree-nav .closeNav:hover, #menu ul li .tree-nav .closeNav:focus{
	color:#676767;
	border:none;
}
.main-items .btn{
	    color: #fff;
    border: 0px;
    width: 100px;
    padding: 6px 12px;
    margin-bottom: 15px;
}