.treeview, .treeview ul {
	padding: 0;
	margin-bottom: 0;
	list-style: none;
}

.treeview .hitarea {
	display: inline-block;
	cursor: pointer;
}

.treeview .hitarea:before{
	content: "";
	display: inline-block;
	position: relative;
	top: -3px;
	margin-right: 5px;
	border-left: 6px solid transparent; 
	border-right: 6px solid transparent;
	border-top: 8px solid #949494;
}

.treeview .expandable-hitarea:before {
	content: "";
	display: inline-block;
	top: 0;
	margin-right: 3px;
	border-top: 6px solid transparent; 
	border-bottom: 6px solid transparent;
	border-left: 8px solid #949494;
}

.treeview li {
	line-height: 2;
	padding-left: 22px;
}

.treeview li.collapsable li.collapsable,
.treeview li.collapsable li.expandable{
	padding-left: 22px;
}

.treeview a.selected {
	background-color: #eee;
}

#treecontrol {
	margin: 1em 0; display: none;
}

.treeview .hover {
	cursor: pointer;
}

.treeview .placeholder,
.filetree .folder,
.filetree .file {
	display: inline-block; 
	font-family: 'FontAwesome';
}

.treeview .placeholder:before {
	content: "\f110";
	display: inline-block;
	margin-left: -2px;
	font-size: 15px;
	/* fa-spin animation defined in font-awesome core css */
	-webkit-animation: fa-spin 1s infinite steps(8);
  animation: fa-spin 1s infinite steps(8);
}

.filetree .folder{
	color: #72d1f5;
	padding-right: 5px;
	font-size: 16px;
}

.filetree .folder:hover{
	cursor: default;
}

.filetree .file{
	padding-right: 7px;
	font-size: 15px;
	color: #cfcfcf;
}

.treeview-line .collapsable,
.treeview-line li .collapsable > ul > li {
	position: relative;
}

.treeview-line .collapsable:before{
	content: "";
	display: block;
	width: 1px;
	position: absolute;
	left: 27px;
	top: 22px;
	bottom: 0;
	background-color: #9e9e9e;
}

.treeview-line li .collapsable > ul > li:before{
	content: "";
	display: block;
	width: 10px;
	height: 1px;
	position: absolute;
	top: 50%;
	left: 5px;
	background-color: #9e9e9e;
}