html, body { margin: 0; }

.region-primary-menu { height: auto; }

#primary_nav_wrap ul ul a,
#primary_nav_wrap ul ul span { font-weight: 400 !important; }

#primary_nav_wrap > ul > li > a,
#primary_nav_wrap > ul > li > span {
  padding: 8px 12px;
  display: inline-flex;
  align-items: center;
  justify-content: flex-start;
  gap: 6px;
  box-sizing: border-box;
  background: transparent;
  color: #333 !important;
  font-weight: 400;
  text-decoration: none;
  border: 1px solid transparent;
}

/* Carets dark */
#primary_nav_wrap > ul > li > a i[class*="fa-"],
#primary_nav_wrap > ul > li > span i[class*="fa-"],
#primary_nav_wrap .menu li.expanding-item::before { color: #333 !important; }

/* Remove forced gray bg on expanded items (keep once) */
#primary_nav_wrap ul li.menu-item--expanded,
#primary_nav_wrap ul li.menu-item-expanded { background: transparent !important; }

/* Top-level hover */
#primary_nav_wrap > ul > li:hover > a,
#primary_nav_wrap > ul > li:hover > span {
  background-color: #fff !important;
  color: #333 !important;
  border-color: #C8B18B;
}

/* First-level dropdown */
#primary_nav_wrap > ul > li > ul {
  position: absolute;
  width: max-content !important;
  min-width: 100% !important;
  max-width: none !important;
  box-sizing: border-box;
    border-top: 2px solid transparent !important;
  overflow: visible; /* FIXED (was 'overlow') */
  white-space: nowrap;
  left: 0;
  top: 100%;
  padding: 0;
  background: #fff !important;
}

#primary_nav_wrap ul li {

  margin: .5em 0 0;
}

#primary_nav_wrap > ul > li { z-index: 2; }
#primary_nav_wrap > ul > li > ul { z-index: 3; } /* optional bump */

/* L2 rows */
#primary_nav_wrap > ul > li > ul > li { background-color: #fff !important; }

#primary_nav_wrap > ul > li > ul > li > a,
#primary_nav_wrap > ul > li > ul > li > span {
  background-color: #fff !important;
  color: #333 !important;
  padding: 12px 16px;
  display: block;
}

/* L2 hover: gold bg + BLUE text per Theme-1 */
#primary_nav_wrap > ul > li > ul > li:hover > a,
#primary_nav_wrap > ul > li > ul > li:hover > span {
  background-color: #C8B18B !important;
  color: #333 !important; 
}

/* Flyout (L3+) */
#primary_nav_wrap ul ul ul { background-color: #003366 !important; }

#primary_nav_wrap ul ul ul > li > a,
#primary_nav_wrap ul ul ul > li > span {
  background-color: #003366 !important;
  color: #fff !important;
  padding: 12px 16px;
}

#primary_nav_wrap ul ul ul > li:hover > a,
#primary_nav_wrap ul ul ul > li:hover > span {
  background-color: #fff !important;
  color: #003366 !important;
}

/* Caret pseudo baseline */
#primary_nav_wrap .menu li.expanding-item::before {
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  content: "\f0dd";
  padding-left: .5em;
  font-size: .8em;
  vertical-align: middle;
  display: inline-block;
  font-style: normal;
  font-variant: normal;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  color: #333;
  transition: color .2s ease-in-out;
}

#primary_nav_wrap > ul > li:hover > a::before,
#primary_nav_wrap > ul > li:hover > span::before { color: #fff !important; }


/* ————— Footer / header block expanded to one-selector-per-line ————— */
a.footer-dept-logo {
  text-decoration: none;
  color: #fff;
  font-family: 'myriad-pro';
  font-size: 1.2vw;
  line-height: 1.2vw;
  font-weight: 900;
}
.footer-dept {
  margin: auto 0;
  padding: 0 0 0 1em;
}
.theme-logos {
  line-height: 1.2vw;
}
.menu-t1-search {
  display: inline-block;
  margin: 1.7em 0 0 0;
}
.t1-dept-logo {
  padding: 0 0 0 .5em;
  margin: auto 0;
  line-height: .9em;
}
.t1-uis-logo::after {
  height: 70%;
  content: '';
  top: 10px;
  width: 1px;
  right: 0;
  position: absolute;
  background-color: #c8b186;
}
ul.footer1-menu li a .txt-indent {
  margin-left: 1.6em;
  display: block;
}
.social-links a:hover {
  font-size: 1.2em;
  transition: font-size .2s ease-in-out;
}
.header-txt {
  top: 45%;
}
.js-form-item.form-item.js-form-type-search.form-type-search {
  margin: .5em 0 0;
}
.region.region-secondary-menu {
  top: 85px;
}
#header {
  width: 100%;
  position: sticky;
  z-index: 98;
  margin: 0;
  padding: 0;
  top: 0;
  background: #fff;
}
.region.region-header {
  position: relative;
  z-index: 13;
}
.footer1-intro a {
  color: #fff;
  font-weight: 100;
  background: none;
}
.footer1-intro a:hover {
  text-decoration: underline;
}
ul.comp-links {
  padding: 0;
  list-style: none;
  line-height: 1.5em;
}
ul.comp-links li a {
  color: #fff;
  font-weight: 100;
  font-size: .8em;
  background: none;
}
ul.comp-links li a:hover {
  text-decoration: underline;
}
button.button.button--ultimenu {
  display: none;
}
img.footer1-dept-logo {
  max-width: 225px;
  border-left: 1px #fff solid;
  padding: 0 .4em;
  margin-top: .7em;
}
img.uis-footer1-logo {
  max-width: 150px;
}
.footer1-intro {
  margin: .9em;
  font-weight: 100;
  font-size: .95em;
}
.footer1-logo {
  display: grid;
  grid-template-columns: 1fr 2fr;
}
.region-primary-menu {
  position: relative;
  border-bottom: 5px #003366 solid;
  display: grid;
  grid-template-columns: 2fr 5fr;
  max-height: none;
  align-items: center;
  z-index: 11;
}
#block-searchform-2 {
  max-width: 250px;
  max-height: 30px;
  float: right;
}
#block-searchform-2 #search-block-form #edit-keys {
  max-width: 120px;
  min-height: 20px;
}
#block-searchform-2 #search-block-form #edit-actions input {
  max-width: 50px;
  min-width: 100px;
  min-height: 20px;
  font-size: .8em;
  margin-top: .5em;
}
#block-ultimenustickynav-2 ul#ultimenu-sticky-nav .uitem > .ultimenu__flyout {
  margin: 0;
}
.t1-site-branding {
  margin: 0;
  display: grid;
  grid-template-columns: 1fr 2fr;
  max-width: 450px;
}
.t1-dept-logo img {
  margin-top: 1em;
  border-left: 1px #c8b186 solid;
  padding: 0 0 0 .5em;
  max-width: 250px;
}
.t1-uis-logo img {
  max-width: 170px;
}
ul.footer1-menu li {
  color: #fff;
  max-height: 50px;
}
ul.footer1-menu li a {
  color: #fff;
  background: none;
  font-weight: 500;
}
.t1-uis-logo {
  margin: 0 .5em 0 0;
  position: relative;
}
ul.footer1-menu li a:hover {
  text-decoration: underline;
}
.footer1-wrap {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  background: url(/sites/default/files/2021-07/cpaa-footer-bg.jpg);
  color: #fff;
  padding: 3em;
  background-position: center;
  background-size: cover;
}
.cbm-footer1-wrap {
  background: url(/sites/default/files/2021-10/cbm-footer-bg.jpg);
}
.footer1-menu li {
  list-style: none;
  padding: 1em 0;
  border-bottom: 1px solid #fff;
  color: #fff;
}
.footer1-menu a {
  text-decoration: none;
  color: #fff;
}
.footer1-col {
  max-width: 400px;
}
.uis-dept-logo {
  border-right: 1px solid #fff;
  padding: 0 .2em 0;
  margin-right: .2em;
}
.footer1-logo img {
  float: left;
}
.social-links span.fa-ext.extlink {
  display: none;
}
.social-media-links {
  max-width: 90%;
  margin: 2em auto 7em;
  display: grid;
  grid-auto-flow: column;
  text-align: center;
}
.contact-blk {
  padding: 0 3em;
}

/* ——— Breakpoints ——— */

/* PHONE */
@media (max-width:599px){
  .footer1-wrap { min-height: 400px; }
  .page-node-33408612 .aos-wrapper { grid-template-columns: 1fr; }
  a.footer-dept-logo { font-size: unset; }
	
}




/* ===== Mobile & Vertical Tablet (≤1000px) — COMBINED ===== */
@media (max-width:1000px){
  #header {
    display:block;
    position: fixed;
  }
  

 .header-txt .btn a {
    margin: 1em auto 0;
    padding: 10px;
    font-size: 1em;
    min-height:unset;
}

  .region.region-secondary-menu {
    position: relative;
    margin:-5px;
    top:unset;
    
  }
  
  .menu-t1-search {
    display: block;
    margin: 0 2em;
  }
  
  ul.menu .menu-t1-search a {
    padding: 2em 0 !important;
 }
 
  #primary_nav_wrap input[type="checkbox"]:checked+.menu {
    min-width: 100%;
  }
  
  #primary_nav_wrap ul li {
    padding: .5vw .2vw;
  }
  
  .header-txt {
    top: 55%;
  }
  
  .t1-dept-logo {
    max-width: 200px;
    line-height: .9em;
  }

  .t1-uis-logo {
    margin: 0;
  }
  
  .t1-uis-logo img {
    max-width: 130px;
    padding-top: .4em;
  }

  .region-primary-menu {
    max-height: 70px;
  }
  .t1-site-branding {
    margin: 0;
    max-width:350px;
  }
  .t1-dept-logo img {
    max-width: 200px;
  }
  .footer1-col:nth-child(2) {
    display: none;
  }
  .footer1-wrap {
    padding: 1em;
    grid-template-columns: 1fr;
  }
  img.uis-footer1-logo {
    max-width: 120px;
 }
 img.footer1-dept-logo {
    max-width: 200px;
 }

  /* --- Menu toggle button tile --- */
  #primary_nav_wrap{ --menu-btn-nudge:-1px; }
  #primary_nav_wrap label{
    display:inline-flex !important; align-items:center; justify-content:center;
    width:40px; height:40px; border-radius:8px;
    background:#000 !important; color:#fff !important; border:0 !important;
    box-shadow:none !important; outline:0 !important; margin-left:var(--menu-btn-nudge,0);
    z-index:99; cursor:pointer;
  }
  #primary_nav_wrap label:hover{ background:#036 !important; }
  #primary_nav_wrap label::before{ color:#fff !important; }
  #primary_nav_wrap label i{ color:#fff !important; }

  /* --- L1 main items (keep same look) --- */
  #primary_nav_wrap .menu{ background:#fff !important; }
  /* L1 (main items) */
  #primary_nav_wrap .menu > li > :is(a,span){
    display: flex; align-items: center; width: 100%; box-sizing: border-box;
    min-height: 62px; line-height: 42px; padding: 0 20px;
    background: #FFFFFF; color: #003366 !important; text-decoration: none;
    border: 0; border-bottom: 1px solid #003366;
  }
  /* L1 icons/carets */
  #primary_nav_wrap .menu > li > :is(a,span) i[class*="fa-"],
  #primary_nav_wrap .menu li.expanding-item::before{ color: #003366 !important; }

 
    /* ====== L2 (submenu) container & rows ====== */
  /* Closed submenu: one thin blue seam to next L1 */
  #primary_nav_wrap .menu > li > ul{
    background:#C8B18B !important;
    margin:0; padding:0;
    border-top:1px solid #C8B18B !important;     /* gold under opener */
    border-bottom:1px solid #003366 !important;  /* blue seam when CLOSED */
  }

  /* L2 rows: blue row dividers */
  #primary_nav_wrap .menu > li > ul > li > :is(a,span){
    background:#C8B18B !important; color:#003366 !important;
    display:block; width:100%; box-sizing:border-box; padding:12px 20px;
    border:0; border-bottom:1px solid #003366;   /* thin blue rows */
    text-decoration:none;
  }

  /* Prevent the “double seam” on the last closed L2 row */
  #primary_nav_wrap .menu > li > ul > li:last-child > :is(a,span){
    border-bottom-color: transparent !important;  /* let container seam show */
  }

  /* When an L2 row is OPEN, hide its own bottom line … */
  #primary_nav_wrap .menu > li > ul > li.open > :is(a,span),
  #primary_nav_wrap .menu > li > ul > li > :is(a[aria-expanded="true"],span[aria-expanded="true"]){
    border-bottom-color: transparent !important;
  }

  /* …and give the L3 block a white top seam under the opener */
  #primary_nav_wrap .menu > li > ul > li.open > ul{
    border-top:1px solid #FFFFFF !important;
  }

  /* If that OPEN row is the LAST in its submenu:
     move the final seam to GOLD between last L3 and the next L1 */
  #primary_nav_wrap .menu > li > ul > li.open:last-child > ul{
    border-bottom:1px solid #C8B18B !important;  /* gold end seam */
  }
  /* Drop the container’s blue seam in that case to avoid doubled lines */
  #primary_nav_wrap .menu > li > ul:has(> li.open:last-child > ul){
    border-bottom:0 !important;
  }
  
 /* White seam after an OPEN submenu (between its last L3 and the NEXT L2 row) */
#primary_nav_wrap .menu > li > ul > li.open + li > :is(a,span),
#primary_nav_wrap .menu > li > ul > li.menu-item--expanded + li > :is(a,span),
#primary_nav_wrap .menu > li > ul > li.menu-item-expanded + li > :is(a,span){
  border-top: 1px solid #FFFFFF !important;
}

  /* ====== L3 (subsubmenu) ====== */
  #primary_nav_wrap .menu > li > ul > li > ul{
    background:#003366 !important;
    margin:0; padding:0; border-left:0; border-right:0;
  }

  /* Subsubmenu rows: ALWAYS have thin white dividers (not only on hover) */
  #primary_nav_wrap .menu > li > ul > li > ul > li > :is(a,span),
  #primary_nav_wrap .menu > li > ul > li > ul > li > :is(a,span):link,
  #primary_nav_wrap .menu > li > ul > li > ul > li > :is(a,span):visited,
  #primary_nav_wrap .menu > li > ul > li > ul > li > :is(a,span):hover,
  #primary_nav_wrap .menu > li > ul > li > ul > li > :is(a,span):focus,
  #primary_nav_wrap .menu > li > ul > li > ul > li > :is(a,span):active{
    background:#003366 !important; color:#FFFFFF !important;
    display:block; width:100%; box-sizing:border-box;
    padding:12px 20px 12px 52px;                 /* indent */
    border-bottom:1px solid #FFFFFF !important;  /* thin white rows */
    text-decoration:none;
  }

  /* Last L3 row: no extra white line (lets the gold end seam show cleanly) */
  #primary_nav_wrap .menu > li > ul > li > ul > li:last-child > :is(a,span){
    border-bottom-color: transparent !important;
  }
}




/* 1200- and 1200+ keepers (unchanged) */
@media (max-width:1200px){
  .t1-uis-logo img { max-width: 120px; padding-top: .4em; }
  .t1-dept-logo img { max-width: 175px; }
  #primary_nav_wrap ul li { padding: .5vw .2vw; }
}


/* TABLET PORTRAIT (match mobile look) */
@media (min-width:600px) and (max-width:1000px){


  /* L1 (main) */
  #primary_nav_wrap :is(.menu, > ul){ background:#FFFFFF !important; }
  #primary_nav_wrap :is(.menu, > ul) > li > :is(a,span){
    background:#FFFFFF !important;
    color:#003366 !important;
    border:0 !important;
    border-bottom:1px solid #003366 !important;
  }
  #primary_nav_wrap :is(.menu, > ul) > li > :is(a,span) i[class*="fa-caret"]{ color:#003366 !important; }

  /* L2 (submenu) container — gold panel with BLUE seam to next L1 */
  #primary_nav_wrap :is(.menu, > ul) > li > ul{
    background:#C8B18B !important;
    margin:0 !important; padding:0 !important; border-left:0 !important; border-right:0 !important;
    border-top:1px solid #C8B18B !important;   /* gold line under the opener */
    border-bottom:1px solid #003366 !important;/* BLUE seam to next L1 */
  }

  /* L2 rows */
  #primary_nav_wrap :is(.menu, > ul) > li > ul > li > :is(a,span){
    background:#C8B18B !important;
    color:#003366 !important;
    border:0 !important;
    border-bottom:1px solid #003366 !important;
    width:100% !important; box-sizing:border-box;
  }

  /* Last L2 row: hide its own bottom divider so container's BLUE seam shows (avoid double line) */
  #primary_nav_wrap :is(.menu, > ul) > li > ul > li:last-child > :is(a,span){
    border-bottom-color: transparent !important;
  }

  /* When an L2 is OPEN: hide its own bottom border so L3's white top seam is visible */
  #primary_nav_wrap :is(.menu, > ul) > li > ul > li:where(.open,.menu-item--expanded,.menu-item-expanded) > :is(a,span),
  #primary_nav_wrap :is(.menu, > ul) > li > ul > li > :is(a[aria-expanded="true"],span[aria-expanded="true"]){
    border-bottom-color: transparent !important;
  }

  /* L3 (subsubmenu) panel — dark blue with white text and thin white row dividers */
  #primary_nav_wrap :is(.menu, > ul) > li > ul > li > ul{
    background:#003366 !important;
    margin:0 !important; padding:0 !important; border:0 !important;
    border-top:1px solid #FFFFFF !important;   /* white seam under the open L2 */
  }

  /* L3 rows — keep text visible in ALL states + row dividers */
  #primary_nav_wrap :is(.menu, > ul) > li > ul > li > ul > li > :is(a,span),
  #primary_nav_wrap :is(.menu, > ul) > li > ul > li > ul > li > :is(a,span):link,
  #primary_nav_wrap :is(.menu, > ul) > li > ul > li > ul > li > :is(a,span):visited,
  #primary_nav_wrap :is(.menu, > ul) > li > ul > li > ul > li > :is(a,span):hover,
  #primary_nav_wrap :is(.menu, > ul) > li > ul > li > ul > li > :is(a,span):focus,
  #primary_nav_wrap :is(.menu, > ul) > li > ul > li > ul > li > :is(a,span):active{
    background:#003366 !important;
    color:#FFFFFF !important;
    border-bottom:1px solid #FFFFFF !important;
    width:100% !important; box-sizing:border-box;
    padding-left:32px !important;
    /* add fallbacks so vars can't break padding on tablet */
    padding-right: calc(var(--caret-right, 18px) + var(--caret-hit, 48px)) !important;
  }

  /* L3 last row: no bottom divider; we'll draw a white seam above the next L2 row */
  #primary_nav_wrap :is(.menu, > ul) > li > ul > li > ul > li:last-child > :is(a,span){
    border-bottom-color: transparent !important;
  }

  /* White seam between last L3 of an OPEN L2 and the NEXT L2 row */
  #primary_nav_wrap :is(.menu, > ul) > li > ul > li.open + li > :is(a,span),
  #primary_nav_wrap :is(.menu, > ul) > li > ul > li.menu-item--expanded + li > :is(a,span),
  #primary_nav_wrap :is(.menu, > ul) > li > ul > li.menu-item-expanded + li > :is(a,span){
    border-top:1px solid #FFFFFF !important;
  }

  /* Carets: blue on gold (L2), white on blue (L3) */
  #primary_nav_wrap :is(.menu, > ul) > li > ul > li > :is(a,span) i[class*="fa-"],
  #primary_nav_wrap :is(.menu, > ul) > li > ul > li.expanding-item::before{ color:#003366 !important; }
  #primary_nav_wrap :is(.menu, > ul) > li > ul > li > ul > li > :is(a,span) i[class*="fa-"],
  #primary_nav_wrap :is(.menu, > ul) > li > ul > li > ul > li.expanding-item::before{ color:#FFFFFF !important; }


}

/* Theme 1 – force L2 (submenu) caret to #333 on desktop */
@media (min-width:1001px){
  /* L1 tabs + L2 dropdown rows: caret = #333 */
  #primary_nav_wrap > ul > li > :is(a,span) i[class*="fa-caret"],
  #primary_nav_wrap > ul > li > ul > li > :is(a,span) i[class*="fa-caret"]{
    color:#333 !important;
  }

  /* L3+ flyouts: caret follows text (white), and flips on hover */
  #primary_nav_wrap ul ul ul > li > :is(a,span) i[class*="fa-caret"]{
    color:currentColor !important;   /* white on dark-blue rows */
  }
  #primary_nav_wrap ul ul ul > li:hover > :is(a,span) i[class*="fa-caret"]{
    color:#003366 !important;        /* blue when row turns white */
  }

  /* If pseudo-caret is used instead of <i> */
  #primary_nav_wrap > ul > li > ul > li.expanding-item::before{ color:#333 !important; }
  #primary_nav_wrap ul ul ul > li.expanding-item::before{ color:#fff !important; }
  #primary_nav_wrap ul ul ul > li:hover.expanding-item::before{ color:#003366 !important; }
}


@media (max-width:1000px){


  nav.t1-menu{
    --safe-top: env(safe-area-inset-top, 0px); /* iOS notch friendly */
    --t1-header-h: 70px;                       /* fixed banner height */
    --underline: 5px;                          /* .region-primary-menu border-bottom */
    --drawer-top: calc(var(--safe-top) + var(--t1-header-h) + var(--underline));
  }

  /* 1) Freeze the banner (logos strip) to a single height */
  nav.t1-menu .region-primary-menu{
    height: var(--t1-header-h);
    min-height: var(--t1-header-h);
    max-height: var(--t1-header-h);
    display: grid;
    grid-template-columns: 2fr 5fr;
    align-items: center;
    overflow: hidden;                           /* stop growth from wraps */
  }

  /* 2) Make the logos fit inside the fixed bar */
  nav.t1-menu .t1-dept-logo img,
  nav.t1-menu .t1-uis-logo img{
    max-height: calc(var(--t1-header-h) - var(--underline) - 10px);
    height: auto; width: auto;
  }
  nav.t1-menu .t1-dept-logo img{ margin-top: 0 !important; } /* remove the 1em bump */
  nav.t1-menu .t1-dept-logo{
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  }

  /* 3) Put the drawer right under the banner underline */
  nav.t1-menu #primary_nav_wrap .menu,
  nav.t1-menu #primary_nav_wrap input[type="checkbox"]:checked + .menu{
    top: calc(var(--drawer-top) - 4px) !important;
  }
}

