$prolist_item_icon_size: 26px;

.prolist {
  list-style-type: none;
  margin: 24px 0 32px;
  padding: 0;
}

.prolist__heading {
  @extend .make-font-heading-tertiary;

  margin: 0;
}

.prolist__item {
  margin: 0 0 16px;
}

.prolist__item__icon {
  float: left;

  width: $prolist_item_icon_size;
  height: $prolist_item_icon_size;
  padding: 2px;
  border-radius: $prolist_item_icon_size;
  background: $color-white;
  color: $color-gray;
  border: 2px $color-gray solid;

  fill: $color-gray;
  stroke: $color-gray;

  // $todo: these font-size, line-height values should be coded in a central place as variables, that we can reuse it here.
  margin-top: ((16px * 1.8) - $prolist_item_icon_size) / 2;

  @include media-breakpoint-up(md) {
    margin-top: ((17px * 1.8) - $prolist_item_icon_size) / 2;
  }
}

.prolist__item__content {
  @extend .make-font-large;

  margin: 0;
  margin-left: 36px;
}

// Copyright AXA Versicherungen AG 2015