
// colours
$palettes: (
  blue: (
    primary : #2E57B8,
    secondary: #00A0E1,
    dark: #2146A5,
    darkest: #223E76,
    light: #AFC7FF,
    lighter: #DBE3F7,
    lightest: rgba(#DBE3F7, .5)
  ),
  white: (
    primary: #fff
  ),
  black: (
    primary: #000
  ),
  feedback: (
    success: #1c801c,
    error: #de2239
  ),
  sand: (
    primary: #f5f4f0
  ),
  gray: (
    primary: #8a9da6,
    dark: #4a596a,
    light: lighten(rgb(151, 151, 151), 20%),
    lightest: #f5f4f0
  )
);

$color-primary: #03a1de;
$color-tertiary: #294d94;
$color-white: white;
$color-soft: #8CACEE;

$color-text-1: #4a596a;

// typography – families
$font-family-1: 'Roboto', 'Helvetica Neue', Helvetica, Arial, sans-serif;

// typography – sizing
$font-size-extra-small:   10px;
$font-size-small:         12px;
$font-size-default:       14px;
$font-size-big:           16px;
$font-size-extrabig:      18px;
$font-size-huge:          22px;
$font-size-extrahuge:     32px;

// typography – weights
$font-weight-light: 300;
$font-weight-regular: 400;
$font-weight-semi-bold: 500;
$font-weight-bold: 700;

// dimensions
$size-header: 60px;

// spacing
$space-1: 8px;

// miscellaneous
$max-z-index: 9999;

// animation – timings
$animation-time: .16s;
$animation-time-2: .24s;
$animation-time-3: .5s;
$animation-time-4: .75s;

// animation – functions
$ease-in-cubic: cubic-bezier(0.550, 0.055, 0.675, 0.190);
$ease-out-cubic: cubic-bezier(0.215, 0.610, 0.355, 1.000);
$ease-in-out-cubic: cubic-bezier(0.645, 0.045, 0.355, 1.000);

$ease-in-sine: cubic-bezier(0.470, 0.000, 0.745, 0.715);
$ease-out-sine: cubic-bezier(0.390, 0.575, 0.565, 1.000);
$ease-in-out-sine: cubic-bezier(0.445, 0.050, 0.550, 0.950);

// keyframes
@-webkit-keyframes rotate {
  from { transform: rotate(0deg);}
  to { transform: rotate(360deg);}
}
@-moz-keyframes rotate {
  from { transform: rotate(0deg);}
  to { transform: rotate(360deg);}
}
@-ms-keyframes rotate {
  from { transform: rotate(0deg);}
  to { transform: rotate(360deg);}
}
@keyframes rotate {
  from { transform: rotate(0deg);}
  to { transform: rotate(360deg);}
}
