/**
 *
 * Base styles for this theme: colors, typography, etc.
 *
 */

/**
 * BEGIN: Variables
 */
:root {
  /* FT / Brand Identity Colors */
  --color-id-surface: #FFFFFF;
  --color-id-surface-light: #FFFFFF;
  --color-id-surface-dark: #F5F5F5;

  --color-id-secondary-900: #76151e;
  --color-id-secondary-800: #9C1414;
  --color-id-secondary-700: #BF0A0A;
  --color-id-secondary-600: #DC291E;
  --color-id-secondary-500: #F14137;
  --color-id-secondary-400: #FF6C64;
  --color-id-secondary-300: #FFA5A0;
  --color-id-secondary: var(--color-id-secondary-600);

  --color-id-primary-900: #24282A;
  --color-id-primary-800: #233136;
  --color-id-primary-700: #213B43;
  --color-id-primary-600: #2C4F5B;
  --color-id-primary-500: #3A6980;
  --color-id-primary-400: #5A8FA9;
  --color-id-primary-300: #7CA6BA;
  --color-id-primary-200: #BDD2DC; /* NRD: Extrapolated */ 
  --color-id-primary-100: #DEE9EE; /* NRD: Extrapolated */
  --color-id-primary: #2F5667;

  --color-id-altgrey-900: #1D1D1F;
  --color-id-altgrey-800: #D2D3C8;

    --color-id-grey-900: #57595C; /* NRD: Extrapolated */
  --color-id-grey-600: #A7A9AC;
  --color-id-grey-500: #BCBDC0;
  --color-id-grey-400: #D5D6D8;
  --color-id-grey-300: #F5F5F5;
    --color-id-grey-200: #F8F8F8; /* NRD: Extrapolated */
    --color-id-grey-100: #FCFCFC; /* NRD: Extrapolated */

    --color-id-black: #101012; /* NRD: Extrapolated */

    --color-id-alt: #FFE166; /* NRD: Yellow used in comps, but not provided as a hexcode */

  /* Theme Colors */
  --color-white: var(--color-id-surface);
  --color-grey: var(--color-id-grey-300);

  --color-grey-xlt: var(--color-id-grey-100);
  --color-grey-lt: var(--color-id-grey-200);
  --color-grey-dk: var(--color-id-grey-400);
  --color-grey-mdk: var(--color-id-grey-500);
  --color-grey-xdk: var(--color-id-grey-900);
  --color-grey-xxdk: var(--color-id-altgrey-900);
  --color-black: var(--color-id-black);

  --color-primary: var(--color-id-primary);
  --color-primary-inv: var(--color-id-surface);
  --color-primary-xxxlt: var(--color-id-primary-200);
  --color-primary-xxlt: var(--color-id-primary-400);
  --color-primary-xlt: var(--color-id-primary-500);
  --color-primary-lt: var(--color-id-primary-600);
  --color-primary-dk: var(--color-id-primary-700);
  --color-primary-xdk: var(--color-id-primary-800);

  --color-secondary: var(--color-id-secondary);
  --color-secondary-inv: var(--color-id-surface);
  --color-secondary-lt: var(--color-id-secondary-500);
  --color-secondary-xxlt: var(--color-id-secondary-400);
  --color-secondary-dk: var(--color-id-secondary-800);

  --color-alt1: var(--color-id-alt);
  --color-alt1-inv: var(--color-primary);

  --color-alt2: var(--color-primary);
  --color-alt2-inv: var(--color-primary-inv);

  --color-alt3: var(--color-secondary);
  --color-alt3-inv: var(--color-secondary-inv);

  --color-alt4: var(--color-grey-xdk);
  --color-alt4-inv: var(--color-white);

  --color-alt5: var(--color-primary-xlt);
  --color-alt5-inv: var(--color-white);

  --color-notice: var(--color-id-primary-300);
  --color-notice-inv: var(--color-id-grey-300);
  --color-notice-second: var(--color-alt1);
  --color-notice-second-inv: var(--color-alt1-inv);

  --color-admin-only: #FF7116; /* Orange for admin tools - based on --color-id-alt */
  --color-admin-only-lt: #ffa164;
  --color-admin-only-xlt: #fff4ed;

  /* Misc. utils */
  --op-hover: 0.85;
  /* Opacity on object hover */
  /*
  --shadow-box-a: 0 2px 1px 0 rgba(108, 108, 108, 0.14);
  --shadow-box-b: 0 2px 23px 0 rgba(205, 205, 205, 0.26);
  --shadow-box-c: 0 2px 23px 0 rgba(205, 205, 205, 0.26);
  */
  --shadow-box-a: 0 2px 1px 0 rgba(87, 89, 92, 0.16); /* --color-id-grey-900 */
  --shadow-box-b: 0 2px 23px 0 rgba(188, 189, 192, 0.33); /* --color-id-grey-500 */
  --shadow-box-c: 0 2px 23px 0 rgba(213, 214, 216, 0.33); /* --color-id-grey-400 */

  /* Letter spacing - not always connected to font sizes, so they have their own scale. */
  --size-ls-xs: -1px;
  --size-ls-sm: 1px;
  --size-ls-md: 3px;

  /* Margins - not always connected to font sizes, so they have their own scale. */
  --size-margin-sm: 24px;
  --size-margin-md: 34px;
  --size-margin-lg: 68px;
  --size-margin-xl: 108px; /* Not based on comp. : (size-xl * 2) */
  --size-margin-xxl: 140px; /* Front page boxes, etc. */
  --size-box-radius: 8px; /* Radius of rounded boxes (captions, etc.) */

  /* Borders - not always connected to font sizes, so they have their own scale. */
  --size-border-xs: 1px;
  --size-border-sm: 4px;
  --size-border-md: 8px;
  --size-border-lg: 12px;
  --size-border-xl: 16px;
}

:root {
  /* Sizes - Larger v1.                                                */
  /*   These can be used for font sizes, margins, padding, etc.        */
  /*   --ITEM-SZ-lh are line-heights when used for font sizes.         */
  /*   NOTE: Smartmenu sizes are separate.  See sm-aamds23.css.        */
  --size-xs-half: 6px;
  --size-xs: 12px;
  --size-xs-lh: 20px;
  --size-xs-alt1: 16px;
  --size-xs-alt1-lh: 22px;

  --size-sm-half: 10px;
  --size-sm: 18px;
  --size-sm-lh: 26px;
  --size-sm-alt1: 20px; /* Default for "Return to Top" text, etc. */
  --size-sm-alt1-lh: 28px;
  --size-sm-alt2: 22px; /* Rarely used */
  --size-sm-alt2-lh: 30px;

  /* Line heights for md: ~size*1.5 */
  --size-md: 24px;
  --size-md-lh: 40px;

  --size-md-alt1: 28px; /* Default for "Sign Up" text, etc. */
  --size-md-alt1-lh: 42px;
  --size-md-alt2: 32px; /* H1 on mobile, etc. */
  --size-md-alt2-lh: 48px;

  /* Line heights for lg: ~size*1.4 */
  --size-lg: 34px;
  --size-lg-lh: 48px;
  --size-lg-alt1: 42px; /* Default for "Stories of Hope" title, etc. */
  --size-lg-alt1-lh: 60px;

  /* Line heights for xxl: ~size*1.25 */
  --size-xl: 50px;
  --size-xl-lh: 63px;

  --size-xxl: 64px;
  --size-xxl-lh: 80px;
}

:root {
  /* Fonts: bootstrap_aamds23 / named method (see also: webfonts.css) */
  /*
  --font-light-family: "TTFors-Light";
  --font-light-weight: inherit;
  --font-light-style: inherit;

  --font-regular-family: "TTFors-Regular";
  --font-regular-weight: inherit;
  --font-regular-style: inherit;

  --font-medium-family: "TTFors-Medium";
  --font-medium-weight: inherit;
  --font-medium-style: inherit;

  --font-demi-bold-family: "TTFors-DemiBold";
  --font-demi-bold-weight: inherit;
  --font-demi-bold-style: inherit;

  --font-bold-family: "TTFors-Bold";
  --font-bold-weight: inherit;
  --font-bold-style: inherit;
  */
  /* --font-italic-family: "TTFors-Italic"; */
  /* --font-black-family: "TTFors-Black"; */
}

:root {
  /* Fonts: b5aamds25 / Google Fonts method (see also: webfonts.css) */
  --font-light-family: "Poppins";
  --font-light-weight: 200; /* 200 - spec, 300 - closer visually to TT Fors */
  --font-light-style: normal;

  --font-regular-family: "Poppins";
  --font-regular-weight: 300;
  --font-regular-style: normal;

  --font-medium-family: "Poppins";
  --font-medium-weight: 400;
  --font-medium-style: normal;

  --font-demi-bold-family: "Poppins";
  --font-demi-bold-weight: 600;
  --font-demi-bold-style: normal;

  --font-bold-family: "Poppins";
  --font-bold-weight: 700;
  --font-bold-style: normal;

  /* Minor size tweaks for "Poppins" */
  /* Should be folded into the --size* variables after testing. #TODO */
  --size-sm: 17.25px;
  --size-sm-alt1: 18.25px; /* Default for "Return to Top" text, etc. */
  --size-md: 23px;

}
/** END **/


/**
 * BEGIN: Remove overrides for navigation width from drupal-bootstrap.min.css.
 *
 * **This is required for bootstrap-xl-xxl.css to work correctly.**
 *
 */
@media screen and (min-width: 992px) {
  .navbar.container {
    max-width: inherit !important;
  }
}
@media screen and (min-width: 768px) {
  .navbar.container {
    max-width: inherit !important;
  }
}
/** END **/

/**
 * BEGIN: Bootstrap utilities
 */
/*
.row.no-gutters>[class^="col-"],
.row.no-gutters>[class*=" col-"] {
  padding-right: 0;
  padding-left: 0;
}
*/
/** END **/

/**
 * BEGIN: Template for breakpoints.
 */
/* XXL *//* @media screen and (min-width: 1400px) {} */
/* XL  *//* @media screen and (min-width: 1200px) {} */
/* LG  *//* @media screen and (min-width: 992px) {} */
/* MD  *//* @media screen and (min-width: 768px) {} */
/* SM  *//* @media screen and (min-width: 576px) {} */
/* XS  *//* DEFAULT in BS5 {} */
/** END **/

/**
 * BEGIN: Print-specific.
 */
@media print {
  .hidden-print {
    display: none !important;
  }
}
/** END **/

/**
 * BEGIN: Basic site typography.
 */
html {
  font-family: sans-serif;
  font-display: fallback; /* Used for body text - allows user to start reading as soon as possible and avoid shifting text around as a new font loads in. */
    -ms-text-size-adjust:100%;
    -webkit-text-size-adjust:100%
}

h1, h2, h3, h4, h5, h6 {
  color: var(--color-primary-lt, black);
}
h1 {
  font-family: var(--font-bold-family); font-weight: var(--font-bold-weight); font-style: var(--font-bold-style);
  color: var(--color-secondary, black);
  font-size: var(--size-xxl);
  line-height: var(--size-xxl-lh);
}
h2 {
  font-family: var(--font-demi-bold-family); font-weight: var(--font-demi-bold-weight); font-style: var(--font-demi-bold-style);
  font-size: var(--size-xl);
  line-height: var(--size-xl-lh);
}
h3 {
  font-family: var(--font-light-family); font-weight: var(--font-light-weight); font-style: var(--font-light-style);
  font-size: var(--size-lg);
  line-height: var(--size-lg-lh);
}
h4 {
  font-family: var(--font-light-family); font-weight: var(--font-light-weight); font-style: var(--font-light-style);
  font-size: var(--size-md);
  line-height: var(--size-md-lh);
}
h5, h6 {
  font-family: var(--font-light-family); font-weight: var(--font-light-weight); font-style: var(--font-light-style);
}
body {
  font-family: var(--font-regular-family); font-weight: var(--font-regular-weight); font-style: var(--font-regular-style);
  color: var(--color-primary, black);
  font-size: var(--size-md);
  line-height: var(--size-md-lh);
}

@media screen and (min-width: 1400px) /* XXL only */ {
  body {
    font-size: var(--size-md-alt1);
    line-height: var(--size-md-alt1-lh);
  }
  h1 {
    font-size: var(--size-xl);
    line-height: var(--size-xl-lh);
  }
  h2 {
    font-size: var(--size-md-alt2);
    line-height: var(--size-md-alt2-lh);
  }
  h3 {
    font-size: var(--size-md-alt1);
    line-height: var(--size-md-alt1-lh);
  }
}

@media screen and (max-width: 1399.98px) /* XXL */ {
  body {
    font-size: var(--size-sm);
    line-height: var(--size-sm-lh);
  }
  h1 {
    font-size: var(--size-md-alt2);
    line-height: var(--size-md-alt2-lh);
  }
  h2 {
    font-size: var(--size-md-alt1);
      line-height: var(--size-md-alt1-lh);
  }
  h3 {
    font-size: var(--size-md-alt1);
    line-height: var(--size-md-alt1-lh);
  }
}

/** END **/


/**
 * BEGIN: Misc. elements from bootstrap starterkit, bootstrap_barrio, etc.
 */
body {
  padding: 0;
  overflow-x: hidden;
}
dd {
  margin: var(--size-md) 0 var(--size-md) var(--size-lg);
}
a,
.views-row h2 a {
  color: var(--color-primary-lt);
  text-decoration: underline;
}
a:visited,
.views-row h2 a:visited {
  /* color: var(--color-primary-xxdk); */
  color: var(--color-id-altgrey-900);
  text-decoration: underline;
}
a:hover,
a:focus,
.views-row h2 a:hover,
.views-row h2 a:focus {
  color: var(--color-primary-xdk);
  text-decoration: underline;
  background-color: var(--color-grey);
}
/** END **/

/** 
 * Begin: Styling for common elements specifically in #region-content
 */
#region-content p {
  padding-left: var(--size-lg);
  padding-right: var(--size-lg);
}

#region-content ul, 
#region-content ol {
  padding-left: var(--size-lg);
  padding-right: var(--size-lg);
}

/**
 * BEGIN: Styling for glossify module 
 */
h2 .glossary-word,
h3 .glossary-word,
h4 .glossary-word,
h5 .glossary-word,
h6 .glossary-word,
li .glossary-word,
td .glossary-word,
p .glossary-word {
  border-bottom: 1px dashed var(--color-primary-xxlt);
  cursor: help;
}
h2 .glossary-word:hover,
h2 .glossary-word:focus,
h3 .glossary-word:hover,
h3 .glossary-word:focus,
h4 .glossary-word:hover,
h4 .glossary-word:focus,
h5 .glossary-word:hover,
h5 .glossary-word:focus,
h6 .glossary-word:hover,
h6 .glossary-word:focus,
li .glossary-word:hover,
li .glossary-word:focus,
td .glossary-word:hover,
td .glossary-word:focus,
p .glossary-word:hover,
p .glossary-word:focus {
  background-color: var(--color-grey-lt);
}
/* Mostly hide lexical styling in .no-lexicon regions */
.no-glossary .glossary-word,
.no-lexicon .glossary-word {
  border-bottom: none;
  text-decoration: none;
  color: inherit;
}

/*
 * Old `lexicon` selectors - replaced with `glossify` and TippyJS.
 *
a.lexicon-term[data-title]:hover:after {
  opacity: 1;
  transition: all 0.1s ease 0.66s;
  visibility: visible;
}
a.lexicon-term[data-title]:after {
  content: attr(data-title);
  position: absolute;
  bottom: 100%;
  left: 50%;
  transform: translateX(-50%);
  visibility: hidden;
  width: 24em;

  background: var(--color-grey-lt);
  font-size: var(--size-sm);
  line-height: var(--size-sm-lh);
  padding: var(--size-xs);
  border: 1px solid var(--color-primary);
}
a.lexicon-term[data-title] {
  position: relative;
}
*/
/** END **/

/**
 * BEGIN: Bootstrap Buttons
 *
 * Bootstrap | FT Large | Desc.
 * ---       | ---      | ---
 * Primary   | Primary  | Red (secondary) button / white text and border
 * Default   | Outline  | White button / teal (primary) text and border
 * Info      | (reverse)| Teal (primary) button / white text and border
 *
 */
.btn, .btn:visited {
  font-family: var(--font-medium-family); font-weight: var(--font-medium-weight); font-style: var(--font-medium-style);
  font-size: var(--size-sm);
  line-height: var(--size-sm-lh);

  padding: var(--size-xs) var(--size-lg);
  border-radius: var(--size-sm-lh);
  text-decoration: none;
}
.btn svg.svg-inline--fa,
.btn:visited svg.svg-inline--fa {
  margin-left: var(--size-sm);
}
.btn-default, .btn-default:visited {
  color: var(--color-primary, black);
  background-color: var(--color-primary-inv, white);
  border-color: var(--color-primary, black);
}
.btn-default:hover {
  color: var(--color-primary-inv, white);
  background-color: var(--color-primary, black);
  border-color: var(--color-primary-inv, white);
}

.btn-default-inv,.btn-default-inv:visited {
  color: var(--color-primary-inv, white);
  background-color: var(--color-primary, black);
  border-color: var(--color-primary-inv, white);
}
.btn-default-inv:hover {
  color: var(--color-primary, black);
  background-color: var(--color-primary-inv, white);
  border-color: var(--color-primary, black);
}

.btn-primary,.btn-primary:visited {
  color: var(--color-secondary-inv, white);
  background-color: var(--color-secondary, black);
  border-color: var(--color-secondary-inv, white);
}
.btn-primary:hover {
  color: var(--color-secondary, black);
  background-color: var(--color-secondary-inv, white);
  border-color: var(--color-secondary, black);
}

.btn-primary-inv, .btn-primary-inv:visited {
  color: var(--color-secondary, black);
  background-color: var(--color-secondary-inv, white);
  border-color: var(--color-secondary, black);
}

.btn-primary-inv:hover {
  color: var(--color-secondary-inv, white);
  background-color: var(--color-secondary, black);
  border-color: var(--color-secondary-inv, white);
}

.btn-info, .btn-info:visited {
  color: var(--color-primary-inv, white);
  background-color: var(--color-primary, black);
  border-color: var(--color-primary-inv, white);
}
.btn-info:hover {
  color: var(--color-primary, black);
  background-color: var(--color-primary-inv, white);
  border-color: var(--color-primary, black);
}
.btn:disabled,.button:disabled,.disabled.button {
  background-color: var(--color-grey-xdk);
  border-color:  var(--color-grey-xdk);
}
@media screen and (max-width: 991.98px) /* LG */ {
  .btn {
    width: 100%;
    margin-bottom: var(--size-sm);
    white-space: normal;
  }
}
/* Recreate ".btn-block" class of B3 */
.btn-block {
  display: block;
  width: 100%;
  margin: var(--size-sm) var(--size-xs);
}
/** END **/

/**
 * BEGIN: Nav Tabs and Pills (from Views, etc.)
 */
h2.nav-label,h3.nav-label,h4.nav-label {
  margin-top: var(--size-lg);
  padding: var(--size-xs) 0 0 var(--size-sm);
  border-top: 1px solid var(--color-grey);
}

.nav-tabs {
  background: linear-gradient(var(--color-white), var(--color-grey));
  margin-top: var(--size-lg);
  margin-bottom: var(--size-md);
}
.nav-tabs .nav-link {
  font-size: var(--size-md);
  line-height: var(--size-md-lh);
  margin-right: 2px;
  color: var(--color-id-altgrey-900);
}


.nav-pills {
  background: linear-gradient(var(--color-white), var(--color-grey));
  margin-top: var(--size-xs);
  margin-bottom: var(--size-md);
  padding: var(--size-xs);
}
.nav-pills .nav-link {
  font-size: var(--size-md);
  line-height: var(--size-md-lh);
  text-decoration: underline;

  padding: var(--size-xs-half) var(--size-sm);  
  margin: var(--size-xs-half) var(--size-xs);

  background-color: var(--color-grey);

  border: 1px solid var(--color-grey-xdk);
  color: var(--color-grey-xdk);  
}
.nav-pills .nav-link {
  border-radius: var(--size-lg);
}
.nav-pills .nav-link:hover {
  background-color: var(--color-grey-dk);
}

.nav-pills .nav-link.active {
  background-color: var(--color-alt1);
  color: var(--color-alt1-inv);
  text-decoration: none;
}
.nav-pills .nav-link.active:hover {}

/** END **/

/**
 * BEGIN: AAMDSIF special button type: btn btn-sq-lg
 */
.btn-sq-xl {
  --size-padding-top: 48px;
  --size-padding-left: 18px;
  --size-padding-bottom: var(--size-padding-left);
  --size-padding-right: 32px;
  --size-min-width: 20em;
    --size-min-width-xl: 18em;
    --size-min-width-md: 100%;
  --size-icon-height: 108px;
}
.btn-sq-xl {
  overflow: hidden;
  border-radius: 0;
  border: none;
  font-family: var(--font-bold-family); font-weight: var(--font-bold-weight); font-style: var(--font-bold-style);
  background-color: var(--color-primary-xxlt);
  color: var(--color-primary);
  text-align: left;

  padding: var(--size-padding-left);

  padding-top: var(--size-padding-top);
  padding-left: var(--size-padding-left);
  padding-bottom: var(--size-padding-bottom);
  padding-right: var(--size-padding-right);
  min-width: var(--size-min-width);
}
.btn-sq-xl:hover {
  background-color: var(--color-primary-xxlt);
  color: var(--color-primary);
}
.btn-sq-xl .title {
  text-transform: uppercase;
  letter-spacing: var(--size-ls-md);
  text-decoration: none;
  display: block;
  color: var(--color-primary-inv);
}
.btn-sq-xl .svg-inline--fa {
  color: var(--color-primary-dk);
  font-size: var(--size-icon-height);
  display: block;
  float: right;
  margin-top: -0.25em;
}
.btn-sq-xl .svg-inline--fa.fa-long-arrow-alt-right,
.btn-sq-xl .svg-inline--fa.fa-aamds-long-arrow-alt-right {
  color: var(--color-primary-inv);
  float: left;
  padding-right: var(--size-padding-right);
  margin-left: -0.1em; /* These FA items are centered in the viewport, not left aligned */
}
@media screen and (max-width: 1399.98px) /* XXL */ {
  .btn-sq-xl {
    min-width: var(--size-min-width-xl);
  }
  .btn-sq-xl .svg-inline--fa {
    width: 0.80em !important; /* Override width specified by FA */
  }
}
@media screen and (max-width: 1199.98px) /* XL */ {
  .btn-sq-xl {
    min-width: var(--size-min-width-md);
  }
  .btn-sq-xl .svg-inline--fa {
    width: 0.5em !important; /* Override width specified by FA */
  }
}
@media screen and (max-width: 991px) /* LG */ {
  .btn-sq-xl .svg-inline--fa.fa-long-arrow-alt-right,
  .btn-sq-xl .svg-inline--fa.fa-aamds-long-arrow-alt-right {
    width: 0.75em !important; /* Override width specified by FA */
  }
}
/**
 * BEGIN: AAMDSIF special item div.box-label-sq-xl and
 div.box-label-sq-xl-secondary - both similar to btn-sq-xl
 */
div.box-label-sq-xl,
div.box-label-sq-xl-secondary {
  --size-padding-top: var(--size-sm);
  --size-padding-left: var(--size-padding-top);
  --size-padding-bottom: var(--size-padding-top);
  --size-padding-right: var(--size-padding-left);
  --size-min-width: 100%;
  --size-icon-height: var(--size-xxl);
}
div.box-label-sq-xl,
div.box-label-sq-xl-secondary {
  border-radius: 0;
  border: none;
  font-family: var(--font-bold-family); font-weight: var(--font-bold-weight); font-style: var(--font-bold-style);
  font-size: var(--size-sm);
  line-height: var(--size-sm-lh);
  background-color: var(--color-primary-xlt);
  text-align: center;

  padding: var(--size-padding-left);

  padding-top: var(--size-padding-top);
  padding-left: var(--size-padding-left);
  padding-bottom: var(--size-padding-bottom);
  padding-right: var(--size-padding-right);
  min-width: var(--size-min-width);
}
div.box-label-sq-xl-secondary {
  background-color: var(--color-secondary-lt);
}

div.box-label-sq-xl p.icon {
  color: var(--color-primary-xxlt);
  font-size: var(--size-icon-height);
}

div.box-label-sq-xl-secondary p.icon {
  color: var(--color-secondary-xxlt);
  font-size: var(--size-icon-height);
}

div.box-label-sq-xl p.title {
  color: var(--color-primary-inv);
  text-transform: uppercase;
  letter-spacing: var(--size-ls-md);
}
div.box-label-sq-xl-secondary p.title {
  color: var(--color-secondary-inv);
  text-transform: uppercase;
  letter-spacing: var(--size-ls-md);
}
/** END **/


/**
 * BEGIN: Glyphicons as stand alone icons (mostly in the sidebar)
 */
.icon-xs, .icon-sm, .icon-md, .icon-lg, .icon-xl, .icon-xxl {
  color: var(--color-secondary);
}
.icon-xs {
  font-size: var(--size-sm);
}
.icon-sm {
  font-size: var(--size-sm);
}
.icon-md {
  font-size: var(--size-md);
}
.icon-lg {
  font-size: var(--size-lg);
}
.icon-xl {
  font-size: var(--size-xl);
}
.icon-xxl {
  font-size: var(--size-xxl);
}
/** END **/


/**
 * Figures and captions
 */
.region-content-top figure figcaption,
.region-content figure figcaption,
.region-content-bottom figure figcaption {
  font-family: var(--font-light-family); font-weight: var(--font-light-weight); font-style: var(--font-light-style);
  font-size: var(--size-md);
  line-height: var(--size-md-lh);
  color: var(--color-primary);
  margin-top: var(--size-md);
  margin-bottom: var(--size-md);
  padding: var(--size-lg);
  border: 1px solid var(--color-grey-lt);
  border-radius: var(--size-box-radius);
  box-shadow: var(--shadow-box-a), var(--shadow-box-b), var(--shadow-box-c);
    -moz-box-shadow: var(--shadow-box-a), var(--shadow-box-b), var(--shadow-box-c);
    -webkit-box-shadow: var(--shadow-box-a), var(--shadow-box-b), var(--shadow-box-c);
    -o-box-shadow: var(--shadow-box-a), var(--shadow-box-b), var(--shadow-box-c);
}
/** END **/


/**
 * Responsive Videos
 */
.container .row .video-responsive {
  position: relative;
  /* 16:9 */
  padding-bottom: 53.5%;
  padding-top: 25px;
  height: 0;
}
.container .row .video-responsive iframe,
.container .row .video-responsive object,
.container .row .video-responsive embed {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
/** END **/


/**
 * BEGIN:  "Decorated boxes" (primarily for front page blocks)
 */
.box-decoration-white {
  background-color: var(--color-white);
  background-image: url(/sites/all/themes/bootstrap_aamds23/img/bg-dotdash-grad-white-1.png);
  background-repeat: repeat-x;
  background-position: left bottom;
  color: var(--color-primary);
}
.box-decoration-white h1,
.box-decoration-white h2,
.box-decoration-white h3,
.box-decoration-white h4,
.box-decoration-white h5,
.box-decoration-white h6,
.box-decoration-white li,
.box-decoration-white p {
  color: var(--color-primary);
}
.box-decoration-white-rev {
  background-color: var(--color-white);
  background-image: url(/sites/all/themes/bootstrap_aamds23/img/bg-dotdash-grad-white-2-rev.png);
  background-repeat: repeat-x;
  background-position: left top;
  color: var(--color-primary);
}
.box-decoration-white-rev h1,
.box-decoration-white-rev h2,
.box-decoration-white-rev h3,
.box-decoration-white-rev h4,
.box-decoration-white-rev h5,
.box-decoration-white-rev h6,
.box-decoration-white-rev li,
.box-decoration-white-rev p {
  color: var(--color-primary);
}

.box-decoration-secondary {
  background-color: var(--color-secondary);
  background-image: url(/sites/all/themes/bootstrap_aamds23/img/bg-dotdash-grad-red-1.png);
  background-repeat: repeat-x;
  background-position: center bottom;
  color: var(--color-secondary-inv);
}
.box-decoration-secondary h1,
.box-decoration-secondary h2,
.box-decoration-secondary h3,
.box-decoration-secondary h4,
.box-decoration-secondary h5,
.box-decoration-secondary h6,
.box-decoration-secondary li,
.box-decoration-secondary p {
  color: var(--color-secondary-inv);
}

.box-decoration-secondary-rev {
  background-color: var(--color-secondary);
  background-image: url(/sites/all/themes/bootstrap_aamds23/img/bg-dotdash-grad-red-2-rev.png);
  background-repeat: repeat-x;
  background-position: center top;
  color: var(--color-secondary-inv);
}
.box-decoration-secondary-rev h1,
.box-decoration-secondary-rev h2,
.box-decoration-secondary-rev h3,
.box-decoration-secondary-rev h4,
.box-decoration-secondary-rev h5,
.box-decoration-secondary-rev h6,
.box-decoration-secondary-rev li,
.box-decoration-secondary-rev p {
  color: var(--color-secondary-inv);
}

.region-content .box-decoration-white,
.region-content .box-decoration-white-rev,
.region-content .box-decoration-secondary,
.region-content .box-decoration-secondary-rev {
  padding: var(--size-xxl);
}
/** END **/

/**
 * NRD: Navigation / Breadcrumbs
 */
.breadcrumb {
  font-family: var(--font-regular-family); font-weight: var(--font-regular-weight); font-style: var(--font-regular-style);
  font-size: var(--size-sm);
  line-height: var(--size-sm-lh);

  padding: var(--size-sm-half) var(--size-sm);
  margin-bottom: var(--size-md);
  list-style: none;

  background-color: var(--color-grey-lt);
  border-radius: 6px;
}
/** END **/


/**
 * Sponsor support levels
 */
h4.sponsor-diamond,
h4.sponsor-platinum,
h4.sponsor-gold,
h4.sponsor-silver,
h4.sponsor-bronze {
  color: var(--color-black);
  padding: 5px;
  border-radius: var(--size-box-radius);
  margin: 0 0 15px 0;
}
h4.sponsor-diamond {
  background-color: #dddddd;
  background: linear-gradient(to bottom, #fafafc, #ddddf6);
}
h4.sponsor-platinum {
  background-color: #dddddd;
  background: linear-gradient(to bottom, #f9f9f9, #dddddd);
}
h4.sponsor-gold {
  background-color: #FCF6BA;
  background: linear-gradient(to bottom, #FCF6BA, #CC963A);
}
h4.sponsor-silver {
  background-color: #eddddd;
  background: linear-gradient(to bottom, #faf9f9, #e3dddd);
}
h4.sponsor-bronze {
  background-color: #EC8748;
  background: linear-gradient(to bottom, #EC8748, #BC5708);
}
h4.sponsor-nolevel {
  background-color: #fff;
  background: linear-gradient(to bottom, #ffffff, #fafafa);
  border-bottom: 1px solid #ddd;
}
div.sponsor-nolevel-textbox {
  padding: var(--size-xs);
  box-shadow: var(--shadow-box-a), var(--shadow-box-b), var(--shadow-box-c);
  -moz-box-shadow: var(--shadow-box-a), var(--shadow-box-b), var(--shadow-box-c);
  -webkit-box-shadow: var(--shadow-box-a), var(--shadow-box-b), var(--shadow-box-c);
  -o-box-shadow: var(--shadow-box-a), var(--shadow-box-b), var(--shadow-box-c);
}
/** END **/

/**
 * Misc. admin buttons / links
 */
.admin-only-link a,
.logged-in-only {
  color: var(--color-admin-only);
}

/* Main node-edit tabs for admins / editors */
body.user-logged-in #block-b5aamds25-local-tasks li>a {
  color: var(--color-admin-only);
}

body.user-logged-in #region-content div.admin-only {
  border: 1px solid var(--color-admin-only);
  color: var(--color-admin-only);
  font-family: var(--font-light-family); font-weight: var(--font-light-weight); font-style: var(--font-light-style);
  font-size: var(--size-sm-alt1);
  line-height: var(--size-sm-alt1-lh);  
}

body.user-logged-in #region-content div.admin-only h2,
body.user-logged-in #region-content div.admin-only h3,
body.user-logged-in #region-content div.admin-only h4 {
  color: var(--color-admin-only);
  background-color: var(--color-admin-only-xlt);
}

/* Various edit buttons for admins / editors */
body.user-logged-in #region-content ul.action-links>li>a,
.view-content .views-field-edit-node .field-content a,
.view-field-collection-view-subsection-panels .view-footer a,
.field-content a.subsection-edit,
.field-content a.subsection-link,
.field-type-field-collection div.view-footer>a,
.field-collection-view .field-collection-view-links li>a,
p.faq-edit-links .faq-add {
  color: var(--color-admin-only);

  border: 1px solid var(--color-admin-only);
  padding: 1px 0.8em 1px 0.8em;

  /*background-color: var(--color-grey-lt); */
  background-color: var(--color-admin-only-xlt);
  border-left-width: 5px;

  display: inline-block;
  min-width: 11em;
}

/* Sidebar items */
.region-sidebar-second #block-system-user-menu .block-title,
.region-sidebar-second #block-system-user-menu .nav>li a,
.region-sidebar-second #block-system-navigation .block-title,
.region-sidebar-second #block-system-navigation .nav>li a,
.region-sidebar-second #block-views-taxonomy-review-block-block .block-title,
.region-sidebar-second #block-views-taxonomy-review-block-block .nav>li a {
  color: var(--color-admin-only);
}
.region-sidebar-second #block-system-user-menu,
.region-sidebar-second #block-system-navigation,
.region-sidebar-second #block-views-taxonomy-review-block-block {
  border-bottom-color: var(--color-admin-only);
}

/* Views fields */
.view-content .item-list .admin-only {
  color: var(--color-admin-only);
  font-family: var(--font-light-family); font-weight: var(--font-light-weight); font-style: var(--font-light-style);
  font-size: var(--size-sm-alt1);
  line-height: var(--size-sm-alt1-lh);
}
/* Informational fields only */
.region-content article footer span.submitted {
  color: var(--color-admin-only);
}

/* Unpublished content */
.node-unpublished {
  background-color: var(--color-admin-only-xlt);
  border: 1px dashed var(--color-admin-only-lt);
}


/**
 * Post-it / sticky notes for prototyping
 *
 * Based on: https://codepen.io/jweden/pen/kGBBpM
 */
/* @import url(https://fonts.googleapis.com/css?family=Permanent+Marker); */
@font-face {
  font-family: 'Permanent Marker';
  font-style: normal;
  font-weight: 400;
  src: url(https://fonts.gstatic.com/s/permanentmarker/v16/Fh4uPib9Iyv2ucM6pGQMWimMp004La2Cf5b6jlg.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
.post-it-container,
.post-it-holder {
  position: relative;top: 1em; left:1em;
}
.post-it {
  display: none; /* 2024-03-21 - In preparation for launch, any remaining post-its are hidden */
  width: 210px;
  height: 190px;
  position: absolute;top: 1em; right: -2em; /* Allow notes to stay out of the page flow (and not impact page layout) */
  background: #ffa;
  overflow: hidden;
  margin: 30px auto;
  padding: 20px;
  border-radius: 0 0 0 30px/45px;
  box-shadow:
    inset 0 -40px 40px rgba(0, 0, 0, 0.1),
    inset 0 25px 10px rgba(0, 0, 0, 0.1),
    0 5px 6px 5px rgba(0, 0, 0, 0.1);
  font-family: 'Permanent Marker', cursive;
  line-height: 1.4em;
  font-size: 14px;
  -webkit-mask-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAIAAACQd1PeAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAA5JREFUeNpiYGBgAAgwAAAEAAGbA+oJAAAAAElFTkSuQmCC);
  color: #130d6b;
  transform: rotate(-2deg);
  z-index: 99;
}
.post-it-alt1 {
  background: #aff;
  transform: rotate(-4.5deg);
}
.post-it-alt2 {
  background: #faa;
  transform: rotate(3deg);
}

.post-it h1,.post-it h2,.post-it h3,.post-it h4, .post-it p {
  font-family: 'Permanent Marker', cursive;
  font-size: 14px !important;
  line-height: 1.33em;
  color: #130d6b !important;
  margin-top: var(--size-border-md);
  margin-bottom: var(--size-border-md);
  padding-left: 1em !important;
  padding-right: 1em !important;
}
.post-it:before {
  content: "";
  display: block;
  position: absolute;
  width: 20px;
  height: 25px;
  background: #ffa;
  box-shadow:
    3px -2px 10px rgba(0, 0, 0, 0.2),
    inset 15px -15px 15px rgba(0, 0, 0, 0.2);
  left: 0;
  bottom: 0;
  z-index: 2;
  transform: skewX(25deg);
}
.post-it-alt1:before {
  background: #aff;
}
.post-it-alt2:before {
  background: #faa;
}
.post-it:after {
  content: "";
  display: block;
  position: absolute;
  width: 75%;
  height: 20px;
  border-top: 3px solid #130d6b;
  border-radius: 50%;
  bottom: 0px;
  left: 10%;
}
/** END **/

/**
 * BEGIN: Responsive tables
 *
 * See also: views.css - * .table-responsive table.views-table *
 *
 */
.region-content .table-responsive table {
  /* margin-bottom: var(--size-xl); */
} 
.region-content .table-responsive table th {
  color: var(--color-grey-xdk);
}

.region-content .table-responsive table td,
.region-content .table-responsive table th,
.region-content .table-responsive table td p,
.region-content .table-responsive table td ol li,
.region-content .table-responsive table td ul li {
  font-size: var(--size-sm-alt2);
  line-height: var(--size-sm-alt2-lh);
}
.region-content .table-responsive table td ol,
.region-content .table-responsive table td ul {
  padding-left: var(--size-xs-half);
  padding-right: var(--size-xs-half);
}

/* Override striping from table.less */
.region-content .table-striped>tbody>tr:nth-of-type(odd) {
  background-color: #f9f9f9;
}
.region-content .table-striped>tbody>tr:nth-of-type(even) {
  background-color: #f2f2f2;
}

/* Add basic support for "low" priority table elements */
@media screen and (max-width: 767.98px) /* MD */ {
  th.priority-low,
  td.priority-low {
    display: none;
  }
}
/** END **/

/**
 * BEGIN: Views (and other) Pagination Styles
 */
.pagination>li>a,
.pagination>li>span {
  color: var(--color-secondary);
}

.pagination>.active>a,
.pagination>.active>span,
.pagination>.active>a:hover,
.pagination>.active>span:hover,
.pagination>.active>a:focus,
.pagination>.active>span:focus {
  z-index: 3;
  color: #fff;
  cursor: default;
  background-color: var(--color-secondary);
  border-color: var(--color-secondary);
}
/** END **/

/**
 * BEGIN: Responsive logo collections
 *
 * This replaces the old ".logogrid" system with a Bootstrap based system.
 */
.logos-responsive {}
.logos-responsive .row {
  margin-bottom: 30px; /* Should be the same as column (padding-left * 2) in Bootstrap */
}
.logos-responsive img.img {
  padding: var(--size-xs-half);

  box-shadow: var(--shadow-box-a), var(--shadow-box-b), var(--shadow-box-c);
    -moz-box-shadow: var(--shadow-box-a), var(--shadow-box-b), var(--shadow-box-c);
    -webkit-box-shadow: var(--shadow-box-a), var(--shadow-box-b), var(--shadow-box-c);
    -o-box-shadow: var(--shadow-box-a), var(--shadow-box-b), var(--shadow-box-c);
}
/** END **/

/**
 * BEGIN: Tabular admin reports displayed outside of admin theme.
 */
body.path-admin .table>tbody>tr>td,
body.path-admin .table>tbody>tr>th,
body.path-admin .table>tfoot>tr>td,
body.path-admin .table>tfoot>tr>th,
body.path-admin .table>thead>tr>td,
body.path-admin .table>thead>tr>th {
  font-size: var(--size-sm);
  line-height: var(--size-sm-lh);
}
body.path-admin .region-content .table>tbody>tr>td li,
body.path-admin .region-content .table>tbody>tr>td a {
  font-size: var(--size-sm);
  line-height: var(--size-sm-lh);
}
/** END **/


/**
 * BEGIN: Colored "tags" used to article status, clinical trial type,
 *   etc.
 */
#region-content .tag-primary,
#region-content .tag-success,
#region-content .tag-info,
#region-content .tag-warning {
  font-size: var(--size-md-alt1);
  line-height: var(--size-md-alt1-lh);
  padding: 3px 5px 1px 5px;
  margin-right: 5px; /* Should match right padding. */
}

/* For .tag elements with font-awesome / SVG glyphs */
#region-content .tag-primary svg,
#region-content .tag-success svg,
#region-content .tag-info svg,
#region-content .tag-warning svg {
  margin-right: 3px; /* Should match left padding of .tag-primary */
}

/* For .tag elements with links */
#region-content .tag-primary a,
#region-content .tag-success a,
#region-content .tag-info a,
#region-content .tag-warning a {
  color: var(--color-white);
  text-decoration: none;
  font-style: normal;
}
#region-content .tag-primary a:visited,
#region-content .tag-success a:visited,
#region-content .tag-info a:visited,
#region-content .tag-warning a:visited {
  color: var(--color-white);
}
#region-content .tag-primary a:hover,
#region-content .tag-success a:hover,
#region-content .tag-info a:hover,
#region-content .tag-warning a:hover {
  background: none;
}

/* Glossify items need some attention... */
#region-content .tag-primary .glossary-word,
#region-content .tag-success .glossary-word,
#region-content .tag-info .glossary-word,
#region-content .tag-warning .glossary-word {
  border-bottom: 1px dashed var(--color-secondary-xxlt);
  /* color: var(--color-primary); */
}

#region-content .tag-primary .glossary-word:hover,
#region-content .tag-success .glossary-word:hover,
#region-content .tag-info .glossary-word:hover,
#region-content .tag-warning .glossary-word:hover {
  background-color: var(--color-secondary);
}


@media screen and (max-width: 1439px)  /* --size-max-width-xl */ {
  #region-content .tag-primary,
  #region-content .tag-success,
  #region-content .tag-info,
  #region-content .tag-warning {
    font-size: var(--size-md);
    line-height: var(--size-md-lh);
  }
}
#region-content .tag-primary {
  background-color: var(--color-id-secondary-500);
  border: 2px solid var(--color-id-secondary-600);
  color: var(--color-white);
}
#region-content .tag-success {
  background-color: #5cb85c;
  border-color: #4cae4c;
  color: var(--color-id-altgrey-900);
}
#region-content .tag-info {
  background-color: var(--color-primary);
  border: 2px solid var(--color-primary-lt);
  color: var(--color-primary-inv);
}
#region-content .tag-warning {
  background-color: #f0ad4e;
  border: 2px solid #eea236;
  color: var(--color-id-altgrey-900);
}
/** END **/

/**
 * Bootstrap Tweaks / Additions
 */
/* Similar to .img-fluid from BS5, but allow upscale */
#region-content .img-fluid-upscale {
  width: 100%;
  height: auto;
}
/** END **/

/**
 * Smart-trimmed text fields with "read more" links
 */
#region-content .field--type-text-with-summary div.more-link {
  clear: both; /* Make sure the thumbnails do not get in the way */
}
#region-content .field--type-text-with-summary div.more-link a.more-link,
#region-content .field--type-text-with-summary div.more-link a.more-link:visited {
  text-align: left !important; /* Override a.more-link from module */
}