// Bulma Variables
//
// Customize Bulma variables
//
// Styleguide: Base.Variables

// Font directory
$font-dir: "../fonts" !default;
// Agaric icons config path
$agaricon-path: $font-dir !default;

// Colors
//
// Assign colors
//
// Styleguide: Base.Variables.Colors

// Design colors
$blue: #26599B;
$blue-light: #3276CF;
$blue-dark: #193B68;
$marine-light: #4EC6B0;
$marine: #3DB5A0;
$marine-dark: #47A191;
$berry-light: #9B6187;
$berry: #823A69;
$berry-dark: #622C4F;
$cinnamon-light: #EC623B;
$cinnamon: #DB512A;
$cinnamon-dark: #CA4019;
$dark: #0D1E34;
$grey: #E4E5E7;
$white: #FFFFFF;
$dandelion-light: #CBC219;
$dandelion: #BAB108;
$dandelion-dark: #A59E20;

// Bulma body color
$body-background: $white !default;

// Bulma primary colors
$primary: $blue !default;
$info: $blue !default;
$success: $marine !default;
$warning: $dandelion-light !default;
$danger: $cinnamon !default;
$light: $white !default;
$dark: $dark !default;

// Bulma invert colors
$orange-invert: $white !default;
$yellow-invert: $white !default;
$green-invert: $white !default;
$turquoise-invert: $white !default;
$blue-invert: $white !default;
$purple-invert: $white !default;
$red-invert: $white !default;
$primary-invert: $turquoise-invert !default;
$info-invert: $blue-invert !default;
$success-invert: $green-invert !default;
$warning-invert: $yellow-invert !default;
$danger-invert: $red-invert !default;
$light-invert: $dark !default;
$dark-invert: $white !default;

// Bulma general colors
$background: $white !default;
$border: $grey !default;
$border-hover: $grey !default;

// Bulma text colors
$text: $dark !default;
$text-invert: $white !default;
$text-light: $grey !default;
$text-strong: $dark !default;

// Bulma code colors
$code: $cinnamon !default;
$code-background: $background !default;
$pre: $text !default;
$pre-background: $background !default;

// Bulma link colors
$link: $primary !default;
$link-invert: $primary-invert !default;
$link-visited: $berry-dark !default;
$link-hover: $white !default;
$link-hover-border: $cinnamon-dark !default;
$link-focus: $white !default;
$link-focus-border: $primary !default;
$link-active: $dandelion-light  !default;
$link-active-border: $blue-light !default;
// Our added link colors
$link-hover-background: $primary !default;
$link-hover-padding: 0.25em !default;


// Fonts
//
// Set fonts
//
// Styleguide: Base.Variables.Fonts

@font-face {
  font-family: 'Poppins';
  src: url("#{$font-dir}/Poppins-400.woff2") format('woff2'), url("#{$font-dir}/Poppins-400.woff") format('woff'), url("#{$font-dir}/Poppins-400.ttf") format('truetype');
  font-weight: 400;
  font-style: normal;
}
@font-face {
  font-family: 'Poppins';
  src: url("#{$font-dir}/Poppins-700.woff2") format('woff2'), url("#{$font-dir}/Poppins-700.woff") format('woff'), url("#{$font-dir}/Poppins-700.ttf") format('truetype');
  font-weight: 700;
  font-style: normal;
}
@font-face {
  font-family: 'Anonymous Pro';
  src: url("#{$font-dir}/AnonymousPro-400.woff2") format('woff2'), url("#{$font-dir}/AnonymousPro-400.woff") format('woff'), url("#{$font-dir}/AnonymousPro-400.ttf") format('truetype');
  font-weight: 700;
  font-style: normal;
}

$family-sans-serif: 'Poppins','Century Gothic',CenturyGothic,AppleGothic,sans-serif !default;
$family-monospace: 'Anonymous Pro', 'Andale Mono', AndaleMono, monospace !default;
$render-mode: optimizeLegibility !default;


// Typography
//
// Customize type sizes and weights
//
// Weight: 3
//
// Styleguide: Base.Variables.Typography

// Bulma sizes
$size-1: 5.63rem !default;
$size-2: 3.5rem !default;
$size-3: 2.5rem !default;
$size-4: 1.75rem !default;
$size-5: 1.25rem !default;
$size-6: 0.88rem !default;
$size-7: 0.63rem !default;

// Bulma weights
$weight-light: 4300 !default;
$weight-normal: 400 !default;
$weight-medium: 400 !default;
$weight-semibold: 700 !default;
$weight-bold: 700 !default;


// Grid
//
// Customize grid dimensions
//
// Styleguide: Base.Variables.Grid

$column-gap: 1.5rem !default;


// Breakpoints
//
// Set responsive breakpoints
//
// Styleguide: Base.Variables.Breakpoints

// The container horizontal gap, which acts as the offset for breakpoints
$gap: 32px !default; // 960, 1152, and 1344 have been chosen because they are divisible by both 12 and 16
$tablet: 769px !default; // 960px container + 3rem
$desktop: 960px + (2 * $gap) !default; // 1152px container + 3rem
$widescreen: 1152px + (2 * $gap) !default; // 1344px container + 3rem
$fullhd: 1344px + (2 * $gap) !default;

$navbar-breakpoint: $tablet !default;


// Animation
//
// Animation timing
//
// Styleguide: Base.Variables.Animation

$easing: ease-out !default;
$speed: 86ms !default;


// Borders
//
// Border radius
//
// Styleguide: Base.Variables.Borders

$radius-small: 0 !default;
$radius: 0 !default;
$radius-large: 0 !default;
