/* HEY LOOK HERE - NOTE - if you're adding a custom variable, make sure '!default' in not at the end, otherwise,
 Bootstrap will enforce the factory default color */
.hlc-color-error {
  color: #f44123;
}

.hlc-form-element-error {
  font-weight: normal;
  color: #f44123;
}

.hlc-form-element-help {
  color: #999ba2;
  font-weight: normal;
}
.alert.hl-alert {
  background-color: #efefef;
  color: #444855;
  border: 0;
  border-radius: 0;
  -webkit-box-shadow: none;
          box-shadow: none;
  position: relative;
}

.hl-alert.hl-alert-danger, .hl-alert.hl-alert-warning, .hl-alert.hl-alert-info, .hl-alert.hl-alert-success {
  border-left-width: 40px;
  border-left-style: solid;
}

.hl-alert.hl-alert-success {
  border-left-color: #67cc9d;
}
.hl-alert.hl-alert-info {
  border-left-color: #5ca2ec;
}
.hl-alert.hl-alert-warning {
  border-left-color: #f58026;
}
.hl-alert.hl-alert-danger {
  border-left-color: #f44123;
}

.hl-alert-icon {
  font-size: 18px;
  color: #fff;
  position: absolute;
  left: -40px;
  width: 40px;
  text-align: center;
  top: 50%;
  -webkit-transform: translate(0, -50%);
      -ms-transform: translate(0, -50%);
          transform: translate(0, -50%);
}
.custom-scrollbars > * {
  scroll-behavior: smooth;
}
.global-toast-notifications .notification-container {
  width: 100vw;
  -ms-flex-pack: center;
      justify-content: center;
  z-index: 10002;
}
.global-toast-notifications .notification-container .notification {
  width: unset;
  max-width: 600px;
}
.global-toast-notifications .notification-container .notification .type-icon,
.global-toast-notifications .notification-container .notification .close-icon {
  -ms-flex-positive: 0;
      flex-grow: 0;
  -ms-flex-negative: 0;
      flex-shrink: 0;
  -ms-flex-preferred-size: auto;
      flex-basis: auto;
}
.global-toast-notifications .notification-container .notification .notification-message {
  -ms-flex-positive: 1;
      flex-grow: 1;
  -ms-flex-negative: 1;
      flex-shrink: 1;
  -ms-flex-preferred-size: auto;
      flex-basis: auto;
}
.notification-container {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  padding: 20px;
  position: fixed;
  z-index: 10000;
}
.notification-container .notification {
  word-break: break-word;
  width: 300px;
  text-align: left;
  -webkit-box-shadow: 0px 2px 6px #999ba2;
          box-shadow: 0px 2px 6px #999ba2;
  background-color: #444855;
  color: white;
  display: -ms-flexbox;
  display: flex;
  position: relative;
}
.notification-container .notification .type-icon {
  text-align: center;
}
.notification-container .notification .type-icon.success {
  background-color: #67cc9d;
}
.notification-container .notification .type-icon.info {
  background-color: #5ca2ec;
}
.notification-container .notification .type-icon.inprogress {
  background-color: #f58026;
  border-radius: none;
}
.notification-container .notification .type-icon.error {
  background-color: #f44123;
}
.notification-container .notification .close-icon {
  -ms-flex-item-align: start;
      align-self: flex-start;
  cursor: pointer;
}
.notification-container .notification .close-icon,
.notification-container .notification .type-icon {
  -ms-flex: 1 1;
      flex: 1 1;
  padding: 12px 8px;
}
.notification-container .notification .notification-message {
  -ms-flex: 10 1;
      flex: 10 1;
  padding: 10px 8px 12px;
  font-size: 12pt;
}
.notification-container .notification a {
  color: #8abcf1;
}
.notification-container .notification-left {
  float: left;
}
.notification-container .notification-right {
  float: right;
}

.spinner-container {
  text-align: center;
}
.spinner-container .spinner {
  border-radius: 50%;
}
.spinner-container .spinner {
  color: #fff;
  font-size: 2px;
  width: 20px;
  height: 20px;
  -webkit-box-shadow: inset 0 0 0 2em;
          box-shadow: inset 0 0 0 2em;
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0);
}
.spinner-container .spinner:before,
.spinner-container .spinner:after {
  position: absolute;
  content: "";
}
.spinner-container .spinner:before {
  width: 12px;
  height: 22px;
  background: #f58026;
  border-radius: 10em 0 0 10em;
  left: -2px;
  -webkit-transform-origin: center right;
      -ms-transform-origin: center right;
          transform-origin: center right;
  -webkit-animation: indeterminate-spin 2s infinite ease 1.5s;
          animation: indeterminate-spin 2s infinite ease 1.5s;
}
.spinner-container .spinner:after {
  width: 12px;
  height: 22px;
  background: #f58026;
  border-radius: 0 10em 10em 0;
  -webkit-transform-origin: center left;
      -ms-transform-origin: center left;
          transform-origin: center left;
  -webkit-animation: indeterminate-spin 2s infinite ease;
          animation: indeterminate-spin 2s infinite ease;
}
@-webkit-keyframes indeterminate-spin {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
@keyframes indeterminate-spin {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
/* HEY LOOK HERE - NOTE - if you're adding a custom variable, make sure '!default' in not at the end, otherwise,
 Bootstrap will enforce the factory default color */
@-webkit-keyframes library-folder-item-slide-in {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@keyframes library-folder-item-slide-in {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
.library-folders-tree .rst__rowWrapper {
  padding: 4px;
  padding-left: 0;
  -webkit-animation: library-folder-item-slide-in 333.3333333333ms ease-in-out;
          animation: library-folder-item-slide-in 333.3333333333ms ease-in-out;
}
.library-folders-tree .rst__lineChildren {
  z-index: 0;
}
.library-folders-tree .rst__lineChildren::after {
  height: 4px;
}
.library-folders-tree .rst__row {
  height: 32px;
}
.library-folders-tree.just-main-folder .rst__lineBlock {
  display: none;
}
.library-folders-tree .folder-item.container-btn {
  min-width: 250px;
  background-color: #fff;
}
.library-folders-tree .folder-item.container-btn .folder-item-name:hover {
  text-decoration: underline;
}
.library-folders-tree .folder-item.container-btn.container-btn .container-btn-button:focus + .container-btn-content {
  text-decoration: underline;
  outline: 1px solid;
}
.library-folders-tree .folder-item.container-btn .folder-item-inner {
  border: 1px solid #dededf;
}
.library-folders-tree .folder-item.container-btn .folder-item-drag {
  border-right: 1px solid #dededf;
  cursor: move;
  z-index: 1;
}
.library-folders-tree .folder-item.container-btn .folder-item-drag,
.library-folders-tree .folder-item.container-btn .folder-item-name,
.library-folders-tree .folder-item.container-btn .folder-item-ellipsis {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
      align-items: center;
  padding: 0 8px;
}
/**
 * Extra class applied to VirtualScroll through className prop
 */
.rst__virtualScrollOverride {
  overflow: auto !important;
}
.rst__virtualScrollOverride * {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}

.ReactVirtualized__Grid__innerScrollContainer {
  overflow: visible !important;
}

.rst__rtl .ReactVirtualized__Grid__innerScrollContainer {
  direction: rtl;
}

.ReactVirtualized__Grid {
  outline: none;
}

.rst__node {
  min-width: 100%;
  white-space: nowrap;
  position: relative;
  text-align: left;
}

.rst__node.rst__rtl {
  text-align: right;
}

.rst__nodeContent {
  position: absolute;
  top: 0;
  bottom: 0;
}

/* ==========================================================================
   Scaffold

    Line-overlaid blocks used for showing the tree structure
   ========================================================================== */
.rst__lineBlock,
.rst__absoluteLineBlock {
  height: 100%;
  position: relative;
  display: inline-block;
}

.rst__absoluteLineBlock {
  position: absolute;
  top: 0;
}

.rst__lineHalfHorizontalRight::before,
.rst__lineFullVertical::after,
.rst__lineHalfVerticalTop::after,
.rst__lineHalfVerticalBottom::after {
  position: absolute;
  content: '';
  background-color: black;
}

/**
 * +-----+
 * |     |
 * |  +--+
 * |     |
 * +-----+
 */
.rst__lineHalfHorizontalRight::before {
  height: 1px;
  top: 50%;
  right: 0;
  width: 50%;
}

.rst__rtl.rst__lineHalfHorizontalRight::before {
  left: 0;
  right: initial;
}

/**
 * +--+--+
 * |  |  |
 * |  |  |
 * |  |  |
 * +--+--+
 */
.rst__lineFullVertical::after,
.rst__lineHalfVerticalTop::after,
.rst__lineHalfVerticalBottom::after {
  width: 1px;
  left: 50%;
  top: 0;
  height: 100%;
}

/**
 * +--+--+
 * |  |  |
 * |  |  |
 * |  |  |
 * +--+--+
 */
.rst__rtl.rst__lineFullVertical::after,
.rst__rtl.rst__lineHalfVerticalTop::after,
.rst__rtl.rst__lineHalfVerticalBottom::after {
  right: 50%;
  left: initial;
}

/**
 * +-----+
 * |  |  |
 * |  +  |
 * |     |
 * +-----+
 */
.rst__lineHalfVerticalTop::after {
  height: 50%;
}

/**
 * +-----+
 * |     |
 * |  +  |
 * |  |  |
 * +-----+
 */
.rst__lineHalfVerticalBottom::after {
  top: auto;
  bottom: 0;
  height: 50%;
}

/* Highlight line for pointing to dragged row destination
   ========================================================================== */
/**
 * +--+--+
 * |  |  |
 * |  |  |
 * |  |  |
 * +--+--+
 */
.rst__highlightLineVertical {
  z-index: 3;
}
.rst__highlightLineVertical::before {
  position: absolute;
  content: '';
  background-color: #36c2f6;
  width: 8px;
  margin-left: -4px;
  left: 50%;
  top: 0;
  height: 100%;
}

.rst__rtl.rst__highlightLineVertical::before {
  margin-left: initial;
  margin-right: -4px;
  left: initial;
  right: 50%;
}

@-webkit-keyframes arrow-pulse {
  0% {
    -webkit-transform: translate(0, 0);
            transform: translate(0, 0);
    opacity: 0;
  }
  30% {
    -webkit-transform: translate(0, 300%);
            transform: translate(0, 300%);
    opacity: 1;
  }
  70% {
    -webkit-transform: translate(0, 700%);
            transform: translate(0, 700%);
    opacity: 1;
  }
  100% {
    -webkit-transform: translate(0, 1000%);
            transform: translate(0, 1000%);
    opacity: 0;
  }
}

@keyframes arrow-pulse {
  0% {
    -webkit-transform: translate(0, 0);
            transform: translate(0, 0);
    opacity: 0;
  }
  30% {
    -webkit-transform: translate(0, 300%);
            transform: translate(0, 300%);
    opacity: 1;
  }
  70% {
    -webkit-transform: translate(0, 700%);
            transform: translate(0, 700%);
    opacity: 1;
  }
  100% {
    -webkit-transform: translate(0, 1000%);
            transform: translate(0, 1000%);
    opacity: 0;
  }
}
.rst__highlightLineVertical::after {
  content: '';
  position: absolute;
  height: 0;
  margin-left: -4px;
  left: 50%;
  top: 0;
  border-left: 4px solid transparent;
  border-right: 4px solid transparent;
  border-top: 4px solid white;
  -webkit-animation: arrow-pulse 1s infinite linear both;
          animation: arrow-pulse 1s infinite linear both;
}

.rst__rtl.rst__highlightLineVertical::after {
  margin-left: initial;
  margin-right: -4px;
  right: 50%;
  left: initial;
}

/**
 * +-----+
 * |     |
 * |  +--+
 * |  |  |
 * +--+--+
 */
.rst__highlightTopLeftCorner::before {
  z-index: 3;
  content: '';
  position: absolute;
  border-top: solid 8px #36c2f6;
  border-left: solid 8px #36c2f6;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  height: calc(50% + 4px);
  top: 50%;
  margin-top: -4px;
  right: 0;
  width: calc(50% + 4px);
}

.rst__rtl.rst__highlightTopLeftCorner::before {
  border-right: solid 8px #36c2f6;
  border-left: none;
  left: 0;
  right: initial;
}

/**
 * +--+--+
 * |  |  |
 * |  |  |
 * |  +->|
 * +-----+
 */
.rst__highlightBottomLeftCorner {
  z-index: 3;
}
.rst__highlightBottomLeftCorner::before {
  content: '';
  position: absolute;
  border-bottom: solid 8px #36c2f6;
  border-left: solid 8px #36c2f6;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  height: calc(100% + 4px);
  top: 0;
  right: 12px;
  width: calc(50% - 8px);
}

.rst__rtl.rst__highlightBottomLeftCorner::before {
  border-right: solid 8px #36c2f6;
  border-left: none;
  left: 12px;
  right: initial;
}

.rst__highlightBottomLeftCorner::after {
  content: '';
  position: absolute;
  height: 0;
  right: 0;
  top: 100%;
  margin-top: -12px;
  border-top: 12px solid transparent;
  border-bottom: 12px solid transparent;
  border-left: 12px solid #36c2f6;
}

.rst__rtl.rst__highlightBottomLeftCorner::after {
  left: 0;
  right: initial;
  border-right: 12px solid #36c2f6;
  border-left: none;
}

.rst__rowWrapper {
  padding: 10px 10px 10px 0;
  height: 100%;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}

.rst__rtl.rst__rowWrapper {
  padding: 10px 0 10px 10px;
}

.rst__row {
  height: 100%;
  white-space: nowrap;
  display: -ms-flexbox;
  display: flex;
}
.rst__row > * {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}

/**
 * The outline of where the element will go if dropped, displayed while dragging
 */
.rst__rowLandingPad,
.rst__rowCancelPad {
  border: none !important;
  -webkit-box-shadow: none !important;
          box-shadow: none !important;
  outline: none !important;
}
.rst__rowLandingPad > *,
.rst__rowCancelPad > * {
  opacity: 0 !important;
}
.rst__rowLandingPad::before,
.rst__rowCancelPad::before {
  background-color: lightblue;
  border: 3px dashed white;
  content: '';
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: -1;
}

/**
 * Alternate appearance of the landing pad when the dragged location is invalid
 */
.rst__rowCancelPad::before {
  background-color: #e6a8ad;
}

/**
 * Nodes matching the search conditions are highlighted
 */
.rst__rowSearchMatch {
  outline: solid 3px #0080ff;
}

/**
 * The node that matches the search conditions and is currently focused
 */
.rst__rowSearchFocus {
  outline: solid 3px #fc6421;
}

.rst__rowContents,
.rst__rowLabel,
.rst__rowToolbar,
.rst__moveHandle,
.rst__toolbarButton {
  display: inline-block;
  vertical-align: middle;
}

.rst__rowContents {
  position: relative;
  height: 100%;
  border: solid #bbb 1px;
  border-left: none;
  -webkit-box-shadow: 0 2px 2px -2px;
          box-shadow: 0 2px 2px -2px;
  padding: 0 5px 0 10px;
  border-radius: 2px;
  min-width: 230px;
  -ms-flex: 1 0 auto;
      flex: 1 0 auto;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
      align-items: center;
  -ms-flex-pack: justify;
      justify-content: space-between;
  background-color: white;
}

.rst__rtl.rst__rowContents {
  border-right: none;
  border-left: solid #bbb 1px;
  padding: 0 10px 0 5px;
}

.rst__rowContentsDragDisabled {
  border-left: solid #bbb 1px;
}

.rst__rtl.rst__rowContentsDragDisabled {
  border-right: solid #bbb 1px;
  border-left: solid #bbb 1px;
}

.rst__rowLabel {
  -ms-flex: 0 1 auto;
      flex: 0 1 auto;
  padding-right: 20px;
}
.rst__rtl.rst__rowLabel {
  padding-left: 20px;
  padding-right: inherit;
}

.rst__rowToolbar {
  -ms-flex: 0 1 auto;
      flex: 0 1 auto;
  display: -ms-flexbox;
  display: flex;
}

.rst__moveHandle,
.rst__loadingHandle {
  height: 100%;
  width: 44px;
  background: #d9d9d9
    url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI0MiIgaGVpZ2h0PSI0MiI+PGcgc3Ryb2tlPSIjRkZGIiBzdHJva2Utd2lkdGg9IjIuOSIgPjxwYXRoIGQ9Ik0xNCAxNS43aDE0LjQiLz48cGF0aCBkPSJNMTQgMjEuNGgxNC40Ii8+PHBhdGggZD0iTTE0IDI3LjFoMTQuNCIvPjwvZz4KPC9zdmc+')
    no-repeat center;
  border: solid #aaa 1px;
  -webkit-box-shadow: 0 2px 2px -2px;
          box-shadow: 0 2px 2px -2px;
  cursor: move;
  border-radius: 1px;
  z-index: 1;
}

.rst__loadingHandle {
  cursor: default;
  background: #d9d9d9;
}

@-webkit-keyframes pointFade {
  0%,
  19.999%,
  100% {
    opacity: 0;
  }
  20% {
    opacity: 1;
  }
}

@keyframes pointFade {
  0%,
  19.999%,
  100% {
    opacity: 0;
  }
  20% {
    opacity: 1;
  }
}

.rst__loadingCircle {
  width: 80%;
  height: 80%;
  margin: 10%;
  position: relative;
}

.rst__loadingCirclePoint {
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
}

.rst__rtl.rst__loadingCirclePoint {
  right: 0;
  left: initial;
}

.rst__loadingCirclePoint::before {
  content: '';
  display: block;
  margin: 0 auto;
  width: 11%;
  height: 30%;
  background-color: #fff;
  border-radius: 30%;
  -webkit-animation: pointFade 800ms infinite ease-in-out both;
          animation: pointFade 800ms infinite ease-in-out both;
}
.rst__loadingCirclePoint:nth-of-type(1) {
  -webkit-transform: rotate(0deg);
      -ms-transform: rotate(0deg);
          transform: rotate(0deg);
}
.rst__loadingCirclePoint:nth-of-type(7) {
  -webkit-transform: rotate(180deg);
      -ms-transform: rotate(180deg);
          transform: rotate(180deg);
}
.rst__loadingCirclePoint:nth-of-type(1)::before,
.rst__loadingCirclePoint:nth-of-type(7)::before {
  -webkit-animation-delay: -800ms;
          animation-delay: -800ms;
}
.rst__loadingCirclePoint:nth-of-type(2) {
  -webkit-transform: rotate(30deg);
      -ms-transform: rotate(30deg);
          transform: rotate(30deg);
}
.rst__loadingCirclePoint:nth-of-type(8) {
  -webkit-transform: rotate(210deg);
      -ms-transform: rotate(210deg);
          transform: rotate(210deg);
}
.rst__loadingCirclePoint:nth-of-type(2)::before,
.rst__loadingCirclePoint:nth-of-type(8)::before {
  -webkit-animation-delay: -666ms;
          animation-delay: -666ms;
}
.rst__loadingCirclePoint:nth-of-type(3) {
  -webkit-transform: rotate(60deg);
      -ms-transform: rotate(60deg);
          transform: rotate(60deg);
}
.rst__loadingCirclePoint:nth-of-type(9) {
  -webkit-transform: rotate(240deg);
      -ms-transform: rotate(240deg);
          transform: rotate(240deg);
}
.rst__loadingCirclePoint:nth-of-type(3)::before,
.rst__loadingCirclePoint:nth-of-type(9)::before {
  -webkit-animation-delay: -533ms;
          animation-delay: -533ms;
}
.rst__loadingCirclePoint:nth-of-type(4) {
  -webkit-transform: rotate(90deg);
      -ms-transform: rotate(90deg);
          transform: rotate(90deg);
}
.rst__loadingCirclePoint:nth-of-type(10) {
  -webkit-transform: rotate(270deg);
      -ms-transform: rotate(270deg);
          transform: rotate(270deg);
}
.rst__loadingCirclePoint:nth-of-type(4)::before,
.rst__loadingCirclePoint:nth-of-type(10)::before {
  -webkit-animation-delay: -400ms;
          animation-delay: -400ms;
}
.rst__loadingCirclePoint:nth-of-type(5) {
  -webkit-transform: rotate(120deg);
      -ms-transform: rotate(120deg);
          transform: rotate(120deg);
}
.rst__loadingCirclePoint:nth-of-type(11) {
  -webkit-transform: rotate(300deg);
      -ms-transform: rotate(300deg);
          transform: rotate(300deg);
}
.rst__loadingCirclePoint:nth-of-type(5)::before,
.rst__loadingCirclePoint:nth-of-type(11)::before {
  -webkit-animation-delay: -266ms;
          animation-delay: -266ms;
}
.rst__loadingCirclePoint:nth-of-type(6) {
  -webkit-transform: rotate(150deg);
      -ms-transform: rotate(150deg);
          transform: rotate(150deg);
}
.rst__loadingCirclePoint:nth-of-type(12) {
  -webkit-transform: rotate(330deg);
      -ms-transform: rotate(330deg);
          transform: rotate(330deg);
}
.rst__loadingCirclePoint:nth-of-type(6)::before,
.rst__loadingCirclePoint:nth-of-type(12)::before {
  -webkit-animation-delay: -133ms;
          animation-delay: -133ms;
}
.rst__loadingCirclePoint:nth-of-type(7) {
  -webkit-transform: rotate(180deg);
      -ms-transform: rotate(180deg);
          transform: rotate(180deg);
}
.rst__loadingCirclePoint:nth-of-type(13) {
  -webkit-transform: rotate(360deg);
      -ms-transform: rotate(360deg);
          transform: rotate(360deg);
}
.rst__loadingCirclePoint:nth-of-type(7)::before,
.rst__loadingCirclePoint:nth-of-type(13)::before {
  -webkit-animation-delay: 0ms;
          animation-delay: 0ms;
}

.rst__rowTitle {
  font-weight: bold;
}

.rst__rowTitleWithSubtitle {
  font-size: 85%;
  display: block;
  height: 0.8rem;
}

.rst__rowSubtitle {
  font-size: 70%;
  line-height: 1;
}

.rst__collapseButton,
.rst__expandButton {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  border: none;
  position: absolute;
  border-radius: 100%;
  -webkit-box-shadow: 0 0 0 1px #000;
          box-shadow: 0 0 0 1px #000;
  width: 16px;
  height: 16px;
  padding: 0;
  top: 50%;
  -webkit-transform: translate(-50%, -50%);
      -ms-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  cursor: pointer;
}
.rst__rtl.rst__collapseButton,
.rst__rtl.rst__expandButton {
  -webkit-transform: translate(50%, -50%);
      -ms-transform: translate(50%, -50%);
          transform: translate(50%, -50%);
}
.rst__collapseButton:focus,
.rst__expandButton:focus {
  outline: none;
  -webkit-box-shadow: 0 0 0 1px #000, 0 0 1px 3px #83bef9;
          box-shadow: 0 0 0 1px #000, 0 0 1px 3px #83bef9;
}
.rst__collapseButton:hover:not(:active),
.rst__expandButton:hover:not(:active) {
  background-size: 24px;
  height: 20px;
  width: 20px;
}

.rst__collapseButton {
  background: #fff
    url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxOCIgaGVpZ2h0PSIxOCI+PGNpcmNsZSBjeD0iOSIgY3k9IjkiIHI9IjgiIGZpbGw9IiNGRkYiLz48ZyBzdHJva2U9IiM5ODk4OTgiIHN0cm9rZS13aWR0aD0iMS45IiA+PHBhdGggZD0iTTQuNSA5aDkiLz48L2c+Cjwvc3ZnPg==')
    no-repeat center;
}

.rst__expandButton {
  background: #fff
    url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxOCIgaGVpZ2h0PSIxOCI+PGNpcmNsZSBjeD0iOSIgY3k9IjkiIHI9IjgiIGZpbGw9IiNGRkYiLz48ZyBzdHJva2U9IiM5ODk4OTgiIHN0cm9rZS13aWR0aD0iMS45IiA+PHBhdGggZD0iTTQuNSA5aDkiLz48cGF0aCBkPSJNOSA0LjV2OSIvPjwvZz4KPC9zdmc+')
    no-repeat center;
}

/**
 * Line for under a node with children
 */
.rst__lineChildren {
  height: 100%;
  display: inline-block;
  position: absolute;
}
.rst__lineChildren::after {
  content: '';
  position: absolute;
  background-color: black;
  width: 1px;
  left: 50%;
  bottom: 0;
  height: 10px;
}

.rst__rtl.rst__lineChildren::after {
  right: 50%;
  left: initial;
}

.rst__placeholder {
  position: relative;
  height: 68px;
  max-width: 300px;
  padding: 10px;
}
.rst__placeholder,
.rst__placeholder > * {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}
.rst__placeholder::before {
  border: 3px dashed #d9d9d9;
  content: '';
  position: absolute;
  top: 5px;
  right: 5px;
  bottom: 5px;
  left: 5px;
  z-index: -1;
}

/**
 * The outline of where the element will go if dropped, displayed while dragging
 */
.rst__placeholderLandingPad,
.rst__placeholderCancelPad {
  border: none !important;
  -webkit-box-shadow: none !important;
          box-shadow: none !important;
  outline: none !important;
}
.rst__placeholderLandingPad *,
.rst__placeholderCancelPad * {
  opacity: 0 !important;
}
.rst__placeholderLandingPad::before,
.rst__placeholderCancelPad::before {
  background-color: lightblue;
  border-color: white;
}

/**
 * Alternate appearance of the landing pad when the dragged location is invalid
 */
.rst__placeholderCancelPad::before {
  background-color: #e6a8ad;
}

/* Collection default theme */

.ReactVirtualized__Collection {
}

.ReactVirtualized__Collection__innerScrollContainer {
}

/* Grid default theme */

.ReactVirtualized__Grid {
}

.ReactVirtualized__Grid__innerScrollContainer {
}

/* Table default theme */

.ReactVirtualized__Table {
}

.ReactVirtualized__Table__Grid {
}

.ReactVirtualized__Table__headerRow {
  font-weight: 700;
  text-transform: uppercase;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: row;
  flex-direction: row;
  -ms-flex-align: center;
      align-items: center;
}
.ReactVirtualized__Table__row {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: row;
  flex-direction: row;
  -ms-flex-align: center;
      align-items: center;
}

.ReactVirtualized__Table__headerTruncatedText {
  display: inline-block;
  max-width: 100%;
  white-space: nowrap;
  -o-text-overflow: ellipsis;
     text-overflow: ellipsis;
  overflow: hidden;
}

.ReactVirtualized__Table__headerColumn,
.ReactVirtualized__Table__rowColumn {
  margin-right: 10px;
  min-width: 0px;
}
.ReactVirtualized__Table__rowColumn {
  -o-text-overflow: ellipsis;
     text-overflow: ellipsis;
  white-space: nowrap;
}

.ReactVirtualized__Table__headerColumn:first-of-type,
.ReactVirtualized__Table__rowColumn:first-of-type {
  margin-left: 10px;
}
.ReactVirtualized__Table__sortableHeaderColumn {
  cursor: pointer;
}

.ReactVirtualized__Table__sortableHeaderIconContainer {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
      align-items: center;
}
.ReactVirtualized__Table__sortableHeaderIcon {
  -ms-flex: 0 0 24px;
      flex: 0 0 24px;
  height: 1em;
  width: 1em;
  fill: currentColor;
}

/* List default theme */

.ReactVirtualized__List {
}

/* HEY LOOK HERE - NOTE - if you're adding a custom variable, make sure '!default' in not at the end, otherwise,
 Bootstrap will enforce the factory default color */
.spaced-row {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
      align-items: center;
  -ms-flex-pack: center;
      justify-content: center;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}
.spaced-row.spaced-row-0 {
  margin: 0;
}
.spaced-row.spaced-row-0 > * {
  margin: 0;
}
.spaced-row.spaced-row-1 {
  margin: -4px;
}
.spaced-row.spaced-row-1 > * {
  margin: 4px;
}
.spaced-row.spaced-row-2 {
  margin: -8px;
}
.spaced-row.spaced-row-2 > * {
  margin: 8px;
}
.spaced-row.spaced-row-3 {
  margin: -16px;
}
.spaced-row.spaced-row-3 > * {
  margin: 16px;
}
.spaced-row.spaced-row-4 {
  margin: -24px;
}
.spaced-row.spaced-row-4 > * {
  margin: 24px;
}
.spaced-row.spaced-row-5 {
  margin: -48px;
}
.spaced-row.spaced-row-5 > * {
  margin: 48px;
}
/* HEY LOOK HERE - NOTE - if you're adding a custom variable, make sure '!default' in not at the end, otherwise,
 Bootstrap will enforce the factory default color */
.library-filterRow--panelHeading {
  font-weight: 600;
}

.bootstrap-4 .library-filter-popover .popover {
  font-size: inherit;
}
/* HEY LOOK HERE - NOTE - if you're adding a custom variable, make sure '!default' in not at the end, otherwise,
 Bootstrap will enforce the factory default color */
/*-----------------------------------------------------------*/
/*----               Pagination Component                ----*/
/*-----------------------------------------------------------*/
.pagination-row {
  background: #fff;
}
.pagination-row .page-spread .page-item.active .page-link {
  pointer-events: none;
}
.pagination-row .page-spread .page-item.disabled .page-link {
  pointer-events: visible;
  cursor: not-allowed;
}
.pagination-row .page-spread * {
  outline: none;
  border: none;
  -webkit-box-shadow: none;
          box-shadow: none;
  border: none;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
}
.pagination-row .page-size {
  position: relative;
}
.pagination-row .page-size select.form-control {
  -webkit-appearance: none;
  -moz-appearance: none;
       appearance: none;
  padding-right: 1.5em;
  border: none;
  -webkit-box-shadow: none;
          box-shadow: none;
}
.pagination-row .page-size select.form-control:active, .pagination-row .page-size select.form-control:focus {
  -webkit-box-shadow: #19528a auto 1px;
          box-shadow: #19528a auto 1px;
  border: #19528a auto 1px;
  outline: #19528a auto 1px;
}
.pagination-row .page-size select,
.pagination-row .page-size option {
  -moz-text-align-last: right;
       text-align-last: right;
}
.pagination-row .page-size .page-size-caret {
  margin-left: -1.6em;
  pointer-events: none;
}
.pagination-row .page-size:after {
  content: "";
  left: 10px;
  bottom: 0.25em;
  height: 3px;
  width: calc(100% - 0.6em);
  border-bottom: 1px dashed #292929;
  position: absolute;
}
.pagination-row .page-go-to input[type=text] {
  width: 5em;
  color: #606065;
}
.pagination-row .page-spread {
  margin-top: 0;
  margin-bottom: 0;
}
.pagination-row .page-spread .page-link:focus {
  z-index: 4;
  -webkit-box-shadow: none;
          box-shadow: none;
}
.pagination-row .page-spread .page-item {
  padding: 0;
  margin: 0;
}
.pagination-row .page-spread .page-item:hover .page-link:not(.directional) span:after {
  content: "";
  height: 1px;
  width: 100%;
  display: block;
  margin: 0 auto;
  border-bottom: 1px solid;
  border-color: #606065;
  margin-bottom: -2px;
}
.pagination-row .page-spread .page-item.disabled .page-link:focus {
  -webkit-box-shadow: none;
          box-shadow: none;
}
.pagination-row .page-spread .page-item.active .page-link {
  border: 1px solid transparent;
}
.pagination-row .icon {
  margin-bottom: -2px;
}
.pagination-row .pagination {
  margin: 0;
}
.pagination-row span[role=button] {
  margin-top: 0.1em;
}
/* HEY LOOK HERE - NOTE - if you're adding a custom variable, make sure '!default' in not at the end, otherwise,
 Bootstrap will enforce the factory default color */
.layout-grid .layout-grid-cell:focus {
  outline: 1px dotted;
}
/* HEY LOOK HERE - NOTE - if you're adding a custom variable, make sure '!default' in not at the end, otherwise,
 Bootstrap will enforce the factory default color */
.bio-bubble-link > :not(a) {
  display: -ms-inline-flexbox;
  display: inline-flex;
}
.bio-bubble-link .popover {
  max-width: 23em;
  max-width: unset;
}
.bio-bubble-link .popover .arrow {
  border-style: none;
}
.bio-bubble-link .bio-bubble-container {
  position: relative;
  min-height: 8em;
  width: 21em;
}
.bio-bubble-link .bio-bubble-container .close-bio-bubble {
  position: absolute;
  top: 4px;
  right: 4px;
  z-index: 1;
}
/* HEY LOOK HERE - NOTE - if you're adding a custom variable, make sure '!default' in not at the end, otherwise,
 Bootstrap will enforce the factory default color */
.library-entry-meta > small {
  display: block;
}
.library-entry-meta .icon {
  margin: none;
}
/* HEY LOOK HERE - NOTE - if you're adding a custom variable, make sure '!default' in not at the end, otherwise,
 Bootstrap will enforce the factory default color */
.library-card .library-entry-counts {
  -ms-flex-pack: justify;
      justify-content: space-between;
  margin-left: 4px;
}
.library-card .library-entry-counts > :not(:last-child) {
  margin-right: 24px;
}

.library-row .library-entry-counts {
  -ms-flex-direction: row-reverse;
      flex-direction: row-reverse;
  -ms-flex-pack: start;
      justify-content: flex-start;
  margin-left: 1em;
}
.library-row .library-entry-counts > :not(:last-child) {
  margin-left: 24px;
}

.library-entry .library-entry-counts .entry-count-text {
  -webkit-transition: font-size 333.3333333333ms linear;
  -o-transition: font-size 333.3333333333ms linear;
  transition: font-size 333.3333333333ms linear;
}
.library-entry.medium .library-entry-counts .entry-count-text {
  font-size: 0;
}
/* HEY LOOK HERE - NOTE - if you're adding a custom variable, make sure '!default' in not at the end, otherwise,
 Bootstrap will enforce the factory default color */
.library-entry-preview-icon {
  height: 2.5em;
  width: 2em;
  bottom: -0.25em;
  right: -0.25em;
}
.library-row :not(.library-entry-preview) > .library-entry-preview-icon {
  margin-right: 1em;
  -webkit-transition: opacity 333.3333333333ms linear, width 333.3333333333ms linear, margin 333.3333333333ms linear;
  -o-transition: opacity 333.3333333333ms linear, width 333.3333333333ms linear, margin 333.3333333333ms linear;
  transition: opacity 333.3333333333ms linear, width 333.3333333333ms linear, margin 333.3333333333ms linear;
}
.library-row.narrow .library-entry-preview-icon {
  margin-right: 0;
  width: 0;
  opacity: 0;
  overflow: hidden;
}
/* HEY LOOK HERE - NOTE - if you're adding a custom variable, make sure '!default' in not at the end, otherwise,
 Bootstrap will enforce the factory default color */
.library-entry-preview {
  position: relative;
  border-radius: 4px;
}
.library-card .library-entry-preview {
  width: 100%;
  height: 8em;
}
.library-card .library-entry-preview .library-entry-preview-icon {
  height: 2.5em;
  width: 2.5em;
  bottom: -0.85em;
  right: 0.65em;
}
.library-row.narrow .library-entry-preview {
  margin-right: 0;
  width: 0;
  opacity: 0;
  overflow: hidden;
}
.library-row .library-entry-preview {
  margin-right: 1em;
  -webkit-transition: opacity 333.3333333333ms linear, width 333.3333333333ms linear, margin 333.3333333333ms linear;
  -o-transition: opacity 333.3333333333ms linear, width 333.3333333333ms linear, margin 333.3333333333ms linear;
  transition: opacity 333.3333333333ms linear, width 333.3333333333ms linear, margin 333.3333333333ms linear;
  height: 7em;
  width: 7em;
}
.library-row .library-entry-preview .library-entry-preview-icon {
  height: 2em;
  width: 2em;
  bottom: -0.25em;
  right: -0.25em;
}
.library-row .library-entry-preview .library-entry-preview-images {
  border-radius: 4px;
}
.library-entry-preview .library-entry-preview-images {
  overflow: hidden;
  height: 100%;
  width: 100%;
}
.library-entry-preview .library-entry-preview-images .extra-counts {
  position: absolute;
  height: 100%;
  width: 100%;
  top: 0;
  right: 0;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
      align-items: center;
  -ms-flex-pack: center;
      justify-content: center;
  font-size: 1em;
  font-weight: 900;
  background: rgba(222, 222, 223, 0.8);
}
.library-entry-preview .library-entry-preview-icon {
  position: absolute;
  background-image: #fff;
}
/* HEY LOOK HERE - NOTE - if you're adding a custom variable, make sure '!default' in not at the end, otherwise,
 Bootstrap will enforce the factory default color */
.library-card.grid-card {
  margin: 0;
  position: relative;
}
.library-card.grid-card .card-body {
  -ms-flex-positive: 1;
      flex-grow: 1;
  padding: 1em;
}
.library-card.grid-card .card-footer {
  color: #606065;
  padding: 0 1em 0.5em;
}
/* HEY LOOK HERE - NOTE - if you're adding a custom variable, make sure '!default' in not at the end, otherwise,
 Bootstrap will enforce the factory default color */
.library-cards-grid .layout-grid-cell {
  border-radius: 8px;
}
.library-cards-grid .layout-grid-cell.selected {
  background-color: #e1eefb;
}
/* HEY LOOK HERE - NOTE - if you're adding a custom variable, make sure '!default' in not at the end, otherwise,
 Bootstrap will enforce the factory default color */
.hl-lightbox {
  background: -o-linear-gradient(63deg, black 0%, black 50%, #292929 100%);
  background: linear-gradient(27deg, black 0%, black 50%, #292929 100%);
}
.hl-lightbox .lightbox-close-section {
  top: 0;
  right: 0;
}
.hl-lightbox .lightbox-controls-section .lighbox-controls-caption {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
      align-items: center;
  -ms-flex-pack: center;
      justify-content: center;
}
@media (min-width: 769px) {
  .hl-lightbox .lightbox-controls-section {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: row-reverse;
        flex-direction: row-reverse;
  }
  .hl-lightbox .lightbox-controls-section .lighbox-controls-caption {
    -ms-flex-negative: 0;
        flex-shrink: 0;
    -ms-flex-direction: column;
        flex-direction: column;
  }
  .hl-lightbox .lightbox-controls-section .lightbox-thumbnails {
    -ms-flex-positive: 1;
        flex-grow: 1;
  }
}
.hl-lightbox .lightbox-thumbnails {
  height: calc(4.5em + 6px);
}
.hl-lightbox .lightbox-thumbnails > .lightbox-thumbnails-track {
  padding-bottom: 0.5em;
}
@media (max-width: 768px) {
  .hl-lightbox .lightbox-thumbnails {
    height: calc(4em + 6px);
  }
  .hl-lightbox .lightbox-thumbnails > .lightbox-thumbnails-track {
    padding-bottom: 0;
  }
}
.hl-lightbox .lightbox-thumbnail {
  height: 4em;
  width: 4em;
  margin: 3px;
}
@media (max-width: 768px) {
  .hl-lightbox .lightbox-thumbnail {
    height: 4em;
    width: 4em;
  }
}
.hl-lightbox .lightbox-thumbnail .lightbox-thumbnail-btn.selected:not(:focus) {
  outline: 3px solid #5796ea;
}
.hl-lightbox .lightbox-thumbnail .lightbox-thumbnail-btn.selected:focus {
  outline: 3px solid #acc7ec;
}
.hl-lightbox .lightbox-thumbnail > button.custom-btn,
.hl-lightbox .lightbox-thumbnail .thumbnail-box {
  height: 100%;
  width: 100%;
}
.hl-lightbox .ghost-thumb {
  width: 4.5em;
  height: 4em;
  max-height: 100%;
  max-width: 100%;
}
.hl-lightbox .lightbox-slide {
  padding: 4px;
}
.hl-lightbox .lightbox-slide .thumbnail-box {
  width: 4.5em;
  height: 4em;
}
.hl-lightbox .lightbox-slide:focus {
  outline: 2px solid #acc7ec;
  outline-offset: -2px;
}
.hl-lightbox .lightbox-arrow.left,
.hl-lightbox .lightbox-arrow.right {
  height: calc(100% - 3em);
  padding: 0;
  top: 1.5em;
  z-index: 1;
}
.image-loader .image-container > img {
  max-width: 100%;
  max-height: 100%;
  -o-object-fit: contain;
     object-fit: contain;
}
.hlc-progress {
  height: 5px;
  width: 100%;
  background: -webkit-gradient(linear, left top, right top, from(#f58026), to(#f58026));
  background: -o-linear-gradient(left, #f58026, #f58026);
  background: linear-gradient(to right, #f58026, #f58026);
  background-color: #fce1c8;
  background-repeat: repeat-y;
}

.indeterminate {
  background-position: -25% 0;
  background-size: 20%;
  -webkit-animation: scroll 1.2s ease-in-out infinite;
          animation: scroll 1.2s ease-in-out infinite;
}

@-webkit-keyframes scroll {
  50% {
    background-size: 80%;
  }
  100% {
    background-position: 125% 0;
  }
}

@keyframes scroll {
  50% {
    background-size: 80%;
  }
  100% {
    background-position: 125% 0;
  }
}
/* HEY LOOK HERE - NOTE - if you're adding a custom variable, make sure '!default' in not at the end, otherwise,
 Bootstrap will enforce the factory default color */
.hl-overlay {
  top: 0;
  left: 0;
}

.overlay-button {
  cursor: pointer;
}
.overlay-button:hover {
  background-color: rgba(255, 255, 255, 0.2);
}

.gradient-overlay {
  top: 0;
  left: 0;
  background: -webkit-gradient(linear, left bottom, left top, from(#ffffff), color-stop(5em, rgba(255, 255, 255, 0.229167)), color-stop(10em, rgba(255, 255, 255, 0)));
  background: -o-linear-gradient(bottom, #ffffff, rgba(255, 255, 255, 0.229167) 5em, rgba(255, 255, 255, 0) 10em);
  background: linear-gradient(to top, #ffffff, rgba(255, 255, 255, 0.229167) 5em, rgba(255, 255, 255, 0) 10em);
}
/* HEY LOOK HERE - NOTE - if you're adding a custom variable, make sure '!default' in not at the end, otherwise,
 Bootstrap will enforce the factory default color */
.entry-preview-sektion {
  padding: 8px;
}
.entry-preview-sektion.list-sektion .library-entry-preview-list-item {
  margin-top: 16px;
  margin-bottom: 16px;
}
@media (max-width: 425px) {
  .entry-preview-sektion.list-sektion {
    padding-left: 0;
    padding-right: 0;
  }
  .entry-preview-sektion.list-sektion .entry-preview-sektion-header {
    padding: 8px;
  }
  .entry-preview-sektion.list-sektion .library-entry-preview-list-item {
    margin-top: 0;
    margin-bottom: 0;
  }
}
.entry-preview-sektion .skeleton-loading-guard {
  min-height: 3.5em;
}
/* HEY LOOK HERE - NOTE - if you're adding a custom variable, make sure '!default' in not at the end, otherwise,
 Bootstrap will enforce the factory default color */
.file-item-copy .size-text {
  background-color: #efefef;
}
@media (max-width: 425px) {
  .file-item-copy > .d-flex {
    -ms-flex-direction: column;
        flex-direction: column;
  }
  .file-item-copy .size-text {
    background-color: #fff;
    padding: 0;
  }
}

@media (max-width: 425px) {
  .library-file-item.file-item .file-item-copy .file-description {
    display: none;
  }
}
/* HEY LOOK HERE - NOTE - if you're adding a custom variable, make sure '!default' in not at the end, otherwise,
 Bootstrap will enforce the factory default color */
.library-file-item {
  height: 4em;
}
.library-file-item a:not(:hover) {
  color: #292929;
}
@media (min-width: 425px) {
  .library-file-item:hover {
    position: relative;
    z-index: 1;
  }
}
@media (min-width: 426px) {
  .library-file-item .thumb-slot {
    margin-right: 8px;
  }
  .library-file-item .copy-slot {
    padding: 8px;
  }
}
/* HEY LOOK HERE - NOTE - if you're adding a custom variable, make sure '!default' in not at the end, otherwise,
 Bootstrap will enforce the factory default color */
.file-item-thumb {
  position: relative;
  width: 6em;
  height: 4em;
  background-color: #dededf;
}
@media (max-width: 425px) {
  .file-item-thumb {
    width: 4em;
    background-color: transparent;
  }
  .file-item-thumb .file-item-thumb-bg.file-item-thumb-bg.file-item-thumb-bg.file-item-thumb-bg.file-item-thumb-bg {
    display: none;
  }
}
.file-item-thumb .file-item-thumb-bg {
  position: absolute;
  top: 0;
  left: 0;
}
.file-item-thumb .file-item-thumb-icon {
  position: relative;
  height: 2.25em;
  width: 2.25em;
}
.file-item-thumb .file-thumb-front-side,
.file-item-thumb .file-thumb-back-side {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
  height: 2.25em;
  width: 2.25em;
}
.file-item-thumb .file-thumb-front-side {
  visibility: visible;
}
.file-item-thumb .file-thumb-back-side {
  visibility: hidden;
}
.library-file-item:hover:not([class*=no-hover]) .file-item-thumb .file-thumb-front-side {
  visibility: hidden;
}
.library-file-item:hover:not([class*=no-hover]) .file-item-thumb .file-thumb-back-side {
  visibility: visible;
}
/* HEY LOOK HERE - NOTE - if you're adding a custom variable, make sure '!default' in not at the end, otherwise,
 Bootstrap will enforce the factory default color */
.single-image-preview-container {
  max-height: 500px;
  min-height: 150px;
  overflow: hidden;
}
.entry-youtube {
  position: relative;
  padding-bottom: 56.25%;
  /* 16:9 */
  height: 0;
}
.entry-youtube iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border-width: unset;
  border-style: unset;
  border-color: unset;
  -o-border-image: unset;
     border-image: unset;
}
/* HEY LOOK HERE - NOTE - if you're adding a custom variable, make sure '!default' in not at the end, otherwise,
 Bootstrap will enforce the factory default color */
/*------------------------------------------------------------------------*/
/*----               Comment Layout and Item Component                ----*/
/*------------------------------------------------------------------------*/
.library-details--comment-list-empty {
  font-size: 16px;
  width: 100%;
  color: #606065;
  background: #f7f7f7;
  border-radius: 5px;
  text-align: center;
  /* Inside Auto Layout */
  padding: 15px;
}
.library-details--comment-list-empty p {
  margin: 0;
}

.library-details--comment-list {
  background: #fff;
  border-radius: 5px;
  /* Inside Auto Layout */
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column-reverse;
      flex-direction: column-reverse;
}

.library-details--comment-container-header {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: justify;
      justify-content: space-between;
  -ms-flex-align: center;
      align-items: center;
}
.library-details--comment-container h4 {
  font-weight: 700;
  font-size: 1em;
  line-height: 156%;
  font-style: normal;
}
.library-details--comment-container .skeleton-loading-guard {
  min-height: 3.5em;
}

.library-details-comment-item .author-avatar {
  height: 4em;
  width: 4em;
}
.library-details-comment-item .author-avatar img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
/* HEY LOOK HERE - NOTE - if you're adding a custom variable, make sure '!default' in not at the end, otherwise,
 Bootstrap will enforce the factory default color */
.library-details {
  padding: 8px 16px;
}
@media (max-width: 425px) {
  .library-details {
    padding: 8px 0;
  }
}
.library-details .library-folders-close,
.library-details .library-entry-ellipsis .dropdown > button {
  font-size: 20px;
}
.library-details > div.hyperlink-no-open-graph > a:hover, .library-details > div.hyperlink-no-open-graph > a:focus {
  text-decoration: none;
}
/* HEY LOOK HERE - NOTE - if you're adding a custom variable, make sure '!default' in not at the end, otherwise,
 Bootstrap will enforce the factory default color */
.likes-modal .people-likes {
  color: #fff;
}
.likes-modal .library-details-recommenduser-list {
  background: #f7f7f7;
  display: -ms-flexbox;
  display: flex;
}
.likes-modal .library-details-likes-user-avatar {
  width: 50px;
  height: 50px;
}
.likes-modal .library-details-likes-user-avatar img {
  height: 100%;
  width: 100%;
}
.likes-modal .library-details-likes-item {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: row;
      flex-direction: row;
}
.likes-modal .library-details-likes-copy {
  -ms-flex-positive: 1;
      flex-grow: 1;
}
/* HEY LOOK HERE - NOTE - if you're adding a custom variable, make sure '!default' in not at the end, otherwise,
 Bootstrap will enforce the factory default color */
.library-details .hyperlink-no-open-graph > a {
  text-decoration: none;
}
.library-details .hyperlink-no-open-graph > a .link-name {
  font-weight: 600;
}

.library-details-header h3 > span {
  font-weight: 580;
}
.hl-profile-avatar img {
  width: 4em;
  height: 4em;
  border-radius: 50%;
  -o-object-fit: cover;
     object-fit: cover;
}
/* HEY LOOK HERE - NOTE - if you're adding a custom variable, make sure '!default' in not at the end, otherwise,
 Bootstrap will enforce the factory default color */
.library-entry-description {
  position: relative;
  overflow: hidden;
}
.library-entry-description.collapsed {
  max-height: 160px;
}
/* HEY LOOK HERE - NOTE - if you're adding a custom variable, make sure '!default' in not at the end, otherwise,
 Bootstrap will enforce the factory default color */
.library-file-details {
  padding: 8px 16px;
}
@media (max-width: 425px) {
  .library-file-details {
    padding: 8px 0;
  }
}
.library-file-details > div.hyperlink-no-open-graph > a:hover, .library-file-details > div.hyperlink-no-open-graph > a:focus {
  text-decoration: none;
}
.library-file-details .library-file-back-btn-icon {
  color: #292929;
}
.library-file-details .library-file-back-btn:hover .library-file-back-btn-icon {
  color: inherit;
}
/* HEY LOOK HERE - NOTE - if you're adding a custom variable, make sure '!default' in not at the end, otherwise,
 Bootstrap will enforce the factory default color */
.library-entry-file-button {
  height: 60px;
  border-radius: 2px;
  line-height: 1.2;
}
.library-entry-file-button.custom-btn {
  overflow: hidden;
}
.library-entry-file-button.left {
  -ms-flex-pack: start;
      justify-content: start;
  text-align: left;
}
.library-entry-file-button.right {
  -ms-flex-pack: end;
      justify-content: end;
  -ms-flex-direction: row-reverse;
      flex-direction: row-reverse;
  text-align: right;
}
.library-entry-file-button .file-type {
  min-height: 60px;
  min-width: 60px;
}
.library-entry-file-button .file-title {
  margin: 1em;
  overflow: hidden;
  -o-text-overflow: ellipsis;
     text-overflow: ellipsis;
}
/* HEY LOOK HERE - NOTE - if you're adding a custom variable, make sure '!default' in not at the end, otherwise,
 Bootstrap will enforce the factory default color */
.library-entry.library-row {
  position: relative;
  border-bottom: 1px solid #dededf;
  padding: 1em;
}
.library-entry.library-row .library-entry-row-tags {
  margin-bottom: -3px;
}
.library-entry.library-row .library-entry-copy {
  -ms-flex-positive: 1;
      flex-grow: 1;
  -ms-flex-negative: 1;
      flex-shrink: 1;
}
.library-entry.library-row .library-misc {
  -ms-flex-direction: column;
      flex-direction: column;
  -ms-flex-pack: justify;
      justify-content: space-between;
  -ms-flex-align: end;
      align-items: flex-end;
  color: #606065;
}
/* HEY LOOK HERE - NOTE - if you're adding a custom variable, make sure '!default' in not at the end, otherwise,
 Bootstrap will enforce the factory default color */
.entry-tags-count span.fa-tags {
  font-size: 12px;
}

.entry-tags-list {
  display: -ms-inline-flexbox;
  display: inline-flex;
  -ms-flex-wrap: nowrap;
      flex-wrap: nowrap;
  font-size: 12px;
  -ms-flex-negative: 1;
      flex-shrink: 1;
}
.entry-tags-list span.fa-tags {
  margin-right: 0;
}
.entry-tags-list a.label-search-tag {
  background-color: #efefef;
  background-image: none;
  border: 1px solid #efefef;
  color: #292929;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -ms-flex-wrap: nowrap;
      flex-wrap: nowrap;
  margin: 3px 0 3px 5px;
  padding: 4px 6px;
  border-radius: 0.25em;
  white-space: nowrap;
  -ms-flex-negative: 1;
      flex-shrink: 1;
}
.entry-tags-list a.label-search-tag.long-text {
  -ms-flex-negative: 3;
      flex-shrink: 3;
}
.entry-tags-list a.label-search-tag.short-text {
  -ms-flex-negative: 0;
      flex-shrink: 0;
}
.entry-tags-list a.label-search-tag:hover {
  text-decoration: underline;
}
.entry-tags-list a.label-search-tag i {
  color: #7c7c7c;
}
.entry-tags-list span.extra-tags-count {
  -ms-flex-positive: 0;
      flex-grow: 0;
  color: #606065;
}
/* HEY LOOK HERE - NOTE - if you're adding a custom variable, make sure '!default' in not at the end, otherwise,
 Bootstrap will enforce the factory default color */
.library-rows-grid .layout-grid-cell:hover {
  background-color: #f7f7f7;
}
.library-rows-grid .layout-grid-cell.selected {
  background-color: #e1eefb;
}
.library-rows-grid .layout-grid-cell:focus {
  outline-offset: -2px;
}
.btn {
  border-radius: 2px;
}

.hlc-empty-state-cards-wrapper {
  height: 100%;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
      justify-content: center;
  -ms-flex-align: center;
      align-items: center;
}

.hlc-empty-state-three-cards,
.hlc-empty-state-two-cards {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
      justify-content: center;
}

.hlc-empty-state-card {
  width: 120px;
}

.hlc-empty-state-three-cards .hlc-empty-state-card:nth-of-type(1) {
  -webkit-transform: rotate(-10deg) translate(10px, 20px);
      -ms-transform: rotate(-10deg) translate(10px, 20px);
          transform: rotate(-10deg) translate(10px, 20px);
}
.hlc-empty-state-three-cards .hlc-empty-state-card:nth-of-type(2) {
  -webkit-box-shadow: 0 2px 7px rgba(153, 155, 162, 0.6);
          box-shadow: 0 2px 7px rgba(153, 155, 162, 0.6);
  z-index: 1;
}
.hlc-empty-state-three-cards .hlc-empty-state-card:nth-of-type(3) {
  -webkit-transform: rotate(10deg) translate(-10px, 20px);
      -ms-transform: rotate(10deg) translate(-10px, 20px);
          transform: rotate(10deg) translate(-10px, 20px);
}

.hlc-empty-state-two-cards .hlc-empty-state-card:nth-of-type(1) {
  -webkit-transform: rotate(-10deg);
      -ms-transform: rotate(-10deg);
          transform: rotate(-10deg);
}
.hlc-empty-state-two-cards .hlc-empty-state-card:nth-of-type(2) {
  -webkit-transform: rotate(4deg) translate(-30px, 25px);
      -ms-transform: rotate(4deg) translate(-30px, 25px);
          transform: rotate(4deg) translate(-30px, 25px);
}

.hlc-empty-state-card-top-part {
  height: 80px;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
      justify-content: center;
  -ms-flex-align: center;
      align-items: center;
}

.hlc-empty-state-card-bottom-part {
  height: 50px;
  padding: 10px;
  background-color: #efefef;
}
.hlc-empty-state-card-bottom-part div {
  background-color: #dededf;
  height: 8px;
}
.hlc-empty-state-card-bottom-part div:first-of-type {
  margin-bottom: 8px;
}
.hlc-empty-state-card-bottom-part div:last-of-type {
  width: 80%;
}

.hlc-empty-state-card-description {
  text-align: center;
}
.hlc-empty-state-card-description > button {
  margin-right: 20px;
}
.hlc-empty-state-card-description > button:last-of-type {
  margin-right: 0;
}
.hlc-empty-state-card-description > h3 {
  margin-top: 60px;
  font-weight: 500;
  font-size: 22px;
}

.hlc-empty-state-card-secondary-text {
  margin-bottom: 20px;
  color: #999ba2;
}
/* HEY LOOK HERE - NOTE - if you're adding a custom variable, make sure '!default' in not at the end, otherwise,
 Bootstrap will enforce the factory default color */
.hl-carousel .hl-carousel-item {
  background: #fff;
}
.hl-carousel .hl-carousel-item > * {
  width: inherit;
}
.hl-carousel .hl-carousel-arrow {
  background-color: #f7f7f7;
}
.hl-carousel .hl-carousel-arrow-container {
  background-color: #fff;
  z-index: 1;
}
/* HEY LOOK HERE - NOTE - if you're adding a custom variable, make sure '!default' in not at the end, otherwise,
 Bootstrap will enforce the factory default color */
/*------------------------------------------------*/
/*----               Variables                ----*/
/*------------------------------------------------*/
/*------------------------------------------------*/
/*----               RESETS                   ----*/
/*------------------------------------------------*/
.sticky {
  position: -webkit-sticky;
  position: sticky;
}

label {
  margin-bottom: 0;
}

div {
  -webkit-animation: all 0.1s appear;
          animation: all 0.1s appear;
}

.grabbable {
  cursor: all-scroll;
  /* fallback if grab cursor is unsupported */
  cursor: grab;
  cursor: -webkit-grab;
  /* (Optional) Apply a "closed-hand" cursor during drag operation. */
}
.grabbable:active {
  cursor: grabbing;
  cursor: -webkit-grabbing;
}

@media (max-width: 767px) {
  .inactiveMobile {
    position: absolute;
    z-index: 0;
  }

  .hide-small {
    display: none;
  }
}
.grabbable {
  cursor: -webkit-grabbing !important;
  cursor: grabbing !important;
  cursor: -webkit-grab;
}

/* (Optional) Apply a "closed-hand" cursor during drag operation. */
.grabbable:active {
  cursor: grabbing !important;
  cursor: -webkit-grabbing;
}

/*----------------------------------------------------------------*/
/*----               Library Content Component                ----*/
/*----------------------------------------------------------------*/
.library-content {
  max-width: 1440;
  background-color: #fff;
  margin-left: auto;
  margin-right: auto;
}

/*------------------------------------------------------------------*/
/*----               ContentWithPanels Component                ----*/
/*------------------------------------------------------------------*/
.library-content .content-with-panels .left-panel {
  background-color: #efefef;
}
@media (min-width: 426px) {
  .library-content .content-with-panels .right-panel {
    border-left: 1px solid #dededf;
  }
}
.library-content .content-with-panels .left-panel,
.library-content .content-with-panels .right-panel,
.library-content .content-with-panels .center-panel {
  height: 700px;
}
.library-content .hlc-empty-state-cards-wrapper {
  height: 700px;
}
.library-content .img-slot {
  width: 100%;
  height: 100%;
  position: relative;
  -ms-flex-positive: 1;
      flex-grow: 1;
  -ms-flex-negative: 0;
      flex-shrink: 0;
  -ms-flex-preferred-size: 50%;
      flex-basis: 50%;
  background: #dededf;
  color: #292929;
  overflow: hidden;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
      align-items: center;
  -ms-flex-pack: center;
      justify-content: center;
}
.library-content .img-slot .multi-img {
  width: 96px;
  height: 64px;
}
.library-content .img-slot > *,
.library-content .img-slot .thumbnail-box {
  height: 100%;
  width: 100%;
}
.library-content .img-slot .ghost-thumb {
  width: 4.5em;
  height: 4em;
  max-height: 100%;
  max-width: 100%;
}

@media (max-width: 767px) {
  .library-view-toggle {
    display: none;
  }
}

/*-----------------------------------------------------------------*/
/*----               Library-Checkbox Component                ----*/
/*-----------------------------------------------------------------*/
.library-checkbox {
  /* The container */
  /* Hide the browser's default checkbox */
  /* Create a custom checkbox */
  /* On mouse-over, add a grey background color */
  /* When the checkbox is checked, add a blue background */
  /* Create the checkmark/indicator (hidden when not checked) */
  /* Show the checkmark when checked */
  /* Style the checkmark/indicator */
}
.library-checkbox--container {
  margin: 15px;
}
.library-checkbox .container {
  display: block;
  position: relative;
  padding-left: 35px;
  margin-bottom: 12px;
  cursor: pointer;
  font-size: 20px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
.library-checkbox .container input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}
.library-checkbox .checkmark {
  position: absolute;
  top: 0;
  left: 0;
  height: 25px;
  width: 25px;
  background-color: #fff;
  border: 3px solid #606065;
  border-radius: 3px;
}
.library-checkbox .container:hover input ~ .checkmark {
  background-color: #efefef;
}
.library-checkbox .container input:checked ~ .checkmark {
  background-color: #5796ea;
  border: 3px solid #5796ea;
}
.library-checkbox .checkmark:after {
  content: "";
  position: absolute;
  display: none;
}
.library-checkbox .container input:checked ~ .checkmark:after {
  display: block;
}
.library-checkbox .container .checkmark:after {
  left: 9px;
  top: 5px;
  width: 5px;
  height: 10px;
  border: solid white;
  border-width: 0 3px 3px 0;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
}

/* Create the checkmark/indicator (hidden when not checked) */
.checkmark .container input:checked ~ .checkmark:after {
  display: block;
}

/* Style the checkmark/indicator */
.container .checkmark:after {
  left: 9px;
  top: 5px;
  width: 5px;
  height: 10px;
  border: solid #fff;
  border-width: 0 3px 3px 0;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
}

.staged {
  background-color: #e1eefb !important;
}

@-webkit-keyframes appear {
  0% {
    width: 0px;
  }
  100% {
    width: 400px;
  }
}

@keyframes appear {
  0% {
    width: 0px;
  }
  100% {
    width: 400px;
  }
}
@keyframes appear {
  0% {
    width: initial;
  }
  100% {
    width: 0px;
  }
}
.moderation-badge {
  background-color: #e1eefb;
  color: #1460aa;
}

/*# sourceMappingURL=LibraryContent.fee34e81.chunk.css.map*/