@define-mixin activity-mention {

  box-sizing:      border-box;
  padding:         $activity-padding;

  background:      $jaffa-light;
  border:          1px solid $jaffa-light;
  border-radius:   $activity-border-radius;

  color:           $jaffa;
  font-weight:     bold;
  text-decoration: none;
  letter-spacing:  .1em;

  transition: border-color 0.1s ease;

  &:hover {
    cursor: pointer;
    border:   1px solid $jaffa;
  }

  /* JP 2/10/15
   * The first element (chevron) needs to be spaced.
   * not 100% sure this selector is the most awesome source
   * */
  & *:first-child {
    margin-right: 1em;
  }

  /* JP 2/10/15
   * The last element (close icon) needs to be spaced.
   * not 100% sure this selector is the most awesome source
   * */
  & *:last-child {
    margin-left: 2em;
  }

}
