.info-list{
  @include list-unstyled;
  li{
    margin-bottom: 0;
    border-bottom: $border-width solid #eee;
    [class*='column-'] {
      display: block;
      padding: $content-padding $text-padding;
      font-size: $font-size;
    }
    .key{
      font-size: $font-size;
      text-overflow: ellipsis;
      white-space:nowrap;
      overflow:hidden;
      color:$sub-color;
    }
    .value{
      font-size: $font-size;
      color:$content-color;
    }
  }
}

dl.info-list{
  dt{
    font-size:1.6rem;
    margin-bottom:$component-span;
  }
  dd{
    margin-bottom: $component-span;
  }
}

.well-info-list {
  @include list-unstyled;
  background-color:#fff;
  li {
    @include horizional-flex-align-center;
    height:$component-size;
    line-height:$component-size;
    padding:0 $content-padding;
    .key {
      display:block;
      text-align:left;
      color:$sub-color;
      font-size: $font-size;
    }
    .value {
      @include flex-adapter;
      display:block;
      font-size: $font-size;
      text-align:right;
      color:$content-color;
    }
  }
}

.horizional-info-list {
  @include horizional-flex;
  .info-item {
    @include flex-adapter;
    padding: $content-padding;
    text-align: center;

    .info-key {
      display: block;
      margin-bottom: $component-span;
      font-size: $font-size;
      font-weight: normal;
    }

    .info-body {
      & + .info-key {
        margin-top: $component-span;
      }
    }
  }
}