.caption,
#query,
.pager {
  text-align: center;
}

#legend-wrapper {
  background-color: whitesmoke;
  padding-top: 0.4em;
}

#legend-label {
  float: left;
  padding: 2px 4px;
  font-size: smaller;
}

#legend {
  float: left;
  width: 200px;
  margin: 2px;
  margin-left: 20px;
}

#legend .count {
  line-height: 20px;
}

#legend .count span {
  width: 20px;
  border: 1px solid black;
}

#taxons {
  display: none;
}

#taxon-display {
  float: left;
  margin: 5px;
}

#taxon-display .taxon {
  font-size: 8pt;
}

#taxon-display tr > th,
#taxon-display tr > td {
  border: none;
}

#taxon-display .taxon .name {
  border: 1px solid;
  width: 32px;
  float: right;
  text-align: center;
  line-height: 11px;
}

#taxon-display .taxon .description {
  display: none;
}

#taxon-display .taxon .expand-handle,
#taxon-display .taxon .collapse-handle,
#taxon-display .taxon .hide-handle {
  cursor: pointer;
  margin-top: 2px;
  margin-bottom: 2px;
}

#result {
  clear: both;
  width: 90%;
}

#groups .group {
  clear: both;
}

#groups .group[even='true'] {
  background-color: #dcdcdc;
}

#groups .group .phyletic-pattern {
  margin-top: 3px;
  clear: both;
}

#groups .group .count-data {
  display: none;
}

#taxon-display .taxon[abbrev='OBAC'] .name,
#groups .group .phyletic-pattern .branch[abbrev='OBAC'] .taxon {
  background-color: #9999cc;
}
#taxon-display .taxon[abbrev='FIRM'] .name,
#groups .group .phyletic-pattern .branch[abbrev='FIRM'] .taxon {
  background-color: #33cc99;
}
#taxon-display .taxon[abbrev='PROT'] .name,
#groups .group .phyletic-pattern .branch[abbrev='PROT'] .taxon {
  background-color: #99cc66;
}
#taxon-display .taxon[abbrev='ARCH'] .name,
#groups .group .phyletic-pattern .branch[abbrev='ARCH'] .taxon {
  background-color: #77ccdd;
}
#taxon-display .taxon[abbrev='OEUK'] .name,
#groups .group .phyletic-pattern .branch[abbrev='OEUK'] .taxon {
  background-color: #cc9999;
}
#taxon-display .taxon[abbrev='VIRI'] .name,
#groups .group .phyletic-pattern .branch[abbrev='VIRI'] .taxon {
  background-color: #cc9933;
}
#taxon-display .taxon[abbrev='EUGL'] .name,
#groups .group .phyletic-pattern .branch[abbrev='EUGL'] .taxon {
  background-color: #cccc66;
}
#taxon-display .taxon[abbrev='ALVE'] .name,
#groups .group .phyletic-pattern .branch[abbrev='ALVE'] .taxon {
  background-color: #cc3399;
}
#taxon-display .taxon[abbrev='FUNG'] .name,
#groups .group .phyletic-pattern .branch[abbrev='FUNG'] .taxon {
  background-color: #aa44dd;
}
#taxon-display .taxon[abbrev='META'] .name,
#groups .group .phyletic-pattern .branch[abbrev='META'] .taxon {
  background-color: #cc6666;
}
#taxon-display .taxon[abbrev='AMOE'] .name,
#groups .group .phyletic-pattern .branch[abbrev='AMOE'] .taxon {
  background-color: #3399cc;
}

#groups .group .phyletic-pattern .taxon {
  text-align: center;
  width: 26px;
  font-family: sans-serif, serif;
  font-size: 7pt;
  overflow: visible;
  margin-bottom: 1px;
  margin-right: 1px;
  border: 1px solid black;
  float: left;
}

#groups .group .phyletic-pattern .taxon .name {
  color: black;
  height: 12px;
  line-height: 12px;
}

#groups .group .phyletic-pattern .taxon .count {
  line-height: 12px;
  height: 10px;
}

#legend .count span,
#groups .group .phyletic-pattern .taxon .count {
  background-color: black;
  color: white;
}

#legend .count span[count='0'],
#groups .group .phyletic-pattern .taxon[count='0'] .count {
  background-color: white;
  color: black;
}

#legend .count span[count='1'],
#groups .group .phyletic-pattern .taxon[count='1'] .count {
  background-color: #ababab;
  color: black;
}

#groups .group .phyletic-pattern .taxon .description {
  display: none;
  position: absolute;
  max-width: 300px;
  border: 1px solid #a99b45;
  color: black;
  background-color: #fafb98;
}

#groups .group .shortcut {
  float: left;
  margin: 2px;
}

#groups .group .group-detail {
  margin: 2px;
  text-align: center;
}

#sequences,
#control {
  clear: both;
}

.expand-handle.off,
.collapse-handle.off,
.hide-handle.off {
  position: relative;
  top: -1px;
}

#phyletic-pattern {
  margin-bottom: 1em;
}

.ui-button-text-only .ui-button-text {
  padding: 0;
}

.attr-keyword-freq,
.attr-descriptions {
  padding: 0.4em;
  font-weight: bold;
}

.attr-keyword-freq label,
.attr-descriptions label {
  width: 100px;
  display: inline-block;
  text-align: right;
  font-weight: normal;
  padding-right: 0.4em;
}

.attr-keyword-freq,
.attr-descriptions {
  background: white;
}