@mixin font-size($sizeValue: 1.6) {
  font-size: ($sizeValue * 10) + px;
  font-size: $sizeValue + rem;
}

@mixin font-face($font-family, $file-path, $weight: normal, $style: normal, $asset-pipeline: false ) {
  @font-face {
    font-family: $font-family;
    font-weight: $weight;
    font-style: $style;

    src: url(font-path('#{$spina-assets-path}/#{$file-path}.eot'));
    src: url(font-path('#{$spina-assets-path}/#{$file-path}.eot?#iefix'))          format('embedded-opentype'),
         url(font-path('#{$spina-assets-path}/#{$file-path}.woff'))                format('woff'),
         url(font-path('#{$spina-assets-path}/#{$file-path}.ttf'))                 format('truetype'),
         url(font-path('#{$spina-assets-path}/#{$file-path}.svg##{$font-family}')) format('svg');
  }
}

@mixin retina-image($filename, $background-size, $extension: png, $retina-filename: null, $retina-suffix: "@2x", $asset-pipeline: false) {
  background-image: image-url("#{$filename}.#{$extension}");

  @include hidpi {
    @if $retina-filename {
      background-image: asset-url("#{$retina-filename}.#{$extension}", image);
    }
    @else {
      background-image: asset-url("#{$filename}#{$retina-suffix}.#{$extension}", image);
    }

    background-size: $background-size;

  }
}