body {
  overflow: hidden;
  background-color: black;
}

h3 {
  color: #00ff00;
  font-family: monospace;
  margin: 0;
}

.container {
  width: 100vw;
  height: 100vh;
}

.logger {
  font-family: monospace;
  position: absolute;
  color: #00ff00;
  right: 10px;
  top: 10px;
  font-size: 13px;
}

.drop-area {
  width: 100vw;
  height: 100vh;
  background-color: gray;
  background-color: #444444;
  /* border: 1px solid antiquewhite; */
}

.drop-area-over {
  width: 100vw;
  height: 100vh;
  /* background-color: greenyellow; */
  background-color: gray;
}

.image-container {
  position: absolute;
  /* background-color: red; */
  /* min-width: 50px; */
  /* min-height: 50px; */
  /* opacity: 0.4; */
}

.image {
  max-width: 300px;
  height: auto;
  /* max-width: 100%;
  max-height: 100%; */
  /* opacity: 0.7; */
  /* width: 100%;
  height: 100%; */
}

.handle {
  position: absolute;
  width: 10px;
  height: 10px;
  background-color: #00ff00;
  /* opacity: 0.8; */
  border: solid 1px white;
}

.handle:hover {
  cursor: pointer;
}

header {
  width: 100%;
  height: 100%;
}