@mixin font-size($size: 1.4, $important: false) {
  @if $important == true {
    font-size: ($size * 10) + px !important;
    font-size: $size + rem !important;
  } @else {
    font-size: ($size * 10) + px;
    font-size: $size + rem;
  }
}

@mixin line-height($size: 1.6, $force-height: false) {
  @if $force-height == true {
    height: ($size * 10) + px;
  }
  line-height: ($size * 10) + px;
  line-height: $size + rem;
}

@mixin text-underline-hover {
  text-decoration: none;
  &:hover {
    text-decoration: underline;
  }
}

$line-height-modifiers: (
  default: 1.1875,
  mac:     1,
  ie:      1.25
);

@mixin text-underline-line-height($line-height) {
  text-decoration: none;
  @include line-height($line-height * map-get($line-height-modifiers, default));
  background-repeat: repeat-x;

  body.mac &,
  body.ios & {
    @include line-height($line-height);
  }

  body.ie & {
    @include line-height($line-height * map-get($line-height-modifiers, ie));
  }
} // @text-underline-line-height()

@mixin text-underline-gradient(
  $color,
  $background-color,
  $line-height,
  $line-width,
  $line-offset: 0px,
  $platform: default
) {
  $line-width: $line-width / 1px;
  $line-offset: $line-offset / 1px;
  $line-height: $line-height * map-get($line-height-modifiers, $platform);

  @if $line-offset == 0 {
    $color-stop: percentage(1 - ($line-width / ($line-height * 10)));
    @include background-image(
      linear-gradient(
        $background-color,
        $background-color $color-stop,
        $color $color-stop,
        $color 100%
      )
    );
  } @else {
    $color-stop-1: percentage(1 - (($line-width + $line-offset) / ($line-height * 10)));
    $color-stop-2: percentage(1 - ($line-offset / ($line-height * 10)));

    @include background-image(
      linear-gradient(
        $background-color,
        $background-color $color-stop-1,
        $color $color-stop-1,
        $color $color-stop-2,
        $background-color $color-stop-2,
        $background-color 100%
      )
    );
  }
} // @text-underline-gradient()

@mixin text-underline-stroke($stroke-color, $stroke-width) {
  @include text-shadow(
    0 $stroke-width 0 $stroke-color,
    $stroke-width 0 0 $stroke-color,
    0 -1 * $stroke-width 0 $stroke-color,
    -1 * $stroke-width 0 0 $stroke-color
  );
} // @text-underline-stroke()

@mixin text-underline(
  $color: black,
  $background-color: transparent,
  $stroke-color: white,
  $font-size: 1.4,
  $line-height: 1.8,
  $stroke-width: 2px,
  $line-width: 1px,
  $line-offset: 0px
) {
  @include text-underline-line-height($line-height);
  @include text-underline-gradient($color, $background-color, $line-height, $line-width, $line-offset, default);
  @include text-underline-stroke($stroke-color, $stroke-width);

  body.mac &,
  body.ios & {
    @include text-underline-gradient($color, $background-color, $line-height, $line-width, $line-offset, mac);
  }

  body.ie & {
    @include text-underline-gradient($color, $background-color, $line-height, $line-width, $line-offset, ie);
  }
} // @text-underline()

@mixin text-underline-hover(
  $color: black,
  $background-color: transparent,
  $stroke-color: white,
  $font-size: 1.4,
  $line-height: 1.8,
  $stroke-width: 2px,
  $line-width: 1px,
  $line-offset: 0px
) {
  @include text-underline-line-height($line-height);

  &:hover {
    @include text-underline-gradient($color, $background-color, $line-width, $line-height, $line-offset);
    @include text-underline-stroke($stroke-color, $stroke-width);
  }

  body.mac &:hover,
  body.ios &:hover {
    @include text-underline-gradient($color, $background-color, $line-width, $line-height, $line-offset, mac);
  }

  body.ie &:hover {
    @include text-underline-gradient($color, $background-color, $line-width, $line-height, $line-offset, ie);
  }
} // @text-underline-hover()

@mixin text-no-underline-hover {
  &:hover { text-decoration: none; }
}

@mixin text-overflow-ellipsis {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

@mixin font-family(
  $fontname,
  $filename,
  $weight: normal,
  $style: normal,
  $stretch: normal,
  $range: false
) {
  @font-face {
    font-family: $fontname;
    src: font-url($filename + '.eot');
    src: local($fontname), // disable this to test without the font installed locally
      font-url($filename + '.eot?#iefix') format('embedded-opentype'),
      font-url($filename + '.woff') format('woff'),
      font-url($filename + '.ttf') format('truetype'),
      font-url($filename + '.svg#' + $filename) format('svg');
    font-weight: $weight;
    font-style: $style;
    font-stretch: $stretch;

    @if $range {
      unicode-range: $range;
    }
  }
}