// ==========================================================================
// Base – Variables
// ==========================================================================

// Global Typography
@base-background-color:                         #fff;
@base-font-family:                              sans-serif;
@base-font-size:                                16;
@base-line-height:                              22;
@base-font-weight:                              400;
@base-font-color:                               #000;
@base-link-color:                               #000;
@base-link-hover-color:                         #000;

// Headings
@base-heading-font-family:                      sans-serif;
@base-h1-font-size:                             32;
@base-h1-line-height:                           38;
@base-h1-font-weight:                           700;
@base-h1-color:                                 #000;
@base-h2-font-size:                             26;
@base-h2-line-height:                           32;
@base-h2-font-weight:                           700;
@base-h2-color:                                 #000;
@base-h3-font-size:                             22;
@base-h3-line-height:                           28;
@base-h3-font-weight:                           700;
@base-h3-color:                                 #000;
@base-h4-font-size:                             18;
@base-h4-line-height:                           24;
@base-h4-font-weight:                           700;
@base-h4-color:                                 #000;
@base-h5-font-size:                             16;
@base-h5-line-height:                           22;
@base-h5-font-weight:                           700;
@base-h5-color:                                 #000;
@base-h6-font-size:                             14;
@base-h6-line-height:                           20;
@base-h6-font-weight:                           700;
@base-h6-color:                                 #000;

// Blockquotes
@base-blockquote-font-family:                   sans-serif;
@base-blockquote-font-size:                     22;
@base-blockquote-line-height:                   28;

// Code
@base-code-font-family:                         monospace, monospace;
@base-code-font-size:                           13;
@base-code-line-height:                         18;
@base-code-color:                               #000;
@base-code-background-color:                    transparent;
@base-code-border-color:                        #d7d7d7;

// Forms
@base-input-height:                             36px;
@base-input-placeholder-color:                  #999;
@base-input-color:                              #000;
@base-input-background-color:                   #fff;
@base-input-background-focus-color:             #fff;
@base-input-border-color:                       #ccc;
@base-input-border-focus-color:                 #f7c723;
@base-select-box-height:                        36px;

// Grid Alignment
@grid-alignment:                                left;

// Grid Containers
@container:                                     100%;
@container-m:                                   720px;
@container-l:                                   960px;
@container-xl:                                  1120px;

// Grid Gutters
@grid-gutter:                                   15px;
@grid-gutter-m:                                 15px;
@grid-gutter-l:                                 15px;
@grid-gutter-xl:                                15px;

// Responsive Breakpoints
@breakpoint-m:                                  (@container-m + 20);
@breakpoint-l:                                  (@container-l + 20);
@breakpoint-xl:                                 (@container-xl + 20);