// Card Rich Container

.rc-card {
  min-height: 145px;
  border: 2px solid tint(@grayLighter, 10%);
  background: @white;
  .transition(border-color 0.2s);

  &:hover {
    border-color: tint(@blueSoft, 50%);
  }

  .rc-card-header {
    padding: @spacingS;

    .name {
      margin: 0 0 @spacingXs 0;
      font-weight: bold;

      .vicon {
        color: @premiumColor;
      }
    }
  }

  .rc-card-content {
    padding: @spacingS;
    border-top: 1px dotted tint(@blueSoft, 60%);
    background: tint(@blueSoft, 93%);
    background-clip: padding-box;
  }

  .rc-card-footer {
    padding: @spacingS;
    border-top: 1px dotted tint(@blueSoft, 60%);
    .clearfixHack();
  }

  .job {
    margin: 0 0 @spacingXs 0;
    font-family: "Arial", sans-serif;
    font-weight: normal;
    font-size: 14px;
  }

  .where {
    font-family: "Arial", sans-serif;
    margin: 0 0 @spacingXs 0;
    font-size: @baseFontSize;
    font-weight: normal;
    color: @gray;
  }

  .previously {
    dt {
      clear: left;
      float: left;
      color: @grayDark;
      margin-right: 0.5em;
    }
  }
}

.rc-card-l {
  .rc-card-header {
    .name {
      margin-top: @spacingS;
      .padding-left(@rtl, 120px);
    }
  }

  .rc-card-content {
    .avatar {
      margin-top: -15%;
      margin-bottom: ((-1 * @spacingS) - 1);
    }
  }
}

.rc-card-m {
  .rc-card-header {
    .name {
      font-size: 14px;
    }
    .job {
      font-size: 12px;
    }
  }

  .rc-card-content {
    .padding-left(@rtl, 84px);
  }
}