// Colors
$black: hsl(0, 0%, 4%);
$black-bis: hsl(0, 0%, 7%);
$black-ter: hsl(0, 0%, 14%);
$grey-darker: hsl(0, 0%, 21%);
$grey-dark: hsl(0, 0%, 29%);
$grey: hsl(0, 0%, 48%);
$grey-light: hsl(0, 0%, 71%);
$grey-lighter: hsl(0, 0%, 86%);
$white-ter: hsl(0, 0%, 96%);
$white-bis: hsl(0, 0%, 98%);
$white: hsl(0, 0%, 100%);
$orange: hsl(14, 100%, 53%);
$yellow: hsl(48, 100%, 67%);
$green: hsl(141, 71%, 48%);
$turquoise: hsl(171, 100%, 41%);
$cyan: hsl(204, 86%, 53%);
$blue: hsl(217, 71%, 53%);
$purple: hsl(271, 100%, 71%);
$red: hsl(348, 100%, 61%);
// Hudson Colors
$black: #000000;
$light: #60b0e2;
$dark: #04202b;
$primary: #215e94;
$info: #9f9f9f;
$brightyellow: #fdbe11;
$mediumblue: #4295d1;
//style guide colors
$carbongrey: #494b5a;
$lightgray: #f6f6f6;
$lightgray-opacity: #a7bdd1;
$darkergrey: #e3e3e5;
$triangle-career-gray: #ebecec;
// base colors
$darkblue: #26588d;
$lightblue: #38c2d8;
$lighterblue: #49d5eb;
$gray: #c7c8c9;
$white: #ffffff;
$shadow-color: rgba($black, .25);
$shadow-color-50: rgba($black, .50);
$gradient-darkblue: rgba(#26588d, .5);
$gradient-lightblue: rgba(#3e8dc8, .5);
$transparent-white: rgba($white, .5);
// menu animations desktop
$menuItems: 7;
$menuItemsLoop: $menuItems - 1;
$menuWidth: (100/$menuItems) * 1%;
$menuGap: 25%;
// Typography
$styleguide-titles-font-family: 'FFDINStdBold',
Arial,
Helvetica,
sans-serif;
$styleguide-regular-font-family: 'FFDINStdRegular',
Arial,
Helvetica,
sans-serif;
$styleguide-regular-italic-font-family: 'FFDINStdRegularItalic',
Arial,
Helvetica,
sans-serif;
$styleguide-medium-font-family: 'FFDINStdMedium',
Arial,
Helvetica,
sans-serif;
$styleguide-medium-italic-font-family: 'FFDINStdMediumItalic',
Arial,
Helvetica,
sans-serif;
$styleguide-default-font-family: 'Merriweather',
Arial,
Helvetica,
sans-serif;
$styleguide-bold-font-family: 'FFDINStdBold',
Arial,
Helvetica,
sans-serif;
$styleguide-bold-italic-font-family: 'FFDINStdBoldItalic',
Arial,
Helvetica,
sans-serif;
$styleguide-font-size: 1.5rem;
$family-sans-serif: BlinkMacSystemFont,
-apple-system,
'Segoe UI',
'Roboto',
'Oxygen',
'Ubuntu',
'Cantarell',
'Fira Sans',
'Droid Sans',
'Helvetica Neue',
'Helvetica',
'Arial',
sans-serif !default;
$family-monospace: monospace;
$render-mode: optimizeLegibility;
$global-font-size: 16px;
$size-1: 3rem;
$size-2: 2.5rem;
$size-3: 2rem;
$size-4: 1.5rem;
$size-5: 1.25rem;
$size-6: 1rem;
$size-7: .75rem;
$weight-light: 300;
$weight-normal: 400;
$weight-medium: 500;
$weight-semibold: 600;
$weight-bold: 700;
// Responsiveness
// The container horizontal gap, which acts as the offset for breakpoints
$gap: 64px;
$mobile: 320px;
// 768px container
$tablet: 768px;
// 1024px container
$desktop: 1024px;
// 1280px container
$widescreen: 1280px;
$widescreen-enabled: true;
// 1366 container
$fullhd: 1366px;
$fullhd-enabled: true;
// Miscellaneous
$easing: ease-out;
$radius-small: rem-calc(2);
$radius: rem-calc(4);
$radius-large: 6px;
$radius-rounded: 290486px;
$speed: 86ms;
$gradient-angle: -50deg;
$gradient-angle-differentiators: 122deg;
$gradient-angle-values-carousel: 212deg;
$gradient-angle-benefits-desktop: 30deg;
$gradient-angle-benefits-mobile: 17deg;
// Flags
$variable-columns: true;
