* {
  box-sizing: border-box;
}
html, body, #viewer-app {
  height: 100%;
  margin: 0;
  padding: 0;
  .with-slideout-content {
    right: 0;
    left: 410px;
    position: fixed;
  }
}
.prefers-minimal-interface {
  height: 100%;
  margin: 0;
  padding: 0;
  overflow-y: auto;

  navigation-panel,
  a2j-viewer-navigation {
    display: none;
  }
  .modal-button {
    display: block;
  }
  audio {
    display: inline-block;
  }
}
.prefers-minimal-interface.with-slideout-content + debug-menu .debugmenu {
  left: 410px;
}
.slideout-content {
  position: fixed;
  width: 400px;
}
.desktop-container {
  display: table;
  width: 100%;
  height: 100%;
}
.app-content {
  display:table-row;
}
.guide-wrapper, .client-wrapper {
  width: 50%;
  float: left;
  position: relative;
}
.guide-wrapper {
  padding-right: @grid-gutter-width;

  &.guide-center {
    float: right;
    right: 35%;
  }
}
.client-wrapper {
  padding-left: @grid-gutter-width;
}

body.with-lawn {
  background: @lawn-color;
}

.desktop {
  // this prevents extraneous scroll bars, specifically in ie11 and Edge
  overflow: hidden;
  #viewer-app {
    background: @lawn-color;
  }
}

.ui-widget-content {
  #viewer-app {
    background: @lawn-color;
  }
}