body { margin: 0; overflow: hidden; }
#tree {
  position: absolute;
  top: 10px;
  left: 10px;
  background: #1e1e1e;
  padding: 10px;
  border: 1px solid #1e1e1e;
  max-height: 93.5vh;
  overflow-x: scroll;
  overflow-y: scroll;
  width: 650px;
  height: 1900px;
  z-index: 2;
}
.tree-item {
  /* padding: 5px; */
  margin: 5px 0;
  /* border: 1px solid transparent; */
  background-color: #1e1e1e;
  white-space: nowrap;
  color: #ffffff;
}
.tree-item .children {
  margin-left: 20px;
  /* padding-left: 20px;
  border-left: 1px solid #ccc; */
  display: none;
  background-color: #1e1e1e;
  color: #ffffff;
}
.tree-item .label{
    background-color: transparent;
}
.tree-item.highlight > .label{
    background-color: #47B5DE;
}
.expanded > .children {
    display: block;
}  

#info { position: absolute; top: 10px; left: 220px; color: white; background: rgba(0,0,0,0.5); padding: 10px; }


/* body { margin: 0; overflow: hidden; }
#tree {
  position: absolute;
  top: 10px;
  left: 10px;
  background: #1e1e1e;
  border: 1px solid #1e1e1e;
  max-height: 95vh;
  overflow-x: scroll;
  overflow-y: scroll;
  width: 350px;
  height: 2000px;
  z-index: 2;
}
.tree-item {
  margin: 5px 0;
  white-space: nowrap;
  color: hsl(0, 0%, 100%);
  font-size: 12px;
}
.tree-item .children {
  margin-left: 20px;
  display: none;
  color: #ffffff;
  font-size: 12px;
}
.expanded > .children {
    display: block;
}    
.selected {
  background: #47B5DE;
}
.highlight {
    background: #47B5DE;
} */