@charset 'utf-8';

/*  ========================================================================
    JUICE -> ELEMENTS -> TYPOGRAPHY -> HEADING
    ========================================================================  */

// Check if the elements with heading should be imported
@if $import-elements and $import-element-heading {
    #{$heading} {
        line-height: normal;
        margin: 0;
        margin-bottom: $heading-element-spacing;
        padding: 0;
        position: relative;
    }
}


/*  ========================================================================
    JUICE -> ELEMENTS -> TYPOGRAPHY -> HEADING -> H1
    ========================================================================  */

// Check if the elements with heading should be imported
@if $import-elements and $import-element-heading {
    h1 {
        color: $heading-1-font-color;
        font-family: $heading-1-font-family;
        font-size: $heading-1-font-size;
        font-variant: $heading-1-font-variant;
        font-weight: $heading-1-font-weight;
        letter-spacing: $heading-1-letter-spacing;
        text-transform: $heading-1-text-transform;
    }
}


/*  ========================================================================
    JUICE -> ELEMENTS -> TYPOGRAPHY -> HEADING -> H2
    ========================================================================  */

// Check if the elements with heading should be imported
@if $import-elements and $import-element-heading {
    h2 {
        color: $heading-2-font-color;
        font-family: $heading-2-font-family;
        font-size: $heading-2-font-size;
        font-variant: $heading-2-font-variant;
        font-weight: $heading-2-font-weight;
        letter-spacing: $heading-2-letter-spacing;
        text-transform: $heading-2-text-transform;
    }
}


/*  ========================================================================
    JUICE -> ELEMENTS -> TYPOGRAPHY -> HEADING -> H3
    ========================================================================  */

// Check if the elements with heading should be imported
@if $import-elements and $import-element-heading {
    h3 {
        color: $heading-3-font-color;
        font-family: $heading-3-font-family;
        font-size: $heading-3-font-size;
        font-variant: $heading-3-font-variant;
        font-weight: $heading-3-font-weight;
        letter-spacing: $heading-3-letter-spacing;
        text-transform: $heading-3-text-transform;
    }
}


/*  ========================================================================
    JUICE -> ELEMENTS -> TYPOGRAPHY -> HEADING -> H4
    ========================================================================  */

// Check if the elements with heading should be imported
@if $import-elements and $import-element-heading {
    h4 {
        color: $heading-4-font-color;
        font-family: $heading-4-font-family;
        font-size: $heading-4-font-size;
        font-variant: $heading-4-font-variant;
        font-weight: $heading-4-font-weight;
        letter-spacing: $heading-4-letter-spacing;
        text-transform: $heading-4-text-transform;
    }
}


/*  ========================================================================
    JUICE -> ELEMENTS -> TYPOGRAPHY -> HEADING -> H5
    ========================================================================  */

// Check if the elements with heading should be imported
@if $import-elements and $import-element-heading {
    h5 {
        color: $heading-5-font-color;
        font-family: $heading-5-font-family;
        font-size: $heading-5-font-size;
        font-variant: $heading-5-font-variant;
        font-weight: $heading-5-font-weight;
        letter-spacing: $heading-5-letter-spacing;
        text-transform: $heading-5-text-transform;
    }
}


/*  ========================================================================
    JUICE -> ELEMENTS -> TYPOGRAPHY -> HEADING -> H6
    ========================================================================  */

// Check if the elements with heading should be imported
@if $import-elements and $import-element-heading {
    h6 {
        color: $heading-6-font-color;
        font-family: $heading-6-font-family;
        font-size: $heading-6-font-size;
        font-variant: $heading-6-font-variant;
        font-weight: $heading-6-font-weight;
        letter-spacing: $heading-6-letter-spacing;
        text-transform: $heading-6-text-transform;
    }
}