indented-bem.css

:root {
  var-ss-Deck-column-header: 2rem;
  var-ss-Deck-column-margin: .6rem;
}

.ss-Deck-column {
  position: relative;
  display: inline-block;
  overflow: hidden;
  width: 19rem;
  height: 100%;
  margin: 0 var(ss-Deck-column-margin) 0 0;
  white-space: normal;
  background: #fff;
  box-shadow: 0 0 .4rem rgba(#000, .1)
}

  .ss-Deck-column-wrapper {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    overflow: hidden;
    border: 1px solid #eee;
  }

    .ss-DeckColumn-handle {
      cursor: move;
    }

    .ss-Deck-column-header {
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      height: var(ss-Deck-column-header);
      background: #eee;
    }

      .ss-Deck-column-title {
        width: 65%;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;

        padding: 0 1rem;
        line-height: var(ss-Deck-column-header);
        text-shadow: 0 1px 0 #fff;
      }

      .ss-Deck-column-filterIcons {
        position: absolute;
        top: 0;
        bottom: 0;
        right: 15%;

        width: 20%;
        line-height: calc(var(ss-Deck-column-header));
        text-align: right;
      }

      .ss-Deck-column-toggleOptions {
        cursor: pointer;
        position: absolute;
        top: 0;
        bottom: 0;
        right: 0;

        width: 13%;
        line-height: .8;
        margin: .1rem 1% -1px;
        border: solid #eee;
        border-width: 1px 1px 0;
        text-align: center;

      }

        .ss-Deck-column-toggleOptions.is-active {
          background: #fff;
          border-color: #ddd;
          z-index: 3;
        }

        .ss-Deck-column-toggleOptions .icon { opacity: .4 }
        .ss-Deck-column-toggleOptions .icon:hover { opacity: .6 }
        .ss-Deck-column-toggleOptions.is-active .icon { opacity: .8 }

    .ss-Deck-column-body {
      position: absolute;
      top: var(ss-Deck-column-header);
      bottom: 0;
      left: 0;
      right: 0;
      overflow: auto;
    }

      .ss-Deck-column-toolbar {
        position: absolute;
        top: var(ss-Deck-column-header);
        left: 0;
        right: 0;
        z-index: 2;
        background: #fff;
        border: solid #ddd;
        border-width: 1px 0 0 0;
        max-height: 0;
        overflow: hidden;
        transition: all .2s;
      }

        .ss-Deck-column-toolbar.is-active {
          max-height: 10em;
          border-width: 1px 0;
        }

        .ss-Deck-column-toolbar-options {
          padding: 1rem;
        }

          .ss-Deck-column-config {
            margin-bottom: 1rem;
          }

          .ss-Deck-column-toolbar-options .ss-Button {
            font-size: .8rem;
          }

        .ss-Deck-column-toolbar-footer {
          text-align: right;
          background: #eee;
          padding: .2rem .4rem;
          font-size: .8rem;
          line-height: 1.8;
        }

          .ss-Deck-column-toolbar-footer-action { opacity: .6 }
          .ss-Deck-column-toolbar-footer-action:hover { opacity: .8 }