@mixin cv-info-card-color($color) {
  > div {
     color:                                                 $color;
  }
}

.cv-info-card {
  text-align:                                               left;
  padding:                                                  $spacer;

  @each $name in ('', '-left', '-top', '-bottom', '-right') {
    &.no-gutter#{$name}{
      padding#{$name}:                                      0px !important;
    }
  }
  .label {
    font-weight:                                            800;
    display:                                                block;
  }
  .amount {
    font-size:                                              $font-size-base * 2.5;
    font-weight:                                            800;
    line-height:                                            $font-size-base * 2.5;
    margin-top:                                             map-get($spacers, 2);
  }
  > div {
    padding:                                                map-get($spacers, 2) map-get($spacers, 3);
    border:                                                 solid 1px $border-color;
    position:                                               relative;
  }
  .info {
    position:                                               absolute;
    right:                                                  map-get($spacers, 3);
    bottom:                                                 map-get($spacers, 2);
    .label {
      margin-top:                                           -5px;
      font-size:                                            $font-size-base * .9;
    }
  }

  @include cv-info-card-color($black);
  @each $name, $color in $theme-colors {
    &.#{$name} {
      @include cv-info-card-color($color);
    }
  }
}


