/* For treemenu.js */

.treemenu li { list-style: none; }

.treemenu .toggler {
    cursor: pointer;
    float:left;
    
}

.treemenu .toggler:before {
    display: inline-block;
    margin-right: 2pt;
     float: left;
    display: block; 
    margin-top:6px;
    
}

li.tree-empty > .toggler { visibility: hidden }
li.tree-empty > .toggler:before { content: url("../img/treeitem-expanded.png"); }
li.tree-closed > .toggler:before { content: url("../img/treeitem-collapsed.png"); }
li.tree-opened > .toggler:before { content: url("../img/treeitem-expanded.png"); }


*{list-style:none;border:none;}
.tree {  color:#45abc7;width:auto;margin:0px auto;cursor:default;padding:0}

.tree ul{
	padding:0 0 0 15px;
}

.tree li,
.tree li > a,
.tree li > div,
.tree li > span {
    padding: 2pt;
    border-radius: 4px;
}

.tree li a  {
    text-decoration: none;
    line-height: 20pt;
    border-radius: 4px;
}

.tree li div{
 text-decoration: none;
    line-height: 20pt;
    border-radius: 4px;
    border:0px
}
@media all and (orientation : portrait){
	.tree li a,.tree li div {
		color:#FFF;
		/* float: left; */
		width: calc(100% - 17px);
		overflow-wrap:break-word;
	}
}
@media all and (orientation : landscape){
	.tree li a,.tree li div {
	    color:#333;
	   /* float: left; */
		width: calc(100% - 17px);
		overflow-wrap:break-word;
	}
	.tree li a:hover,.tree li div:hover {
	    background-color: #565656;
	    color: #fff;
	}
}

.active {
}

.active a,.active div {
    color: #fff;
}

.tree li ul li span{
	float: left;
    display: block;
}