/*
 * This vars file is based off of Bootstrap. Not all vars are used.
 *
 * The most obviously unused ones (e.g., modal windows, etc) were removed.
 * There are some vars that remain that are not actually used but
 * perhaps should be. E.g. using dropdown colours.
 */
/******************************
 Greyscale colours
 *******************************/
/******************************
 Colours
 ******************************/
/* COULD NOT LOAD FILE (../../../../../../node_modules/font-awesome/scss/variables) */
/* COULD NOT LOAD FILE (../../../../../../node_modules/font-awesome/scss/mixins) */
/*
 Use these classnames in your HTML markup:
 as-no-dpui:
 Add to things that are meant to be displayed when NOT using enhanced UI controls. These are fallback controls.
 as-dpui:
 Add to things that ARE enhanced controls. These are typically added during pageload with JS.
 with-dpx:
 Add to containers that may or may not contain enhanced controls.
 The contents of these elements are hidden until after the page is done loading. This
 reduces the "flash" as JS runs to enhance controls.
 If there are many elements on a page, you might consider putting this on a 'high'
 parent (e.g., a <form>) to hide the entire contents until page load.
 */
body .as-no-dpui {
  display: block; }

body .as-dpui {
  display: none; }

body.with-dpui .as-no-dpui {
  display: none; }

body.with-dpui .as-dpui {
  display: block; }

body.with-js .with-dpx {
  visibility: hidden; }

body.with-js .with-dpx {
  visibility: hidden; }

.without-dpui .dpx-placeholder {
  display: none; }

body.with-js.with-dpui.with-pageload-dpx-done .dpx-placeholder {
  display: none; }

body.with-js.without-dpui.with-pageload-done .with-dpx {
  visibility: visible; }

body.with-js.with-dpui.with-pageload-dpx-done .with-dpx {
  visibility: visible; }

:root {
  --brand-primary: #3A8DDE;
  --danger: #E84954;
  --warning: #EC6C4E;
  --neutral: #F8AF3C;
  --success: #54B162;
  --info: #5bc0de;
  --background-color: #F7F7F7;
  --text-color: #4C4F50;
  --text-color-lighter: #8B9293;
  --font-family-sans-serif: Lato, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
  --font-family-heading: Rubik, sans-serif;
  --font-family-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  --brand-primary-d-75: #237acf;
  --brand-primary-d-100: #2173c4;
  --brand-primary-d-125: #1f6db9;
  --brand-primary-d-150: #1d67ae;
  --brand-primary-l-100: #66a6e5;
  --brand-primary-l-250: #a7ccf0;
  --brand-primary-l-350: #d3e5f8;
  --brand-primary-yiq: #fff;
  --brand-primary-d-75-yiq: #fff;
  --brand-primary-d-100-yiq: #fff;
  --brand-primary-rgb: 58, 141, 222;
  --danger-d-75: #e42734;
  --danger-d-100: #e21c2a;
  --danger-d-125: #d61b28;
  --danger-d-150: #cb1a26;
  --danger-l-100: #ee767f;
  --danger-yiq: #fff;
  --danger-d-75-yiq: #fff;
  --danger-d-100-yiq: #fff;
  --danger-rgb: 232, 73, 84;
  --warning-d-75: #e84f2b;
  --warning-d-100: #e74620;
  --warning-d-125: #e23f18;
  --warning-d-150: #d63b17;
  --warning-l-100: #f1927c;
  --warning-yiq: #fff;
  --warning-d-75-yiq: #fff;
  --warning-d-100-yiq: #fff;
  --warning-rgb: 236, 108, 78;
  --neutral-d-75: #f7a017;
  --neutral-d-100: #f69b0b;
  --neutral-d-125: #ec9408;
  --neutral-d-150: #df8c08;
  --neutral-l-100: #fac36d;
  --neutral-yiq: #212529;
  --neutral-d-75-yiq: #212529;
  --neutral-d-100-yiq: #212529;
  --neutral-rgb: 248, 175, 60;
  --success-d-75: #469952;
  --success-d-100: #42904e;
  --success-d-125: #3e8749;
  --success-d-150: #3a7f44;
  --success-l-100: #77c182;
  --success-yiq: #fff;
  --success-d-75-yiq: #fff;
  --success-d-100-yiq: #fff;
  --success-rgb: 84, 177, 98;
  --info-d-75: #3bb4d8;
  --info-d-100: #31b0d5;
  --info-d-125: #2aaacf;
  --info-d-150: #28a1c5;
  --info-l-100: #85d0e7;
  --info-yiq: #212529;
  --info-d-75-yiq: #fff;
  --info-d-100-yiq: #fff;
  --info-rgb: 91, 192, 222;
  --tcl-danger-b-6: #79262c;
  --tcl-danger-w-6: #f3a0a6;
  --tcl-danger-w-10: #fadbdd;
  --tcl-danger-w-9: #f9cccf;
  --tcl-danger-w-9-d-50: #f6b5ba;
  --tcl-danger-b-6-d-100: #521a1e;
  --tcl-info-b-6: #2f6473;
  --tcl-info-w-6: #aadeee;
  --tcl-info-w-10: #def2f8;
  --tcl-info-w-9: #d1edf6;
  --tcl-info-w-9-d-50: #bce5f1;
  --tcl-info-b-6-d-100: #20454f;
  --tcl-success-b-6: #2c5c33;
  --tcl-success-w-6: #a6d6ad;
  --tcl-success-w-10: #ddefe0;
  --tcl-success-w-9: #cfe9d3;
  --tcl-success-w-9-d-50: #bee1c3;
  --tcl-success-b-6-d-100: #1b3920;
  --tcl-warning-b-6: #7b3829;
  --tcl-warning-w-6: #f5b3a3;
  --tcl-warning-w-10: #fbe2dc;
  --tcl-warning-w-9: #fad6cd;
  --tcl-warning-w-9-d-50: #f7c3b6;
  --tcl-warning-b-6-d-100: #54271c; }

/*
 Use this template to add custom CSS to your site.
 The code you enter here will be evaluated as SCSS which is an extension of CSS
 that adds nesting features, variables, mixins, inheritance and more.
 Read more about SCSS here: http://sass-lang.com/guide
 */