/* screen - main-nav-6 */

html, body {
  height: 100%;
}

.container-center-horizontal {
  height: 100%;
}

.main-nav-6 {
  align-items: flex-start;
  background-color: var(--bgwhite);
  display: flex;
  flex-direction: column;
  gap: 50px;
  /*height: 2240px;*/
  width: 100%;
}

.main-nav-6 .overlap-group {
  /*height: 4540px;*/
  /*margin-top: -2685px;*/
  position: relative;
  width: 100%;
  display: flex;
  flex-direction: column;
  height: 100%;
}

.main-nav-6 .content-1 {
  align-items: flex-start;
  display: flex;
  /*height: 811px;*/
  left: 0;
  /*position: absolute;*/
  /*top: 2865px;*/
  width: 100%;
  flex: 1 0 auto;
}

.main-nav-6 .sidebar {
  align-items: flex-start;
  /*background-color: var(--bg2-surfaces);*/
  display: inline-flex;
  flex: 0 0 auto;
  flex-direction: column;
  gap: 15px;
  /*height: 1752px;*/
  /*margin-bottom: -941.00px;*/
  overflow-y: auto;
  /*padding: 30px 0px;*/
  position: relative;
  padding-bottom: 30px;
}

/*
.main-nav-6 .title {
  align-items: center;
  display: flex;
  flex: 1;
  flex-grow: 1;
  gap: 10px;
  position: relative;
}
*/

.main-nav-6 .title-1 {
  align-items: center;
  display: flex;
  flex: 1;
  flex-grow: 1;
  gap: 5px;
  position: relative;
}

.main-nav-6 .content-2::-webkit-scrollbar {
  display: none;
  width: 0;
}

/*  
.main-nav-6 .content-2 {
  flex: 1;
  flex-grow: 1;
  /*height: 730px;*/
  /*overflow-y: auto;
  position: relative;
  margin-right: 370px; 
   /* Scroll settings /
 height: 100%; /* Fills available space /
max-height: 100vh; /* Full height of the viewport /
  overflow-y: auto;
  overflow-x: hidden; /* Optional: disables horizontal scroll 
}
*/

.main-nav-6 .content-2 {
  flex: 1 1 auto;                                    /* fill the middle */
  min-height: 0;                                     /* critical for flex scrolling */
  height: calc(100vh - var(--header-h, 0px) - var(--footer-h, 0px));
  position: relative;
  overflow-y: auto;                                   /* only this area scrolls */
  overflow-x: hidden;
  box-sizing: border-box;
}

section.frame-285 { 
padding: 12px; 
margin-bottom: 20px; 
width: 100%; 
font-size: 13px; 
}

section.frame-285 > .title { 
font-size: 20px; 
font-weight: bold; 
color: #1e1e5a; 
margin-bottom: 8px; 
} 

section.frame-285 ul {
font-size: 14px;
list-style-type: disc; 
padding-left: 20px; 
margin: 0; 
} 

section.frame-285 ul li { 
font-size: 14px;
margin-bottom: 6px; 
}

section.frame-285 a {
font-size: 14px;
color: #0056b3; 
text-decoration: none; 
} 

section.frame-285 a:hover { 
text-decoration: underline; 
}



.main-nav-6 .page-pagination {
  align-items: flex-start;
  align-self: stretch;
  display: flex;
  flex: 0 0 auto;
  flex-direction: column;
  gap: 15px;
  padding: 30px 0px 30px 0px;
  position: relative;
  width: 100%;
}

.main-nav-6 .content-3 {
  align-items: flex-start;
  display: flex;
  flex: 0 0 auto;
  position: relative;
  width: 200px;
}

.main-nav-6 .scrolling-navigation {
  align-self: stretch;
  background-color: var(--charts--graphslight-grey);
  border-radius: 5px;
  position: relative;
  width: 4px;
}

.main-nav-6 .x50 {
  background-color: var(--primary-colorscolor-2);
  border-radius: 5px;
  height: 50px;
  position: relative;
  top: 205px;
}

.main-nav-6 .topics {
  align-items: flex-start;
  display: inline-flex;
  flex: 0 0 auto;
  flex-direction: column;
  gap: 5px;
  position: relative;
}

.main-nav-6 .level-3-4 {
  display: flex;
  width: 196px;
}

.main-nav-6 .scrolling-navigation-title-1 {
  align-self: stretch;
  gap: 10px;
  padding: 5px 15px 5px 30px;
  width: 100%;
}

/*
.main-nav-6 .filters {
  align-items: flex-start;
  align-self: stretch;
  display: flex;
  flex: 0 0 auto;
  flex-direction: column;
  gap: 30px;
  padding: 0;
  position: relative;
  width: 100%;
}
*/

.main-nav-6 .tag {
  align-items: flex-start;
  background-color: var(--primary-colorscolor-4);
  border-radius: 5px;
  display: inline-flex;
  flex: 0 0 auto;
  padding: 2px 5px;
  position: relative;
}

.main-nav-6 .content-4 {
  align-items: flex-start;
  display: inline-flex;
  flex-direction: column;
  gap: 60px;
  left: 382px;
  position: absolute;
  top: 0;
}

.main-nav-6 .level-2 {
  gap: 15px;
}

.main-nav-6 .title-2 {
  align-items: flex-start;
  display: flex;
  flex: 0 0 auto;
  flex-direction: column;
  gap: 10px;
  padding: 0px 15px 0px 0px;
  position: relative;
  width: 750px;
}

.main-nav-6 .title-3 {
  letter-spacing: 0;
  line-height: 30px;
  margin-top: -1.00px;
  position: relative;
  white-space: nowrap;
  width: fit-content;
}

.main-nav-6 .print {
  height: 15px;
  /*margin-bottom: -3258.50px;*/
  /*margin-left: -34330px;*/
  position: relative;
  width: 15px;
}

.main-nav-6 .content {
  align-items: flex-start;
  display: flex;
  flex: 0 0 auto;
  flex-direction: column;
  gap: 10px;
  position: relative;
  width: 750px;
}

.main-nav-6 .level-3 {
  gap: 15px;
}

.main-nav-6 .title-4 {
  align-items: flex-start;
  display: flex;
  flex: 0 0 auto;
  flex-direction: column;
  gap: 15px;
  position: relative;
  width: 750px;
}

.main-nav-6 .title-5 {
  align-items: center;
  align-self: stretch;
  display: flex;
  flex: 0 0 auto;
  gap: 5px;
  position: relative;
  width: 100%;
}

.main-nav-6 .link {
  height: 15px;
  margin-bottom: -2973.50px;
  margin-left: -17706.00px;
  position: relative;
  width: 15px;
}

.main-nav-6 .description {
  align-items: flex-start;
  display: inline-flex;
  flex: 0 0 auto;
  gap: 10px;
  position: relative;
}

.main-nav-6 .image-1 {
  height: 425px;
  margin-bottom: -2656.00px;
  margin-left: -17706.00px;
  position: relative;
  width: 750px;
}

.main-nav-6 .image-2 {
  height: 200px;
  margin-bottom: -2906.00px;
  margin-left: -17706.00px;
  position: relative;
  width: 400px;
}

.main-nav-6 .level-3-4-1 {
  align-items: flex-start;
  display: inline-flex;
  flex: 0 0 auto;
  flex-direction: column;
  gap: 20px;
  position: relative;
}

.main-nav-6 .level-3-1 {
  display: inline-flex;
  gap: 15px;
}

.main-nav-6 .content-5 {
  align-items: flex-start;
  display: flex;
  flex: 0 0 auto;
  flex-direction: column;
  gap: 15px;
  position: relative;
  width: 750px;
}

.main-nav-6 .title-6 {
  align-items: center;
  align-self: stretch;
  display: flex;
  flex: 0 0 auto;
  gap: 5px;
  position: relative;
  width: 100%;
}

.main-nav-6 .link-1 {
  margin-bottom: -2043.50px;
  margin-left: -17706.00px;
}

.main-nav-6 .description-1 {
  align-items: flex-start;
  display: inline-flex;
  flex: 0 0 auto;
  flex-direction: column;
  gap: 10px;
  position: relative;
}

.main-nav-6 .image-3 {
  height: 425px;
  margin-bottom: -1171.00px;
  margin-left: -17706.00px;
  position: relative;
  width: 750px;
}

.main-nav-6 .image-4 {
  height: 425px;
  margin-bottom: -1646.00px;
  margin-left: -17706.00px;
  position: relative;
  width: 750px;
}

.main-nav-6 .image-5 {
  height: 200px;
  margin-bottom: -1916.00px;
  margin-left: -17706.00px;
  position: relative;
  width: 400px;
}

.main-nav-6 .note {
  align-items: flex-start;
  align-self: stretch;
  background-color: var(--charts--graphsorange-10);
  border-radius: 5px;
  display: flex;
  flex: 0 0 auto;
  flex-direction: column;
  gap: 5px;
  padding: 15px;
  position: relative;
  width: 100%;
}

.main-nav-6 .solidlightbulb {
  height: 15px;
  margin-bottom: -651.00px;
  margin-left: -17721.00px;
  position: relative;
  width: 15px;
}

.main-nav-6 .level-3-2 {
  display: inline-flex;
  gap: 15px;
}

.main-nav-6 .title-7 {
  align-items: flex-start;
  display: flex;
  flex: 0 0 auto;
  flex-direction: column;
  gap: 15px;
  position: relative;
  width: 750px;
}

.main-nav-6 .title-8 {
  align-items: center;
  align-self: stretch;
  display: flex;
  flex: 0 0 auto;
  gap: 5px;
  position: relative;
  width: 100%;
}

.main-nav-6 .image-6 {
  height: 425px;
  position: relative;
  width: 750px;
}

.main-nav-6 .image {
  /*
  height: 200px;
  position: relative;
  width: 400px;
  */
}

.main-nav-6 .was-this-article-helpful {
  align-items: flex-start;
  display: flex;
  flex: 0 0 auto;
  flex-direction: column;
  gap: 15px;
  position: relative;
  width: 750px;
}

.main-nav-6 .pagination-1 {
  align-items: flex-start;
  display: inline-flex;
  flex: 0 0 auto;
  gap: 30px;
  /*position: relative;*/
}

.main-nav-6 .header-new {
  box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
  display: flex;
  left: 0;
  /*position: absolute;*/
  /*top: 2685px;*/
  width: 100%;
}

.main-nav-6 .support-buttons {
  align-items: center;
  background-color: var(--white);
  height: 30px;
  justify-content: flex-end;
  padding: 0px 90px;
  width: 100%;
}

.main-nav-6 .buttons-primary-button {
  align-items: center;
  border-radius: 2px;
  display: inline-flex;
  flex: 0 0 auto;
  gap: 5px;
  height: 20px;
  position: relative;
}

.main-nav-6 .external-link {
  height: 15px;
  position: relative;
  width: 15px;
}

.main-nav-6 .label {
  letter-spacing: 0;
  line-height: 20px;
  position: relative;
  white-space: nowrap;
  width: fit-content;
}

.main-nav-6 .label-1 {
  line-height: 20px;
  white-space: nowrap;
  width: fit-content;
}

.main-nav-6 .label-2 {
  line-height: 20px;
  white-space: nowrap;
  width: fit-content;
}

.main-nav-6 .label-3 {
  line-height: 20px;
  white-space: nowrap;
  width: fit-content;
}

.main-nav-6 .header {
  align-items: center;
  align-self: stretch;
  background-color: var(--primary-colorscolor-1);
  display: flex;
  height: 80px;
  justify-content: space-between;
  padding: 0px 90px;
  position: relative;
  width: 100%;
}

.main-nav-6 .header-tab {
  border-radius: 0px 0px 5px 5px;
  display: inline-flex;
  flex: 0 0 auto;
  height: 70px;
  justify-content: center;
  padding: 10px 15px 0px;
  position: relative;
}

.main-nav-6 .text {
  align-items: flex-start;
  display: inline-flex;
  flex: 0 0 auto;
  gap: 5px;
  position: relative;
}

.main-nav-6 .image-7 {
  align-self: stretch;
  background-image: url(../img/image-4@2x.png);
  background-position: 50% 50%;
  background-size: cover;
  border-radius: 40px;
  flex: 1;
  flex-grow: 1;
  position: relative;
}

.main-nav-6 .icon-1 {
  height: 10px;
  position: relative;
  width: 10px;
}

.main-nav-6 .filters-1 {
  align-self: stretch;
  background-color: var(--bgwhite);
  border-radius: 0px 0px 5px 5px;
  display: flex;
  gap: 45px;
  justify-content: center;
  padding: 15px 90px;
  width: 100%;
}

.main-nav-6 .filters-2 {
  display: inline-flex;
  gap: 15px;
}

.main-nav-6 .futer {
  align-items: flex-start;
  background-color: var(--primary-colorscolor-1);
  display: flex;
  flex-direction: column;
  position: relative;
  width: 100%;
  flex: 0 0 auto;
}

.main-nav-6 .content-6 {
  align-items: flex-start;
  align-self: stretch;
  display: flex;
  flex: 0 0 auto;
  justify-content: space-between;
  padding: 30px 90px;
  position: relative;
  width: 100%;
}

.main-nav-6 .trial-interactive {
  align-items: flex-start;
  display: inline-flex;
  flex: 0 0 auto;
  flex-direction: column;
  gap: 15px;
  position: relative;
}

.main-nav-6 .buttons-primary-button-1 {
  background-color: var(--bgwhite);
  border: 1px solid;
  border-color: var(--primary-colorscolor-1);
  border-radius: 5px;
  box-shadow: 0px 1px 3px #4c4c4c63;
  display: inline-flex;
  gap: 5px;
  height: 40px;
  min-width: 105px;
  padding: 9px 20px;
}

.main-nav-6 .label-4 {
  flex: 1;
  line-height: 22px;
  margin-top: -1.00px;
  text-align: center;
}

.main-nav-6 .title-9 {
  align-items: flex-start;
  display: inline-flex;
  flex: 0 0 auto;
  flex-direction: column;
  gap: 5px;
  position: relative;
}

.main-nav-6 .buttons-primary-button-2 {
  background-color: var(--bgwhite);
  border: 1px solid;
  border-color: var(--primary-colorscolor-1);
  border-radius: 5px;
  box-shadow: 0px 1px 3px #4c4c4c63;
  display: inline-flex;
  gap: 5px;
  height: 30px;
  min-width: 75px;
  padding: 5px 15px;
}

.main-nav-6 .icon {
  align-self: stretch;
  flex: 1;
  letter-spacing: 0;
  line-height: normal;
  margin-top: -1.00px;
  position: relative;
  text-align: center;
  white-space: nowrap;
}

.main-nav-6 .label-5 {
  flex: 1;
  line-height: 20px;
  margin-top: -1.00px;
  text-align: center;
}

.main-nav-6 .language {
  align-items: center;
  display: inline-flex;
  flex: 0 0 auto;
  gap: 5px;
  position: relative;
}

.main-nav-6 .language-1 {
  background-image: url(../img/rectangle-8-2@2x.png);
  background-size: 100% 100%;
  height: 30px;
  margin-left: -18682.00px;
  margin-top: -1589.00px;
  position: relative;
  width: 30px;
}

.main-nav-6 .buttons-primary-button-3 {
  align-items: center;
  justify-content: center;
  position: relative;
}

.main-nav-6 .header-1 {
  align-items: center;
  flex-direction: column;
}

.main-nav-6 .label-6 {
  letter-spacing: 0;
  position: relative;
}

.main-nav-6 .level {
  align-items: flex-start;
  display: inline-flex;
  flex: 0 0 auto;
  flex-direction: column;
  position: relative;
}

.main-nav-6 .level-3-3 {
  align-items: flex-start;
  flex: 0 0 auto;
  flex-direction: column;
  position: relative;
}

/* 
#wh_publication_toc {
  align-items: center;
  gap: 15px;
  padding: 0px 10px 0px 90px;
  position: relative;
  width: 420px;
}

#wh_publication_toc span.title {
  display: block !important;
  gap: 15px;
  padding: 5px 15px;
}

#wh_publication_toc > div > ul > li > span > span.title > span > p {
  margin-top: 10px;
}

#wh_publication_toc > div > ul > li > span > span.title > a {
  color: var(--text-colorsdefault);
  font-family: var(--font-family-open_sans);
  font-size: var(--font-size-xxl);
  font-style: normal;
  font-weight: 600;
}

#wh_publication_toc > div > ul > li > span > span.title > span > p {
  color: var(--text-colorsdefaultsecondary);
  font-family: var(--font-family-open_sans);
  font-size: var(--font-size-s);
}

#wh_publication_toc > div > ul > li > ul > li > span > span.title {
  background: url(../img/chevron-up.svg) no-repeat right center;
}

#wh_publication_toc > div > ul > li > ul > li.active > span > span.title {
  background: url(../img/chevron-down.svg) no-repeat right center;
}

#wh_publication_toc > div > ul > li > ul > li a {
  letter-spacing: 0;
  line-height: 25px;
  margin-top: -1px;
  position: relative;
  width: 195px;
  color: var(--text-colorsdefault);
  font-family: var(--font-family-open_sans);
  font-size: var(--font-size-l);
  font-style: normal;
  font-weight: 600;
}

#wh_publication_toc > div > ul > li > ul > li > ul > li {
  padding-left: 15px;
}

#wh_publication_toc > div > ul > li > ul > li > ul > li > ul > li {
  padding-left: 30px;
}

#wh_publication_toc > div > ul > li > ul > li > ul > li a {
  flex: 1;
  letter-spacing: 0;
  line-height: 20px;
  margin-top: -1px;
  position: relative;
  color: var(--text-colorsdefaultsecondary);
  font-family: var(--font-family-open_sans);
  font-size: var(--font-size-m);
  font-style: normal;
  font-weight: 600;
}

#wh_publication_toc > div > ul > li > ul > li > ul > li.active span.title {
  background-color: var(--primary-colorscolor-2);
  border-radius: 2px;
}

#wh_publication_toc > div > ul > li > ul > li > ul > li.active span.title a {
  color: var(--bgwhite);
}

div.wh_breadcrumb {
  margin-top: 10px;
}

div.wh_breadcrumb > ol > li {
  font-family: var(--font-family-open_sans);
  font-size: var(--font-size-m);
  font-style: normal;
  font-weight: 600;
  margin-bottom: 5px;
}

div.wh_breadcrumb > ol > li a {
  color: var(--text-colorsdefaultsecondary);
}

div.wh_breadcrumb > ol > li span.wh-tooltip {
  font-size: var(--font-size-s);
  color: var(--text-colorsdefaultsecondary);
  font-weight: normal;
}
 */
.wh_hide_highlight, .wh_navigation_links, .webhelp_expand_collapse_sections {
  display: none;
}

.wh_print_link {
  float: right;
  margin-top: 20px;
}

.wh_publication_toc span.wh-tooltip {
  display: none;
}

.wh_print_link button {
  background: url(../img/print.svg) no-repeat;
  width: 16px;
  height: 16px;
  border: none;
  cursor: pointer;
}

.content-2 {
  padding-right: 0px;
  padding-left: 0px;
}

.wh_content_area {
  color: var(--text-colors-default, #100040);
  font-family: var(--font-family-open_sans);
}

.wh_content_area * {
  font-size: var(--font-size-m);
  font-style: normal;
  /*font-weight: 400;*/
  line-height: 20px;
  margin-bottom: 10px;
}

.wh_content_area img {
  line-height: normal;
  margin-bottom: -5px;
}

.wh_content_area h2, .wh_content_area h2 * {
  font-weight: 600;
}

.wh_content_area h1 {
  font-size: var(--font-size-xxxl);
  font-style: normal;
  font-weight: 600;
  line-height: 30px;
  margin-bottom: 10px;
  margin-top: 20px;
}

.was-this-article-helpful {
  margin-top: 60px;
  margin-bottom: 60px;
}

#wh_topic_toc {
  letter-spacing: 0;
  line-height: 20px;
  position: relative;
  font-family: var(--font-family-open_sans);
  font-style: normal;
  margin-top: 10px;
  margin-bottom: 10px;
}

#wh_topic_toc .wh_topic_label {
  color: var(--text-colorsdefaultsecondary);
  font-size: var(--font-size-s);
  font-weight: 600;
}

#wh_topic_toc .section-title {
    padding: 10px;
    padding-bottom: 0;
}

#wh_topic_toc .section-title a {
    color: var(--text-colorsdefault);
    font-weight: 600;
    font-size: var(--font-size-m);
}

.filters {
  margin-top: 10px;
  display: flex;
  gap: 10px;
  color: var(--text-colorsdefaultsecondary);
  font-size: var(--font-size-s);
  font-weight: 600;
}

.filters .tag * {
  margin: 0px;
  border-radius: 5px;
  background: var(--primary-colors-color-4, #EDF5FB);
  color: var(--text-colors-default, #100040);
  font-size: var(--font-size-s);
}

#searchForm {
  /*display: none;*/
}

#searchForm > div {
  display: flex;
  align-items: stretch;
}

.search-header-inline-container {
  align-items: center;
  background-color: var(--bgwhite);
  border-radius: 8px;
  display: flex;
  gap: 15px;
  height: 50px;
  justify-content: center;
  padding: 15px;
}

.wh_search_textfield {
  display: flex;
  flex: 1;
  border: none;
  outline: none;
  color: var(--text-colorsdefaultsecondary);
  font-family: var(--font-family-open_sans);
  font-size: var(--font-size-m);
  font-style: normal;
  font-weight: 400;
}

.wh_search_button {
  height: 20px;
  position: relative;
  width: 20px;
  background: url("../img/search-1.svg") center center no-repeat;
  border: none;
}

.search_input_text {
  display: none;
}

/* SEARCH OVERRIDES */
.wh_search_results_header_docs {
  /*display: none;*/
}

.wh_search_expression {
  font-weight: bold;
}

.showSimilarPages {
  display: none !important;
}

#results .row {
  display: block;
}

#searchResults {
  max-width: 1440px;
  margin: 50px auto;
}

#searchResults .searchresult li {
  font-style: normal;
  font-weight: 600;
  font-size: 18px;
  color: #100040;
  /*border-bottom: 1px solid #D8D8D8;*/
}

#searchResults .searchresult >li {
  border-bottom: 1px solid #D8D8D8;
}

#searchResults .searchresult li a {
  font-style: normal;
  font-weight: 600;
  font-size: 18px;
  /*color: #100040;*/
}

#searchResults .searchresult li .relativePath a {
  font-weight: 400;
  font-size: 14px;
  display: none;
}

.searchItemAdditionalData {
  display: flex;
  justify-content: center;
}

.searchItemAdditionalData .missingAndSimilar {
  flex-grow: 2;
}

.searchItemAdditionalData #rightDiv {
  align-self: flex-start;
  margin-right: 100px;
}

.searchItemAdditionalData #star .star {
  list-style: none;
  margin: 0;
  padding: 0;
  width: 85px;
  height: 20px;
  left: 1px;
  top: -5px;
  position: relative;
  float: right;
  background: url('../img/starsSmall.png') repeat-x 0 -25px;
}

.searchItemAdditionalData #star .curr {
  background: url('../img/starsSmall.png') 0 25px;
  float: left;
  width: 85px;
  font-size: 1px;
}

.relativePath a {
  color: #5D6982;
}

.searchresult ol {
  list-style-type: none !important;
  margin-left: -10px;
}

.search-breadcrumb {
  margin-top: 15px;
}

.shortdesclink, .searchItemAdditionalData {
  font-weight: normal;
  color: #5D6982;
}

.shortdesclink .search-shortdescription-highlight {
  font-weight: bold;
}

#wh-search-pagination .pagination {
  flex-direction: row;
  gap: 30px;
}

.pagination.bootpag {
  margin: 0 auto;
}

.pagination.bootpag .active {
  font-weight: bold;
}

.pagination li {
  display: flex;
}


.search-breadcrumb ol {
  display: flex;
  list-style: none;
  padding: 0;
  flex-wrap: wrap;
  align-content: space-between;
  justify-content: flex-start;
  font-size: .8em;
}

.search-breadcrumb li:first-child {
  margin-left: inherit;
}
.search-breadcrumb li {
  padding: 0 !important;
  margin-bottom: .3em;
  margin-left: -1.2em;
}

.search-breadcrumb li .title::after {
  border-color: transparent;
  border-left-color: #ddd;
}
.search-breadcrumb li .title::before, .search-breadcrumb li .title::after {
  display: inline-block;
  content: "";
  border-style: solid;
  border-color: #EDF5FB;
  border-width: 1em;
  padding-left: 2px;
  font-size: 0.8em;
  margin-bottom: 0;
}
.search-breadcrumb li .title::before {
  border-left-color: transparent;
}
.search-breadcrumb li .title::after {
  border-color: transparent;
  border-left-color: #FFF;
}
.search-breadcrumb li:first-child a {
  border-radius: .1em 0 0 .1em;
}
.searchresult li a {
  color: #346ec5;
}
.search-breadcrumb li a {
  color: #fff;
  display: block;
  background: #EDF5FB;
  color: #100040;
  text-decoration: none;
  line-height: 1.6em;
  padding: 0.5em;
  text-align: center;
  font-size: 0.8em !important;
  margin-bottom: 0;
}

.search-breadcrumb li .title {
  display: flex;
  justify-content: flex-start;
  flex-wrap: nowrap;
  margin-bottom: 0;
}
/*  
.ui-widget-content.ui-autocomplete {
  background: white;
  border-radius: 5px;
  list-style: none;
  margin-left: 0;
  padding-left: 0px;
  padding: 15px;
  right: 0px;
  width: 250px;
  font-family: var(--font-family-open_sans);
}
*/

.search-autocomplete-proposal-icon.history {
  display: none;
  color: blue;
  text-transform: capitalize;
  font-size: 10px;
  padding-right: 3px;
}

.ui-menu-item {
  display: none;
  text-transform: uppercase;
  color: #5D6982;
}

.search-autocomplete-proposal-hg {
  display: none;
  font-weight: bold;
}

.ui-menu-item:hover {
  display: none;
  text-decoration: underline;
  cursor: pointer;
}

/* Video Gallery Layout */
ul.video-gallery {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(340px, 340px)); /* fixed 360px cards */
  flex-wrap: wrap;
  column-gap: 0px;
  justify-content: start; 
  padding: 10px 0;
  margin: 0 auto;
  list-style: none;
  box-sizing: border-box;
  max-width: 1300px; /* Optional: to prevent overflow into sidebar */
}
 
/* Each card container */

ul.video-gallery li {

  max-width: 400px;
  min-width: 280px;
  box-sizing: border-box;
  display: flex;
  justify-content: flex-start;
}
 
/* Card styling */
fig.video-card,
figure.video-card,
.video-card  {
  align-items: flex-start;
  background-color: #F5F5F5;
  border-radius: 8px;
   box-shadow: 0px 8px 24px rgba(0, 0, 0, 0.4); /* darker, deeper shadow */
  transition: box-shadow 0.3s ease;
  display: flex;
  flex: 1;
  flex-direction: column;
  flex-grow: 1;
  position: relative;
  width: 100%;
  max-width: 400px;
  box-sizing: border-box;
  overflow: hidden; /* keeps overlay inside the rounded corners */
}
 
/* Image styling */
.video-card img,
.video-card image,
.video-card .image {
  border: none;
  outline: none;
  box-shadow: none;
  max-width: 100%;
  height: auto;
  border-radius: 8px;
  display: block;
}
 
fig img,
fig image {
  max-width: 100%;
  height: auto;
  border-radius: 8px;
  border: none;
  outline: none;
  display: block;
}
 
 
 
/* Title styling */
.video-title {
  align-self: stretch;
  color: #002147;
  text-align: left;
  font-weight: bold;
}
 
.video-title xref,
.video-title a {
  font-size: 18px;
  color: #003366;
  font-weight: 600;
  text-decoration: none;
  font-family: "Open Sans", Helvetica, sans-serif;
}
 
.opensans-semi-bold-tolopea-18px {
  color: #002147;
  font-family: "Open Sans", Helvetica;
  font-size: 20px;
  font-style: normal;
  font-weight: 600;
}

/* Full-card overlay lives on the <p class="video-title"> */
.video-card .video-title {
  position: static;             /* was absolute */
  margin: 0;
 padding: 2px 6px;
  z-index: auto;
  background: transparent; 
}

/* Title link styling */
.video-card .video-title a,
.video-card .video-title xref,
.video-card .video-title *[href] {
  display: block;               /* make the whole title row clickable */
 
  text-decoration: none;
  font-size: 18px;
  font-weight: 600;
  font-family: "Open Sans", Helvetica, sans-serif;
  color: #003366;
}

/* Make the WHOLE CARD clickable using a stretched link */
.video-card .video-title a::after,
.video-card .video-title xref::after,
.video-card .video-title *[href]::after {
  content: "";
  position: absolute;
  inset: 0;                     /* fills .video-card */
  z-index: 1;                   /* above image, behind visible text */
}

/* Hover/focus feedback for the whole card */
fig.video-card:hover,
figure.video-card:hover,
.video-card:hover,
fig.video-card:focus-within,
figure.video-card:focus-within,
.video-card:focus-within {
  box-shadow: 0 12px 30px rgba(0,0,0,.35);
  transform: translateY(-1px);
  transition: box-shadow .2s ease, transform .1s ease;
}

/* Optional: remove underline on hover, keep title color */
.video-card .video-title a:hover,
.video-card .video-title a:focus {
  text-decoration: none;
  color: #003366;
}


/* Base styles for layout */
#wh_publication_toc {
 align-items: center;
 gap: 15px;
 padding: 0px 10px 0px 90px;
 position: relative;
 width: 420px;
}
 
/* Common Title block */
#wh_publication_toc span.title {
 display: block !important;
 padding: 5px 15px;
 gap: 15px;
}
 
/* Top-level parent title */
#wh_publication_toc > div > ul > li > span > span.title > a {
 color: var(--text-colorsdefault);
 font-family: var(--font-family-open_sans);
 font-size: var(--font-size-xxl);
 font-weight: 600;
}
 
/* Parent arrow - default up */
#wh_publication_toc li[aria-expanded="false"] > span > span.title {
 background: url(../img/chevron-up.svg) no-repeat right center;
}
 
/* Parent arrow - expanded */
#wh_publication_toc li[aria-expanded="true"] > span > span.title {
 background: url(../img/chevron-down.svg) no-repeat right center;
}
 
/* First-level child links (Minakshi, etc.) */
#wh_publication_toc li li > span.title a {
 display: block;
 padding: 5px 15px;
 color: var(--text-colorsdefault);
 font-size: var(--font-size-l);
 font-weight: 600;
 font-family: var(--font-family-open_sans);
}
 
/* Sub-child (Yogita, etc.) */
#wh_publication_toc li li li > span.title a {
 font-size: var(--font-size-m);
 font-weight: 600;
 color: var(--text-colorsdefaultsecondary);
}
 
/* Highlight only the selected .active at its level */
#wh_publication_toc li li.active > span.title,
#wh_publication_toc li li li.active > span.title {
 background-color: var(--primary-colorscolor-2);
 border-radius: 2px;
}
 
#wh_publication_toc li li.active > span.title a,
#wh_publication_toc li li li.active > span.title a {
 color: var(--bgwhite);
}
 

/* ========== PILL + ACTIVE ONLY ON DEEPEST LEVEL ========== */
:root {
  --toc-pill-bg: #5A8FC2;
  --toc-pill-text: #fff;
  --toc-pill-r: 3px;
  --toc-pill-py: 3px;
  --toc-pill-px: 10px;

  --toc-hover-bg: #6AA0D1;
  --toc-hover-text: #ffffff;
}

/* Highlight only the clicked item */
.navbar-nav.nav-list li.active { background: transparent !important; }

.navbar-nav.nav-list a.active,
.navbar-nav.nav-list a[aria-current="page"],
.navbar-nav.nav-list .topicref.active,
.navbar-nav.nav-list .topicref[aria-current="page"] {
  display: inline-block !important;
  background: var(--toc-pill-bg) !important;
  color: var(--toc-pill-text) !important;
  border-radius: var(--toc-pill-r);
  padding: var(--toc-pill-py) var(--toc-pill-px);
  line-height: 1.1;
  text-decoration: none;
  border-left: 0 !important;
}

.navbar-nav.nav-list a.active * {
  color: inherit !important;
}

/* Remove left bars */
.navbar-nav.nav-list a.active::before,
.navbar-nav.nav-list a[aria-current="page"]::before {
  content: none !important;
  display: none !important;
}

/* Disable highlight on ancestor */
.navbar-nav.nav-list li.active:has(li.active) > a,
.navbar-nav.nav-list li.active:has(li.active) > .topicref {
  background: transparent !important;
  color: inherit !important;
}

/* Hover styling 
.navbar-nav.nav-list a:hover,
.navbar-nav.nav-list .topicref:hover {
  background: var(--toc-hover-bg) !important;
  color: var(--toc-hover-text) !important;
  border-radius: var(--toc-pill-r);
  padding: var(--toc-pill-py) var(--toc-pill-px);
  line-height: 1.1;
  text-decoration: none;
}

/* --- Click/hover highlight for non-current items --- 
:root{
  --toc-hover-bg:  #6AA0D1;  /* hover/click blue 
  --toc-hover-text:#ffffff;  /* text on hover 
}

.navbar-nav.nav-list a:not(.active):not([aria-current="page"]):hover,
.navbar-nav.nav-list .topicref:not(.active):not([aria-current="page"]):hover,
.navbar-nav.nav-list a:not(.active):not([aria-current="page"]):focus,
.navbar-nav.nav-list .topicref:not(.active):not([aria-current="page"]):focus,
.navbar-nav.nav-list a:not(.active):not([aria-current="page"]):active,
.navbar-nav.nav-list .topicref:not(.active):not([aria-current="page"]):active {
  display: inline-block;                      /* compact pill 
  background: var(--toc-hover-bg) !important;
  color: var(--toc-hover-text) !important;
  border-radius: var(--toc-pill-r);
  padding: var(--toc-pill-py) var(--toc-pill-px);
  line-height: 1.1;
  text-decoration: none;
  outline: none;
}
*/

/* ========== TOC NESTING + ARROWS ========== */
#wh_publication_toc {
  padding: 0 10px 0 90px;
  width: 420px;
  align-items: center;
  gap: 15px;
}

/* TOC title blocks */
#wh_publication_toc span.title {
  display: block !important;
  padding: 5px 15px;
}

/* INDENTATION by nesting level */
#wh_publication_toc li ul li { padding-left: 15px; }
#wh_publication_toc li ul li ul li { padding-left: 30px; }
#wh_publication_toc li ul li ul li ul li { padding-left: 45px; }

/* ARROWS — default collapsed (up) */
#wh_publication_toc li[aria-expanded="false"] > span > span.title {
  background: url(../img/chevron-up.svg) no-repeat right center;
}

/* ARROWS — expanded (down) */
#wh_publication_toc li[aria-expanded="true"] > span > span.title {
  background: url(../img/chevron-down.svg) no-repeat right center;
}

/* Subsection link styles */
#wh_publication_toc li > span > span.title > a {
  font-size: var(--font-size-l);
  font-weight: 600;
  color: var(--text-colorsdefault);
  font-family: var(--font-family-open_sans);
}

#wh_publication_toc li li > span.title a {
font-size: 14px !important;
  font-size: var(--font-size-m);
  color: var(--text-colorsdefault);
  font-weight: 600;
}

#wh_publication_toc li li li > span.title a {
font-size: 14px !important;
  font-size: var(--font-size-s);
  color: var(--text-colorsdefaultsecondary);
  font-weight: 600;
}

/* Stay-blue for the exact current/clicked heading */
#wh_publication_toc li.active > span > span.title > a,
.navbar-nav.nav-list li.active > a,
.navbar-nav.nav-list li.active > .topicref {
  display: inline-block;
  background-color: #5A8FC2 !important;  /* blue */
  color: #fff !important;
  border-radius: 3px;
  padding: 2px 8px;
  line-height: 1.1;
  text-decoration: none;
  border-left: 0 !important;
}

/* Do NOT paint ancestor items (only the deepest active item) */
#wh_publication_toc li.active:has(li.active) > span > span.title > a,
.navbar-nav.nav-list li.active:has(li.active) > a,
.navbar-nav.nav-list li.active:has(li.active) > .topicref {
  background: transparent !important;
  color: inherit !important;
}
/* =========================================================
   Header resize code (main-nav-6) — responsive tabs + right-pinned search
   ========================================================= */

/* Header row can wrap, but aligns items vertically */
.main-nav-6 .header{
  display:flex;
  align-items:center;
  justify-content:flex-start;   /* flow left→right; search won't jump to far right */
  flex-wrap:wrap;
  min-height:80px;
  height:auto;
  padding:0 24px;
  gap:12px;
}

/* Logo + tabs strip */
.main-nav-6 .tabs-and-logo{
  display:flex;                 /* override inline-flex */
  align-items:center;
  flex:0 1 auto;                /* fit to content so search can sit after tabs */
  min-width:0;
  gap:12px;
  flex-wrap:wrap;               /* allow wrap when narrow */
}

/* Tabs container */
.main-nav-6 .tabs{
  display:flex;                 /* override inline-flex */
  align-items:center;
  flex:1 1 auto;                /* can shrink */
  min-width:0;
  gap:10px 12px;
  flex-wrap:wrap;               /* wrap to a second line if needed */
}

/* Each tab wrapper can shrink */
.main-nav-6 .controls-tabs-default{ flex:0 1 auto; }

/* Pill/button itself shouldn't force a big height/width */
.main-nav-6 .header-tab,
.main-nav-6 .header-tab-1{
  height:auto;                  /* override fixed 70px */
  padding:8px 12px;             /* even padding for vertical centering */
  flex:0 1 auto;
  white-space:nowrap;
  align-self:center;
}

/* Tab label: scale down a bit; remove negative margins that push it up */
.main-nav-6 .tab,
.main-nav-6 .tab-5,
.main-nav-6 .text,
.main-nav-6 .text-2,
.main-nav-6 .text-3,
.main-nav-6 .text-4,
.main-nav-6 .text-5,
.main-nav-6 .text-6{
  margin-top:0 !important;
  line-height:1.2;
  white-space:nowrap;
  display:inline-block;
  font-size:clamp(12px, 1vw + 0.35rem, 16px);
}

/* Search box (inline after tabs on wide screens) */
.main-nav-6 .search-header-inline-container{
  flex:1 1 100%;               /* adjust width here (e.g., 260–320px) */
  max-width:280px;
  min-width:220px;
  margin-left:30px;             /* small gap after "Solutions" */
  align-self:center;            /* vertical centering in the bar */
}

/* When narrow: put search on the next line, pinned to the RIGHT */
@media (max-width:900px){
  .main-nav-6 .tabs-and-logo{ flex:1 1 100%; } /* tabs take first row */
  .main-nav-6 .search-header-inline-container{
    order:3;                    /* move below tabs */
    flex:0 0 auto;              /* don't stretch full width */
    margin-left:auto;           /* push to right edge */
    margin-top:6px;             /* gap from tabs */
  }
}


/* =========================
   Job aids and Video stick  at top right
   (Left: article | Right: sticky rail)
   ========================= */

:root{
 --header-h: 40px;
  --rail-w: 340px;          /* card width */
  --rail-gap: 20px;         /* space between text and card */
}

/* Reserve a fixed gutter on the right for the rail */
.main-nav-6 .wh_content_area{
  position: relative;
  overflow: visible;
  padding-right: calc(var(--rail-w) + var(--rail-gap)) !important;
}

/* Sticky rail lives inside the reserved gutter (never pushes text) */
.main-nav-6 .wh_content_area .frame-285{
  width: var(--rail-w);

  /* key: float into the gutter we reserved */
  float: right !important;
  margin-right: calc(-1 * (var(--rail-w) + var(--rail-gap))); /* pull into gutter */
  margin-left: var(--rail-gap);                               /* gap to text */

  position: sticky;
  top: calc(var(--header-h) + 8px);
  z-index: 2;

  /* card look */
  background: #fff;
  border-radius: 8px;
  box-shadow: 0 4px 16px rgba(0,0,0,.12);
  max-height: calc(100vh - var(--header-h) - 16px);
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}

/* Let the main column actually use the left width */
.main-nav-6 #wh_topic_body{
  width: 100% !important;
  max-width: none !important;
  float: none !important;
  flex: 1 1 auto !important;
}

/* Remove stray “clears” that can create a gap before bullets */
.main-nav-6 .wh_content_area .topic\/body > p,
.main-nav-6 .wh_content_area .topic\/body > div,
.main-nav-6 .wh_content_area .topic\/body > section{
  clear: none !important;
  overflow: visible !important;
}

/* Nice tight rhythm around the first list */
.main-nav-6 .wh_content_area .topic\/body h1 + p { margin-bottom: 8px !important; }
.main-nav-6 .wh_content_area .topic\/body p       { margin-bottom: 10px; }
.main-nav-6 .wh_content_area .topic\/body p + ul,
.main-nav-6 .wh_content_area .topic\/body p + ol  { margin-top: 8px !important; }

/* Ensure the container encloses the floated rail */
.main-nav-6 .wh_content_area .topic\/body::after{
  content: "";
  display: block;
  clear: both;
}

/* Mobile: stack full width */
@media (max-width: 1200px){
  .main-nav-6 .wh_content_area{
    padding-right: 0 !important;
  }
  .main-nav-6 .wh_content_area .frame-285{
    float: none !important;
    margin: 16px 0 0 0;
    position: static !important;
    max-height: none;
    box-shadow: none;
    border-radius: 0;
  }
}










/*=======================
 * =============
   Tile Grid (Feature Articles)
  =============
 * ======================*/
ul.ti-tiles {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(2, minmax(280px, 1fr));
  gap: 24px;
}

@media (max-width: 980px) {
  ul.ti-tiles { grid-template-columns: 1fr; }
}

/* --- Individual Tile (grid item) --- */
li.ti-tile { margin: 0; }

/* =========================
   CARD AS FULL-LINK (a.ti-card-link)
   ========================= */
a.ti-card-link {
  display: block;
  text-decoration: none;
  background: #fff;
  border: 1px solid #e6e8eb;
  border-radius: 12px;
  padding: 18px 18px 16px;
  box-shadow: 0 1px 2px rgba(16,24,40,.06);
  /* no vertical movement on hover */
  transition: box-shadow 150ms ease, border-color 150ms ease;
  min-height: 160px;
  position: relative; /* for divider pseudo-element */
}

/* hover/focus polish, but NO jump */
a.ti-card-link:hover,
a.ti-card-link:focus {
  border-color: #d1d6dc;
  box-shadow: 0 6px 20px rgba(16,24,40,.12);
  outline: none;
}

/* Title */
a.ti-card-link .ti-card-title {
  display: block;
  font-weight: 700;
  font-size: 18px;
  line-height: 1.25;
  color: #19324d;
  margin: 0 0 8px;
  text-decoration: none;
}
a.ti-card-link .ti-card-title:hover,
a.ti-card-link .ti-card-title:focus { text-decoration: underline; }

/* Description (3-line clamp) */
a.ti-card-link .ti-card-desc {
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
  font-size: 14px;
  line-height: 1.5;
  color: #4b5563;
  margin: 0 0 12px;
}

/* Pill/tag aligned like screenshot */
a.ti-card-link .ti-card-pill {
  display: inline-block;
  font-size: 12px;
  line-height: 1;
  padding: 6px 8px;
  border-radius: 999px;
  background: #eef2f7;
  color: #334155;
  border: 1px solid #e1e7ef;
  margin-top: 4px;
}

/* Thin divider inside each card (bottom) */
a.ti-card-link::after {
  content: "";
  position: absolute;
  left: 18px;           /* line aligns with card padding */
  right: 18px;
  bottom: -12px;        /* creates visual row divider gap */
  height: 1px;
  background: #e9edf3;  /* subtle grey like screenshot */
}
ul.ti-tiles > li:nth-last-child(-n+2) a.ti-card-link::after {
  /* hide divider for last row (2 columns) */
  display: none;
}

/* =========================
   CARD WITH COVER-LINK (.ti-card + .ti-cover-link)
   (keep if you use the invisible full-card link)
   ========================= */
.ti-card{
  position: relative;
  background: #fff;
  border-radius: 12px;
  padding: 18px 18px 16px;
  min-height: 100px; 
}
.ti-card:hover,
.ti-card:focus-within {
  border-color: #c8ced8;     /* subtle only */
  box-shadow: 0 1px 2px rgba(16,24,40,.06); /* same shadow so no lift */
  transform: none !important; /* prevent any “jump” */
}

/* stretch the invisible link */
.ti-card .ti-cover-link{
  position: absolute; inset: 0;
  text-indent: -9999px; overflow: hidden;
}

/* inner elements (same look as the <a> version) */
.ti-card .ti-card-title{
  margin: 10px 0 6px;
  font-size: 18px; font-weight: 700; line-height: 1.25;
  color: #19324d;
}
.ti-card .ti-card-title a{
  color: inherit; text-decoration: none;
}
.ti-card .ti-card-title a:hover,
.ti-card .ti-card-title a:focus{ text-decoration: underline; }

.ti-card .ti-card-desc{
  margin: 0 0 12px; color: #4b5563; font-size: 14px; line-height: 1.5;
  display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;
}
.ti-card .ti-card-pill{
  display: inline-block; font-size: 12px; line-height: 1;
  padding: 6px 8px; border-radius: 999px;
  background: #eef2f7; color: #334155; border: 1px solid #e1e7ef; margin-top: 4px;
}


/*===== divider for .ti-card version==== */
.ti-card::after{
  content:""; position:absolute; left:18px; right:18px; bottom:-12px;
  height:1px;
  background:#c8d1e0;
}
ul.ti-tiles > li:nth-last-child(-n+2) .ti-card::after { display:none; }



/* =============== GRID: make it fill rows cleanly and center leftover space =============== ****************************************/
ul.ti-tiles{
  display: grid !important;
  /* fit as many columns as we can; smaller min widens earlier to create a 3rd col */
  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)) !important;
  gap: 24px !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;

  /* when there isn't room for another column, center the tracks so the gutter
     is split left/right instead of a big blank only on the right */
  justify-content: center !important;
}

/* Optional explicit breakpoints if you want hard steps */
@media (min-width: 1280px){
  ul.ti-tiles{ grid-template-columns: repeat(3, minmax(0,1fr)) !important; }
}
@media (min-width: 768px) and (max-width: 1279px){
  ul.ti-tiles{ grid-template-columns: repeat(2, minmax(0,1fr)) !important; }
}
@media (max-width: 767px){
  ul.ti-tiles{ grid-template-columns: 1fr !important; }
}

/* =============== IMAGE FRAME: keep a fixed, clean border and ratio =============== */
/* Wrap your <img> in a div.ti-card-media (or target your existing image container) */
.ti-card-media{
  position: relative !important;
  width: 100% !important;
  aspect-ratio: 16 / 9 !important;      /* fixed box size across widths */
  border: 1px solid #dce1e7 !important; /* the visible “image box” */
  border-radius: 8px !important;
  overflow: hidden !important;
  margin-bottom: 12px !important;
}
.ti-card-media img{
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;         /* fill the box neatly */
  display: block !important;
}

/* =============== Card height polish so all cards look even =============== */
.ti-card, a.ti-card-link{
  display: flex !important;
  flex-direction: column !important;
  height: 100% !important;
}
.ti-card .ti-card-desc,
a.ti-card-link .ti-card-desc{
  flex: 1 1 auto !important;
}





/*=====================================================================
 *  ===== Hide Only under Feature Articles and Release Notes(data-id="feature-articles") ===== 
 * ===================================================================*/

/* Keep level-2 items (Title1/2/3) visible */
#wh_publication_toc span[data-id="feature-articles"] + ul > li,
#wh_publication_toc span[data-id="release-notes"] + ul > li{
  display: list-item !important;
}

/* 1) Collapse the immediate child UL of each level-2 item (i.e., level-3 list) */
#wh_publication_toc span[data-id="feature-articles"] + ul > li > ul,
#wh_publication_toc span[data-id="release-notes"] + ul > li > ul{
  display: none !important;      /* removes the block (no space reserved) */
  margin: 0 !important;
  padding: 0 !important;
}

/* 2) Also hide everything inside that level-3 list, defensively */
#wh_publication_toc span[data-id="feature-articles"] + ul > li > ul *,
#wh_publication_toc span[data-id="release-notes"] + ul > li > ul *{
  display: none !important;
}

/* 3) Hide the expand/collapse button/gutter on level-2 items in this branch */
#wh_publication_toc span[data-id="feature-articles"] + ul > li .wh-expand-btn,
#wh_publication_toc span[data-id="release-notes"] + ul > li .wh-expand-btn{
  display: none !important;
}

/* 4) Prevent scripts/active states from re-opening level-3 under Feature Articles */
#wh_publication_toc span[data-id="feature-articles"] + ul > li[aria-expanded="true"] > ul,
#wh_publication_toc span[data-id="release-notes"] + ul > li[aria-expanded="true"] > ul{
  display: none !important;
}
#wh_publication_toc span[data-id="feature-articles"] + ul > li.active > ul,
#wh_publication_toc span[data-id="release-notes"] + ul > li.active > ul{
  display: none !important;
}

/* Optional: if your skin adds extra spacing to 'expanded' items, normalize it */
#wh_publication_toc span[data-id="feature-articles"] + ul > li[aria-expanded="true"],
#wh_publication_toc span[data-id="release-notes"] + ul > li[aria-expanded="true"]{
  padding-bottom: 0 !important;
  margin-bottom: 0 !important;
}




/* ===========================================
 * ========GRID CONTAINER(Release Notes) =====
 * =========================================== */
.ti-card-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(260px, 1fr));
  gap: 26px;
  padding: 10px;
  margin: 24px 0;
  list-style: none;
}

/* Responsive layout */
@media (max-width: 900px) {
  .ti-card-list {
    grid-template-columns: 1fr;
  }
}

/* ===== CARD ITEM ===== */
.ti-card {
  background: var(--bgwhite);
  border-radius: 12px;
  box-shadow: 0 1px 2px rgba(20,12,66,.06), 0 6px 18px rgba(20,12,66,.06);
  overflow: hidden;
  transition: transform .12s ease, box-shadow .12s ease;
  padding-bottom: 12px;
}

.ti-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 2px 6px rgba(20,12,66,.10), 0 10px 22px rgba(20,12,66,.10);
}

/* ===== THUMBNAIL IMAGE ===== */
.ti-card-thumb {
  display: block;
  width: 100%;
  height: 80px;                /* ↓ reduced from 140px */
  object-fit: cover;
  background: #f5f7fb;
  border: none !important;
  margin-bottom: 18px;           /* small spacing before badge */
}

/* ===== BADGE ===== */
.ti-badge {
  display: inline-block;
  font-size: 11px;
  font-weight: 700;
  color: #1f4ea3;
  background: #e9f0ff;
  border-radius: 6px;
  padding: 4px 8px;
  position: relative;
  left: -4px;             /* shift slightly left */
  top: 8px;               /* push slightly lower */

  margin-bottom: 10px;    /* more space below badge */
}


/* ===== CARD TITLE ===== */
.ti-card-title {
  margin: 6px 16px 0 16px;
  font-size: 18px;
  font-weight: 700;
  color: #0f1a52;
}

.ti-card-title a {
  color: inherit;
  text-decoration: none;
}

.ti-card-title a:hover {
  text-decoration: underline;
}

/* ===== CARD DESCRIPTION ===== */
.ti-card-desc {
  font-size: 14px;
  line-height: 1.5;
  color: #5a627a;
  margin: 8px 16px 0 16px;
}

/* ===== CARD DATE ===== */
.ti-card-date {
  font-size: 12px;
  color: #8b93a9;
  margin: 10px 0 0 0;     /* remove side margins */
  padding-left: 0;        /* align flush to the left edge */
  text-align: left;       /* ensure left alignment */
}


/* =====================================================
 * ==Title text for Feature Articles
 * ====================================================== */
.parent-section {
  display: block;
  position: relative;
  top: -2.4rem;
  margin-bottom: -0.8rem;
  font: 600 14px/1.2 "Open Sans", Arial, sans-serif;
  color: #1a174e;
}
/* Moves the topic title (Title1, Title2, etc.) slightly downward */
.main-title {
  position: relative;
  top: 2rem;          /* Adjust this value: try 0.5rem–1.2rem for best spacing */
  margin-top: 0;        /* Removes any default extra margin */
  display: block;
  font:40px
}




 /* 
/\* ==============Feature Articles inside cards================
 ==============* GRID: 3-up, even spacing, responsive ===== *\/
.tiX-list{
  display:grid !important;
  grid-template-columns: repeat(3, minmax(280px, 1fr));
  gap: 40px;                       /\* spacing between items *\/
  padding: 0;
  list-style: none;
  margin: 24px 0;
}
@media (max-width: 1100px){
  .tiX-list{ grid-template-columns: repeat(2, minmax(260px, 1fr)); }
}
@media (max-width: 640px){
  .tiX-list{ grid-template-columns: 1fr; }
}

/\* ===== ITEM: remove white card & shadow ===== *\/
.tiX-card{
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
  overflow: visible;               /\* so the image shadow shows cleanly *\/
  transition: none !important;     /\* no hover “jump” of the box *\/
}

/\* ===== THUMB: make the image the only thing with shadow ===== *\/
.tiX-thumb{
  display:block;
  width:100%;
  height:auto;
  aspect-ratio: 16 / 9;            /\* keep consistent height; remove if you prefer natural *\/
  object-fit: cover;
  border-radius: 16px;              /\* rounded image corners *\/
  box-shadow: 0 24px 40px rgba(16, 24, 40, .18);  /\* soft, natural shadow like the site *\/
  margin: 0 0 18px 0;               /\* space under the image *\/
  border: none !important;          /\* kill any inherited borders *\/
}
.tiX-card:hover .tiX-thumb{      /\* optional gentle hover *\/
  transform: translateY(-1px);
  box-shadow: 0 28px 48px rgba(16,24,40,.20);
  transition: box-shadow .15s ease, transform .10s ease;
}

/\* ===== META / TEXT ===== *\/
.tiX-badge{
  display:block;
  font-size: 12px;
  font-weight: 700;
  letter-spacing:.02em;
  color:#2563eb;                    /\* tweak to match your brand *\/
  background: transparent;
  margin-bottom: 8px;
}

.tiX-title{
  margin: 0 0 10px 0;
  font-size: 22px;
  line-height: 1.25;
  font-weight: 800;
  color:#0f1a52;
}
.tiX-title a{
  color: inherit;
  text-decoration: none;
}
.tiX-title a:hover{ text-decoration: underline; }

.tiX-card-desc{                      /\* if you show a blurb *\/
  margin: 0 0 12px 0;
  color:#475569;
  font-size: 15px;
  line-height: 1.55;
}

.tiX-card-date,
.tiX-more{
  display:inline-flex;
  gap:6px;
  align-items:center;
  font-size: 13px;
  font-weight: 700;
  letter-spacing:.02em;
  color:#0f1a52;
}

/\* ===== Make the whole block clickable without creating a white box ===== *\/
.tiX-card { position: relative; }
.tiX-card .tiX-cover{
  position:absolute; inset:0;
  text-indent:-9999px; overflow:hidden;
  border-radius: 16px;              /\* match the image radius so clicks feel natural *\/
}
/\* Make sure the grid always applies inside the section *\/
.popular .tiX-list,
.popular-1 .tiX-list {
  display: grid !important;
}

/\* Remove the thin line under each card, if present *\/
.line-2 { display: none !important; }  */



/* Merge both columns into one 3-up grid */
.frame-222{
  display:grid;
  grid-template-columns: repeat(3, minmax(280px, 1fr));
  gap:40px;
}
.frame-222 > .articles,
.frame-222 > .articles-1{
  display: contents; /* let all .article items flow into the same grid */
}
 
/* Card basics (keep your existing look) */
.article{
  background: transparent;
  border: 0;
  box-shadow: none;
}
 
/* Thumbnail: target the FIRST image in each .article (so we don't need a new class) */
.article > img:first-of-type{
  display:block;
  width:100%;
  height:auto;
  aspect-ratio: 16/9;              /* consistent card height */
  object-fit: cover;
  border-radius:16px;
  box-shadow: 0 24px 40px rgba(16,24,40,.18);
  margin:0 0 14px 0;
}
 
/* Optional hover lift on the image */
.article:hover > img:first-of-type{
  transform: translateY(-1px);
  box-shadow: 0 28px 48px rgba(16,24,40,.20);
  transition: box-shadow .15s ease, transform .10s ease;
}
 
/* Title + blurb */
.associating-an-addre{
  margin:0 0 8px 0;
  font-size:22px;
  line-height:1.25;
  font-weight:800;
  color:#0f1a52;
}
.this-section-provide{
  color:#475569;
  font-size:15px;
  line-height:1.55;
  margin:0 0 10px 0;
}
 
/* Read more link inside tags */
.tags{ margin-top: 8px; }
.tags .category-title{
  font-weight:700;
  color:#1f39ff; /* adjust to brand */
}
.tags a{ text-decoration:none; }
.tags a:hover .category-title{ text-decoration:underline; }
 
/* Hide the decorative divider lines if you don't want them */
.article .line-2{ display:none; }
 
/* Responsive */
@media (max-width: 1100px){
  .frame-222{ grid-template-columns: repeat(2, minmax(260px, 1fr)); }
}
@media (max-width: 640px){
  .frame-222{ grid-template-columns: 1fr; }
}