.app-container {
  .main-panel {
    padding-bottom: 80px;
    transition: width, padding, margin-left 0.25s ease;
  }

  &.desktop {
    .uploadFiles {
      align-items: center;
      background: linear-gradient(to left, #348f50, #56b4d3);
      color: #fff;
      display: flex;
      font-size: 19px;
      height: 100%;
      justify-content: center;
      position: fixed;
      top: 0;
      visibility: hidden;
      width: 100%;
      z-index: 70;
      flex-wrap: wrap;

      .inner {
        flex: none;
        text-align: center;

        h3 {
          margin-bottom: 15px;
        }
      }
    }

    .inactiveDrop {
      &.activeDrop {
        .uploadFiles {
          animation-name: fadeInDown;
          animation-duration: 0.25s;
          animation-fill-mode: both;
          visibility: visible;
        }
      }
    }
  }

  .loading {
    position: absolute;
    top: 0;
    left: 0;
    background: #fff;
    right: 0;
    bottom: 0;
    z-index: 1;
  }
}

@media (min-width: 40rem) {
  .app-container {
    .main-panel {
      padding-bottom: 0;
      margin-left: 300px;
    }
  }
}
