body {
  height: 100%;
  display: flex;
  flex-direction: column;
}

.app-container {
  height: 100%;
  display: flex;
  flex-direction: column;
  flex: 1;
  overflow: hidden;
}

.ui.inverted.menu .item.disabled,
.ui.inverted.menu .item.disabled:hover {
  color: rgba(225, 225, 225, 0.3) !important;
}

.right-sidebar .ui.segment.tab {
  padding: 0;
}

.pusher.map-container {
  height: 100%;
}

.hide-overflow-x {
  overflow-x: hidden;
}

.opacity-slider {
  margin-top: 10px;
}

.list.with-labels > .item {
  display: flex;
  align-items: center;
}
.with-labels .item > .content {
  flex: 1;
}
.spin {
  animation: spin 2s infinite linear;
}

.dropdownOpen .divider.text {
  /*  Hide the current selection at the top of semantic <Dropdown> so doesn't appear as doubled-up (see LayerControl.tsx) Task #116  */
  display: none !important;
}