@import "{design}/app"

.viewerMain
  width: 100%
  height: 100%

  #layoutManagerTarget
    width: 100%
    height: 100%
    transition(all 0.3s ease)

    #imageViewerViewports
      padding-right: 0 !important // Top remove odd borders from non-existant right Sidebar
      
      .viewportContainer
        theme('border', '%s solid $uiBorderColorDark' % $viewportBorderThickness)
        float: left

        outline: 0 // Prevent blue outline in Chrome

        &:hover
        &.active
        &: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)

        .removable
          width: 100%
          height: 100%
          position: relative // Necessary so that the viewportOverlay is on top of the viewports