.#{prefix(null, 'table-component')} {
  min-height: 50px;

  &-section {
    position: relative;

    &-title {
      position: sticky;
      top: 28px;
      z-index: 1;
      margin: 0;
      padding-top: 60px;
      padding-bottom: 20px;
      font-size: 19px;
      text-transform: capitalize;
      background: color('white');
      border-bottom: 1px solid transparentize(color('black'), 0.95);
    }
  }

  &-link {
    display: flex;
    flex-direction: column;
    padding: 10px 0;
    border-bottom: 1px solid transparentize(color('black'), 0.95);
    color: color('river-bed');

    @include respond-to('medium') {
      flex-direction: row;
      align-items: center;
      height: 42px;
    }

    &-formats {
      position: absolute;
      right: 0;
      display: flex;

      @include respond-to('medium') {
        position: relative;
        width: 8%;
      }

      .#{prefix(null, 'tag')} {

        @include respond-to('medium') {
          max-width: 8px;
          max-height: 8px;
          margin-right: 4px;
          border-radius: 50%;
        }
      }
    }

    &-title {
      font-family: $fontFamilyCode;
      font-size: 14px;
      margin-bottom: 7px;

      @include respond-to('medium') {
        width: 40%;
        margin-bottom: 0;
      }
    }

    &-description {
      font-size: 12px;
      font-weight: normal;

      @include respond-to('medium') {
        width: 52%;
      }
    }

    &:hover {
      background: color('athens-gray');
      border-color: color('athens-gray');
    }
  }
}
