/*
|------------------------------------------------------------------------------
| Base variables
|------------------------------------------------------------------------------
*/
// Border radius
$base-border-radius: 2px !default;

// Default colors
// $off-white: #FCFCFC !default;
$off-white: #FBFBFB !default;
$dark-gray: #333 !default;
$medium-gray: #999 !default;
$light-gray: #e1e1e1 !default;
$blue: #477dca !default;

// Ubiquitous colors
$base-background-color: $off-white !default;
$success-color: green !default;
$error-color: red !default;
$link-color: $blue !default;
$separator-color: $light-gray !default;
$disabled-bg-color: #eee !default;
$disabled-color: #d5d5d5 !default;

// Font colors
$base-font-color: $dark-gray !default;
$header-font-color: $dark-gray !default;
$soft-font-color: #8C8788 !default;

// Color themes
$primary-color: #10aee0 !default;
$secondary-color: #33c3f0 !default;
$tertiary-color: #333 !default;

// $primary-color: #EE6E73 !default;
// $secondary-color: #F3989B !default;


/*
|------------------------------------------------------------------------------
| Badges
|------------------------------------------------------------------------------
*/
$badge-bg-color: $secondary-color !default;


/*
|------------------------------------------------------------------------------
| Buttons
|------------------------------------------------------------------------------
*/
// Height
$btn-height: 40px !default;
$btn-large-height: 42px !default;
$btn-huge-height: 50px !default;

// Padding
$btn-padding: 0 14px !default;
$btn-large-padding: 0 44px !default;
$btn-huge-padding: 0 46px !default;

// Color
$button-bg-color: $secondary-color !default;
$button-hollow-color: $secondary-color !default;
$button-hollow-hover-color: $base-background-color !default;
$button-bright-color: #fff !default;
$button-bright-hover-color: $base-font-color !default;
$button-disabled-color: $disabled-color !default;


/*
|------------------------------------------------------------------------------
| Collections
|------------------------------------------------------------------------------
*/
$collection-active-bg-color: $secondary-color !default;
$collection-active-color: lighten($secondary-color, 55%) !default;
$collection-hover-bg-color: #F5F5F5 !default;


/*
|------------------------------------------------------------------------------
| Forms
|------------------------------------------------------------------------------
*/
$input-height: 42px !default;


/*
|------------------------------------------------------------------------------
| Grid
|------------------------------------------------------------------------------
*/
// Breakpoints
$bp-larger-than-mobile    : "min-width: 400px" !default;
$bp-larger-than-phablet   : "min-width: 550px" !default;
$bp-larger-than-tablet    : "min-width: 750px" !default;
$bp-larger-than-desktop   : "min-width: 1000px" !default;
$bp-larger-than-desktophd : "min-width: 1200px" !default;

// Grid Variables
$container-width: 960px !default;
$container-width-larger-than-mobile: 85% !default;
$container-width-larger-than-phablet: 80% !default;
$total-columns: 12 !default;
$column-width: 100 / $total-columns !default; // calculates individual column width based off of # of columns
$column-margin: 4% !default; // space between columns


/*
|------------------------------------------------------------------------------
| Typography
|------------------------------------------------------------------------------
*/
@import url(https://fonts.googleapis.com/css?family=Source+Sans+Pro:400,300,600,700);
// @import url(https://fonts.googleapis.com/css?family=Open+Sans:400,300,700);
// @import url(https://fonts.googleapis.com/css?family=Roboto:300,100,400,500,700);
// @import url(https://fonts.googleapis.com/css?family=EB+Garamond);

$base-font-family: 'Source Sans Pro', sans-serif !default;
// $base-font-family: 'Open Sans', sans-serif;
// $base-font-family: 'Roboto', sans-serif;
// $base-font-family: 'EB Garamond', serif;

// $heading-font-family: 'Open Sans', sans-serif;