Breakpoints
| Variable | Value |
|---|---|
$screen-phone |
480px |
$screen-xs |
480px |
$screen-xs-min |
480px |
$screen-xs-max |
767px |
$screen-tablet |
768px |
$screen-sm |
768px |
$screen-sm-min |
768px |
$screen-sm-max |
991px |
$screen-desktop |
992px |
$screen-md |
992px |
$screen-md-min |
992px |
$screen-md-max |
1199px |
$screen-lg-desktop |
1200px |
$screen-lg |
1200px |
$screen-lg-min |
1200px |
Color variables
| Variable | Value |
|---|---|
$white |
#ffffff |
$trans-white |
rgba(255,255,255,.85) |
$black |
#1d2021 |
$red |
#df3018 |
$darker-red |
darken($red, 5%) |
$darkest-red |
darken($red, 10%) |
$darker-grey |
#3f4243 |
$dark-grey |
#727779 |
$grey |
#bbbebf |
$light-grey |
#e8e8e8 |
$lighter-grey |
#eef0f0 |
Font variables
Font size
| Variable | Value | Description |
|---|---|---|
$base-font-size |
13px | The font size set on the root html element |
Font family
| Variable | Value | Description |
|---|---|---|
$gotham |
'Gotham SSm A', 'Gotham SSm B', $sans-serif; | The default font family set on the root html element |
$gotham-narrow |
'Gotham Narrow SSm A', 'Gotham Narrow SSm B', $sans-serif; | The emphasis font family set on h2 and h3s |
Font weight
| Variable | Value | Description |
|---|---|---|
$light |
100 | The lightest weight of Gotham/Gotham Narrow |
$book |
300 | The second to lightest weight of Gotham/Gotham Narrow |
$medium |
500 | The second to heaviest weight of Gotham/Gotham Narrow |
$bold |
700 | The heaviest weight of Gotham/Gotham Narrow |