$visual-grid: false !default;

// Typography
$base-font-family: 'Open Sans', $helvetica;
$heading-font-family: $base-font-family;

// Font Sizes
$base-font-size: rem(16);
$font-big-size: rem(33);
$font-headers-size: rem(24);
$font-medium-size: rem(14);
$font-small-size: rem(12);

// Line height
$base-line-height: 1.5;
$heading-line-height: 1.2;

// Other Sizes
$base-z-index: 0;
$button-margin: rem(8) 0;
$large-button-padding: 0 rem(27);
$large-button-padding--mobile: 0 rem(15);
$default-button-padding: rem(14) rem(38);
$small-spacing: rem(10) rem(10);
$base-spacing: rem(10) rem(30);
$banner-padding: rem(20) rem(15);
$dropdown-padding: rem(1) rem(8) 0 rem(8);
$content-padding: 0 rem(50);
$content_padding--mobile: rem(15);
$min-component-width: rem(180);

/// GLOBAL VALUES
// --------------------------------------------------

// Oct 2015 Styleguide colors
// We get the names from here
// http://chir.ag/projects/name-that-color/
// --------------------------

// Blues
$pacific-blue:          #00A7C4;
$eastern-blue:          #018EA6;
$ocean-blue:            #333B4F;
$bunting:               #293140;
$midnight-express:      #1E2532;

// Greens
$shamrock:              #22CCAA;
$niagara:               #21B498;

// Purples
$blue-gem:              #543EAC;

// Reds
$amaranth:              #E62C4F;
$cardinal:              #BC213F;

// Yellows
$golden-tainoi:         #F8C150;
$metallic-gold:         #D7A43B;

// Oranges
$dark-orange:           #FF910A;
$mango-tango:           #D97B08;

// Grays
$nero:                     #222;
$mattherhorn:              #555;
$nobel:                    #999;
$very-light-grey:          #CCC;
$gainsboro:                #DDD;

// Whites
$white-smoke:           #F7F7F7;
$white:                    #FFF;

// Error Colors
$success-color: $shamrock;
$error-color: $amaranth;
$warning-color: $golden-tainoi;

// Font Colors
$base-font-color: $mattherhorn;
$action-color: $pacific-blue;
$action-color-darker: $eastern-blue;
$hiperlink-color: $ocean-blue;


// Border
$base-border-color: $gainsboro;
$base-border-radius: rem(3);
$base-border: 1px solid $base-border-color;
$large-buttons-border: 1px solid $eastern-blue;

// Background Colors
$base-background-color: #fff;
$secondary-background-color: tint($base-border-color, 75%);

// Forms
$form-box-shadow: inset 0 1px 3px rgba(#000, 0.06);
$form-box-shadow-focus: $form-box-shadow, 0 0 5px adjust-color($action-color, $lightness: -5%, $alpha: -0.3);
$forms-spacing: rem(22);
$forms-padding: rem(8);
$forms-height: rem(40);
$padding_forms--errors: rem(32);

//Status buttons
$status-width: rem(50);
$status-height: rem(60);
$status-bigger-width: rem(75);
$status-list-padding: rem(7) rem(7) rem(7) rem(5);


// Header and nav-bar
$navbar_height: rem(60);
$header_height: rem(120);

// Breakpoints
$breakpoint-a: rem(450);
$breakpoint-b: rem(720);
$breakpoint-c: rem(1200);


// Animations
$base-duration: 150ms;
$base-timing: ease;