html,
body {
  margin: auto;
  padding: 0;
  width: 100%;
  height: 100%;
}

body iframe {
  width: 100%;
  height: 100%;
}
/*
body.fullscreen iframe {
  width: 100vw;
  height: 100vh;
}
*/
body.right-panel iframe:first-of-type {
  position: absolute;
  top: 0;
  left: 0;
  width: 80vw;
  height: 100vh;
}

body.right-panel iframe:nth-of-type(2) {
  position: absolute;
  top: 0;
  left: 80vw;
  width: 20vw;
  height: 100vh;
}

#error {
  position: absolute;
  top: 0;
  left: 0;
  width: 100vw;
  background: #000;
  color: #fff;
  padding: 20px;
}

#error span {
  font-weight: 700;
  color: #f00;
}

.rot0,
.fullscreen {
  width: 100vw;
  height: 100vh;
}

.rot90 {
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  transform: rotate(90deg);
  width: 100vh;
  height: 100vw;
}

.rot180 {
  transform: rotate(180deg);
  width: 100vw;
  height: 100vh;
}

.rot270 {
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  transform: rotate(-90deg);
  width: 100vh;
  height: 100vw;
}

#toast.full-width {
  width: calc(100% - 20px);
  left: 10px;
  bottom: 15px;
  right: 10px;
}

#toast.full-width .title {
  font-size: 7.5vh;
}