legend{
  margin-bottom: 1.5rem;
  border-bottom: 1px solid #cdcdcd;
  padding-bottom: .5rem;
  color: $legend-color;
}

// Color contrast
@function color-yiq-const($color) {
  $r: red($color);
  $g: green($color);
  $b: blue($color);

  $yiq: (($r * 299) + ($g * 587) + ($b * 114)) / 1000;

  @if ($yiq >= 200) {
    @return #666666;
  } @else {
    @return #FFFFFF;
  }
}

.btn{
  @each $color, $value in $theme-colors-custom{
    &.btn-#{$color}{
      background-color: $value;
      border-color: darken($value, 10%);
      color: color-yiq-const($value);
      &:hover{
        background-color: darken($value, 10%);
        border-color: darken($value,15%) ;
        color: color-yiq-const($value);
      }
    }
  }
  @each $color, $value in $theme-colors-custom{
    &.btn-outline-#{$color}{
      font-size: 12px;
      background-color: $white;
      border-color: darken($value, 20%);
      color: darken($value,30%);
      &:hover{
        background-color: darken($value, 10%);
        border-color: darken($value,15%) ;
        color: color-yiq-const($value);
      }
    }
  }
}