////
/// Vars: Grid
/// ================
/// @group vars:grid
////

//
// Breakpoint
// ##################################################
/// @prop {Size} $bp-xlarge [1440px] - the minimum size for screen size lg eXtra
$bp-xlarge: 1440px !default;
/// @prop {Size} $bp-large [1024px] - the minimum size for screen size lg
$bp-large: 1024px !default;
/// @prop {Size} $bp-medium [768px] - the minimum size for screen size md
$bp-medium: 768px !default;
/// @prop {Size} $bp-small [425px] - the minimum size for screen size sm
$bp-small: 425px !default;
/// @prop {Size} $bp-xsmall [$bp-small - 1] - the maximum size for screen size smale eXtra
$bp-xsmall: $bp-small - 1 !default;

//
// Columns
// ##################################################
/// @prop {Int} $col-qty [12] - how much columns the grid should be based of, 12 or 24 are a good match
$col-qty: 12 !default;