// ---------------------------------------------------------------------

// SCSS Settings

// ---------------------------------------------------------------------

// ----------------------------------------

// Fonts

// ----------------------------------------

// Font weights: 400 | 700

$sans-serif: 'SegoeUI', sans-serif;

$mono: 'SF-Mono', serif;

$icons: 'FabricMDL2Icons';

// ----------------------------------------

// Font Size/ Line Height

// ----------------------------------------

$main-font: $sans-serif;

$base-font-size: 16px;

$base-line-height: 1.5;

// ----------------------------------------

// Colors

// ----------------------------------------

$black: #11100F;

$white: #ffffff;

$brand: #258EDE;

$brand-dark: darken(#258EDE, 8.4%);

$gray: #11100F;

$gray: #323130;

$error: #FF3333;

// ----------------------------------------

// Breakpoints

// ----------------------------------------

$xlarge: 1280px;

$large: 1012px;

$medium: 768px;

$small: 544px;

@mixin start-at($device-width) {

@media (min-width: $device-width) {

@content;

}

}

@mixin stop-at($device-width) {

@media (max-width: $device-width - 1) {

@content;

}

}

// ----------------------------------------

// Global Variables

// ----------------------------------------

$header-breakpoint: $medium;

$transition-speed: 0.4s;

$transition: $transition-speed ease;

// cuz I no type good

$trans: $transition-speed ease;

$wrapper-percentage: 92%;

$wrapper-width: 1440px;

$wrapper-padding: (100% - $wrapper-percentage) / 2;