li.open ul { display:block; }
li.closed ul { display:none; }
.selected { font-weight: bold; }
.failed { color: red; }
.rpc, .disabled { color: dimgrey; font-style: italic; }

table { border-spacing: 0; }
thead td { font-weight: bold; border-bottom: 1px solid black; }
tbody td { border-bottom: 1px solid gray; padding: 4px; }
thead .asc:after { content: "↑"; color: blue; }
thead .desc:after { content: "↓"; color: blue; }

tbody.body td { border-bottom: 1px solid gray; padding: 4px; }

tbody.foot td { font-weight: bold; padding: 4px 4px 4px 8px; }

.note {
  font-size: 0.75rem;
}

#topMenu {
  display:none;
  position:absolute;
  z-index:100;
  border: 1px solid gray;
  background: lightgray;
}
#topMenu li {
  list-style: none;
  padding: 3px 3px 0 3px;
}
#topMenu li:hover {
  background-color: gray;
}
#topMenu ul {
  padding:0;
  margin:0;
}

.key {
  font-weight: bolder;
}

.value {
  font-weight: normal;
}

.inputEditor, .open > ul {
  display: flex;
  flex-direction: column;
}
.inputEditor {
  max-width: 15rem;
}
.open > ul {
  max-width: 25rem;
}
.input, .open .tableItem {
  justify-content: space-around;
  display: flex;
  flex-direction: row;
}
.input > label, .tableItem > button {
  flex-grow: 2;
  flex-basis: 35%;
}
.input > input, .tableItem > label {
  flex-grow: 5;
  flex-basis: 65%;
}
