//  paths
$icon-path: "fonts" !default;
$img-path: "../img" !default;

// spacer
$spacer: 1rem !default;
$spacer-small: 0.75rem !default;
$spacer-large: 1.5rem !default;

// grid-related stuff
// [locked]
$grid-columns: 12 !default;
$grid-gutter: 10px !default; // space between each column
// https://github.com/twbs/bootstrap/blob/v4-dev/scss/mixins/_grid-framework.scss
$grid-breakpoints: (
  xs: 0, // Extra small screen / phone
  sm: 34em, // Small screen / phone
  md: 48em, // Medium screen / tablet
  lg: 62em, // Large screen / desktop
  xl: 75em// Extra large screen / wide desktop
) !default;
$container-max-widths: (
  sm: 34rem,    // 480
  md: 45rem,    // 720
  lg: 60rem,    // 960
  xl: 72.25rem  // 1140
) !default;

// type base
$font-size-small: 12px !default;
$font-size-base: 14px !default;
$font-size-h1: 36px !default;
$font-size-h2: 30px !default;
$font-size-h3: 24px !default;
$font-size-h4: 20px !default;
$font-size-h5: 16px !default;
$font-size-h6: 14px !default;
$line-height-base: 1.7 !default;

// etc base
$border-radius-base: 5px;
$border-radius-rounded: 25px;

$form-size: 34px; // basic form height
$padding-y: 6px !default;
$padding-y-small: 5px !default;
$padding-y-large: 10px !default;
$padding-x: 12px !default;
$padding-x-small: 10px !default;
$padding-x-large: 16px !default;

$mini: 12px;
$tiny: 18px;
$small: 24px;
$medium: 32px;
$big: 36px;

$modal-backdrop-zIndex: 999;
$modal-zIndex: 1000;