:root {
  --erg-dark-blue: #005994;
  --erg-medium-blue: #006db6;
  --erg-light-blue: #5cb8e1;
  --erg-cyan: #44b2e8;
  --erg-gray: #737b82;

  --ste-primary-blue: #233e90;
  --ste-primary-cyan: #1ea9e1;
  --ste-primary-gold: #f2a900;            /* PMS 130C  */
  --ste-primary-light-blue: #0077c8;      /* PMS 3005C */
  --ste-primary-dark-blue: #002d72;       /* PMS 288C  */
  --ste-secondary-dark-yellow: #ffd100;   /* PMS 109C  */
  --ste-secondary-light-yellow: #f3dd6d;  /* PMS 127C  */
  --ste-secondary-cyan: #009cde;          /* PMS 2925C */
  --ste-secondary-light-purple: #6787b7;  /* PMS 7682C */
  --ste-secondary-dark-purple: #1d428a;   /* PMS 7687C */
  --ste-secondary-blue: #0047bb;          /* PMS 2728C */
  --ste-black: #101820;           /* PMS Black 6C      */
  --ste-gray-10: #63666a;         /* PMS Cool Gray 10C */
  --ste-gray-8: #888b8d;          /* PMS Cool Gray 8C  */
  --ste-gray-4: #bbbcbc;          /* PMS Cool Gray 4C  */
  --ste-gray-2: #d0d0ce;          /* PMS Cool Gray 2C  */
  --ste-light-gray: #d9e1e2;      /* PMS 7541C         */

  --blue-green: #55a6ad;    /* rgb(85, 166, 173)  */
  --green: #86b385;         /* rgb(134, 179, 133) */
  --light-green: #b6c15e;   /* rgb(182, 193, 94)  */
  --yellow-green: #e7ce36;  /* rgb(231, 206, 54)  */
  --yellow: #fac221;        /* rgb(250, 194, 33)  */
  --light-orange: #ef9c20;  /* rgb(239, 156, 32)  */
  --orange: #e5751f;        /* rgb(229, 117, 31)  */
  --red: #da4f1e;           /* rgb(218, 79, 30)   */

  --header-height: 3rem;
  --footer-height: 3rem;
  --mobile-nav-width: 75%;
}

*,
*::before,
*::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

html {
  box-sizing: border-box;
  font-family: proxima-nova, -apple-system, BlinkMacSystemFont, "Segoe UI",
    Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
  font-size: 16px;
  line-height: 1;
  -webkit-text-size-adjust: 100%;
}

body {
  color: #444;
  background-color: white;
}

.erg-container,
.erg-wide-container {
  position: relative;
  margin: 0 auto;
  padding: 0 1rem;
  width: 100%;
}

.erg-container {
  max-width: 52rem; /* 800px not including padding */
}

.erg-wide-container {
  max-width: 66rem; /* 1024px not including padding */
}

.erg-copy {
  line-height: 1.5;
}

.erg-copy p {
  margin-top: 1rem;
}

.erg-copy ul,
.erg-copy ol {
  margin-top: 1rem;
  padding-left: 2rem;
}

.erg-copy sub {
  position: relative;
  top: 0.375rem;
  vertical-align: baseline;
}

.erg-copy sup {
  position: relative;
  top: -0.375rem;
  vertical-align: baseline;
}

.erg-copy a {
  color: var(--erg-medium-blue);
}

.erg-copy a:hover,
.erg-copy a:focus {
  color: var(--erg-light-blue);
}

.erg-copy a[target="_blank"] img.erg-external-icon {
  position: relative;
  bottom: -2px;
  margin-left: 1px;
  width: 16px;
  height: 16px;
}

.erg-copy hr {
  margin: 2.5rem 0;
  border: none;
  border-top: 1px solid var(--ste-light-gray);
  opacity: 1;
}

.erg-copy h1,
.erg-copy h2,
.erg-copy h3,
.erg-copy h4,
.erg-copy h5,
.erg-copy h6 {
  margin-top: 1rem;
  margin-bottom: 0.5rem;
  font-family: proxima-nova-condensed, sans-serif;
  font-weight: 700;
  line-height: 1.125;
}

.erg-copy h1 {
  color: var(--erg-dark-blue);
}

.erg-copy h2 {
  color: var(--erg-dark-blue);
}

.erg-copy h3 {
  color: var(--erg-light-blue);
}

.erg-copy h4 {
  color: var(--erg-cyan);
}

.erg-copy h5 {
  color: var(--erg-gray);
}

.erg-copy h6 {
  color: var(--erg-dark-blue);
}

.erg-copy table {
  margin-top: 0.25rem;
  border-collapse: collapse;
  width: 100%;
  table-layout: fixed;
}

.erg-copy tbody tr:nth-of-type(even) {
  background-color: rgba(0, 109, 182, 0.0625);
}

.erg-copy th {
  font-family: proxima-nova-condensed, sans-serif;
  color: white;
  background-color: rgba(0, 109, 182, 0.875);
}

.erg-copy th,
.erg-copy td {
  padding: 0.375rem 0.5rem;
  border: 1px solid var(--erg-dark-blue);
  line-height: 1.125;
  text-align: left;
  vertical-align: top;
}

.erg-copy td {
  font-size: 0.875rem;
}

.erg-copy figure[class*='erg-photo'] {
  position: relative;
  margin-top: 1rem;
  margin-bottom: 1rem;
  width: 100%;
  height: 12rem;
  box-shadow: 0 0 2px rgba(0, 0, 0, 0.5);
}

.erg-copy figure[class*='erg-photo'] img {
  position: absolute;
  top: 0.25rem;
  left: 0.25rem;
  width: calc(100% - 0.5rem);
  height: calc(100% - 0.5rem);
  object-fit: cover;
}

.erg-details-list {
  margin-top: 1rem;
}

.erg-details-list button[data-details-toggle] {
  float: right;
  padding: 0.25rem 0.75rem;
  border: none;
  font-size: 0.8125rem;
  color: var(--erg-medium-blue);
  background-color: transparent;
  cursor: pointer;
}

.erg-details-list button[data-details-toggle]:hover,
.erg-details-list button[data-details-toggle]:focus {
  color: var(--erg-light-blue);
}

.erg-details-list details {
  clear: both;
  border-bottom: 1px solid var(--ste-light-gray);
}

.erg-details-list details:last-of-type {
  border-bottom: none;
}

/* summary styled like an h3 */
.erg-details-list summary {
  position: relative;
  padding: 0.875rem 2.625rem 0.625rem 0;
  font-family: proxima-nova-condensed, sans-serif;
  font-weight: 700;
  font-size: 1.125rem;
  line-height: 1.125;
  color: var(--ste-primary-light-blue);
  cursor: pointer;
}

.erg-details-list summary::marker {
  display: none;
  content: '';
}

.erg-details-list summary::after {
  content: '+';
  position: absolute;
  top: 0.625rem;
  right: 0.75rem;
  font-size: 1.75rem;
  font-weight: 700;
  color: var(--ste-primary-light-blue);
}

.erg-details-list details[open] summary::after {
  content: '–';
  top: 0.5rem;
  font-size: 1.5rem;
}

.erg-details-list summary:hover::after,
.erg-details-list summary:focus::after {
  color: var(--erg-light-blue);
}

.erg-details-list .erg-details-content {
  padding-bottom: 1rem;
}

.erg-details-list .erg-details-content >:first-child {
  margin-top: 0.25rem;
}

.erg-details-list .erg-details-content h3 {
  margin-bottom: 0.25rem;
  font-size: 1rem;
  color: var(--erg-medium-blue);
}

.erg-details-list .erg-details-content ul,
.erg-details-list .erg-details-content ol {
  margin-top: 0;
}

.erg-details-list .erg-details-content p,
.erg-details-list .erg-details-content li {
  margin-top: 0;
  font-size: 0.9375rem;
}

.erg-details-list summary.erg-workgroup {
  position: relative;
  padding-left: 2.625rem;
}

.erg-details-list summary.erg-workgroup img {
  position: absolute;
  top: 5px;
  left: 0;
  object-fit: cover;
  object-position: 0 0;
  width: 32px;
  height: 32px;
}

.erg-embed {
  position: relative;
}

/* 16:9 aspect ratio */
.erg-embed::before {
  content: '';
  display: block;
  padding-top: calc(9 / 16 * 100%);
}

.erg-embed iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

/* --- header --- */
.erg-site-header {
  position: fixed;
  top: 0;
  z-index: 10;
  display: flex;
  flex-direction: column;
  justify-content: center;
  width: 100%;
  height: var(--header-height);
  background-color: white;
  box-shadow: 0 0 3px rgba(0, 0, 0, 0.375);
}

/* reduce padding for header container on small screens,
so the toggle is better aligned with the content below */
.erg-site-header .erg-wide-container {
  padding-right: 0.5rem;
}

.erg-header-menu {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.erg-header-logo {
  /* 600:230 (full) | 300:115 (half) | 60:23 aspect ratio (30:11.5) */
  width: 90px;
  height: auto;
}

.erg-header-logo img {
  display: block;
  width: 100%;
  height: auto;
}

.erg-header-toggle {
  position: absolute;
  top: 0;
  right: 0;
  border: none;
  width: 34.5px;
  height: 34.5px;
  background-color: transparent;
  font-weight: 700;
  font-size: 1.375rem;
  line-height: 100%;
  color: var(--erg-dark-blue);
  cursor: pointer;
}

.erg-header-toggle:hover,
.erg-header-toggle:focus {
  color: var(--erg-light-blue);
}

.erg-header-nav {
  position: fixed;
  top: var(--header-height);
  right: calc(var(--mobile-nav-width) * -1);
  width: var(--mobile-nav-width);
  height: 100%;
  background-color: var(--erg-dark-blue);
}

.erg-header-search {
  width: 190px;
  height: auto;
}

/* left border inset shadow */
.erg-header-nav::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 3px;
  height: 100%;
  background-image: linear-gradient(to left, transparent, rgba(0, 0, 0, 0.25));
}

.erg-header-nav ul {
  list-style: none;
  padding-left: 0px;
}

.erg-header-nav li {
  border-bottom: 1px solid rgba(0, 0, 0, 0.25);
}

.erg-header-nav a,
.erg-header-nav button {
  padding: 0.875rem 1.25rem;
  border-top: 1px solid rgba(255, 255, 255, 0.125);
  font-weight: 700;
  line-height: 1.125;
  text-transform: uppercase;
  color: white;
}

.erg-header-nav button::after {
  content: '';
  display: inline-block;
  flex-shrink: 0;
  position: relative;
  bottom: -2px;
  left: 5px;
  width: 1rem;
  height: 1rem;
  background-image: url('../img/erg-arrow.svg');
  background-size: cover;
}

.erg-header-nav a {
  display: block;
  text-decoration: none;
}

.erg-header-nav a:hover,
.erg-header-nav a:focus,
.erg-header-nav button:hover,
.erg-header-nav button:focus {
  border-top-color: rgba(255, 255, 255, 0.25);
  background-color: var(--erg-light-blue);
}

.erg-header-nav button {
  border-right: none;
  border-bottom: none;
  border-left: none;
  width: 100%;
  font-size: 100%;
  text-align: left;
  background-color: transparent;
  cursor: pointer;
}

.erg-header-nav button[aria-expanded="true"] {
  border-bottom: 1px solid rgba(0, 0, 0, 0.25);
}

.erg-header-nav button[aria-expanded="false"] + ul {
  display: none;
}

.erg-header-nav ul ul {
  display: flex;
  flex-direction: column;
}

.erg-header-nav ul ul li:last-child {
  border-bottom: none;
}

.erg-header-nav ul ul a {
  padding-left: 2.5rem;
}

/* header nav and site body mobile nav transition/slide */
.erg-header-nav,
.erg-site-body {
  transition: right 0.3s ease;
}

.erg-site-body {
  position: relative;
  right: 0;
}

[data-mobile-nav="open"] .erg-header-nav {
  right: 0;
}

[data-mobile-nav="open"] + .erg-site-body {
  right: var(--mobile-nav-width);
}

/* --- main --- */
.erg-site-main {
  margin-top: var(--header-height);
  padding-bottom: 0rem;
  min-height: calc(100vh - var(--header-height) - var(--footer-height));
}

.erg-section {
  padding-top: 1rem;
  padding-bottom: 2rem;
}

.erg-intro-section {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 2rem;
  padding: 1rem;
  min-height: 8rem;
  text-align: center;
  text-shadow: 0 0 3px rgba(0, 0, 0, 0.25);
  color: white;
  background-image: ;
  background-position: center;
  background-size: cover;
  background-color: white;
}

.erg-intro-section::after {
  content: '';
  position: absolute;
  z-index: 1;
  bottom: 0;
  width: 100%;
  height: 100%;
  background-image: linear-gradient(to top,
    rgba(0, 0, 0, 1) 12.5%,
    rgba(0, 0, 0, 0.875) 37.5%,
    rgba(0, 0, 0, 0) 87.5%);
  opacity: 62.5%;
}

.erg-intro-section .erg-copy {
  position: relative;
  z-index: 2;
}

.erg-intro-section h1 {
  margin: 0;
  font-size: 2.5rem;
  color: inherit;
}

.erg-intro-section p {
  font-style: italic;
  font-size: 1.375rem;
  line-height: 1.375;
}

/* --- footer --- */
.erg-site-footer {
  display: flex;
  flex-direction: column;
  justify-content: center;
  border-top: 6px solid var(--erg-light-blue);
  height: var(--footer-height);
  color: white;
  background-color: var(--erg-dark-blue);
}

.erg-site-footer p {
  font-size: 0.8125rem;
  text-align: center;
}

@media (min-width: 480px) {
  .erg-align-left {
    float: left;
    margin-right: 1rem;
  }

  .erg-align-right {
    float: right;
    margin-left: 1rem;
  }

  .erg-copy figure[class*='erg-photo'] {
    width: 12rem;
  }

  .erg-copy figure.erg-photo-landscape {
    height: 8rem;
    width: 12rem;
  }
  
  .erg-copy figure.erg-photo-portrait {
    height: 18rem;
    width: 12rem;
  }
}

@media (min-width: 720px) {
  :root {
    --header-height: 4rem;
    --transition-time: 0.3s;
  }

  body[data-scrolled="true"] .erg-site-header {
    height: var(--header-height);
  }

  body[data-scrolled="true"] .erg-header-logo {
    width: 120px;
  }

  body[data-scrolled="true"] .erg-header-nav {
    width: calc(100% - 120px - 9px); /* account for .erg-header-logo width */
  }

  body[data-scrolled="true"] .erg-header-nav > ul {
    height: var(--header-height);
  }

  .erg-site-header {
    height: calc(var(--header-height) * 1.375);
    transition: height var(--transition-time) ease;
  }

  .erg-site-header .erg-wide-container {
    padding-right: 1rem;
  }

  .erg-header-logo {
    width: 150px;
    transition: width var(--transition-time) ease;
  }

  .erg-header-toggle {
    display: none;
  }

  .erg-header-nav {
    position: static;
    width: calc(100% - 150px - 15.25px); /* account for .erg-header-logo width */
    background-color: transparent;
    transition: width var(--transition-time) ease;
  }

  .erg-header-nav::after {
    display: none;
  }

  .erg-header-nav ul {
    display: flex;
    justify-content: flex-end;
  }

  .erg-header-nav > ul {
    height: calc(var(--header-height) * 1.375);
    transition: height var(--transition-time) ease;
  }

  .erg-header-nav li {
    border-bottom: none;
    flex: 1;
  }

  .erg-header-nav a,
  .erg-header-nav button {
    display: flex;
    align-items: center;
    justify-content: center;
    border-top: none;
    height: 100%;
    color: var(--erg-dark-blue);
  }

  .erg-header-nav button[aria-expanded="true"] {
    border-bottom: none;
  }

  .erg-header-nav button::after {
    bottom: 1px;
    opacity: 0.375;
    background-position-x: 1rem;
  }
  
  .erg-header-nav button:hover::after,
  .erg-header-nav button:focus::after {
    opacity: 1;
    background-position-x: 2rem;
  }

  .erg-header-nav a:hover,
  .erg-header-nav a:focus,
  .erg-header-nav button:hover,
  .erg-header-nav button:focus {
    color: var(--erg-medium-blue);
    background-color: transparent;
  }

  .erg-header-nav ul ul {
    background-color: white;
    box-shadow:
       2px 2px 2px 0 rgba(0, 0, 0, 0.125),
      -2px 2px 2px 0 rgba(0, 0, 0, 0.125);
  }

  .erg-header-nav ul ul a {
    justify-content: flex-start;
    padding-left: 1.25rem;
    border-top: 1px solid rgba(0, 0, 0, 0.1875);
    font-size: 93.75%;
    text-transform: none;
  }

  .erg-header-nav ul ul a:hover,
  .erg-header-nav ul ul a:focus {
    border-top-color: rgba(0, 0, 0, 0.1875);
  }
}

input[type=search], select {
  width: 40 px;
  height: 30px;
  padding: 7px 10px;
  margin: 4px 0;
  display: inline-block;
  border: 2px solid #24618e;
  border-radius: 4px;
  box-sizing: border-box;
  background-image: url('/wp-content/uploads/2023/02/ergsearchicon-01.png');
  background-size: 20px 20px;
  background-position: 4px 4px; 
  background-repeat: no-repeat;
  padding: 4px 4px 0px 40px;
  align-content: right;
  
}

input[type=submit] {
  display: none;
  font-family: Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif;
  width: 40 px;
  background-color: #24618e;
  color: white;
  padding: 7px 10px;
  margin: 4px 0;
  border: none;
  border-radius: 0px;
  cursor: pointer;
}

@media (min-width: 800px) {
  .erg-intro-section {
    min-height: 12rem;
  }
}

@media (min-width: 960px) {
  .erg-intro-section {
    min-height: 16rem;
  }
}