//  Colors
$black:        rgb(0, 0, 0) !default;
// TODO 68
$darker-grey:  rgb(85, 85, 85) !default;
// TODO 95
$dark-grey:    rgb(118, 118, 118) !default;
// TODO 163
$grey:         rgb(176, 176, 176) !default;
$grey-light:   rgb(185, 185, 185) !default;
// TODO 191
// TODO 214
$grey-lighter: rgb(242, 242, 242) !default;
$white:        rgb(255, 255, 255) !default;

$bright-green: rgb(0, 226, 152) !default;

$blue:         rgb(0, 155, 239) !default;
$green:        rgb(0, 161, 37) !default;
$light-green:  rgb(190, 255, 205) !default;
$yellow:       rgb(239, 193, 0) !default;
$light-yellow: rgb(255, 232, 145) !default;
$red:          rgb(211, 44, 76) !default;
$light-red:    rgb(255, 208, 217) !default;

// Typography

$family-sans-serif: BlinkMacSystemFont, -apple-system, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", "Helvetica", "Arial", sans-serif !default;
$family-monospace: monospace !default;
$render-mode: optimizeLegibility !default;

//  Used to dynamically load roboto from Google fonts
$use-roboto: false !default;

$body-size: 16px !default;
$body-line-height: 1.5 !default;

$size-1: 3rem !default;
$size-2: 2.5rem !default;
$size-3: 2rem !default;
$size-4: 1.5rem !default;
$size-5: 1.25rem !default;
$size-6: 1rem !default;
$size-7: 0.75rem !default;

$weight-light: 300 !default;
$weight-normal: 400 !default;
$weight-medium: 500 !default;
$weight-semibold: 600 !default;
$weight-bold: 700 !default;

// Container

//$container-offset: 60px !default;

// Grid
$columns-count: 12 !default;
$columns-gutter: 10px !default;
$columns-gutter-md: 20px !default;

$container-gap: 32px;

 //The container gap, which acts as the offset for breakpoints
//$gap: 32px !default;
// 960, 1152, and 1344 have been chosen because they are divisible by both 12 and 16
$tablet: 769px !default;
// 960px container + 3rem
$desktop: 960px + (2 * $container-gap) !default;
// 1152px container + 3rem
$widescreen: 1152px + (2 * $container-gap)  !default;
// 1344px container + 3rem
$fullhd: 1344px + (2 * $container-gap)  !default;


// Miscellaneous

$easing: ease-out !default;
$radius: 3px !default;
$radius-rounded: 290486px !default;
$speed: 86ms !default;