Generated by SassMeister.com.

SassMeister-input.sass

// ----
// Sass (v3.4.12)
// Compass (v1.0.3)
// ----

// Styleguide 4.2.
$new-brand-main:        #21A5B8
$new-brand-main-1:      #1F8B9B
$new-brand-secondary:   #83A1A6
$new-grey-light-1:      #EEEEEE
$new-grey-light-2:      #E6E6E6
$new-grey-1:            #BBBBBB
$new-grey-dark-2:       #333333
$fs_regular: 13px
$fs_small: 11px

.search-results-count
  padding: 5px 0 15px
.search-result
  &
    border: 1px solid $new-grey-light-2
    border-top-width: 0
    padding: 10px 10px 10px 40px
    background-color: #fff
    position: relative
  &:hover
    background-color: $new-grey-light-1
    cursor: pointer
  &:first-child
    border-top-width: 1px
  &.is-selected
    &
      background-color: $new-brand-main
      border-right-color: $new-brand-main
      border-top-color: $new-brand-main-1
      border-bottom: 0
      color: #fff
    .search-result
      &__title a,
      .tag
        color: #fff
      &__details,
      &__icon
        color: rgba(255,255,255,.6)
    .tag
      background-color: $new-brand-main-1
      border-color: $new-brand-main-1
  &__title
    &
      font-weight: 600
      font-size: $fs_regular
      line-height: 1.3
      word-spacing: 1px
      margin-bottom: 6px
    a
      color: $new-grey-dark-2
  &__tags
    margin-bottom: 6px
  &__details
    font-size: $fs_small
    color: $new-grey-1
    font-weight: 400
  &__project
    float: left
  &__date
    float: right
  &__icon
    position: absolute
    left: 15px
    color: $new-brand-secondary
  &--chatchannel,
  &--unknown
    &
      min-height: 44px
    .search-result
      &__title
        margin-bottom: 0
        float: left
      &__date,
      &__title
        margin-top: 3px
      &__icon
        left: 9px
  &--unknown
    .search-result__icon
      left: 15px
      margin-top: 3px

SassMeister-output.css

.search-results-count {
  padding: 5px 0 15px;
}

.search-result {
  border: 1px solid #E6E6E6;
  border-top-width: 0;
  padding: 10px 10px 10px 40px;
  background-color: #fff;
  position: relative;
}
.search-result:hover {
  background-color: #EEEEEE;
  cursor: pointer;
}
.search-result:first-child {
  border-top-width: 1px;
}
.search-result.is-selected {
  background-color: #21A5B8;
  border-right-color: #21A5B8;
  border-top-color: #1F8B9B;
  border-bottom: 0;
  color: #fff;
}
.search-result.is-selected .search-result__title a,
.search-result.is-selected .search-result .tag {
  color: #fff;
}
.search-result.is-selected .search-result__details, .search-result.is-selected .search-result__icon {
  color: rgba(255, 255, 255, 0.6);
}
.search-result.is-selected .tag {
  background-color: #1F8B9B;
  border-color: #1F8B9B;
}
.search-result__title {
  font-weight: 600;
  font-size: 13px;
  line-height: 1.3;
  word-spacing: 1px;
  margin-bottom: 6px;
}
.search-result__title a {
  color: #333333;
}
.search-result__tags {
  margin-bottom: 6px;
}
.search-result__details {
  font-size: 11px;
  color: #BBBBBB;
  font-weight: 400;
}
.search-result__project {
  float: left;
}
.search-result__date {
  float: right;
}
.search-result__icon {
  position: absolute;
  left: 15px;
  color: #83A1A6;
}
.search-result--chatchannel, .search-result--unknown {
  min-height: 44px;
}
.search-result--chatchannel .search-result__title, .search-result--unknown .search-result__title {
  margin-bottom: 0;
  float: left;
}
.search-result--chatchannel .search-result__date, .search-result--chatchannel .search-result__title, .search-result--unknown .search-result__date, .search-result--unknown .search-result__title {
  margin-top: 3px;
}
.search-result--chatchannel .search-result__icon, .search-result--unknown .search-result__icon {
  left: 9px;
}
.search-result--unknown .search-result__icon {
  left: 15px;
  margin-top: 3px;
}