/*.styled-background {
  background-color: #f00;
}*/

html, body {
  background: #000;
  margin: 0px;
  padding: 0px;
  width: 100%;
  height: 100%;
  color: #fff;
}

.camera-inputs{
  color: black;
  background: white;
}
textarea {
    background: #000;
}

canvas {
  /* background-color: #000; */
}

#hydra-ui {
  position: fixed;
  top: 0px;
  left: 0px;
  width: 100%;
  height: 100%;
}

#code {
    z-index: 5;
}

#hydra-canvas {
  position: absolute;
  top: 0px;
  left: 0px;
  z-index: -2;
}

#audio-canvas {
  position: absolute;
  bottom: 0px;
  right: 0px;
  background-color: transparent;
}

.CodeMirror {
  position: absolute;
  top: 20px;
  left: 20px;
  z-index: 5;
  width: calc(100% - 20px);
  height: calc(100% - 20px);
  background: transparent;
}

.console {
  bottom: 0px;
  position: absolute;
  padding: 20px;
  padding-bottom: 5px;
  width: calc(100% - 40px);
  z-index: 6;
  left: 0px;
  font-family: monospace;
  font-size: 14px;
  color: #aaa;
}

.log-error {
  color: #f00;
}