// font sizes
$font-size-xs:          .75rem;
$font-size-sm:          1rem;
$font-size-md:          1.25rem;
$font-size-lg:          1.75rem;
$font-size-xl:          3rem;

// margins/paddings
$margin-xxs:            .25rem;
$margin-xs:             .5rem;
$margin-sm:             .75rem;
$margin-md:             1rem;
$margin-lg:             1.5rem;
$margin-xl:             2rem;

// border radius
$radius-sm:             2px;
$radius-md:             4px;
$radius-lg:             6px;

// transitions
$transition-sm:         100ms;
$transition-md:         250ms;
$transition-lg:         350ms;

// colors
$brand-primary:         #263238;
$brand-secondary:       #78909C;
$brand-tertiary:        #e2f1f8;

$color-gray-light:      #efefef;
$color-gray-lighter:    lighten($color-gray-light, 0.5%);
$color-gray-lightest:   lighten($color-gray-light, 2%);
$color-gray-medium:     #c8c8c8;
$color-gray-dark:       #787878;
$color-gray-darker:     #2A2A2A;
$color-bluish-light:    lighten($brand-tertiary, 3%);

$color-100:             #CFD8DC;
$color-600:             #546E7A;

$color-lightest:        #FFFFFF;
$color-darkest:         #2A2A2A;
$color-focus:           #d32f2f;

// responsive breakpoints
$breakpoints: (
  'sm': 767px,
  'md': 992px,
  'lg': 1200px
) !default;