body {
  margin: 0;
  height: 100vh;
}

#app {
  height: 100%;
}

.column {
  width: 50%;
  height: 100%;
  float: left;
}

#editor {
  overflow: hidden;
}

#terminal {
  background: black;
}

#runButton {
  position: absolute;
  top: 25px;
  right: calc(50% + 25px);
}

#formatButton {
  position: absolute;
  bottom: 80px;
  right: calc(50% + 25px);
  visibility: hidden;
}

#formatButton.visible {
  visibility: visible;
}

#packagesButton {
  position: absolute;
  bottom: 25px;
  right: calc(50% + 25px);
  visibility: hidden;
}

#packagesButton.visible {
  visibility: visible;
}

#backButton {
  position: absolute;
  left: 25px;
  bottom: 25px;
}

#packagesTerminal {
  height: 250px;
}

#packagesAdd {
  float: right;
}

#packagesSearchContainer {
  overflow: hidden;
  padding-right: 15px;
}

#packagesSearch {
  width: 100%;
}

.autocomplete-items {
  position: absolute;
  z-index: 50;
  border: 1px solid #d4d4d4;
  border-bottom: none;
  border-radius: 4px;
  overflow: hidden;
}

.autocomplete-items div {
  background-color: white;
  cursor: pointer;
  padding: 5px 11px;
  border-bottom: 1px solid #d4d4d4;
}

.autocomplete-items div:hover {
  background-color: #e9e9e9;
}

.autocomplete-active {
  background-color: DodgerBlue !important;
  color: white;
}