// Calculate rgba() fallback value for older browsers.
//
// Examples:
// @include rgba(background-color, $blue, 0.8);
// @include rgba(background-color, #23b8fc, 0.5);
// @include rgba(background-color, rgb(35, 184, 252), 0.5);
//
@mixin rgba($property, $color: #000, $value: 0.5, $fallback: #000) {
  #{$property}: rgb(red($fallback), green($fallback), blue($fallback));
  #{$property}: rgba($color, $value);
}

// Micro-clearfix mixin.
// See: http://goo.gl/y82qLF
@mixin clearfix {
  &:after {
    clear: both;
    content: "";
    display: table;
  }
}

// Media query mixin
@mixin media($breakpoint) {
  @media #{$breakpoint} {
    @content;
  }
}

// Set typographic settings for icon fonts.
@mixin icomoon-icon {
  font-family: "icomoon";
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;

  // Better Font Rendering
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

// Hide only visually, but have it available for screenreaders.
// @mixin visually-hidden
// @mixin visually-restored
//
// @param $position: absolute
@mixin visually-hidden($position:absolute) { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: $position; width: 1px; }
@mixin visually-restored($position:static) { clip: auto; height: auto; margin: auto; overflow: visible; position: $position; width: auto; }