﻿.banner {
   padding: 30px 0;
   margin-top: 0;
}

.banner .background {
   position: absolute;
   left: 0;
   right: 0;
   top: 0;
   bottom: 0;
   background-position: top right;
}

.banner .banner-header {
   background-color: var(--hlc-midnight-blue);
   padding: 35px;
   color: #ffffff;
   width: 100%;
   max-width: 600px;
   font-size: 17px;
}

.banner .banner-header h1 { font-size: 38px; margin-bottom: 0.75em; }
.banner p { color: inherit; font-size: inherit; padding-right: 100px; }
.banner p:last-of-type { margin-bottom: 0; }

.banner .banner-buttons { margin-top: 20px; display: flex; flex-direction: column; gap: 10px; }
.banner .banner-buttons a { max-width: fit-content; font-size: 16px; padding-right: 40px; }

section.search-bar { }
section.search-bar .search-bar-container { display: flex; flex-direction: row; gap: 20px; }
section.search-bar .search-box { background-color: #ffffff; border: 1px solid #BEC5C2; flex-basis: 100%; padding: 8px 12px; display: flex; flex-direction: row; align-items: center; }

section.search-bar .buttons a { flex-basis: 100%; font-size: 16px; text-decoration: none; border: none; font-family: 'GT Ultra Regular', sans-serif; color: #ffffff; padding: 8px 18px; display: flex; flex-direction: row; gap: 10px; align-items: center; white-space: nowrap; border-style: solid; border-width: 1px; transition: all 0.2s; }

h2.section-header {
   font-size: 32px;
   margin-bottom: 0.75em;
   color: var(--hlc-midnight-blue);
}

h3.subsection-header {
   font-size: 27px;
   margin-bottom: 1em;
   color: var(--hlc-midnight-blue);
}

.grey-bg { background-color: var(--hl-taupe) !important; }

.carousel-item { padding: 0 5px; }

.carousel-controls { margin-top: 20px; display: flex; flex-direction: row; align-items: center; justify-content: space-between; }
.carousel-controls .carousel-buttons { display: flex; flex-direction: row; align-items: center; gap: 20px; }

/*** Home Page ***/

section.topic-centers { margin: 30px 0; }

section.whats-new { padding: 30px 0; }

section.whats-new .slick-arrow {
   border-color: var(--hlc-midnight-blue);
   background-color: transparent;
   background-image: url("/_assets/icon-line-arrow-hl-dark-green.png");
}

section.whats-new .slick-arrow:hover { background-color: var(--hlc-midnight-blue); background-image: url("/_assets/icon-line-arrow-white.png"); }

/*** Topic Center Panel ***/
.topic-center-list { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }

.topic-center-panel { position: relative; }
.topic-center-panel { text-align: left; width: 100%; position: relative; transition: all 0.2s; overflow: hidden; }

.topic-center-panel a { text-decoration: none; }

.topic-center-panel:hover .tint { background-color: #436889; }

.topic-center-panel:hover .background { transform: scale(1.1); }

.topic-center-panel .background { position: absolute; top: 0; left: 0; bottom: 0; right: 0; z-index: 0; transition: all 0.2s; }
.topic-center-panel .tint {
   position: absolute;
   top: 0;
   left: 0;
   bottom: 0;
   right: 0;
   background-color: rgba(var(--hlc-midnight-blue-rgb), 0.75);
   mix-blend-mode: multiply;
   z-index: 1;
   transition: all 0.2s;
}

.topic-center-panel .content { padding: 20px; position: relative; z-index: 2; width: 100%; background-color: transparent; }

.topic-center-panel .icon { margin-bottom: 10px; }
.topic-center-panel .icon img { height: 34px; display: none; }

.topic-center-panel .icon svg { height: 34px; }
.topic-center-panel .icon svg path { fill: #ffffff; }

.topic-center-panel:not(.not-expanded) .icon img.white-icon { display: block; }
.topic-center-panel.not-expanded .icon img.blue-icon { display: block; }

.topic-center-panel .title { font-size: 27px; color: #ffffff; }

.topic-center-panel .buttons { margin-top: 20px; }
.topic-center-panel .btn-plus {
   display: inline-block;
   width: 24px;
   height: 24px;
   background-image: url("/_assets/icon-plus-white.png");
   background-position: center;
   background-size: contain;
   background-repeat: no-repeat;
}

.topic-center-panel.no-topics .btn-plus { background-image: url("/_assets/btn-arrow-white.png"); }

.topic-center-panel.not-expanded .btn-plus { background-image: url("/_assets/icon-plus-hl-dark-green.png"); }

.topic-center-panel.no-topics.not-expanded .btn-plus {
   background-image: url("/_assets/btn-arrow-hl-dark-green.png");
}

.topic-center-panel.not-expanded .tint { background-color: var(--hlc-light-blue); opacity: 0.85; mix-blend-mode: normal; }
.topic-center-panel.not-expanded .icon svg path { fill: var(--hlc-midnight-blue); }
.topic-center-panel.not-expanded .title { color: var(--hlc-midnight-blue); }

/*** Topic Center Topic List ***/

.topic-center-topic-list { margin-top: 10px; display: flex; flex-direction: column; gap: 20px; grid-column: span 4; }

.topic-center-topic-list .topic-panel { width: 100%; }
.topic-center-topic-list .topic-panel-link { width: 100%; height: 100%; background-color: var(--hlc-light-blue); display: flex; flex-direction: row; align-items: center; gap: 40px; text-decoration: none; transition: all 0.2s; padding-right: 30px; }

.topic-center-topic-list .topic-panel-link .image { width: max(25%, 350px); align-self: normal; flex-shrink: 0; clip-path: polygon(0 0, 350px 40px, 310px max(100%, 350px), 0 100%); }

.topic-center-topic-list .topic-panel-link .content {
   padding: 40px 0;
}

.topic-center-topic-list .topic-panel-link .content .title {
   font-size: 21px;
   margin-bottom: 0.5em;
   color: inherit;
}

.topic-center-topic-list .topic-panel-link .content { color: var(--hlc-midnight-blue); font-size: 20px; line-height: 1.3em; }

.topic-center-topic-list .topic-panel-link .arrow,
.search-result .arrow { flex-shrink: 0; display: block; width: 16px; height: 50px; background-image: url("/_assets/btn-arrow-hl-dark-green.png"); background-size: 16px 33px; background-position: 0 center; background-repeat: no-repeat; }

.topic-center-topic-list .topic-panel-link:hover { background-color: var(--hlc-midnight-blue); }
.topic-center-topic-list .topic-panel-link:hover .content,
.topic-center-topic-list .topic-panel-link:hover p{ color: #ffffff; }

.topic-center-topic-list .topic-panel-link:hover .arrow { background-image: url(/_assets/btn-arrow-white.png); }

/*** Topic ***/

section.topic-related-articles { padding: 40px 0; }

/*** Article Panel List ***/

.articles-list { display: grid; gap: 20px; grid-template-columns: repeat(4, 1fr); }

.article-panel {
   text-decoration: none;
   border-top: 10px solid var(--hlc-midnight-blue);
   display: block;
   background-color: #ffffff;
   transition: all 0.2s;
}

.article-panel .article-panel-content { padding: 20px; }
.article-panel .article-date { color: var(--hlc-midnight-blue); }
.article-panel .title { font-size: 20px; margin-bottom: 0.75em; }
.article-panel p { color: var(--hlc-midnight-blue); font-size: 14px; }
.article-panel p:last-child { margin-bottom: 0; }
.article-panel .image-container { overflow: hidden; margin-top: 20px; }
.article-panel .image { width: 100%; height: 120px; transition: all 0.2s; }

.article-panel:hover { background-color: #e8e8e8; }
.article-panel:hover .image { transform: scale(1.1); }

/*** Article Page ***/

section.article { padding: 0 0 40px 0; }
/*section.article .container { display: grid; grid-template-columns: auto 290px; grid-template-rows: auto auto 0; column-gap: 40px; row-gap: 0; 
      grid-template-areas: "content notes" "content chapters" "content related"; }*/

section.article .container { display: block; font-size: 0; display: flex; flex-direction: row; align-items: start; gap: 40px; }

section.article .chapters .chapter.overview.standard-page-content div.header-image { width: 100%; height: 0; padding-top: 38.12%; background-position: center; background-size: cover; background-repeat: no-repeat; }

/*section.article .content-container { grid-row-start: content; grid-row-end: span 4; }*/

/* If there is a header image and something after it, add a margin to the first something. */

section.article .overview .header-image + :nth-child(2) { margin-top: 20px; }


xxsection.article .container .content-container { display: inline-block; width: calc(100% - 340px); vertical-align: top; }

section.article .container { display: grid; grid-template-areas: "content notes" "content menu" "content related"; grid-template-columns: minmax(0, 1fr) 300px; column-gap: 40px; row-gap: 10px; grid-template-rows: auto auto 100%; }

section.article .content-container { grid-area: content; }
section.article .notes { grid-area: notes; }
section.article .chapter-menu { grid-area: menu; }
section.article .related-articles { grid-area: related; }


section.article .container .content { border-top: 10px solid var(--hlc-midnight-blue); padding: 30px 35px; background-color: #ffffff; }

/*section.article .container .manage { display: inline-block; width: 300px; height: 100%; vertical-align: top; flex-shrink: 0; }*/

section.article .container .chapter-menu:not(.no-divider),
section.article .container .related-articles:not(.no-divider) { margin-top: 25px; border-top: 1px solid var(--hlc-midnight-blue); padding-top: 25px; }

section.article .container .chapter-menu.no-divider,
section.article .container .related-articles.no-divider { margin-top: -12px; }

section.article .not-visible { visibility: hidden; height: 0 !important; margin: 0 !important; padding: 0 !important; border: 0 !important; }

/*section.article .container .manage .chapter-menu { position: sticky; top: 140px; }*/
section.article .subsection-header { font-size: 18px; margin-bottom: 0.5em; color: var(--hlc-midnight-blue); }

section.article .chapter-menu-list { background-color: #ffffff; padding: 20px; display: flex; flex-direction: column; gap: 10px; }
.btn-chapter-link {
   border: 1px solid var(--hlc-light-blue);
   background-color: var(--hlc-light-blue);
   color: var(--hlc-midnight-blue);
   font-size: 16px;
   text-decoration: none;
   padding: 10px 14px;
   transition: all 0.2s;
}

/*.btn-chapter-link:after { content: ""; background-image: url("/_assets/btn-arrow-blue.png"); width: 11px; transform: rotate(90deg);  }*/

section.article p.article-date { font-size: 14px; margin-bottom: 0.75em; color: var(--hlc-midnight-blue); }

section.article label.article-topic { display: block; font-size: 17px; color: var(--hlc-midnight-blue); margin-bottom: 0.5em; }

section.article p:has(video) { margin-bottom: 0; }
section.article p.video-title { padding: 12px 18px; background-color: #4a2942; color: #ffffff; font-family: 'GT Ultra Regular', sans-serif; margin-top: -5px; }

section.article .content .chapters { font-size: 0; }

section.article .content .chapter {
   font-family: 'GT Ultra Fine', Georgia, 'Times New Roman', Times, serif;
   font-size: 15px;
   line-height: 1.4em;
   font-weight: 400;
   color: var(--hlc-midnight-blue);
}

section.article .content .chapter .chapter-title { position: relative; width: 100%; margin-bottom: 20px; }
section.article .content .chapter .chapter-title hr { position: absolute; left: 0; top: 50%; right: 0; margin: 0; border-color: var(--hlc-midnight-blue); min-width: 50px; z-index: 0; }

section.article .content .chapter .chapter-title label {
   position: relative;
   display: inline-block;
   font-size: 17px;
   line-height: 1.3em;
   padding: 8px 10px;
   background-color: var(--hlc-light-blue);
   color: var(--hlc-midnight-blue);
   border-right: 20px solid #ffffff;
   max-width: 95%;
   z-index: 2;
}

section.article .content .chapter h3 { font-family: 'GT Ultra Regular', sans-serif; color: var(--hlc-midnight-blue); font-size: 16px; margin: 1.2em 0 1em 0; }

section.article .content-container .navigation { margin-top: 30px; display: flex; flex-direction: row; justify-content: space-between; gap: 40px; }

section.article .content-container .navigation > div { display: flex; flex-direction: row; gap: 14px; }

section.article .content-container .navigation a,
section.article .content-container .navigation button {
   font-size: 15px;
   font-family: 'GT Ultra Regular', sans-serif;
   color: #ffffff;
}

section.article .content-container .navigation a:after,
section.article .content-container .navigation button:after {
   background-image: url("/_assets/btn-arrow-white.png");
}

section.article .chapter table { margin: 10px 0; }
section.article .chapter table caption {
   background-color: var(--hlc-midnight-blue);
   color: #ffffff;
   font-size: 15px;
   padding: 10px;
   font-weight: normal;
   font-family: 'GT Ultra Regular', sans-serif;
   border-bottom: 1px solid #ffffff;
}

section.article .wrapper table { 
   background-color: #ffffff;
}

section.article .chapter table th {
   font-weight: normal;
   font-family: 'GT Ultra Regular', sans-serif;
   font-size: 14px;
   background-color: var(--hlc-midnight-blue);
   color: #ffffff;
   border-right: 1px solid #ffffff;
   padding: 15px;
}
section.article .chapter table th:last-child { border-right: 0; }

section.article .chapter table tbody tr { background-color: rgba(var(--hlc-light-blue-rgb), 0.8); }
section.article .chapter table tbody tr:nth-child(even) { background-color: rgba(var(--hlc-light-blue-rgb), 0.5); }

section.article .chapter table tbody td { font-weight: normal; font-family: 'GT Ultra Regular', sans-serif; font-size: 14px; background-color: inherit; border-top: 1px solid #ffffff; border-right: 1px solid #ffffff; padding: 15px; }
section.article .chapter table tbody td:last-child { border-right: 0; }

.btn-back { background-color: var(--hlc-midnight-blue); border-color: var(--hlc-midnight-blue); }
.btn-back:after { transform: rotate(180deg); }

.btn-back:hover { background-color: #ffffff; color: var(--hlc-midnight-blue) !important; }
.btn-back:hover:after { background-image: url("/_assets/btn-arrow-hl-dark-green.png") !important; }

.btn-to-top {
   background-color: #ffffff;
   color: var(--hlc-midnight-blue)!important;
   padding-right: 45px;
}

section.article .content-container .navigation .btn-to-top:after {
   background-image: url("/_assets/btn-arrow-hl-dark-green.png");
}

.btn-to-top:after {
   transform: rotate(-90deg);
}

.btn-to-top:hover { background-color: var(--hlc-midnight-blue); color: #ffffff!important; }
.btn-to-top:hover:after { background-image: url("/_assets/btn-arrow-white.png") !important; }

.btn-change-article { background-color: var(--hlc-midnight-blue); border-color: var(--hlc-midnight-blue); }
.btn-change-article.next:after { right: 10px; }

.btn-change-article:hover { background-color: #ffffff; color: #4a2942 !important; }
.btn-change-article:hover:after { background-image: url("/_assets/btn-arrow-maroon.png") !important; }

.btn-change-article[disabled] { opacity: 0.65; }

/*section.article .notes { display: grid; grid-template-areas: "notes pin" "download download"; grid-template-columns: 1fr 1fr; grid-template-rows: 50px 50px; gap: 10px; }*/

/*section.article .notes.no-download { grid-template-areas: "notes pin"; grid-template-rows: 50px; }*/
/*section.article .notes.no-notes { grid-template-areas: "download"; grid-template-columns: 1fr; grid-template-rows: auto; }

section.article .notes.no-notes.no-download { display: none; }
section.article .notes.no-notes.no-download + div { margin-top: 0; border-top: none; padding-top: 0; }*/

.btn-icon { border: 1px solid #ffffff; background-color: #ffffff; color: var(--hlc-midnight-blue); font-size: 16px; display: flex; flex-direction: row; gap: 10px; padding: 10px 14px; align-items: center; justify-content: space-between; text-decoration: none; transition: all 0.2s; }

.btn-icon.blue { border-color: var(--hlc-midnight-blue); background-color: var(--hlc-midnight-blue); color: #ffffff; }

.btn-icon:after { content: ""; display: block; height: 24px; background-size: contain; background-position: center; background-repeat: no-repeat; flex-shrink: 0; }

.btn-write-notes { grid-area: notes; }
.btn-pin { grid-area: pin; }

.btn-write-notes:after { width: 8px; background-image: url("/_assets/icon-pencil-dark.png"); }
.btn-pin:after { width: 15px; background-image: url("/_assets/icon-pin-dark.png"); }
.btn-download:after { width: 25px; background-image: url("/_assets/icon-download-white.png"); }

.btn-pin.pinned:after { background-image: url("/_assets/icon-pin-dark-pinned.png"); }

.btn-download { grid-area: download; }

.btn-icon:hover { background-color: var(--hlc-midnight-blue); color: #ffffff; }
.btn-icon.blue:hover { background-color: #ffffff; color: var(--hlc-midnight-blue); }

.btn-write-notes:hover:after { background-image: url("/_assets/icon-pencil-white.png"); }
.btn-pin:hover:after { background-image: url("/_assets/icon-pin-white.png"); }
.btn-pin.pinned:hover:after { background-image: url("/_assets/icon-pin-white-pinned.png"); }
.btn-download:hover:after { background-image: url("/_assets/icon-download-hl-dark-green.png"); }

.btn-chapter-link:hover { background-color: var(--hlc-midnight-blue); color: #ffffff; }
.btn-chapter-link:hover:after { background-image: url("/_assets/btn-arrow-white.png"); }

.btn-blue { font-family: 'GT Ultra Regular', sans-serif; }

.related-article-list { display: flex; flex-direction: column; gap: 20px; }

/*** My Alerts ***/

section.my-alerts-filter { margin-top: 10px; }

.filter-options { background-color: var(--hl-taupe); padding: 30px; display: flex; flex-direction: row; gap: 40px; align-items: start; }

.filter-options > div { flex-basis: 50%; }

.selection-area-header { margin-bottom: 20px; }
.selection-area-header h3 { font-size: 21px; }

.select-option {
   display: flex;
   flex-direction: row;
   align-items: center;
   text-align: left;
   padding: 10px 10px;
   width: 100%;
   background-color: #ffffff;
   font-size: 15px;
   font-family: 'GT Ultra Regular', sans-serif;
   position: relative;
}

.select-option:before { content: ""; display: inline-block; width: 12px; height: 12px; border: 1px solid var(--hlc-midnight-blue); margin-right: 10px; }

.select-option.select-all { background-color: transparent; }

.expander-button { margin-top: 10px; padding: 10px 50px 10px 10px; width: 100%; font-family: 'GT Ultra Regular', sans-serif; text-align: left; font-size: 15px; white-space: normal; display: flex; flex-direction: row; align-items: center; gap: 10px; }

.expander-button span { color: #C3D34D; }

.expander-button.blue { border: 1px solid var(--hlc-midnight-blue); background-color: var(--hlc-midnight-blue); width: 100%; color: #ffffff; }

.expander-button.blue { background-image: url("/ai-hub/_assets/icon-expand-white.png"); background-size: 20px; background-position: calc(100% - 14px) center; background-repeat: no-repeat; }
.expander-button.blue.expanded { background-image: url("/ai-hub/_assets/icon-expanded-white.png"); }
.expander-button:first-child { margin-top: 0; }

.expander-button .select-topic-center { display: inline-block; width: 14px; height: 14px; border: 1px solid #ffffff; position: relative; }
.expander-button .select-topic-center.checked:after { content: ""; position: absolute; left: 0px; top: -5px; width: 18px; height: 18px; overflow: visible; background-image: url("/_assets/icon-tick-white-2.png"); background-size: contain; background-position: 0 0; background-repeat: no-repeat; }

.topic-center-container { margin: 0 0 10px 0; }

.topic-center-container .topics { display: none; margin-bottom: 20px; }

.select-option.checked:after {
   content: "";
   position: absolute;
   left: 13px;
   top: 13px;
   width: 14px;
   height: 14px;
   overflow: visible;
   background-image: url("/_assets/icon-tick-hl-dark-green.png");
   background-size: contain;
   background-position: 0px 0px;
   background-repeat: no-repeat;
}

.subscribe-options .subscribe-error { margin-top: 10px; font-size: 14px; color: #cc0000; }


.subscribe-options { padding: 30px 30px 40px 30px; background-color: var(--hl-taupe); display: inline-block; width: auto; position: relative; }

.switch label .lever { border-width: 1px; background-color: transparent; height: 26px; }
.switch label .lever:before,
.switch label .lever:after { background-color: var(--hlc-midnight-blue); width: 20px; height: 20px; }

.my-alerts-control { margin-top: 10px; }
.my-alerts-control .toggles { display: flex; flex-direction: row; gap: 40px; }

.subscribe-options .saving { position: absolute; right: 25px; bottom: 15px; font-size: 15px; font-family: 'GT Ultra Regular', sans-serif; color: var(--hlc-midnight-blue); }

.switch:has(input[type=checkbox]:checked) .when-sel { opacity: 0.7; }
.switch:has(input[type=checkbox]:not(:checked)) .when-unsel { opacity: 0.7; }

section.my-alerts-details .input-form .form-row .form-cell input { 
   border: none;
}

/*** Search ***/
div.search-results {
   padding: 30px;
   background-color: var(--hl-taupe);
}

.search-results-list { margin-top: 20px; }
.search-result { text-decoration: none; color: var(--hlc-midnight-blue); margin-top: 20px; background-color: #ffffff; padding: 20px; display: flex; flex-direction: row; align-items: center; font-size: 16px; line-height: 1.3em; gap: 40px; transition: all 0.2s; }

.search-result .content { flex-basis: 100%; }

.search-result h4 { margin-bottom: 0.5em; font-size: 14px; }
.search-result h3 { color: var(--hlc-midnight-blue); margin-bottom: 0.75em; }

.search-result:hover { background-color: var(--hlc-midnight-blue); color: #ffffff; }
.search-result:hover h3 { color: #ffffff; }
.search-result:hover .arrow { background-image: url("/_assets/btn-arrow-white.png"); }

.search-result .search-highlight {
   color: var(--hlc-midnight-blue);
   font-weight: bold;
   font-family: 'GT Ultra', sans-serif;
}

.search-result:hover .search-highlight { color: #ffffff; }

.no-search-results { margin-top: 20px; }
.no-search-results p { color: var(--hlc-midnight-blue); font-size: 16px; margin-bottom: 0; }

.subscribe-options .current-status {
   font-size: 16px;
   font-family: var(--hlc-gt-ultra);
   color: var(--hlc-midnight-blue);
   margin-bottom: 20px;
}

div.input-area { padding: 30px; background-color: var(--hl-taupe); }

section.my-alerts-details .input-form { display: flex; flex-direction: row; margin: 0; }

section.my-alerts-details .input-form .form-row { flex-basis: 50%; display: flex; flex-direction: column; margin: 0; }
section.my-alerts-details .input-form .form-row .form-cell { margin-top: 10px; }
section.my-alerts-details .input-form .form-row .form-cell:first-child { margin-top: 0; }

section.my-alerts-control .buttons { display: flex; flex-direction: row; gap: 10px; }

.btn-subscribe { background-color: var(--hlc-midnight-blue); border: 1px solid var(--hlc-midnight-blue); padding: 10px 20px; color: #ffffff; font-size: 16px; display: flex; flex-direction: row; align-items: center; gap: 10px; }
.btn-subscribe:before {
   content: "";
   display: inline-block;
   width: 21px;
   height: 25px;
   background-image: url("/_assets/icon-my-alerts-filled-hl-light-green.png");
   background-size: contain;
   background-repeat: no-repeat;
}

.btn-subscribe:hover {
   background-color: transparent;
   color: var(--hlc-midnight-blue);
}

.btn-subscribe:hover:before {
   background-image: url("/_assets/icon-my-alerts-filled-hl-dark-green.png");
}

.btn-unsubscribe {
   border: 1px solid var(--hl-light-green);
   background-color: var(--hl-light-green);
   padding: 10px 20px;
   font-size: 16px;
   font-family: 'GT Ultra Regular', sans-serif;
}

.btn-unsubscribe:hover {
   background-color: #ffffff;
}


/*** Tooltip Popup ***/
.tooltip .tooltip-inner { background-color: #ffffff; }
.tooltip .tooltip-inner .tooltip-title { color: var(--hlc-midnight-blue); font-family: 'GT Ultra Regular', sans-serif; font-size: 14px; margin-bottom: 0.75em; }
.tooltip .tooltip-inner p { font-family: 'GT Ultra Fine', Georgia, 'Times New Roman', Times, serif; font-size: 13px; }

/*** Key contacts ***/

.key-contacts-list-wide,
.key-contacts-list-wide .col-1 { padding: 0; }

.key-contacts-list-wide .carousel-container .title { 
   padding: 0;
}

.key-contacts-list-wide .slick-arrows-and-dots {
   display: flex;
   flex-direction: row;
   gap: 20px;
   margin-top: 30px;
}

section.key-contacts {
   background-color: var(--hlc-midnight-blue) !important;
   padding: 30px 0;
   margin-top: 0px;
}

section.key-contacts .title h2 { font-size: 36px !important; color: #ffffff !important; }

section.key-contacts .title .contacts { display: flex; flex-direction: row-reverse; gap: 20px; }

section.key-contacts .title .contacts .btn-all-contacts { background-color: transparent; border-color: #C3D544; }
section.key-contacts .title .contacts .btn-all-contacts:hover { background-color: #c3d544; color: #381634; }

section.key-contacts .title .contacts .btn-contact-us {
   border-color: var(--hl-light-green);
   background-color: var(--hl-light-green);
   color: var(--hlc-midnight-blue);
   font-size: 16px;
   background-image: url("/_assets/icon-envelope-hl-dark-over-light-green.png");
   padding-left: 50px;
   padding-top: 12px;
   padding-bottom: 12px;
}

section.key-contacts .title .contacts .btn-contact-us:hover {
   background-color: #ffffff !important;
}

section.key-contacts .key-contact-panel-content {
   display: flex;
   flex-direction: column;
   gap: 20px;
   align-items: start;
   padding-bottom: 0;
}

section.key-contacts .key-contact-panel-content .key-contact-image { flex-basis: 45%; flex-shrink: 0; object-fit: contain; }
section.key-contacts .key-contact-panel-content .key-contact-image img { margin: 0; height: 180px; }

section.key-contacts .key-contact-panel-content .key-contact-details p { color: #ffffff; white-space: initial; font-size: 17px; font-family: var(--hlc-gt-ultra); }
section.key-contacts .key-contact-panel-content .key-contact-details p.name {
   font-family: 'GT Ultra Regular', sans-serif;
   color: var(--hl-light-green);
}

/*** Carousels ***/

.slick-arrow {
   border: 1px solid var(--hl-light-green);
   width: 36px;
   height: 36px;
   font-size: 0;
   background-color: transparent;
   background-image: url("/ai-hub/_assets/icon-arrow-white.png");
   background-size: 17px auto;
   background-position: center;
   background-repeat: no-repeat;
}

.slick-arrow.slick-prev { transform: rotate(180deg); }

.slick-arrow:hover {
   background-color: #c3d544;
   background-image: url("/_assets/icon-line-arrow-hl-dark-green.png");
}

@media (max-width: 1100px) {
   .articles-list { grid-template-columns: repeat(3, 1fr); }
}

@media (max-width: 1000px) {
   .topic-center-list { grid-template-columns: repeat(3, 1fr); }
   .topic-center-topic-list { grid-column: span 3; }
}

@media (max-width: 930px) {
   section.article .content-container .navigation { flex-direction: column; gap: 20px; justify-content: initial; }

   section.article .content-container .navigation > div { justify-content: space-between; }

   section.article .content-container .navigation a { flex-basis: 160px; }
}

@media (max-width: 840px) {
   .topic-center-list { grid-template-columns: repeat(2, 1fr); }
   .topic-center-topic-list { grid-column: span 2; }

   section.article .container { grid-template-areas: "notes" "menu" "content" "related"; grid-template-columns: 1fr; grid-template-rows: auto; }

   section.article .notes { grid-template-areas: "notes pin download"; grid-template-columns: repeat(3, 1fr); grid-template-rows: 1fr; }
   section.article .notes.no-download { grid-template-areas: "notes pin"; grid-template-columns: repeat(2, max-content); grid-template-rows: 50px; }

   section.article .related-article-list { display: grid; grid-template-columns: repeat(2, 1fr); gap: 20px; }

   section.article .content-container { margin-top: 30px; border-top: 1px solid var(--hlc-midnight-blue); padding-top: 40px; }

   .articles-list { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 800px) {
   .topic-center-topic-list .topic-panel-link { display: grid; grid-template-areas: "image image" "content arrow"; gap: 20px; }

   .topic-center-topic-list .topic-panel-link .image { grid-area: image; height: 180px; width: 100%; clip-path: none; }
   .topic-center-topic-list .topic-panel-link .content { grid-area: content; padding: 0 40px 40px 40px; }
   .topic-center-topic-list .topic-panel-link .arrow { grid-area: arrow; }
}

@media (max-width: 640px) {
   section .search-bar .buttons a, section.search-bar .buttons button { font-size: 0; gap: 0; }
}

@media (max-width: 560px) {
   section.search-bar .search-bar-container { align-items: initial; display: grid; grid-template-areas: "social" "search" "buttons"; grid-template-columns: 1fr; gap: 10px; }
   section.search-bar .search-bar-container .search-box { grid-area: search; }
   section.search-bar .search-bar-container .buttons { grid-area: buttons; justify-content: end; }
   section.search-bar .search-bar-container .share-icons { grid-area: social; justify-self: end; }

   section.article .related-article-list { grid-template-columns: 1fr; }

   section.article .notes { grid-template-areas: "notes pin" "download download"; grid-template-columns: 1fr 1fr; gap: 20px; }

   .articles-list { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
   .topic-center-list { grid-template-columns: 1fr; }
   .topic-center-topic-list { grid-column: span 1; }
}

@media (max-width: 440px) {
   .key-contacts-list-wide .carousel-container .title { flex-direction: column; align-items: start; gap: 20px; }
}
