/** =====================================================================================
 *  Defines the typographic baseline.
 *  We define every size in pixels, the underlying system converts the
 *  respective units to the responsive REM value.
 ===================================================================================== */

/**
 * Our base font-size and line-height
 */
$base-font-size:        18 !default;
$base-line-height:      28 !default;
$line-height-ratio:     $base-line-height/$base-font-size !default;

$font-sizes: (
        x2-small:       13,
        x-small:        14,
        small:          16,
        base:           $base-font-size,
        mid:            20,
        mid-large:      24,
        large:          28,
        x-large:        32,
        x2-large:       36,
        x3-large:       48,
        x4-large:       64
);

$font-weights: (
        regular:        400,
        medium:         500,
        semi-bold:      600,
        bold:           700,
        extra-bold:     800,
);

/**
 *	Here we assign short names for the font families
 */
$font-raleway: 'Raleway', sans-serif;
$_font-system: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";

$font-families: (
        base:           $font-raleway,
        primary:        $font-raleway,

  // Fallback font
        system:         $_font-system
);