// Font Family
$font-family-default:  			"Raleway", "Helvetica", "Tahoma", "Geneva", "Arial", sans-serif;
$font-family-header:  			"Montserrat", "Helvetica", "Tahoma", "Geneva", "Arial", sans-serif;
$font-family-mono: 				"Inconsolata", monospace;
$font-family-serif:				"Georgia", "Times", "Times New Roman", serif;
$icons: 						"FontAwesome";

// @font-face
$style-name-regular: "amiri-regular";
$file-regular: "amiri-regular-webfont";
$family: "amiri";

$category: serif;

@mixin font-face-regular($style-name-regular, $file-regular, $family, $category:"") {
    $filepath: "../fonts/" + $family + "/" + $file-regular;
    @font-face {
        font-family: "#{$style-name-regular}";
        src: url($filepath + ".eot");
        src: url($filepath + ".eot?#iefix") format('embedded-opentype'),
              url($filepath + ".woff") format('woff'),
              url($filepath + ".ttf")  format('truetype'),
              url($filepath + ".svg#" + $style-name-regular + "") format('svg');
    }

    %#{$style-name-regular} {
        font: {
            @if $category != "" {
                family: "#{$style-name-regular}", #{$category};
            }
            @else {
                family: "#{$style-name-regular}";
                weight: normal;
            }
        }
    }
}

$style-name-slanted: "amiri-slanted";
$file-slanted: "amiri-slanted-webfont";

@mixin font-face-slanted($style-name-slanted, $file-slanted, $family, $category:"") {
    $filepath: "../fonts/" + $family + "/" + $file-slanted;
    @font-face {
        font-family: "#{$style-name-slanted}";
        src: url($filepath + ".eot");
        src: url($filepath + ".eot?#iefix") format('embedded-opentype'),
              url($filepath + ".woff") format('woff'),
              url($filepath + ".ttf")  format('truetype'),
              url($filepath + ".svg#" + $style-name-slanted + "") format('svg');
    }

    %#{$style-name-slanted} {
        font: {
            @if $category != "" {
                family: "#{$style-name-slanted}", #{$category};
            }
            @else {
                family: "#{$style-name-slanted}";
                weight: normal;
            }
        }
    }
}

$style-name-bold: "amiri-bold";
$file-bold: "amiri-bold-webfont";

@mixin font-face-bold($style-name-bold, $file-bold, $family, $category:"") {
    $filepath: "../fonts/" + $family + "/" + $file-bold;
    @font-face {
        font-family: "#{$style-name-bold}";
        src: url($filepath + ".eot");
        src: url($filepath + ".eot?#iefix") format('embedded-opentype'),
              url($filepath + ".woff") format('woff'),
              url($filepath + ".ttf")  format('truetype'),
              url($filepath + ".svg#" + $style-name-bold + "") format('svg');
    }

    %#{$style-name-bold} {
        font: {
            @if $category != "" {
                family: "#{$style-name-bold}", #{$category};
            }
            @else {
                family: "#{$style-name-bold}";
                weight: normal;
            }
        }
    }
}

$style-name-boldslanted: "amiri-boldslanted";
$file-boldslanted: "amiri-boldslanted-webfont";

@mixin font-face-boldslanted($style-name-boldslanted, $file-boldslanted, $family, $category:"") {
    $filepath: "../fonts/" + $family + "/" + $file-boldslanted;
    @font-face {
        font-family: "#{$style-name-boldslanted}";
        src: url($filepath + ".eot");
        src: url($filepath + ".eot?#iefix") format('embedded-opentype'),
              url($filepath + ".woff") format('woff'),
              url($filepath + ".ttf")  format('truetype'),
              url($filepath + ".svg#" + $style-name-boldslanted + "") format('svg');
    }

    %#{$style-name-boldslanted} {
        font: {
            @if $category != "" {
                family: "#{$style-name-boldslanted}", #{$category};
            }
            @else {
                family: "#{$style-name-boldslanted}";
                weight: normal;
            }
        }
    }
}

@include font-face-regular($style-name-regular, $file-regular, $family, $category);
@include font-face-slanted($style-name-slanted, $file-slanted, $family, $category);
@include font-face-bold($style-name-bold, $file-bold, $family, $category);
@include font-face-boldslanted($style-name-boldslanted, $file-boldslanted, $family, $category);

// font-size
$fonth1: 2rem;
$fonth2: 1.5rem;
$fonth3: 1rem;
$fontp: 1rem;
