body {
  text-align: center;
}

.dark {
  color: rgb(100, 200, 255);
  background-color: rgb(30, 30, 30);
}

button {
  color: rgb(100, 200, 255);
  background-color: rgba(60, 60, 60);
  border-color: rgb(100, 200, 255);
  border-width: 4px;
  border-radius: 15px;
  margin: 5px;
  padding: 10px;
}

button:disabled,
button[disabled],
button[disabled="disabled"] {
  border-color: rgb(30, 60, 75);
}

fieldset {
  border-radius: 15px;
  margin: 10px;
}

.toggleBlock {
  border-style: solid;
  border-width: 1px;
  border-color: rgb(100, 200, 255);
  border-radius: 4px 4px 0 0;
  padding: 3px;
  margin: 4px;
}

.toggleShow,
.toggleHide {
  cursor: pointer;
  font-weight: bold;
  align-content: flex-end;
  text-align: left;
}

.toggleShow {
}

.toggleShow::before {
  content: "▼ ";
}

.toggleShow + div {
  display: block;
}

.toggleHide {
}

.toggleHide::before {
  content: "▶ ";
}

.toggleHide + div {
  display: none;
}

#preview {
  border-style: solid;
  border-width: 1px;
  border-radius: 10px;
  width: 256px;
  height: 512px;
  background-color: #333333;
  position: relative;
}

.previewImage {
  border-radius: 10px;
}

.stlViewer {
  width: 256px;
  height: 512px;
}

.loadingImage {
  height: 512px;
}

.btn3d {
  position: absolute;
  top: 20px;
  left: 180px;
  z-index: 10;
}

.btn3d button {
  border-style: none;
  background-color: rgba(0, 0, 0, 0);
}

.btn3d img {
  width: 32px;
  height: 32px;
  position: relative;
}

.save {
  width: 20px;
  height: 20px;
}