@media screen and (orientation: portrait) {
  #wrapper,
  #dreamcatcher,
  #theframe,
  #splash,
  #spinner {
    width: 100vw;
    height: 56.470588235vw;
  }
  .container-fluid {
    width: 100vw;
  }
}
@media screen and (orientation: landscape) {
  #wrapper,
  #dreamcatcher,
  #theframe,
  #splash,
  #spinner {
    width: 70vw;
    height: 39.5294117645vw;
  }
  #wrapper {
    margin-top: 15px;
    margin-left: 15px;
  }
  .container-fluid {
    width: 70vw;
  }
}
#nagger,
#nagger-screener,
#skeleton-loader {
  width: 100vw;
  height: 100vh;
}
#chatwrap {
  position: relative;
  width: 100%;
  margin-bottom: 10px;
}
#chatframe {
  z-index: -1;
  width: 100%;
  border-radius: 4px;
  background-color: white;
  height: 200px;
  overflow-y: auto;
  margin-bottom: 4px;
  padding-left: 8px;
}