/* COLOURS */

$johnston-black: #03071C;
$beck-blue: #0019A8;
$dark: #2D3039;
$grey90: #637282;
$grey70: #86909E;
$grey50: #C1C8D2;
$grey30: #E1E4E8;
$grey10: #F2F4F5;
$grey5: #F7F9FA;
$white: #FFFFFF;

$yellow: #FAB928;
$yellow-light: #FDEBCE;
$blue-light: #F2F4FF;
$blue-dark: #000C51;
$turquoise: #00727D;
$green: #00A95D;
$red-light: #FBE9E8;
$red: #DC241F;

$mappage-header-height: 60px;

$body-font: Johnston100-Light, Arial, Helvetica, sans-serif;
$meta-font: Johnston100-Light, Arial, Helvetica, sans-serif;
$heading-font: Johnston100-Regular, Arial, Helvetica, sans-serif;
$bold-font: Johnston100-Medium, Arial, Helvetica, sans-serif;

/* Primary is white on bluey */
$primary: $beck-blue;
$primary_b: $johnston-black;
$primary_text: $johnston-black;

$link-color: $beck-blue;
$link-hover-color: $blue-dark;

$base_bg: $white;
$base_fg: $johnston-black;

$map_nav_bg: $johnston-black;
$nav_fg: $white;
$nav_fg_hover: $primary;

$col_click_map: $beck-blue;

$col_fixed_label: #00BD08;
$col_fixed_label_dark: #4B8304;

$header-top-border: false;

@mixin tflbutton {
  background: $beck-blue;
  border-radius: 22.5px;
  font-family: $heading-font;
  padding: 0.7em 2em;
  display: inline-block;
  border: 0;
  color: $white !important;
  &:hover,
  &:active,
  &:focus {
    background: transparent;
    background-color: $blue-dark;
    color: $white !important;
  }
}

@mixin tflfield {
  border: 1px solid $dark;
  border-radius: 2px;
  font-family: $body-font;
  background-color: $white;
  box-shadow: none;
  padding: 0.4em;
}