/**
 * Variables
 */

// site variables
$page-gutter: 60px;

// options
$enable-rounded:            true !default;
$enable-shadows:            false !default;
$enable-gradients:          false !default;
$enable-transitions:        true !default;
$enable-hover-media-query:  false !default;
$enable-grid-classes:       true !default;
$enable-print-styles:       true !default;

// base colors
$white:  #fff    !default;
$black:  #000    !default;
$red:    #d9534f !default;
$orange: #f0ad4e !default;
$yellow: #ffd500 !default;
$green:  #5cb85c !default;
$blue:   #0275d8 !default;
$teal:   #5bc0de !default;
$pink:   #ff5b77 !default;
$purple: #613d7c !default;

// grayscale
$gray-darkest:   darken(#292b2c, 10%) !default;
$gray-darker:    #292b2c !default;
$gray-dark:      lighten(#292b2c, 10%) !default;
$gray:           #464a4c !default;
$gray-light:     #636c72 !default;
$gray-lighter:   #eceeef !default;
$gray-lightest:  #f7f9f9 !default;

// semantic colors
$brand-primary:  $blue      !default;
$brand-success:  $green     !default;
$brand-info:     $teal      !default;
$brand-warning:  $orange    !default;
$brand-danger:   $red       !default;
$brand-inverse:  $gray-dark !default;

//
// links - style anchor elements
//

$link-color:            $brand-primary !default;
$link-decoration:       none !default;
$link-hover-color:      darken($link-color, 15%) !default;
$link-hover-decoration: underline !default;

// headers
$header-heading-color: #fff;
$header-bg-color: #31b0d5;
$header-bg-color-secondary: darken($header-bg-color, 15%);
$section-headings-color: $header-bg-color;

// font families
$font-family-sans-serif: "Railway", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif !default;
$font-family-serif:     Georgia, "Times New Roman", Times, serif !default;
$font-family-monospace: "Roboto Mono", Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace !default;
$font-family-headings:  "Roboto", $font-family-sans-serif;

// font sizes
$font-size-base: 1rem    !default; // Assumes the browser default, typically `16px`
$font-size-lg:   1.25rem !default;
$font-size-sm:   .875rem !default;
$font-size-xs:   .75rem  !default;

// font weights
$font-weight-normal: normal !default;
$font-weight-bold:   bold   !default;
$font-weight-base:   $font-weight-normal !default;

// borders
$border-color:       #dce6f0;
$border-width:       1px !default;
$border-radius:      .25rem !default;
$border-radius-lg:   .3rem  !default;
$border-radius-sm:   .2rem  !default;

// vertical padding
$vertical-spacing: 1rem;

// list padding
$list-inline-padding: 5px !default;

//
// Elements
//

// body
$body-text-color: #606c71;
$body-link-color:    #2b7cb9;

// tables
$table-border-color: #e9ebec;

// Blockquotes
$blockquote-text-color: #819198;
$blockquote-small-color:  $gray-light !default;
$blockquote-font-size:    ($font-size-base * 1.25) !default;
$blockquote-border-color: $gray-lighter !default;
$blockquote-border-width: .25rem !default;

// code
$code-font-size:     .9rem          !default;
$code-padding-x:     .4rem          !default;
$code-padding-y:     .2rem          !default;
$code-color:         #bd4147        !default;
$code-bg:            $gray-lightest !default;

// code
$code-bg-color:      #f3f6fa;
$code-text-color:    #567482;

// keyboard
$kbd-color:                   $white            !default;
$kbd-bg:                      $gray-dark        !default;
$nested-kbd-font-weight:      $font-weight-bold !default;
$kbd-box-shadow:              inset 0 -.1rem 0 rgba($black, .25) !default;

// pre-formatted text
$pre-color:                   $gray-dark     !default;
$pre-scrollable-max-height:   340px          !default;
$pre-border-color:            340px          !default;

// hr
$hr-border-color: rgba($black,.1) !default;
$hr-border-width: $border-width   !default;


//
// grid
//

// breakpoints
$large-breakpoint:  64em;
$medium-breakpoint: 42em;

$grid-columns:               12 !default;
$grid-gutter-width-base:     30px !default;
$grid-gutter-widths: (
  xs: $grid-gutter-width-base,
  sm: $grid-gutter-width-base,
  md: $grid-gutter-width-base,
  lg: $grid-gutter-width-base,
  xl: $grid-gutter-width-base
) !default;

$grid-breakpoints: (
  xs: 0,
  sm: 576px,
  md: 768px,
  lg: 992px,
  xl: 1200px
) !default;

//
// components
//

// masthead
$masthead-padding:  2rem !default;
$masthead-bg:       $gray-lighter !default;
