// Variables
// -----------------------------------------------
// -----------------------------------------------

// Google Fonts
@import url('https://fonts.googleapis.com/css?family=Montserrat:400,500,600');

// Colors
$brand-primary: rgb(255, 111, 0);
$brand-secondary: rgb(255, 143, 0);
$brand-tertiary: rgb(255, 160, 0);
$gray-primary: rgb(33, 46, 52);
$gray-secondary: rgb(99, 108, 113);
$white: rgb(255, 255, 255);
$link-color: $brand-secondary;
$link-hover: darken($brand-secondary, 10%);

// Typography
$base-font-family: 'Montserrat', sans-serif;
$header-font-family: $base-font-family;
$code-font-family: 'Source Code Pro', monospace;
$base-font-color: $gray-secondary;
$header-font-color: $gray-primary;
$font-regular: 400;
$font-medium: 500;
$font-semibold: 600;
$font-bold: 700;
$base-font-size: 14px;
$base-line-height: 1.6;
// Sizes
$base-point-grid: 8px;
// Animation
$base-duration: 350ms;
$base-timing: ease;

// Breakpoint
$bp-small: 480px;
$bp-medium: 768px;
$bp-large: 992px;
$bp-xlarge: 1130px;
// Border
$border-color: rgba($gray-primary, 0.1);

// Grid
// -----------------------------------------------
$column-1: (1/12*100%);
$column-2: (2/12*100%);
$column-3: (3/12*100%);
$column-4: (4/12*100%);
$column-5: (5/12*100%);
$column-6: (6/12*100%);
$column-7: (7/12*100%);
$column-8: (8/12*100%);
$column-9: (9/12*100%);
$column-10: (10/12*100%);
$column-11: (11/12*100%);
$column-12: (12/12*100%);
$gutter-margin: ($base-point-grid * 4);
