///
/// # Main API
///
/// ----
///
/// ## Shorthand
///
/// ### Recursive span
/// Use this if you want identical column spans across all breakpoints. This is of course
/// relative to each of your breakpoint's column count, so if your lowest breakpoint has
/// a column count of `4`, then anything above that would likely cause layout issues
/// for that breakpoint.
///
///    ```scss
///    div {
///        @include _(2);
///    }
///    ```
///
/// ### Recursive Span With Identical Context
/// Use this if your nested context is identical across all breakpoints. The `$context` should
/// be the span value of the element's parent, or `auto`.
///
///    ```scss
///    div {
///        @include _(4, 2);
///    }
///    ```
///
/// ### Recursive Span With Differing Context
/// Use this if your nested context is not identical across all breakpoints. The `$context`
/// should be the span value of the element's parent, or `auto`.
///
///    ```scss
///    div {
///        @include _(4, 8 8 4 4);
///    }
///    ```
///
/// ### Variable Span
/// Use this if your content needs different spans across each breakpoint. The order of
/// operations is the order that your breakpoints are listed in your config (DESC).
///
///    ```scss
///    div {
///        @include _(8 8 4 4);
///    }
///    ```
///
/// ### Variable Span With Identical Context
/// Use this if your nested context is identical across all breakpoints. The `$context`
/// should be the span value of the element's parent, or `auto`.
///
///    ```scss
///    div {
///        @include _(4 4 2 2, 4);
///    }
///    ```
///
/// ### Variable Span With Differing Context
/// Use this if your nested context is not identical across all breakpoints. The `$context`
/// should be the span value of the element's parent, or `auto`.
///
///    ```scss
///    div {
///        @include _(8 8 4 4, 8 8 4 4);
///    }
///    ```
///
/// ----
///
/// ## Longhand
///
/// ### Span
/// Use if you want to define each span by breakpoint `$alias`.
///
///    ```scss
///    div {
///        @include _(desktop, 2);
///    }
///    ```
///
/// ### Span With Context
/// Use if you want to define each span by breakpoint `$alias`. The `$context` should be the span
/// value of the element's parent, or `auto`.
///
///    ```scss
///    div {
///        @include _(desktop, 4, 2);
///    }
///    ```
///
/// ----
///
/// ## Automatic Context
///
/// You can use `$context: auto`, and Flint will calculate based on the closest parent element's
/// width instead of the current breakpoint. When using `auto`, Flint falls back from the topmost
/// selector until one is found that has an instance, and it will calculate its span based on that
/// instance's width for the current breakpoint. Think of the `auto` option as a self-correcting grid.
///
/// When utilizing the `$context` argument, be sure to note the differences in the way the calculations
/// happen depending on if you use a numerical value or `auto`. When using a numerical value, the span
/// is calculated against the current breakpoint's value (example: `80em`), then it's divided by its column
/// count (example: `16`), and then finally, it's multiplied by the passed `$context` value. When using
/// `auto`, the span is _always_ calculated against the closest parent element's width instead
/// of the current breakpoint's width.
///
/// The difference in output varies, but your gutters will be more accurate across the board if you
/// consistently use the `auto` option. This option allows you to infinitely nest elements on both fixed
/// and fluid grids without dealing with the inconsistencies that can be caused by nesting elements that
/// all use a gutter value of their own. Because the parent element's actual width is always used, the
/// gutters never become out of sync.
///
///    ```scss
///    .parent {
///        @include _(4);
///        .child {
///            @include _(3, 4);
///        }
///    }
///
///    // Auto will work
///    .parent {
///        @include _(4);
///        .child {
///            @include _(3, auto);
///        }
///    }
///
///    // Will also work
///    .parent {
///        @include _(4);
///    }
///    .parent .child {
///        @include _(3, auto);
///    }
///
///    // Will not work, as the child has no relation to
///    //   the parent within the stylesheet
///    .parent {
///        @include _(6);
///    }
///    .child {
///        @include _(3, auto);
///    }
///    ```
///
/// If you attempt to use this feature with a methodology like BEM, where selectors aren't neccassarily
/// lists, but instead single strings, you'll notice that Flint can't find return a valid parent for the
/// element. This is the reason for the `support-syntax` functionality. With it, Flint is able to parse
/// selectors that are a single string, as opposed to a list, and successfully search for the passed
/// selector's parent.
///
/// ----
///
/// ## Modifiers
///
/// ### Alpha
/// Remove the left `$gutter` from the span. Other aliases for `alpha` include: `no-left` and `first`.
///
///    ```scss
///    div {
///        @include _(12 8 6 4, $gutter: alpha);
///    }
///    ```
///
/// ### Omega
/// Remove the right `$gutter` from the span. Other aliases for `omega` include: `no-right` and `last`.
///
///    ```scss
///    div {
///        @include _(2, $gutter: omega);
///    }
///    ````
///
/// ### Row
/// Remove both of the `$gutter` values from the span. Other aliases for `row` include: `none`.
///
///    ```scss
///    div {
///        @include _(4, $gutter: row);
///    }
///    ```
///
/// ### Center
/// Center the current span within it's container element. Outputs auto left and right margins.
/// This modifier will also remove any float properties on the element.
///
///    ```scss
///    div {
///        @include _(4, $gutter: center);
///    }
///    ```
///
/// ### Inside
/// Sets both `$gutter` values on the inside of the element. Instead of deducting `$gutter*2` out
/// of the final width, it will deduct `$gutter*4`. Useful for nesting elements inside of other
/// elements without using `$context: auto`.
///
///    ```scss
///    div {
///        @include _(16 12 8 4, $gutter: inside);
///    }
///    ```
///
/// ### Default
/// Argument to use the default left/right `$gutter` values. Useful for when you want to use a
/// variable `$gutter` argument. Other aliases for `default` include: `normal` and `regular`.
///
///    ```scss
///    div {
///        @include _(4, $gutter: default);
///    }
///    ```
///
/// ### Variable Modifiers
/// Instead of passing in a recursive `$gutter` value, you may specify a value for each breakpoint exactly
/// like you would a `$span` argument.
///
///    ```scss
///    div {
///        @include _(10 8 6 4, $gutter: alpha omega omega default);
///    }
///    ```
///
/// ----
///
/// ## Queries
///
/// ### By Alias
/// Use this type of query to wrap the `@content` in a single query for the specified breakpoint.
///
///    ```scss
///    div {
///        @include _(desktop) {
///            property: value;
///        }
///    }
///    ```
///
/// ### From, To
/// Use this type of query to wrap the `@content` in a single query between 2 breakpoints. Make
/// sure to pass in the breakpoints from lowest to highest.
///
///    ```scss
///    div {
///        @include _(from tablet to laptop) {
///            property: value;
///        }
///    }
///    ```
///
/// ### Greater Than
/// Use this type of query to wrap the `@content` in a single query for anything above
/// the passed breakpoint.
///
///    ```scss
///    div {
///        @include _(greater than laptop) {
///            property: value;
///        }
///        @include _(5em greater than tablet) {
///            property: value;
///        }
///        @include _(greater than 55em) {
///            property: value;
///        }
///    }
///    ```
///
/// ### Less Than
/// Use this type of query to wrap the `@content` in a single query for anything below
/// the passed breakpoint.
///
///    ```scss
///    div {
///        @include _(less than laptop) {
///            property: value;
///        }
///        @include _(5em less than tablet) {
///            property: value;
///        }
///        @include _(less than 8em) {
///            property: value;
///        }
///    }
///    ```
///
/// ### For
/// Use this type of query to wrap the `@content` in a single comma delimited query
/// for each passed `$alias`.
///
///    ```scss
///    div {
///        @include _(for mobile tablet desktop) {
///            property: value;
///        }
///    }
///    ```
///
/// ----
///
/// ## Miscellaneous
///
/// ### Clearfix
/// Given that Flint is float based, you might find yourself needing to use a clearfix. Flint comes
/// packaged with a micro-clearfix function. _Flint will attempt to use a local mixin named
/// `clearfix`. If one is not found, it will use it's own._
///
///    ```scss
///    div {
///        @include _(clear);
///    }
///    ```
///
/// ### Foundation
/// A foundation instance will output a global box-sizing: border-box declaration. If you selected
/// `"border-box-sizing": true`, then it is advised to create a global foundation instance. If you
/// don't, Flint will automatically apply a foundation instance with your first span declaration.
/// This should be placed at the root of your stylesheet. _Flint will attempt to use a local
/// mixin named `box-sizing`. If one is not found, it will use it's own._
///
///    ```scss
///     @include _(foundation);
///    ```
///
/// ### Container
/// Containers act as a containing row for each individual breakpoint. It uses the `"max-width"`
/// setting, if set. They do not float, so if you have `"center-container"` set, then it
/// will also center your element using auto left and right margins. You may combine
/// container and clear declarations, with arguments separated by a comma.
///
///    ```scss
///    div {
///        @include _(container);
///    }
///    ```
///
/// ----
///
/// @access public
///
/// @param {String|Number|List} $key     [null] - key of breakpoint, or shorthand span
/// @param {String|Number|List} $span    [null] - value of span for column, or shorthand context
/// @param {String|Number}      $context [null] - context value of span, or null for shorthand
/// @param {String|List}        $gutter  [null] - alias for gutter modifier
///
/// @throws - Error if list lengths do not match number of breakpoints (when using variable shorthands).
///
/// ----
///
/// @example scss - Recursive shorthand with no context
/// _(2)
///
/// @example scss - Recursive shorthand with identical context
/// _(2, 4)
///
/// @example scss - Recursive shorthand with differing context
/// _(1, 2 4 6 8)
/// _(1, auto)
///
/// @example scss - Variable shorthand with no context
/// _(1 2 3 4)
///
/// @example scss - Variable shorthand with identical context
/// _(1 2 3 4, 4)
/// _(1 2 3 4, auto)
///
/// @example scss - Variable shorthand with differing context
/// _(4 3 2 1, 8 6 4 2)
/// _(4 3 2 1, auto)
///
/// @example scss - Call by alias with no context
/// _(desktop, 2)
///
/// @example scss - Call by alias with context
/// _(desktop, 2, 4)
/// _(desktop, 2, auto)
///
/// @example scss - Call $key breakpoint by alias
/// _(desktop) { ... }
///
/// @example scss - From $key breakpoint to infinity
/// _(from laptop to infinity) { ... }
///
/// @example scss - From $key-x breakpoint to $key-y breakpoint
/// _(from tablet to laptop) { ... }
///
/// @example scss - From $num-x to $num-y
/// _(from 20em to laptop) { ... }
///
/// @example scss - Greater than $key breakpoint
/// _(greater than tablet) { ... }
///
/// @example scss - Greater than number
/// _(greater than 15em) { ... }
///
/// @example scss - Number greater than $key breakpoint
/// _(5em greater than mobile) { ... }
///
/// @example scss - Less than $key breakpoint
/// _(less than laptop) { ... }
///
/// @example scss - Less than number
/// _(less than 35em) { ... }
///
/// @example scss - Number less than $key breakpoint
/// _(10em less than laptop) { ... }
///
/// @example scss - For $key-x $key-y $key-z...
/// _(for mobile tablet desktop) { ... }
///
/// @example scss - Clear
/// _(clear)
///
/// @example scss - Foundation
/// _(foundation)
///
/// @example scss - Container
/// _(container)
///
/// ----
///
/// @author Ezekiel Gabrielse
/// @link http://flint.gs
///
/// @group Public API
///
@mixin _(
    $key: null,
    $span: null,
    $context: null,
    $gutter: null
) {

    //
    // Get unit to modify queries with
    //
    $unit: null;

    @if flint-get-config-unit() == "rem" {
        $unit: flint-to-rem(1px);
    } @else if flint-get-config-unit() == "em" {
        $unit: flint-to-em(1px);
    } @else {
        $unit: 1;
    }

    //
    // Clearfix
    //
    @if $key == "clear" or $span == "clear" or $context == "clear" {

        //
        // Check if key exists as breakpoint, and if so wrap
        //   in query to not affect other breakpoints
        //
        @if map-has-key(map-get($flint, "breakpoints"), $key) {

            @if flint-get-value("settings", "grid") == "fluid" {
                @if flint-is-highest-breakpoint($key) {
                    @media ( min-width: (flint-calc-breakpoint("next", $key, flint-get-index($key)) + $unit) ) {
                        @include flint-clearfix;
                        @content;
                    }
                } @else {
                    @media ( min-width: (flint-calc-breakpoint("next", $key, flint-get-index($key)) + if(flint-is-lowest-breakpoint($key), 0, $unit)) ) and ( max-width: flint-calc-breakpoint("alias", $key, flint-get-index($key)) ) {
                        @include flint-clearfix;
                        @content;
                    }
                }
            } @else if flint-get-value("settings", "grid") == "fixed" {
                @if flint-is-highest-breakpoint($key) {
                    @media ( min-width: flint-calc-breakpoint("alias", $key, flint-get-index($key)) ) {
                        @include flint-clearfix;
                        @content;
                    }
                } @else {
                    @media ( min-width: flint-calc-breakpoint("alias", $key, flint-get-index($key)) ) and ( max-width: (flint-calc-breakpoint("prev", $key, flint-get-index($key)) - $unit) ) {
                        @include flint-clearfix;
                        @content;
                    }
                }
            }

        } @else {

            @include flint-clearfix;
            @content;

        }
    }

    //
    // Apply grid overlay if debug mode is enabled
    //
    @if not $flint-overlay and flint-get-value("settings", "debug-mode") {
        $flint-overlay: true !global;
        @include flint-overlay-grid;
    }

    //
    // Foundation
    //
    @if $key == "foundation" {

        // Apply global border-box-sizing if set to true
        @if flint-get-value("settings", "border-box-sizing") {
            $flint-foundation: true !global;
        }

        // Foundation is now globally existant
        @if $flint-foundation {
            @at-root *, *:before, *:after {
                @include flint-box-sizing;
                @content;
            }
        }

    //
    // Container
    //
    } @else if $key == "container" or $span == "container" or $context == "container" {

        // Apply individually if foundation is not set globally, but is set to true in config
        @if flint-get-value("settings", "border-box-sizing") and not $flint-foundation {
            @include _("foundation");
        }

        // Output container for each breakpoint if fixed grid
        @if $key == "container" and flint-get-value("settings", "grid") == "fixed" {

            @for $i from 1 through length($flint-all-keys) {

                // Set up variables
                $calc-key: flint-steal-key($i);

                // Key is default, no media queries
                @if flint-is-default($calc-key) {

                    @include flint-container($calc-key, $i) {
                        @content;
                    }

                // Not default, wrap in media queries
                } @else {

                    // Highest breakpoint? No max-width
                    @if flint-is-highest-breakpoint($calc-key) {

                        @media ( min-width: flint-calc-breakpoint("alias", $calc-key, $i) ) {
                            @include flint-container($calc-key, $i) {
                                @content;
                            }
                        }

                    } @else {

                        @media ( min-width: flint-calc-breakpoint("alias", $calc-key, $i) ) and ( max-width: (flint-calc-breakpoint("prev", $calc-key, $i) - $unit) ) {
                            @include flint-container($calc-key, $i) {
                                @content;
                            }
                        }

                    }
                }
            }

        // Output container for specific breakpoint if exists
        } @else if map-has-key(map-get($flint, "breakpoints"), $key) and flint-get-value("settings", "grid") == "fixed" {

            @if flint-is-highest-breakpoint($key) {

                @media ( min-width: flint-calc-breakpoint("alias", $key, flint-get-index($key)) ) {
                    @include flint-container($key) {
                        @content;
                    }
                }

            } @else {

                @media ( min-width: flint-calc-breakpoint("alias", $key, flint-get-index($key)) ) and ( max-width: (flint-calc-breakpoint("prev", $key, flint-get-index($key)) - $unit) ) {
                    @include flint-container($key) {
                        @content;
                    }
                }

            }
        } @else if map-has-key(map-get($flint, "breakpoints"), $key) and flint-get-value("settings", "grid") == "fluid" {
            @if flint-is-highest-breakpoint($key) {

                @media ( min-width: (flint-calc-breakpoint("next", $key, flint-get-index($key)) + $unit) ) {
                    @include flint-container {
                        @content;
                    }
                }

            } @else {

                @media ( min-width: (flint-calc-breakpoint("next", $key, flint-get-index($key)) + if(flint-is-lowest-breakpoint($key), 0, $unit)) ) and ( max-width: flint-calc-breakpoint("alias", $key, flint-get-index($key)) ) {
                    @include flint-container {
                        @content;
                    }
                }

            }
        } @else {
            @include flint-container {
                @content;
            }
        }

    //
    // Create a new instance, add to global instance map
    //
    } @else {

        // Apply individually if foundation is not set globally, but is set to true in config
        @if flint-get-value("settings", "border-box-sizing") and not $flint-foundation {
            @include _("foundation");
        }

        //
        // Recursive shorthand with no context
        //
        @if flint-is-number($key) and length($key) == 1 and $span == null

        //
        // Recursive shorthand with identical context
        //
        or flint-is-number($key) and length($key) == 1 and flint-is-number($span) and length($span) == 1
        or flint-is-number($key) and length($key) == 1 and $span == "auto"

        //
        // Recursive shorthand with differing context
        //
        or flint-is-number($key) and length($key) == 1 and flint-types-in-list($span, "number")
        or flint-is-number($key) and length($key) == 1 and $span == "auto"

        //
        // Variable shorthand with no context
        //
        or flint-types-in-list($key, "number") and $span == null

        //
        // Variable shorthand with identical context
        //
        or flint-types-in-list($key, "number") and flint-is-number($span) and length($span) == 1
        or flint-types-in-list($key, "number") and $span == "auto"

        //
        // Variable shorthand with differing context
        //
        or flint-types-in-list($key, "number") and flint-types-in-list($span, "number")
        or flint-types-in-list($key, "number") and $span == "auto" {

            // Emit erroring for invalid argument lengths
            @if flint-types-in-list($key, "number") and length($key) != length($flint-all-keys) {
                @if not $flint-development-mode {
                    @error "Invalid argument length of #{length($key)} for span. Please provide an argument for each breakpoint in your config (#{length($flint-all-keys)}). Your argument was: #{$key}";
                }
            } @else if flint-types-in-list($span, "number") and length($span) != length($flint-all-keys) {
                @if not $flint-development-mode {
                    @error "Invalid argument length of #{length($span)} for context. Please provide an argument for each breakpoint in your config (#{length($flint-all-keys)}). Your argument was: #{$span}";
                }
            } @else {

                @for $i from 1 through length($flint-all-keys) {

                    $calc-key: flint-steal-key($i);
                    $calc-span: $key;
                    $calc-context: $span;
                    $calc-gutter: $gutter;

                    @if flint-is-default($calc-key) {

                        @include flint-calculate($calc-key, $calc-span, $calc-context, $calc-gutter, $i) {
                            @content;
                        }

                    } @else {

                        @if flint-get-value("settings", "grid") == "fluid" {

                            @if flint-is-highest-breakpoint($calc-key) {

                                @media ( min-width: (flint-calc-breakpoint("next", $calc-key, $i) + $unit) ) {
                                    @include flint-calculate($calc-key, $calc-span, $calc-context, $calc-gutter, $i) {
                                        @content;
                                    }
                                }

                            } @else {

                                @media ( min-width: (flint-calc-breakpoint("next", $calc-key, $i) + if(flint-is-lowest-breakpoint($calc-key), 0, $unit)) ) and ( max-width: flint-calc-breakpoint("alias", $calc-key, $i) ) {
                                    @include flint-calculate($calc-key, $calc-span, $calc-context, $calc-gutter, $i) {
                                        @content;
                                    }
                                }

                            }

                        } @else if flint-get-value("settings", "grid") == "fixed" {

                            @if flint-is-highest-breakpoint($calc-key) {

                                @media ( min-width: flint-calc-breakpoint("alias", $calc-key, $i) ) {
                                    @include flint-calculate($calc-key, $calc-span, $calc-context, $calc-gutter, $i) {
                                        @content;
                                    }
                                }

                            } @else {

                                @media ( min-width: flint-calc-breakpoint("alias", $calc-key, $i) ) and ( max-width: (flint-calc-breakpoint("prev", $calc-key, $i) - $unit) ) {
                                    @include flint-calculate($calc-key, $calc-span, $calc-context, $calc-gutter, $i) {
                                        @content;
                                    }
                                }

                            }

                        } @else {
                            @if not $flint-development-mode {
                                @error "Invalid gutter settings in config map: #{flint-get-value('settings', 'grid')}. Valid arguments: fluid, fixed";
                            }
                        }
                    }
                }
            }

        //
        // Call by alias with no context
        //
        } @else if flint-is-string($key) and flint-is-number($span) and $context == null

        //
        // Call by alias with context
        //
        or flint-is-string($key) and flint-is-number($span) and flint-is-number($context)
        or flint-is-string($key) and flint-is-number($span) and $context == "auto" {

            // Throw error for invalid argument lengths
            @if not map-has-key(map-get($flint, "breakpoints"), $key) {
                @if not $flint-development-mode {
                    @error "Invalid argument: #{$key}. Breakpoint does not exist. Please provide a valid argument.";
                }
            } @else {

                $calc-key: $key;
                $calc-span: $span;
                $calc-context: $context;
                $calc-gutter: $gutter;

                @if flint-is-default($calc-key) {

                    @include flint-calculate ($calc-key, $calc-span, $calc-context, $calc-gutter) {
                        @content;
                    }

                } @else {

                    @if flint-get-value("settings", "grid") == "fluid" {

                        @if flint-is-highest-breakpoint($calc-key) {

                            @media ( min-width: (flint-calc-breakpoint("next", $calc-key, flint-get-index($calc-key)) + $unit) ) {
                                @include flint-calculate($calc-key, $calc-span, $calc-context, $calc-gutter) {
                                    @content;
                                }
                            }

                        } @else {

                            @media ( min-width: (flint-calc-breakpoint("next", $calc-key, flint-get-index($calc-key)) + if(flint-is-lowest-breakpoint($calc-key), 0, $unit)) ) and ( max-width: flint-calc-breakpoint("alias", $calc-key, flint-get-index($calc-key)) ) {
                                @include flint-calculate($calc-key, $calc-span, $calc-context, $calc-gutter) {
                                    @content;
                                }
                            }

                        }

                    } @else if flint-get-value("settings", "grid") == "fixed" {

                        @if flint-is-highest-breakpoint($calc-key) {

                            @media ( min-width: flint-calc-breakpoint("alias", $calc-key, flint-get-index($calc-key)) ) {
                                @include flint-calculate($calc-key, $calc-span, $calc-context, $calc-gutter) {
                                    @content;
                                }
                            }

                        } @else {

                            @media ( min-width: flint-calc-breakpoint("alias", $calc-key, flint-get-index($calc-key)) ) and ( max-width: (flint-calc-breakpoint("prev", $calc-key, flint-get-index($calc-key)) - $unit) ) {
                                @include flint-calculate($calc-key, $calc-span, $calc-context, $calc-gutter) {
                                    @content;
                                }
                            }

                        }

                    } @else {
                        @if not $flint-development-mode {
                            @error "Invalid gutter settings in config map: #{flint-get-value('settings', 'grid')}. Valid arguments: fluid, fixed";
                        }
                    }
                }
            }

        //
        // Wrap content in media query
        //
        } @else if map-has-key(map-get($flint, "breakpoints"), $key) and $span == null and $context == null
        or flint-is-list($key) and $span == null and $context == null {

            //
            // Call $key breakpoint by alias
            //
            @if length($key) == 1 {

                @if flint-get-value("settings", "grid") == "fluid" {
                    @if flint-is-highest-breakpoint($key) {
                        @media ( min-width: (flint-calc-breakpoint("next", $key, flint-get-index($key)) + $unit) ) {
                            @content;
                        }
                    } @else {
                        @media ( min-width: (flint-calc-breakpoint("next", $key, flint-get-index($key)) + if(flint-is-lowest-breakpoint($key), 0, $unit)) ) and ( max-width: flint-calc-breakpoint("alias", $key, flint-get-index($key)) ) {
                            @content;
                        }
                    }
                } @else if flint-get-value("settings", "grid") == "fixed" {
                    @if flint-is-highest-breakpoint($key) {
                        @media ( min-width: flint-calc-breakpoint("alias", $key, flint-get-index($key)) ) {
                            @content;
                        }
                    } @else {
                        @media ( min-width: flint-calc-breakpoint("alias", $key, flint-get-index($key)) ) and ( max-width: (flint-calc-breakpoint("prev", $key, flint-get-index($key)) - $unit) ) {
                            @content;
                        }
                    }
                } @else {
                    @if not $flint-development-mode {
                        @error "Invalid gutter settings in config map: #{flint-get-value('settings', 'grid')}. Valid arguments: fluid, fixed";
                    }
                }

            //
            // From $key breakpoint to infinity
            //
            } @else if flint-types-in-list($key, "string", 4) and nth($key, 1) == "from" and nth($key, 3) == "to" and nth($key, 4) == "infinity" {

                @if flint-get-value("settings", "grid") == "fluid" {
                    @media ( min-width: (flint-calc-breakpoint("next", nth($key, 2), flint-get-index(nth($key, 2))) + if(flint-is-lowest-breakpoint(nth($key, 2)), 0, $unit)) ) {
                        @content;
                    }
                } @else if flint-get-value("settings", "grid") == "fixed" {
                    @media ( min-width: flint-calc-breakpoint("alias", nth($key, 2), flint-get-index(nth($key, 2))) ) {
                        @content;
                    }
                } @else {
                    @if not $flint-development-mode {
                        @error "Invalid gutter settings in config map: #{flint-get-value('settings', 'grid')}. Valid arguments: fluid, fixed";
                    }
                }

            //
            // From $key-x breakpoint to $key-y breakpoint
            //
            } @else if flint-types-in-list($key, "string", 4) and nth($key, 1) == "from" and nth($key, 3) == "to" {

                @if flint-get-value("settings", "grid") == "fluid" {
                    @media ( min-width: (flint-calc-breakpoint("next", nth($key, 2), flint-get-index(nth($key, 2))) + if(flint-is-lowest-breakpoint(nth($key, 2)), 0, $unit)) ) and ( max-width: flint-calc-breakpoint("alias", nth($key, 4), flint-get-index(nth($key, 4))) ) {
                        @content;
                    }
                } @else if flint-get-value("settings", "grid") == "fixed" {
                     @media ( min-width: flint-calc-breakpoint("alias", nth($key, 2), flint-get-index(nth($key, 2))) ) and ( max-width: (flint-calc-breakpoint("prev", nth($key, 4), flint-get-index(nth($key, 4))) - if(flint-is-highest-breakpoint(nth($key, 4)), 0, $unit)) ) {
                        @content;
                    }
                } @else {
                    @if not $flint-development-mode {
                        @error "Invalid gutter settings in config map: #{flint-get-value('settings', 'grid')}. Valid arguments: fluid, fixed";
                    }
                }

            //
            // From $num-x to $num-y
            //
            } @else if flint-types-in-list($key, "string" "number" "string" "number", 4) and nth($key, 1) == "from" and nth($key, 3) == "to" {
                // Make sure passed units match units used in config
                @if flint-get-config-unit() == unit(nth($key, 2)) and flint-get-config-unit() == unit(nth($key, 4)) {
                    @media ( min-width: nth($key, 2) ) and ( max-width: nth($key, 4) ) {
                        @content;
                    }
                // Throw error
                } @else {
                    @if not $flint-development-mode {
                        @error "Passed units [#{unit(nth($key, 2))}, #{unit(nth($key, 4))}] do not match the unit used in your config map: #{flint-get-config-unit()}";
                    }
                }

            //
            // Greater than $key breakpoint
            //
            } @else if flint-types-in-list($key, "string", 3) and nth($key, 1) == "greater" and nth($key, 2) == "than" {

                @if flint-get-value("settings", "grid") == "fluid" {
                    @media ( min-width: (flint-calc-breakpoint("alias", nth($key, 3), flint-get-index(nth($key, 3))) + $unit) ) {
                        @content;
                    }
                } @else if flint-get-value("settings", "grid") == "fixed" {
                    @media ( min-width: flint-calc-breakpoint("prev", nth($key, 3), flint-get-index(nth($key, 3))) ) {
                        @content;
                    }
                } @else {
                    @if not $flint-development-mode {
                        @error "Invalid gutter settings in config map: #{flint-get-value('settings', 'grid')}. Valid arguments: fluid, fixed";
                    }
                }

            //
            // Greater than number
            //
            } @else if flint-types-in-list($key, "string" "string" "number", 3) and nth($key, 1) == "greater" and nth($key, 2) == "than" {

                @if flint-get-config-unit() == unit(nth($key, 3)) {
                    @media ( min-width: nth($key, 3) + $unit ) {
                        @content;
                    }
                } @else {
                    @if not $flint-development-mode {
                        @error "Passed units [#{unit(nth($key, 3))}] do not match the unit used in your config map: #{flint-get-config-unit()}";
                    }
                }

            //
            // Number greater than $key breakpoint
            //
            } @else if flint-types-in-list($key, "number" "string" "string" "string", 4) and nth($key, 2) == "greater" and nth($key, 3) == "than" {

                @if flint-get-config-unit() == unit(nth($key, 1)) {
                    @media ( min-width: (flint-calc-breakpoint("alias", nth($key, 4), flint-get-index(nth($key, 4))) + nth($key, 1)) ) {
                        @content;
                    }
                } @else {
                    @if not $flint-development-mode {
                        @error "Passed units [#{unit(nth($key, 1))}] do not match the unit used in your config map: #{flint-get-config-unit()}";
                    }
                }

            //
            // Less than $key breakpoint
            //
            } @else if flint-types-in-list($key, "string", 3) and nth($key, 1) == "less" and nth($key, 2) == "than" {

                @if flint-get-value("settings", "grid") == "fluid" {
                    @media ( max-width: flint-calc-breakpoint("next", nth($key, 3), flint-get-index(nth($key, 3))) ) {
                        @content;
                    }
                } @else if flint-get-value("settings", "grid") == "fixed" {
                    @media ( max-width: (flint-calc-breakpoint("alias", nth($key, 3), flint-get-index(nth($key, 3))) - $unit) ) {
                        @content;
                    }
                } @else {
                    @if not $flint-development-mode {
                        @error "Invalid gutter settings in config map: #{flint-get-value('settings', 'grid')}. Valid arguments: fluid, fixed";
                    }
                }

            //
            // Less than number
            //
            } @else if flint-types-in-list($key, "string" "string" "number", 3) and nth($key, 1) == "less" and nth($key, 2) == "than" {

                @if flint-get-config-unit() == unit(nth($key, 3)) {
                    @media ( max-width: nth($key, 3) - $unit ) {
                        @content;
                    }
                } @else {
                    @if not $flint-development-mode {
                        @error "Passed units [#{unit(nth($key, 3))}] do not match the unit used in your config map: #{flint-get-config-unit()}";
                    }
                }

            //
            // Number less than $key breakpoint
            //
            } @else if flint-types-in-list($key, "number" "string" "string" "string", 4) and nth($key, 2) == "less" and nth($key, 3) == "than" {

                @if flint-get-config-unit() == unit(nth($key, 1)) {
                    @media ( max-width: (flint-calc-breakpoint("alias", nth($key, 4), flint-get-index(nth($key, 4))) - nth($key, 1)) ) {
                        @content;
                    }
                } @else {
                    @if not $flint-development-mode {
                        @error "Passed units [#{unit(nth($key, 1))}] do not match the unit used in your config map: #{flint-get-config-unit()}";
                    }
                }

            //
            // For $key-x $key-y $key-z
            //
            } @else if flint-types-in-list($key, "string") and nth($key, 1) == "for" {
                // Define empty query list
                $query: ();

                //
                // Build out comma delimited query list for each breakpoint
                //
                @for $i from 1 through length($key) {
                    $calc-key: nth($key, $i);

                    @if map-has-key(map-get($flint, "breakpoints"), $calc-key) {
                        @if flint-get-value("settings", "grid") == "fluid" {
                            @if flint-is-highest-breakpoint($calc-key) {
                                $query: append($query, unquote('( min-width: #{(flint-calc-breakpoint("next", $calc-key, flint-get-index($calc-key)) + $unit)} )'), "comma");
                            } @else {
                                $query: append($query, unquote('( min-width: #{(flint-calc-breakpoint("next", $calc-key, flint-get-index($calc-key)) + if(flint-is-lowest-breakpoint($calc-key), 0, $unit))} ) and ( max-width: #{flint-calc-breakpoint("alias", $calc-key, flint-get-index($calc-key))} )'), "comma");
                            }
                        } @else if flint-get-value("settings", "grid") == "fixed" {
                            @if flint-is-highest-breakpoint($calc-key) {
                                $query: append($query, unquote('( min-width: #{flint-calc-breakpoint("alias", $calc-key, flint-get-index($calc-key))} )'), "comma");
                            } @else {
                                $query: append($query, unquote('( min-width: #{flint-calc-breakpoint("alias", $calc-key, flint-get-index($calc-key))} ) and ( max-width: #{(flint-calc-breakpoint("prev", $calc-key, flint-get-index($calc-key)) - $unit)} )'), "comma");
                            }
                        } @else {
                            @if not $flint-development-mode {
                                @error "Invalid gutter settings in config map: #{flint-get-value('settings', 'grid')}. Valid arguments: fluid, fixed";
                            }
                        }
                    } @else {
                        @if not $calc-key == "for" {
                            @if not $flint-development-mode {
                                @error "Invalid argument: #{$calc-key}. Breakpoint does not exist. Please provide a valid argument.";
                            }
                        }
                    }
                }

                @media #{$query} {
                  @content;
                }
            }

        //
        // Invalid argument
        //
        } @else {
            @if $key != "clear" {
                @if not $flint-development-mode {
                    @error "Invalid argument(s). Please double check and provide a valid argument. If you're calling by alias, please provide a single span argument for your breakpoint. See documentation for additional details.";
                }
            }
        }
    }
}
