// Variables

// Fonts

$vital-sass-asset-helper: false !default;

$font: "Helvetica Neue", Helvetica, Sans-Serif !default;
$code: "Monaco", Menlo, Courier !default;
$icons: "icons", helvetica, Sans-Serif !default;

// App Colors

$notice: #FFE0A3 !default;
$body: #FAFAFA !default;
$page: #FFF !default;

// Base Colors

$white: #FFF !default;
$black: #000 !default;

$gray-dark: #333 !default;
$gray: #666 !default;
$gray-medium: #999 !default;
$gray-light: #BBB !default;
$gray-lighter: #EEE !default;
$gray-lightest: #F9F9F9 !default;

$red-dark: #AA2227 !default;
$red: #C9282E !default;
$red-bright: #FF0008 !default;

$orange: #E16E00 !default;
$orange-bright: #F97908 !default;

$yellow: #D5B778 !default;
$yellow-bright: #F1CE86 !default;

$green: #6BAF56 !default;
$green-bright: #85DB6A !default;

$blue: #5A9FC8 !default;
$blue-bright: #66B7E7 !default;

// Background Colors

$bg-gray-lgihter: $gray-lighter !default;
$bg-transparent: rgba(0, 0, 0, 0.1) !default;
$bg-tab: $gray-light !default;

// Gradated Background Colors

$bg-default: linear-gradient(to bottom right, #4B99CB, #91E1B9) !default;
$bg-default-fallback: #4B99CB !default;
$bg-red: linear-gradient(to bottom right, #C9282E, #A60052) !default;
$bg-red-fallback: #A8002D !default;
$bg-orange: linear-gradient(to bottom right, #EE495C, #F09259) !default;
$bg-orange-fallback: #EE495C !default;
$bg-green: linear-gradient(to bottom right, #73B558, #45D093) !default;
$bg-green-fallback: #52BB5C !default;
$bg-blue: linear-gradient(to bottom right, #25639A, #1F9CEA) !default;
$bg-blue-fallback: #1C6AB9 !default;

$bg-black: linear-gradient(to bottom right, #222, #333) !default;
$bg-black-fallback: #252525 !default;
$bg-gray: linear-gradient(to bottom right, #888, #CCC) !default;
$bg-gray-fallback: #9A9A9A !default;
$bg-gray-medium: linear-gradient(to bottom right, #666, #777) !default;
$bg-gray-medium-fallback: #666 !default;
$bg-gray-light: linear-gradient(to bottom right, #DDD, #EEE) !default;
$bg-gray-light-fallback: #DDD !default;
$bg-gray-lighter: linear-gradient(to bottom right, #EEE, #f9f9f9) !default;
$bg-gray-lighter-fallback: #EEE !default;
$bg-gray-lightest: linear-gradient(to bottom right, #F9F9F9, #FFF) !default;
$bg-gray-lightest-fallback: #F9F9F9 !default;

// Hover

$link: $red !default;
$hover: $red-bright !default;
$focus: rgba(255, 0, 0, 0.2) !default;

// Header

$header-background-color: #FFF !default;
$header-dropdown-menu-padding: 1.24em 1.3em !default;
$header-dropdown-submenu-padding: 0.7em 1.5em !default;
$header-height: 4.25em !default;
$header-link-hover: #EEE !default;
$header-link: #333 !default;
$header-menu-background-color-dark: #222 !default;
$header-menu-background-color: #FFF !default;
$header-menu-border-color-dark: #111 !default;
$header-menu-border-color: #EEE !default;
$header-menu-line-height: 1.82 !default;
$header: #FFF !default;

// Typography

$text: #444 !default;
$bold: 500 !default;

// Transitions

$standard-animation-speed: 200ms !default;
$all: all $standard-animation-speed ease-in-out !default;
$color: color $standard-animation-speed ease-in-out !default;

// GPU Trickery

$translate: translateZ(0) !default;

// Radius

$radius: 0.15em !default;
$round: 99em !default;

// Grid

$grid-padding: 2% !default;

// Loaders

$loader-large: 48px !default;
$loader: 32px !default;
$loader-small: 16px !default;
$loader-smallest: 9px !default;

// Forms

$size: 1em !default;
$border-width: 1px !default;
$input-left-right-padding: 0.5em !default;
$input-checkbox-checked: $link !default;
$input-background-color: #FFF !default;
$input-background-color-hover: #F8F8F8 !default;
$input-height: 2.7em !default;

// Breakpoints

$desktop-large: 1680px !default;
$desktop: 1440px !default;
$laptop: 1280px !default;
$tablet: 1080px !default;
$phablet: 860px !default;
$phablet-handheld: 780px !default;
$handheld: 667px !default;
$handheld-portrait: 334px !default;

// Characters

$non-breaking-space: " " !default;

// Vectors

$svg-arrow-updown: 'data:image/svg+xml;utf8,<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="512px" height="512px" viewBox="0 0 512 512" style="enable-background:new 0 0 512 512;" xml:space="preserve"><polyline points="114.3,212.8 388,212.8 251.1,0 114.3,212.8 "/><polyline points="388,297.9 114.3,297.9 251.1,510.7 388,297.9 "/></svg>';
