/**
 * Media tree
 */

#mediaTree .tree-fork li[rel="folder"] a {
  width : auto!important;
  position: relative
}

#mediaTree .tree-fork li[rel="folder"] a:before {
  content: "\f114";
}
#mediaTree .tree-fork li[rel="folder"] a:before {
  color: #999;
  font-family: FontAwesome;
  font-size: 12px;
  position: absolute;
  left: 4px
}

/**
 * Media library Helper
 *
 * Structure:
 *   #mediaConnectedItems
 *    .mediaConnectedBox
 *    .mediaConnectedItems
 */
  .media-library-media-library-media-group-helper-helper .mediaGroup {
    margin-bottom: 0;
  }
    .mediaGroup .panel-body {
      padding: 0;
      border: none;
    }
    .mediaGroup .panel-body .helpTxt {
      padding: 20px 25px 25px;
      margin-bottom: 0;
    }
    .mediaGroup .mediaConnectedBox {
      background-color: #fff;
    }
    .mediaGroup .media-group-type-errors {
      padding: 0px 25px 5px;
    }
    .panel-danger .mediaConnectedBox .mediaNoItems {
      padding-bottom: 0;
    }
  #addGalleriesBox a {
    float: right;
  }
  .mediaConnectedItems {
    float: left;
    width: 100%;
    margin-bottom: 0;
  }
    .helpTxt {
      padding: 10px;
    }
    .mediaConnectedItems {
      padding: 5px 2px 2px 5px;
    }
    .mediaEditBox {
      background: #eee;
    }
    .mediaEditBox ul {
      padding: 10px;
    }
    .mediaEditBox li {
      display: inline;
      float: left;
      padding-right: 10px;
    }
    .mediaSettingsGroup {
      position: absolute;
      right: 10px;
    }

  .media-library-media-group-helper .panel-body,
  .media-library-media-group-helper .mediaGroup {
    padding: 0!important;
    margin: 0!important;
  }
    .media-library-media-group-helper .panel-body .panel {
      border: none;
      width: 100%;
    }
    .media-library-media-group-helper .panel-body .mediaSettingsGroup {
      right: 0;
    }

.mediaConnectedItems .ui-state-default {
  display: inline-block;
  overflow: hidden;
  margin: 0 3px 3px 0;
  background: none;
  border: none;
  vertical-align: top;
  position: relative;
}
  .mediaHolder {
    float: left;
    cursor: move;
    display: block;
    padding: 1em 1em 2em;
    width: 140px;
    height: 118px;
  }
    .mediaHolderFile .icon,
    .mediaHolderMovie .icon,
    .mediaHolderAudio .icon {
      background: url(../../../../Core/Layout/images/sprites/fork_icons.png) no-repeat;
      width: 16px;
      height: 20px;
      display: block;
      text-align: center;
      margin: 20px auto 2px;
    }
    .mediaHolderAudio .icon {
      background-position: 0 -468px;
    }
    .mediaHolderFile .icon {
      background-position: 0 -443px;
    }
    .mediaHolderMovie .icon {
      background-position: 0 -468px;
    }
    .mediaHolderFile .url,
    .mediaHolderMovie .url,
    .mediaHolderAudio .url {
      font-size: 0.8em;
      color: #666;
      text-align: center;
      width: 100%;
      word-wrap: break-word;
    }
    .mediaHolderMovie .videoThumbnail {
      width: 100%;
      height: 100%;
      background-size: cover;
      padding-top: 20px;
    }
    .mediaHolderImage img {
      max-width: 100%;
      max-height: 100%;
    }
  .mediaConnectedItems .disconnectMediaItem::before {
    content: "\f057";
    color: #ffffff;
    font: normal normal normal 2rem/1.7rem FontAwesome;
    border-radius: 100%;
    position: absolute;
    top: 4px;
    right: 4px;
    background-color: #d0021b;
    border: 2px solid #d0021b;
  }
  .mediaConnectedItems .mediaHolder .disconnectMediaItem:hover,
  .mediaConnectedItems .mediaHolder .disconnectMediaItem:focus {
    font-size: 14px;
  }
  .mediaConnectedItems .mediaHolder .disconnectMediaItem:hover::before,
  .mediaConnectedItems .mediaHolder .disconnectMediaItem:focus::before {
    border-color: #d0021b;
    color: #d0021b;
    background-color: #ffffff;
    padding: 0;
    font-weight: normal;
  }
  .mediaConnectedItems .disconnectMediaItem {
    color: #d0021b;
    line-height: 2em;
    font-size: 0;
    width: 100%;
    background: none;
    border: none;
    display: block;
    font-weight: normal;
  }
  .mediaConnectedItems .editMediaItem::before {
    content: "\f044";
    color: #2f77cf;
    font: normal normal normal 2rem/1.7rem FontAwesome;
    position: absolute;
    top: 7px;
    right: 26px;
    background: #ffffff;
  }
  .mediaConnectedItems .mediaHolder .editMediaItem:hover,
  .mediaConnectedItems .mediaHolder .editMediaItem:focus {
    font-size: 14px;
  }
  .mediaConnectedItems .mediaHolder .editMediaItem:hover::before,
  .mediaConnectedItems .mediaHolder .editMediaItem:focus::before {
    color: #01417b;
    padding: 0;
    font-weight: normal;
  }
  .mediaConnectedItems .editMediaItem {
    color: #2f77cf;
    line-height: 2em;
    font-size: 0;
    width: 100%;
    background: none;
    border: none;
    display: block;
    font-weight: normal;
  }
/**
 * Media Dialog
 */
#addMediaDialog .modal-dialog,
#cropperMediaDialog .modal-dialog {
  max-height: calc(100vh - 200px);
  overflow-y: auto;
}
#addMediaDialog .modal-body,
#cropperMediaDialog .modal-body {
  padding: 0;
  background: none;
  border: none;
}
#addMediaDialog #tabLibrary .options,
#addMediaDialog #tabUploadMedia .options {
  margin-bottom: 1em;
}
#addMediaDialog #tabLibrary .tab-content {
  padding: 0;
  border: none;
}
#addMediaDialog #tabLibrary .tab-content .table-striped {
  border-top: 0;
  padding: .5em 0 0;
}
#addMediaDialog #tabLibrary .table-responsive {
  max-height: 400px;
  overflow: auto;
}
.mediaTable {
  overflow-wrap: break-word;
}
  .mediaTable .check {
    width: 30px;
  }
  .mediaTable .fullUrl {
    width: 90px;
    cursor: pointer;
  }
  .mediaTable .url {
    max-width: 156px;
  }
  .mediaTable .title {
    max-width: 140px;
    color: #000;
  }
  .mediaTable .actions {
    max-width: 100px;
  }
  .mediaTable .actions a {
    float: right;
  }

.inputList.noPadding,
.inputList.noPadding li {
  padding:  0;
}

#uploadMediaTypeBox label {
  vertical-align: bottom;
}


/**
 * Uploaded media box
 */
#uploadedMediaBox .panel-body {
  padding: 20px;
}

#uploadedMediaBox .mediaConnectedItems {
  float: none;
  padding: 0;
  margin: 0;
}

/**
 * Fine uploader
 */
.qq-uploader {
  border-radius: 0!important;
}
.qq-upload-button-selector {
  margin-bottom: 1.5em;
}
.qq-upload-list {
  margin-top: 1.5em;
}
