// Font stacks
$primary-font-stack: 'Montserrat', sans-serif;
$secondary-font-stack: 'Lato', sans-serif;

// Primary Colors
//
// Colors used throughout the project. Even though some have a name tied to specific components ("$primary-font-color" for fonts) they can be used on other elements to avoid writing SASS variables with duplicate values.
//
// $primary-accent-color - #1428aa; Primary accent
// $secondary-accent-color - #ee7100; Secondary accent
// $primary-font-color - #000; Primary font color
// $primary-bg-color - #fff; Primary background color
// $secondary-bg-color - #ebebeb; Secondary background color
//
// Styleguide Base.Colors
$primary-accent-color: #1428aa;
$secondary-accent-color: #ee7100;
$primary-font-color: #000;
$primary-bg-color: #fff;
$secondary-bg-color: #ebebeb;
$transition-circle-color: #ccc;

$transition-time: 0.2s;

// Breakpoints
$small-breakpoint: 576;
$tablet-breakpoint: 768;
$desktop-breakpoint: 992;
$lg-desktop-breakpoint: 1200;

// In increments of 100 to leave more than enough
// wiggle room for your component shenanigans.
$zindices: (
  underworld  : -1,
  base        : 0,
  navbar      : 100,
  mobileNav   : 200,
  menuToggle  : 300,
  secondaryPage: 400,
  transitionCircle: 1000
);

// Easing beziers
$easeOutCubic:   cubic-bezier(0.215, 0.61, 0.355, 1);
$easeInOutQuad: cubic-bezier(0.455, 0.03, 0.515, 0.955)