/*
 * Responsive intrinsic ratios
 * http://www.fredparke.com/blog/css-padding-trick-responsive-intrinsic-ratios
 */
@mixin intrinsic-pad-ratio($w: 4, $h: 3, $selector: picture, $breakpoint: 768, $w-br: 4, $h-br: 3) {
  position: relative;
  padding: 0 0 percentage($h/$w) 0;
  height: 0;
  z-index: 1;
  #{$selector} {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 0;
    &.loading {
      background: lighten($brand-primary, 10%);
      color: $white;
      .fa {
        position: absolute;
        left: inherit;
        top: 50%;
        height: 1em;
        margin-top: -0.5em;
        font-size: 2em;
      }
    }
  }
  @media (max-width: $breakpoint * 1px) {
    padding: 0 0 percentage($h-br/$w-br) 0;
    #{$selector} {
      &.loading {
        .fa {
          font-size: 1em;
        }
      }
    }
  }
}


/* Converting Hex to RGBa for background opacity */
@mixin background-opacity($color, $opacity: 0.5) {
  background: $color; /* The Fallback */
  background: rgba($color, $opacity);
}
/*
 * Responsive intrinsic ratios
 * http://www.fredparke.com/blog/css-padding-trick-responsive-intrinsic-ratios
 */
@mixin intrinsic-pad-ratio($w: 4, $h: 3, $selector: picture, $breakpoint: 768, $w-br: 4, $h-br: 3, $bg: inherit) {
  position: relative;
  padding: 0 0 percentage($h/$w) 0;
  height: 0;
  z-index: 1;
  #{$selector} {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 0;
    &.loading {
      background: $bg;
      color: $white;
      .fa {
        position: absolute;
        left: inherit;
        top: 50%;
        height: 1em;
        margin-top: -0.5em;
        font-size: 2em;
      }
    }
  }
  @media (max-width: $breakpoint * 1px) {
    padding: 0 0 percentage($h-br/$w-br) 0;
    #{$selector} {
      &.loading {
        .fa {
          font-size: 1em;
        }
      }
    }
  }
}


/* Converting Hex to RGBa for background opacity */
@mixin background-opacity($color, $opacity: 0.5) {
  background: $color; /* The Fallback */
  background: rgba($color, $opacity);
}
Add background color as parameter
Add background color as parameter
