// @section Configuration Settings
// Adjust colors, font stacks, breakpoints and sizing.
//
// Typographic Scale
// (For math purposes. Actual font sizes in ems.)
// 1px, 4px, 5px, 8px, 9px, 11px, 12px, 13px, 15px, 16px, 19px, 21px, 24px, 28px, 32px, 48px, 64px, 80px, 96px
// line height: 1.5em on small screens, 1.5625em on big screens


// Colors
$color-primary: #0088cc;
$color-secondary: #fa7176;
$color-tertiary: #343d4d;
$color-accent: #800080;
$color-black: #272727;
$color-black-dark: #000000;
$color-white: #ffffff;

// $color-info: #0088cc; // Blue
// $color-success: #377f31; // Green
// $color-danger: #880e14; // Red
// $color-warning: #dba909; // Yellow
$color-code: #dd1144;

$color-gray-dark: #808080;
$color-gray-medium: #b2b2b2;
$color-gray-light: #e5e5e5;


// Font Stacks
$font-primary: Georgia, serif;
// $font-primary: "Helvetica Neue", Arial, sans-serif;
$font-enhanced: "PT Serif", serif;
// $font-enhanced: "Source Sans Pro",  sans-serif;
// $font-secondary: "Helvetica Neue", Arial, sans-serif;
$font-monospace: Menlo, Monaco, "Courier New", monospace;


// Breakpoints
$bp-xsmall: 19em;
$bp-small: 28em;
$bp-medium: 38em;
$bp-large: 60em;
$bp-xlarge: 80em;


// Sizing
$font-size: 112.5%;
$spacing: 1.5625em;
$container-width: 88%;
$container-max-width: $bp-medium;
$container-large-max-width: $bp-large;


// Grid
$grid-margins: 1.4%;
$grid-sizes: (
	// Grid width options
	// Add/remove grid's as needed
	// $name: $width
	// $name - {string} class suffix
	// $width - {string} width of the grid
	fourth: 25%,
	third: 33.33333333333%,
	half: 50%,
	two-thirds: 66.666666666667%,
	three-fourths: 75%,
	// full: 100%
);
$grid-breakpoints: (
	// Breakpoints at which to activate grid
	// Add/remove breakpoints as needed
	// ($breakpoint, $prefix-class, $include-offsets)
	// $breakpoint - {string|variable} the breakpoint
	// $prefix-class - {string|optional} class to be used with `.row` to activate grid
	// $include-offsets - {boolean} if true, include offset classes at this breakpoint
	// ($bp-xsmall, ".row-start-xsmall", false),
	// ($bp-small, ".row-start-small", false),
	($bp-medium, null, true),
);
$grid-dynamic: (
	// Create grid classes that vary in size at different breakpoints
	// Add/remove classes, breakpoints, and sizes as needed
	// ($class, $breakpoint, $width)
	// $class - {string} the grid class
	// $breakpoint - {string|variable} the breakpoint
	// $width - {string|variable} width of the grid at the breakpoint
	// (".grid-dynamic", $bp-xsmall, map-get($grid-sizes, half))
	// (".grid-dynamic", $bp-small, map-get($grid-sizes, third))
	// (".grid-dynamic", $bp-medium, map-get($grid-sizes, fourth))
);