#viewer {
  height: "calc(100% - %s)" % var(--top-bar-height);
}

#viewer > .loadingTextDiv {
  color: var(--text-secondary-color);
  font-size: 30px;
  height: 100%;
  line-height: "calc(100% - %s)" % var(--top-bar-height);
}

.ViewerMain {
  width: 100%;
  height: 100%;
  transition: all 0.3s ease;
}

.ViewerMain>div {
  width: 100%;
  height: 100%;
}

.ViewerMain #imageViewerViewports .viewportContainer {
  /*theme('border', '%s solid $uiBorderColorDark' % $viewportBorderThickness)*/
  /*float: left;
  position: relative;*/
  outline: 0; /* Prevent blue outline in Chrome */
}

.ViewerMain #imageViewerViewports .viewportContainer:hover,
.ViewerMain #imageViewerViewports .viewportContainer:active,
.ViewerMain #imageViewerViewports .viewportContainer:hover.active {
  outline: 0; /* Prevent blue outline in Chrome */
}

/*    &:hover
      //theme('border', '%s solid $uiBorderColor' % $viewportBorderThickness)

    &.active, &:hover.active
      //theme('border', '%s solid $uiBorderColorActive' % $viewportBorderThickness)
*/