.list {
  header {
    .search {
      @include absolutePosition(0 0 inherit inherit);
      height: 40px; overflow: hidden; width: 40px;

      .icon   { @include absolutePosition(0 inherit inherit 0); z-index: 0; @extend .icon-search; }
      input   { display: none; height: 42px; width: 100%; padding: 0 5em 0 2.5em; outline-style: none; border: none; }
      .cancel { display: none; @include absolutePosition(0 1em initial initial); z-index: 0; color: $positiveColor;  }
    }
    .new + .search { @include absolutePosition(0 40px inherit inherit); }
  }

  &.list-search {
    header {
      .search { @include absolutePosition(0 0 inherit 0);
                  width: 100%; z-index: 1; background-color: $white;
        input   { display: block; }
        .cancel { display: inline; &:hover { opacity: .5; } }
        .icon   {
          &:hover   { cursor: pointer; opacity: 1; }
          &:before  { border-color: $stableColor;     }
          &:after   { background-color: $stableColor; }
        }
      }
      .new + .search { @include absolutePosition(0 0 inherit 0); }
    }
    .item-folder { display: none; }
  }

  .items:after {
    content: 'Loading...';
    font-size: .8em; text-align: center; width: 100%; color: $stableColor; display: block; margin-top: 1.5em;
    opacity: 0; @include transition(opacity .25s);
  }

  &.list-loading .items:after {
    opacity: 1;
  }
}