ul[role="tree"] {
  margin: 0;
  padding: 0;
  list-style: none;
}

ul[role="tree"] li {
  margin: 0;
  padding: 5px 5px 5px 10px;
  list-style: none;
}

ul[role="tree"] a {
  border-color: transparent;
  display: inline;
  color: #656565;
}

[role="treeitem"] ul {
  margin: 0;
  padding: 0;
  margin-left: 0.9em;
}

[role="treeitem"][aria-expanded="false"] > ul {
  display: none;
}

[role="treeitem"][aria-expanded="true"] > ul {
  display: block;
}

[role="treeitem"][aria-expanded="false"] > span::before {
  font-family: FontAwesome;
  content: "\f067";
  font-weight: 400 !important;
  color: #4e9dc4;
  position: relative;
  top: 0.25em;
  /*left: -0.25em;*/
}

[role="treeitem"][aria-expanded="true"] > span::before {
  font-family: FontAwesome;
  content: "\f068";
  position: relative;
  top: 0.25em;
  left: -0.25em;
}

[role="treeitem"],
[role="treeitem"] span {
  margin: 2px;
  padding: 0.125em;
  /*border: 2px transparent solid;*/
  display: block;
}

/* disable default keyboard focus styling for treeitems
   Keyboard focus is styled with the following CSS */
[role="treeitem"]:focus {
  outline: 0;
}

[role="treeitem"].focus,
[role="treeitem"] span.focus {
  /*border-color: black;*/
  background-color: #eee;
}

[role="treeitem"].hover,
[role="treeitem"] span.hover {
  background-color: #eee;
}