// Grid
$grid-columns: 12 !default; // Set number of columns in the grid

$xs-max: 40rem !default; // Set xs breakpoint's max width
$sm-max: 64rem !default; // Set sm breakpoint's max width
$md-max: 90rem !default; // Set md breakpoint's max width
$lg-max: 120rem !default; // Set lg breakpoint's max width

$gutter: 1rem !default; // Set gutter size

$content-well-max-width: "none" !default; // Set the max-width of the content well

$sm-start: ($xs-max + 1); // Generate sm breakpoint's min width
$md-start: ($sm-max + 1); // Generate md breakpoint's min width
$lg-start: ($md-max + 1); // Generate lg breakpoint's min width
$xl-start: ($lg-max + 1); // Generate xl breakpoint's min width

// Breakpoints
// Create breakpoint range statements to be used in media queries
$breakpoint-xs-only: "only screen and (max-width: #{$xs-max})"; // 0 -> xs-max range
$breakpoint-sm-up: "only screen and (min-width: #{$sm-start})"; // sm-start -> up range
$breakpoint-sm-only: "only screen and (min-width: #{$sm-start}) and (max-width: #{$sm-max})"; // sm-start -> sm-max range
$breakpoint-md-up: "only screen and (min-width: #{$md-start})"; // md-start -> up range
$breakpoint-md-only: "only screen and (min-width: #{$md-start}) and (max-width: #{$md-max})"; // md-start -> md-max range
$breakpoint-lg-up: "only screen and (min-width: #{$lg-start})"; // lg-start -> up range
$breakpoint-lg-only: "only screen and (min-width: #{$lg-start}) and (max-width: #{$lg-max})"; // lg-start -> lg-max range
$breakpoint-xl-up: "only screen and (min-width: #{$xl-start})"; // xl-start -> up range

$breakpoints-all: ($breakpoint-xs-only, $breakpoint-sm-up, $breakpoint-sm-only, $breakpoint-md-up, $breakpoint-md-only, $breakpoint-lg-up, $breakpoint-lg-only, $breakpoint-xl-up);
$breakpoint-ups: ($breakpoint-sm-up, $breakpoint-md-up, $breakpoint-lg-up, $breakpoint-xl-up);
$breakpoint-all-prefixes: ("xs", "xs-only", "sm", "sm-only", "md", "md-only", "lg", "lg-only", "xl");
$breakpoint-up-prefixes: ("xs", "sm", "md", "lg", "xl");
