:root {
	--c-black: #000;
	--c-white: #fff;
	--c-almost-black: #121212;
	--c-almost-white: #f8f4f0;
	--c-light-grey: #d7d7d7;
	--c-dark-grey: #404040;
}

.no-display, .visuallyhidden { border: 0; clip: rect(0 0 0 0); -webkit-clip-path: inset(50%); clip-path: inset(50%); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; white-space: nowrap;}

body { background-color: var(--body-bg-color); color: var(--body-color); }

a { color: var(--link-color); transition: all .2s ease-in-out;}
a:hover, a:active, a:focus { color: var(--link-hover-color)}

/*
@supports(--fancy-link-underlines: true) {
    a>span {
        background-image:linear-gradient(currentColor,currentColor);
        background-position: bottom;
        background-repeat: no-repeat;
        background-size: 0 2px;
        padding-bottom: 3px;
        text-decoration: none;
        transition: background-size .3s cubic-bezier(.55,.085,.68,.53)
    }
}
@supports(--fancy-link-underlines: true) {
    a:focus>span, a:hover>span {
        background-size:100% 2px;
        text-decoration: none; 
        transition-timing-function: cubic-bezier(.23,1,.32,1)
    }
}	
*/

.title-wrap { }
.site-title { color: var(--bnr-title-color); font-size: var(--bnr-title-size); font-weight: var(--bnr-title-weight); margin-top: 1.2rem}
.site-sub-title { color: var(--bnr-subtitle-color); font-size: var(--bnr-subtitle-size); font-weight: var(--bnr-subtitle-weight); }


.carousel-row  div.title { text-align: center; margin-bottom: 1.2rem; font-size: 1.5rem; color: var(--crsl-title-color) }

.banner {  background-color: var(--banner-row-bg-color) } 
.banner .layout-wrap { background-color: var(--banner-layoutrow-bg-color); padding: 0 } 

.banner-logo-wrap a {  align-items: center; text-decoration: none; gap: 2rem}
.banner .logo { max-width: 100%; background-color: var(--bnr-logo-bg-color); }

@media only screen and (max-width: 768px) {
.banner-logo-wrap a { grid-template-columns: repeat(1, 1fr); grid-gap: 0; }
}

.banner .banner-button-wrap {
	display: grid;
	grid-template-columns: repeat(1, 1fr);
	gap: 1rem;
	width: 100%;
	margin: 0 aut0;
	box-sizing: border-box; 
}
@media only screen and (max-width: 1250px) {
.banner .banner-button-wrap {grid-template-columns: repeat(1, 1fr);}
}
@media only screen and (max-width: 768px) {
.banner .banner-button-wrap {grid-template-columns: repeat(2, 1fr);}
}
@media only screen and (max-width: 450px) {
.banner .banner-button-wrap {grid-template-columns: repeat(1, 1fr);}
}


.banner-row-2 { background-color: var(--banner-row-bg-color)}



/* social media links */


a.social {
	position: relative;
	display: block;

	width: 38px;
	height: 38px;
	flex: 0 0 38px;
	
	padding: 0;
	margin: 0;

	text-indent: -9999px;
	overflow: hidden;

	background-color: transparent;
	color: var(--soc-icon-txt-color);

}

a.social::before {
	content: "";
	position: absolute;
	inset: 0;

	background-size: contain;
	background-position: center;
	background-repeat: no-repeat;
}

/*
a.social { text-indent: -9999px; display: inline-block; background-color: var(--soc-icon-bg-color); color: var(--soc-icon-txt-color); }
a.social { position: relative; padding-left: 35px; /* space for icon  }*/
/*
a.social::before { content: "";position: absolute;left: 0;top: 20%;width: 45px;height: 45px;transform: translateY(-50%);background-image: url("/img/icons/search.svg");background-size: contain;   background-repeat: no-repeat;}
*/
[data-theme="light"],
[data-theme="hclight"] {
	a.social.twitter::before { background-image: url("../img/icons/icon-x-twitter-dark.png"); }
	a.social.facebook::before { background-image: url("../img/icons/icon-facebook-dark.png"); }
	a.social.linkedin::before { background-image: url("../img/icons/icon-linkedin-dark.png"); }
	a.social.instagram::before { background-image: url("../img/icons/icon-instagram-dark.png"); }
	a.social.rss::before { background-image: url("../img/icons/icon-rss-feed-dark.png"); }
}
[data-theme="dark"],
[data-theme="hcdark"] {
	a.social.twitter::before { background-image: url("../img/icons/icon-x-twitter-light.png"); }
	a.social.facebook::before { background-image: url("../img/icons/icon-facebook-light.png"); }
	a.social.linkedin::before { background-image: url("../img/icons/icon-linkedin-light.png"); }
	a.social.instagram::before { background-image: url("../img/icons/icon-instagram-light.png"); }
	a.social.rss::before { background-image: url("../img/icons/icon-rss-feed-light.png"); }
}


/* back to top */
.back-up-row { background-color: var(--bu-bg-color); margin-top: 3rem; margin-bottom: 2rem }
.back-up-row .layout-wrap { text-align: center;}
.back-up{ color: var(--bu-txt-color); text-decoration: none; padding: 4em 0 1.5em; position: relative; display:inline-block}
/*.back-up:before { background-image: url(../img/icons/icons-back-to-top-light.png); background-size: 2.5em;background-repeat:no-repeat; 
	content:""; display: inline-block;position: absolute; width: 2.5em; height: 2.5em;top: 34%;left: 30%;transform: translateY(-50%);}

[data-theme="light"],
[data-theme="hclight"] {
	.back-up:before {	background-image: url(../img/icons/icons-back-to-top-dark.png); }
}
[data-theme="dark"],
[data-theme="hcdark"]  {
	.back-up:before {	background-image: url(../img/icons/icons-back-to-top-light.png); }
}
.back-up { display: inline-block; margin-bottom: 2rem;}
.back-up::after { content: 'Back to top'}
*/

.footer-row  { padding: 2.5rem 0; }

.logo-row .layout-wrap { background-color: var(--lr-bg-color); padding: 1em 0 }
/*.logo-row img { margin-left: 2rem; max-width: 100%;} */

.top-row { background-color: var(--top-row-bg-color) }
.top-row .layout-wrap { background-color: var(--top-layoutrow-bg-color) }
.search-row {  background-color: var(--search-row-bg-color); padding: 1rem }
.search-row .layout-wrap {  background-color: var(--search-layoutrow-bg-color) }
.nav-row {  background-color: var(--nav-row-bg-color) }
.nav-row .layout-wrap {  background-color: var(--nav-layoutrow-bg-color) }
.content-row { background-color: var(--content-row-bg-color) }
.content-row .layout-wrap { background-color: var(--content-layoutrow-bg-color) }

.footer-row { background-color: var(--footer-row-bg-color); color: var(--footer-txt-color)}
.footer-row .layout-row { background-color: var(--footer-layoutrow-bg-color); }

.footer-row a { color: var(--footer-link-color); transition: all .2s ease-in-out; text-decoration: var(--footer-link-decoration)}

.footer-row a:hover, 
.footer-row a:active, 
.footer-row a:focus { color: var(--footer-link-hover-color); text-decoration: var(--footer-link-hover-decoration)}

/* content specific */

.issue-title { color: var(--cnt-issue-title-txt-color); font-size: 1rem; background-color: var(--cnt-issue-title-bg-color); padding: 1rem; margin-bottom: 1rem }

.pub-date { display: block; margin: 1rem 0; color: var(--cnt-pub-date-txt-color)}


/* carousel and buttons */

.slick-loading .slick-list { background: #fff url('./ajax-loader.gif') center center no-repeat; }
.slick-list { margin: 0 3rem 0 2.5rem }

.slick-prev,
.slick-next { font-size: 0;line-height: 0;position: absolute;top: 50%;display: block;padding: 0;-webkit-transform: translate(0, -50%);-ms-transform: translate(0, -50%);transform: translate(0, -50%);cursor: pointer;border: none;outline: none;background: transparent;
   color: var(--icon-btn-txt-color);width: var(--crsl-btn-size);height: var(--crsl-btn-size);
}
.slick-prev { left: -5px; }
[dir='rtl'] .slick-prev { right: -5px; left: auto; }
.slick-next { right: 5px; }
[dir='rtl'] .slick-next { right: auto; left: -5px; }

.slick-next:before,
.slick-prev:before {
	content: "";
	display: inline-block;
    width: var(--crsl-btn-size);
    height: var(--crsl-btn-size);
    background-color: var(--crsl-btn-color);
    background-repeat: no-repeat;
    background-position: center;
    background-size: var(--crsl-btn-size);
	transition: background 0.25s ease;
    border-radius: 50%;
    flex-shrink: 0;
}
.slick-prev:before, .slick-next:before {font-size: var(--crsl-btn-size);color: var(--crsl-btn-color);}

.slick-next:before { background-image: url("../img/icons/icon-right-arrow-light.png"); }	
.slick-prev:before { background-image: url("../img/icons/icon-left-arrow-light.png"); }		
[dir='rtl'] .slick-next:before { background-image: url("../img/icons/icon-left-arrow-light.png"); }
[dir='rtl'] .slick-prev:before { background-image: url("../img/icons/icon-right-arrow-light.png"); }

.slick-prev:hover:before,
.slick-prev:focus:before,
.slick-next:hover:before,
.slick-next:focus:before { background-color: var(--crsl-btn-hover-color); }    
.slick-prev.slick-disabled:before,
.slick-next.slick-disabled:before { opacity: .25; }
/* Dots */
.slick-dotted.slick-slider { margin-bottom: 30px; }

.slick-dots { position: absolute; bottom: -35px; display: block; width: 100%; padding: 0; margin: 0; list-style: none; text-align: center; }
.slick-dots li { position: relative; display: inline-block; width: 20px; height: 20px; margin: 0 5px; padding: 0; cursor: pointer; }
.slick-dots li button { font-size: 0;line-height: 0;display: block;width: 20px;height: 20px;padding: 5px;cursor: pointer;color: transparent;border: 0;outline: none;background: transparent;}
.slick-dots li button:hover,
.slick-dots li button:focus { outline: none; }
.slick-dots li button:hover:before,
.slick-dots li button:focus:before { opacity: 1; }
.slick-dots li button:before
{
    font-size: 46px;
    line-height: 20px;
    position: absolute;
    top: 0;
    left: 0;
    width: 20px;
    height: 20px;
    content: '•';
    text-align: center;
    opacity: .25;
    color: black;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}
.slick-dots li.slick-active button:before { opacity: .75; color: black; }




	
/* icon buttons */	

.icon-btn { display: inline-flex; align-items: center; gap: 10px; text-decoration: none; color: var(--icon-btn-txt-color); } 
.icon-btn.txt-bottom { flex-direction: column; align-items: center; }
.icon-btn:before { 
	content: "";
    width: var(--icon-btn-circle-size);
    height: var(--icon-btn-circle-size);
    background-color: var(--icon-btn-circle-bg-color);
    background-repeat: no-repeat;
    background-position: center;
    background-size: var(--icon-btn-size);
	transition: background 0.25s ease;
    border-radius: 50%;
    flex-shrink: 0;
}
.icon-btn.up-arrow:before { background-image: url("../img//icons/icon-up-arrow-light.png"); }	
.icon-btn.twitter::before { background-image: url("../img/icons/icon-x-twitter-dark.png"); }
.icon-btn.facebook::before { background-image: url("../img/icons/icon-facebook-dark.png"); }
.icon-btn.linkedin::before { background-image: url("../img/icons/icon-linkedin-dark.png"); }
.icon-btn.instagram::before { background-image: url("../img/icons/icon-instagram-dark.png"); }

.icon-btn.up-arrow.dark::before { background-image: url("../img//icons/icon-up-arrow-dark.png"); }	
.icon-btn.twitter.dark::before { background-image: url("../img/icons/icon-x-twitter-dark.png"); }
.icon-btn.facebook.dark::before { background-image: url("../img/icons/icon-facebook-dark.png"); }
.icon-btn.linkedin.dark::before { background-image: url("../img/icons/icon-linkedin-dark.png"); }
.icon-btn.instagram.dark::before { background-image: url("../img/icons/icon-instagram-dark.png"); }


.icon-btn:hover,
.icon-btn:active { color: var(--icon-btn-hover-txt-color); }

.icon-btn:hover:before,
.icon-btn:active:before { background-color: var(--icon-btn-circle-hover-bg-color); }






.feature-wrap { margin-top: 2rem; height:auto; display: grid; gap: 3rem; grid-template-columns: repeat(3, 1fr); justify-content: space-between; }
.feature-wrap .card { position: relative; display: flex;background-color: var(--ic-bg-color); border-radius: var(--ic-border-radius); }
.feature-wrap .card img { width: 100%; display: block; }
.feature-wrap .card a { text-decoration: none; color: var(--ic-link-color); display: block; }
.feature-wrap .card a:hover,
.feature-wrap .card a:active,
.feature-wrap .card a:focus { color: var(--ic-link-hover-color)}
@media only screen and (min-width: 600px) {
.feature-wrap .card a { height: 100% }
}
.feature-wrap .card .tags { position: absolute; top: 2em; left: 1em; width: auto; }
.feature-wrap .card .tags ul { display: flex; gap: 0.6rem; color: transparent}
.feature-wrap .card .tags a { text-decoration: none; color: var(--ic-tag-color);  padding: 0.6rem; background-color: var(--ic-tag-bg-color); }
.feature-wrap .card a:before {
	bottom: 0;
    content: "";
    cursor: pointer;
    left: 0;
    /* padding: 20px; */
    position: absolute;
    right: 0;
    top: 0;
    z-index: 1;
}
.feature-wrap .card .tags a:hover,
.feature-wrap .card .tags a:active,
.feature-wrap .card .tags a:focus { background-color: var(--ic-tag-hover-bg-color); color: var(--ic-tag-hover-color)}
.feature-wrap .card .caption { padding: 1rem;  color: var(--ic-caption-color);
        display: flex;
        flex: 1 0 auto;
        flex-direction: column;
        padding: 20px;
        z-index: 5;
 }

@media only screen and (min-width: 1000px) {
.feature-wrap { margin-top: 2rem;  }
.feature-wrap .card { }
}

	
@media(min-width: 768px) {
        .card-wrap:hover:before {
            bottom:-15px;
            left: -15px;
            right: -15px;
            top: -15px;
            transition-timing-function: cubic-bezier(.23,1,.32,1)
        }
    }
.card-wrap a:before {
        bottom: 0;
        content: "";
        cursor: pointer;
        left: 0;
        padding: 20px;
        position: absolute;
        right: 0;
        top: 0;
        z-index: 1
    }

    @media(min-width: 768px) {
        .card-wrap a:before {
            padding:30px
        }
    }

	
/* issue summary */
.issue-wrap { margin-top: 2rem }

.issue-summary { }
.issue-summary .section-wrap { background-color: var(--is-section-bg-color); margin-bottom: 2rem; padding-bottom: 1rem }
.issue-summary .section-wrap .is-sec-title { background-color: var(--is-sec-title-bg-color); color: var(--is-sec-title-color); padding: 0.6rem; font-size: 1rem;}
.issue-summary .section-wrap .is-content-wrap { color: var(--is-sec-title-color); font-size: 1rem;}
.issue-summary .is-content-wrap a { text-decoration: none; display: block; margin-left: 2rem}
.issue-summary .is-content-wrap a:hover { text-decoration: underline; }
.issue-summary .is-content-title { color: var(--is-content-title-color); font-size: 1rem;}

.issue-summary ul { margin-top: 1rem; margin-bottom: 1rem; padding: 0;}
.issue-summary ul li { margin: 0; padding: 0; }
.issue-summary ul { list-style: none; }
.issue-summary li { position: relative; padding-left: 1em; }
.issue-summary li::before { content: "•"; position: absolute; left: 1rem; color: var(--is-content-title-color); }


.issue-wrap.grid { display: grid; gap: 1.25rem;}
@media only screen and (min-width: 450px) {
	.issue-wrap.grid { display: grid; grid-template-columns: repeat(2, 1fr);	}
}


.issue-wrap .card { height: 100%; position: relative; background-color: var(--ic-bg-color); border-radius: var(--ic-border-radius); overflow: hidden; }
.issue-wrap .card img { width: 100%; display: block; }
.issue-wrap .card > a { text-decoration: none; color: var(--ic-link-color); display: block; }
.issue-wrap .card > a:hover,
.issue-wrap .card > a:active,
.issue-wrap .card > a:focus { color: var(--ic-link-hover-color)}

.issue-wrap .card .tags { position: absolute; top: 2em; left: 1em; width: auto; }
.issue-wrap .card .tags ul { display: flex; gap: 0.6rem}
.issue-wrap .card .tags a { text-decoration: none; color: var(--ic-tag-color); height: 100%; padding: 0.6rem; background-color: var(--ic-tag-bg-color);}
.issue-wrap .card .tags a:hover,
.issue-wrap .card .tags a:active,
.issue-wrap .card .tags a:focus { background-color: var(--ic-tag-hover-bg-color); color: var(--ic-tag-hover-color)}
.issue-wrap .card .caption { padding: 1rem;  color: var(--ic-caption-color)}

@media only screen and (min-width: 1000px) {
.issue-wrap .card div.flex figure { width: 40%; flex: 1; margin: 0;	}
    .issue-wrap .card div.flex figure img {object-fit: cover; height: 100%;
    align-self: flex-start;
	}
.issue-wrap .card div.flex .caption {  flex: 1}

}



/* skip-link elements */
.skip-links ul { list-style-type:none; margin: 0; padding:0}
.skip-links a {
    text-decoration: underline;
    text-decoration-thickness: max(1px, .0625rem);
    text-underline-offset: .1578em;
    font-size: 1rem;
    line-height: 1.25rem;
	color: var(--skip-links-txt);
	display: block;
	background-color: var(--skip-links-bg); margin-top: 0.5rem; padding:0.5rem
}

.skip-links a:not(:active):not(:focus) {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    clip: rect(0 0 0 0) !important;
    clip-path: inset(50%) !important;
    border: 0 !important;
    white-space: nowrap !important;
    user-select: none
}


input[type="submit"] {
	border-radius: var(--submit-border-radius);
	border-width: var(--submit-border-width);
	border-style: var(--submit-border-style);
	border-color: var(--submit-border-color);
	font-size: 1rem; 
	color: var(--submit-txt); 
	background-color: var(--submit-bg); 
}


/* Back issue elements */
.back-issues label { color: var(--backissue-label-txt); }
.back-issues select {width: auto;font-weight: normal;}
@media (min-width: 768px) {
	.back-issues { float: right; }
}


/* Search elements */
.form-search { margin-bottom: 0; margin-top: 2rem;}
.form-search label { color: var(--search-label-txt); }
.form-search #q {border-right: none; }
@media (min-width: 768px) {
	.form-search { float: right; }
}

.form-search-filter > div { margin-bottom: 1rem;}
.form-search-filter label { color: var(--search-filter-label-txt); }
.form-search-filter input, .form-search-filter select { margin-left: 0.5rem }

.form-search.style-2 input[type="text"] { background-color: inherit; border: none; box-shadow:inset 0px 0px 0px 1px var(--c-green) }
.form-search.style-2 input[type="submit"] { background-color: var(--c-green); color: #fff; border: none; appearance: none; transition: all .2s ease-out; font-weight: 600;}
.form-search.style-2 input[type="submit"]:hover,
.form-search.style-2 input[type="submit"]:focus { background-color: var(--c-dark-green); color: #fff; border: none; box-shadow: none; } 

.form-search.style-3 input[type="text"] { background-color: inherit; border: none; border: none; border-bottom: 1px solid var(--c-green)  }
.form-search.style-3 input[type="submit"] { background-color: var(--c-green); border: none; appearance: none; transition: all .2s ease-out; font-weight: 600;}
.form-search.style-3 input[type="submit"]:hover,
.form-search.style-3 input[type="submit"]:focus { background-color: var(--c-dark-green); color: #fff; border: none; outline: none; box-shadow: none; } 



/* search results */

.search-results { margin: 0; padding: 0; list-style-type: none; }
.search-results .card { padding: 1rem; border: var(--sr-border); background-color: var(--sr-bg-color); color: var(--sr-txt-color); margin-bottom: 2rem }
.search-results .card .pub-date { margin: 0 0 1rem 0; color: var(--sr-pubdate-color)}

.pagination ul { list-style=type: none; margin: 0; padding:0; float: right; margin-bottom: 2rem}
.pagination ul li { display: inline-block; margin-right: 1rem }
.pagination ul li a { text-decoration: none;}
.pagination ul li.active:not(:has(a.disabled)) {border-bottom: 2px solid var(--c-dark-grey) }
.pagination ul li a.disabled { color: var(--c-light-grey); cursor: default; }

/* mode switcher */

.mode-switch-wrap { }
.mode-switch-wrap label { color: var(--ms-txt-color); }


/* font resize elements */


#font-resize-wrap { display: flex; flex-wrap: wrap; justify-content: center; width: 120px; color: var(--txt-resize-txt); }

.font-resize_label-wrap { display: flex; justify-content: center; width: 100%; margin: 0; }

.font-resize_label { appearance: none; position: relative; margin: 0; padding: 0 18px 2px 0; border: 0; border-bottom: 1px solid currentColor; background: none; color: inherit; font: inherit; font-size: 0.9em; font-weight: normal; line-height: inherit; white-space: nowrap; cursor: pointer; }

.font-resize_label::after { content: ""; position: absolute; right: 2px; top: 50%; width: 6px; height: 6px; border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor; transform: translateY(-65%) rotate(45deg); transition: transform 0.2s ease; }

.font-resize_label[aria-expanded="true"]::after { transform: translateY(-25%) rotate(225deg); }

.font-resize-control { display: none; align-items: center; justify-content: center; width: 100%; gap: 12px; margin-top: 10px; }

.font-resize-control.open { display: flex; }

.font-resize_up,
.font-resize_down { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 32px; width: 32px; min-width: 32px; max-width: 32px; height: 32px; min-height: 32px; max-height: 32px; box-sizing: border-box; border: 1px solid var(--txt-resize-txt); border-radius: 50%; background: none; color: var(--txt-resize-txt); font-size: 1.5em; line-height: 1; text-decoration: none; }
.font-resize_up:hover,
.font-resize_down:hover,
.font-resize_up:focus,
.font-resize_down:focus { background: var(--txt-resize-focus-bg); color: var(--txt-resize-focus-txt); }

.font-resize_scale { min-width: 42px; text-align: center; }



/* quick exit link */

.quick-exit {
    position: fixed;
    top: 0;
    left: 1.75rem;
    z-index: 10000;

    display: inline-flex;
    align-items: center;
    gap: 0.4rem;

    padding: 1rem 1.75rem;

    background: #f2b632;
    color: #111;

    font-weight: 700;
    line-height: 1;
    text-decoration: none;

    border: 2px solid #111;
    border-top: 0;
    border-radius: 0 0 4px 4px;
}

.quick-exit:hover,
.quick-exit:focus-visible {
    background: #111;
    color: #fff;
    text-decoration: none;
}

.quick-exit:focus-visible {
    outline: 3px solid #fff;
    outline-offset: -5px;
}



html.panic-active::after {
    content: '';
    position: fixed;
    inset: 0;
    z-index: 999999;
    background: #fff;
}


.breadcrumb-list { padding: 0; margin: 0 0 20px 0; }
.breadcrumb-list li { font-size: 12px; display: inline-block;}
.breadcrumb-list li:after {content: "/"; margin-left: 10px;padding-right: 10px; color: var(--bc-separator-color)}
.breadcrumb-list li:last-child:after {content: ""; }
.breadcrumb-list li a,
.breadcrumb-list li a:link { var(--bc-txt-color); }
.breadcrumb-list li a:hover { var(--bc-txt-hover-color); }
.breadcrumb-list li a:active { var(--bc-txt-active-color); }


/* buttons */
.button { 
	background-color: var(--button-bg-color); 
	color: var(--button-txt-color); 
	padding-inline: 1.25rem; 
	padding-block: 2.5rem;
	text-align: center; 
	border-radius: var(--button-border-radius); 
	border-width: var(--button-border-width);
	border-style: var(--button-border-style);
	border-color: var(--button-border-color);
	display: inline-block;
}

.button,
.button:link { text-decoration: none; }
.button:hover,.button:active { background-color: var(--button-bg-color-hover) !important; color: var(--button-txt-color-hover) !important;}

.button-secondary {	background-color: var(--button-sec-bg-color); color: var(--button-sec-txt-color); }
.button-secondary:hover,.button-secondary:active { background-color: var(--button-sec-bg-color-hover) !important; color: var(--button-sec-txt-color-hover) !important; }

.button-tertiary {	background-color: var(--button-ter-bg-color); color: var(--button-ter-txt-color); }
.button-tertiary:hover,.button-tertiary:active { background-color: var(--button-ter-bg-color-hover) !important; color: var(--button-ter-txt-color-hover) !important;}


.button.full { width: 100%; display: block }
.button.x-small { padding-block: 0.5rem; padding-inline: 0.5rem;  }
.button.small { padding-block: 1rem; padding-inline: 1.25rem; }
.button.large { padding-block: 2rem; padding-inline: 2rem; font-size: 1.25rem}
.button.x-large { padding-block: 3rem; padding-inline: 3rem; font-size: 1.25rem }

.button.w-icon { background-position: 1rem center; background-repeat: no-repeat; background-size: 3rem; padding-block: 1.875rem; text-align: left; padding-inline: 4.75rem 1.25rem }
.button.w-icon.x-small { background-position: 0.75rem center; background-size: 1.75rem; padding-block: 0.5rem; padding-inline:3.25rem 1.25rem; }
.button.w-icon.small { background-position: 0.75rem center; background-size: 2.5rem; padding-block: 1rem; padding-inline:  4rem 1.25rem; }
.button.w-icon.medium { background-position: 1rem center; background-size: 3rem; padding-block: 2rem; padding-inline:5rem 1.5rem; }
.button.w-icon.large { background-position: 1rem center; background-size: 4rem; padding-block: 2rem; padding-inline:6rem 2rem; }
.button.w-icon.x-large { background-position: 1rem center; background-size: 4rem; padding-block: 3rem; padding-inline:6rem 3rem; }


.icon-button { background-color: var(--icon-button-bg-color); border-radius: var(--icon-button-border-radius); border: var(--icon-button-border); }
.icon-button img { width: var(--icon-button-img-width); height: var(--icon-button-img-height);}
.icon-button:hover { opacity: 0.8; }

.button.bold { font-weight: 600 }
.button.regular-txt { font-size: 1rem; }
.button.small-txt { font-size: 0.9rem; }
.button.medium-txt { font-size: 1.16rem }
.button.large-txt { font-size: 1.25rem }
.button.x-large-txt { font-size: 1.5rem }

.button.w-icon.feedback { background-image: url(../img/icons/icon-feedback-light.png); }
.button.w-icon.document { background-image: url(../img/icons/icon-document-light.png); }
.button.w-icon.exclamation { background-image: url(../img/icons/icon-exclamation-light.png); }
.button.w-icon.handshake { background-image: url(../img/icons/icon-handshake-light.png); }
.button.w-icon.family { background-image: url(../img/icons/icon-family-light.png); }
.button.w-icon.check { background-image: url(../img/icons/icon-check-light.png); }
.button.w-icon.up-arrow { background-image: url(../img/icons/icon-up-arrow-light.png); }
.button.w-icon.folder { background-image: url(../img/icons/icon-folder-light.png); }
.button.w-icon.mail-1 { background-image: url(../img/icons/icon-mail-1-light.png); }
.button.w-icon.mail-2 { background-image: url(../img/icons/icon-mail-2-light.png); }
.button.w-icon.star { background-image: url(../img/icons/icon-star-light.png); }
.button.w-icon.warning { background-image: url(../img/icons/icon-warning-light.png); }
.button.w-icon.education  { background-image: url(../img/icons/icon-training-light.png); }
.button.w-icon.subscribe  { background-image: url(../img/icons/icon-subscribe-light.png); }
.button.w-icon.rss  { background-image: url(../img/icons/icon-rss-light.png); }
.button.w-icon.cogs  { background-image: url(../img/icons/icon-gears-light.png); }

.button.w-icon.feedback.dark { background-image: url(../img/icons/icon-feedback-dark.png); }
.button.w-icon.document.dark { background-image: url(../img/icons/icon-document-dark.png); }
.button.w-icon.exclamation.dark { background-image: url(../img/icons/icon-exclamation-dark.png); }
.button.w-icon.handshake.dark { background-image: url(../img/icons/icon-handshake-dark.png); }
.button.w-icon.family.dark { background-image: url(../img/icons/icon-family-dark.png); }
.button.w-icon.check.dark { background-image: url(../img/icons/icon-check-dark.png); }
.button.w-icon.up-arrow.dark { background-image: url(../img/icons/icon-up-arrow-dark.png); }
.button.w-icon.folder.dark { background-image: url(../img/icons/icon-folder-dark.png); }
.button.w-icon.mail-1.dark { background-image: url(../img/icons/icon-mail-1-dark.png); }
.button.w-icon.mail-2.dark { background-image: url(../img/icons/icon-mail-2-dark.png); }
.button.w-icon.star.dark { background-image: url(../img/icons/icon-star-dark.png); }
.button.w-icon.warning.dark  { background-image: url(../img/icons/icon-warning-dark.png); }
.button.w-icon.education.dark  { background-image: url(../img/icons/icon-training-dark.png); }
.button.w-icon.subscribe.dark  { background-image: url(../img/icons/icon-subscribe-dark.png); }
.button.w-icon.rss.dark  { background-image: url(../img/icons/icon-rss-dark.png); }
.button.w-icon.cogs.dark  { background-image: url(../img/icons/icon-gears-dark.png); }

[data-theme="hcdark"] {
	.button.w-icon.feedback { background-image: url(../img/icons/icon-feedback-light.png); }
	.button.w-icon.document { background-image: url(../img/icons/icon-document-light.png); }
	.button.w-icon.exclamation { background-image: url(../icons/img/icon-exclamation-light.png); }
	.button.w-icon.handshake { background-image: url(../img/icons/icon-handshake-light.png); }
	.button.w-icon.family { background-image: url(../img/icons/icon-family-light.png); }
	.button.w-icon.check { background-image: url(../img/icons/icon-check-light.png); }
	.button.w-icon.up-arrow { background-image: url(../icons/img/icon-up-arrow-light.png); }
	.button.w-icon.folder { background-image: url(../img/icons/icon-folder-light.png); }
	.button.w-icon.mail-1 { background-image: url(../img/icons/icon-mail-1-light.png); }
	.button.w-icon.mail-2 { background-image: url(../img/icons/icon-mail-2-light.png); }
	.button.w-icon.star { background-image: url(../img/icons/icon-star-light.png); }
	.button.w-icon.warning { background-image: url(../img/icons/icon-star-light.png); }
	.button.w-icon.education  { background-image: url(../img/icons/icon-training-light.png); }
	.button.w-icon.subscribe  { background-image: url(../img/icons/icon-subscribe-light.png); }	
	.button.w-icon.rss  { background-image: url(../img/icons/icon-rss-light.png); }
	.button.w-icon.cogs  { background-image: url(../img/icons/icon-gears-light.png); }
}
[data-theme="hclight"] {
	.button.w-icon.feedback { background-image: url(../img/icons/icon-feedback-dark.png); }
	.button.w-icon.document { background-image: url(../img/icons/icon-document-dark.png); }
	.button.w-icon.exclamation { background-image: url(../icons/img/icon-exclamation-dark.png); }
	.button.w-icon.handshake { background-image: url(../img/icons/icon-handshake-dark.png); }
	.button.w-icon.family { background-image: url(../img/icons/icon-family-dark.png); }
	.button.w-icon.check { background-image: url(../img/icons/icon-check-dark.png); }
	.button.w-icon.up-arrow { background-image: url(../icons/img/icon-up-arrow-dark.png); }
	.button.w-icon.folder { background-image: url(../img/icons/icon-folder-dark.png); }
	.button.w-icon.mail-1 { background-image: url(../img/icons/icon-mail-1-dark.png); }
	.button.w-icon.mail-2 { background-image: url(../img/icons/icon-mail-2-dark.png); }
	.button.w-icon.star { background-image: url(../img/icons/icon-star-dark.png); }
	.button.w-icon.warning  { background-image: url(../img/icons/icon-warning-dark.png); }	
	.button.w-icon.education  { background-image: url(../img/icons/icon-training-dark.png); }
	.button.w-icon.subscribe  { background-image: url(../img/icons/icon-subscribe-dark.png); }
	.button.w-icon.rss  { background-image: url(../img/icons/icon-rss-dark.png); }
	.button.w-icon.cogs  { background-image: url(../img/icons/icon-gears-dark.png); }
}


.nav-row { background-color: var(--main-nav-bg); }
.main-nav .nav { clear: both; max-height: 0; transition: max-height .2s ease-out; /*overflow: hidden;*/ }
.main-nav .menu-icon { cursor: pointer; display: inline-block; padding: 28px 20px 28px 10px; position: relative; user-select: none; }
.main-nav .menu-icon .navicon { background: var(--main-nav-hamburger); display: block; height: 5px; position: relative; transition: background .2s ease-out; width: 30px; }
.main-nav .menu-icon .navicon:before,
.main-nav .menu-icon .navicon:after { background: var(--main-nav-hamburger); content: ''; display: block; height: 100%; position: absolute; transition: all .2s ease-out; width: 100%; }
.main-nav .menu-icon .navicon:before { top: 9px; }
.main-nav .menu-icon .navicon:after { top: -9px; }
.main-nav .menu-btn { display: none; }
.main-nav .menu-btn:checked ~ .menu { display: block; max-height: 1500px; }
.main-nav .menu-btn:checked ~ .menu-icon .navicon { background: transparent; }
.main-nav .menu-btn:checked ~ .menu-icon .navicon:before { transform: rotate(-45deg); }
.main-nav .menu-btn:checked ~ .menu-icon .navicon:after { transform: rotate(45deg); }
.main-nav .menu-btn:checked ~ .menu-icon:not(.steps) .navicon:before, 
.main-nav .menu-btn:checked ~ .menu-icon:not(.steps) .navicon:after { top: 0; }
@media (min-width: 768px) {
  .main-nav .menu { clear: none; max-height: none; }
  .main-nav .menu-icon { display: none;  }
}

#mainNavigation { display: table; width: 100%; background-color: var(--main-nav-bg); }
#mainNavigation > ul { display: flex; flex-wrap: wrap; margin: 0; padding: 0; list-style-type: none; }
#mainNavigation > ul > li { display: flex; /*	width: 10%;*/ position: relative; align-items: center; }


.main-nav.vertical { /*margin-bottom: 1rem;*/ }
.main-nav.vertical #mainNavigation > ul { display: block; }


@media only screen and (max-width: 1250px) {
	#mainNavigation > ul  { display: grid; grid-template-columns: repeat(auto-fill, 150px); justify-content: space-between; grid-gap: 0; }
	#mainNavigation > ul > li { justify-content: space-between; }
}

#mainNavigation > ul > li:hover,   
#mainNavigation > ul > li:active,
#mainNavigation > ul > li:focus  { color: var(--main-nav-active-txt); background-color:var(--main-nav-active-bg);}

#mainNavigation > ul > li > a,
#mainNavigation > ul > li > a:link { color: var(--main-nav-link-txt); background-color: var(--main-nav-link-bg); text-decoration: none;}

#mainNavigation > ul > li > a:hover,
#mainNavigation > ul > li > a:active,
#mainNavigation > ul > li > a:focus,
#mainNavigation > ul > li > a:focus-visible  { color: var(--main-nav-active-txt); background-color:var(--main-nav-active-bg);}
#mainNavigation > ul > li > a { flex: 1; display: block; padding: 16px; }
#mainNavigation > ul > li.has-submenu > a { padding: 16px 8px 16px 16px; }
#mainNavigation > ul > li.home-link > a { padding: 16px; }

#mainNavigation > ul > li:hover > a,
#mainNavigation > ul > li:active > a,
#mainNavigation > ul > li:focus > a { color: var(--main-nav-active-txt); background-color:var(--main-nav-active-bg);}


/*
#mainNavigation > ul > li.has-submenu.open { background-color: var(--main-nav-active-bg);}

#mainNavigation > ul > li.has-submenu.open a,
#mainNavigation > ul > li.has-submenu.open a:link { color: var(--main-nav-active-txt); background-color:var(--main-nav-active-bg); text-decoration: none;}
*/
#mainNavigation > ul > li > .dropdown { background-color: var(--main-nav-drop-bg) !important; display: none; position: absolute; left: 0; right: 0; top: 100%; padding: 0 0 20px 0; margin: 0; min-width: 250px; z-index:99;  }
#mainNavigation > ul > li > .dropdown { display: none; }
#mainNavigation > ul > li.open > .dropdown { display:block; }

#mainNavigation > ul > li > .dropdown ul { list-style-type: none; margin: 0; padding: 0;}
#mainNavigation > ul > li > .dropdown ul li { margin: 0; padding: 0; }
#mainNavigation > ul > li > .dropdown ul li a,
#mainNavigation > ul > li.open > .dropdown ul li a { display: block; padding: 10px 16px; color: var(--main-nav-drop-link-txt); text-decoration:none}
#mainNavigation > ul > li > .dropdown ul li a:hover,
#mainNavigation > ul > li > .dropdown ul li a:active,
#mainNavigation > ul > li > .dropdown ul li a:focus,
#mainNavigation > ul > li > .dropdown ul li a:focus-visible { background-color: var(--main-nav-drop-active-bg); color: var(--main-nav-drop-active-txt);}


#mainNavigation .has-submenu button { background-color: transparent; border: none; padding:0;  }
#mainNavigation .has-submenu button > span { display:inline-block; padding: 1em; }
#mainNavigation .has-submenu button > span:after { content: "\25BC"; color: var(--main-nav-link-txt)}
#mainNavigation .has-submenu.open button > span:after { content: '\25B2'; color: var(--main-nav-active-txt) }

#mainNavigation > ul > li.selected {color: var(--main-nav-selected-txt); background-color:var(--main-nav-selected-bg) }
#mainNavigation > ul > li.selected > a,
#mainNavigation > ul > li.selected button,
#mainNavigation > ul > li.selected button > span:after,
#mainNavigation > ul > li.selected button:hover > span:after,
#mainNavigation > ul > li.selected button:focus > span:after,
#mainNavigation > ul > li.selected button:active > span:after,
#mainNavigation > ul > li.selected.has-submenu.open button > span:after { color: var(--main-nav-selected-txt); background-color:var(--main-nav-selected-bg) !important;}

.home #mainNavigation > ul > li.home-link a {color: var(--main-nav-selected-txt) !important; background-color:var(--main-nav-selected-bg) !important  }

/*
#mainNavigation .has-submenu button,
#mainNavigation .has-submenu a:focus + button { background-color: var(--main-nav-drop-active-bg); color: var(--main-nav-drop-active-txt) }
*/
#mainNavigation .has-submenu:hover button,
#mainNavigation .has-submenu:focus button,
#mainNavigation .has-submenu button:hover,
#mainNavigation .has-submenu button:active,
#mainNavigation .has-submenu button:focus { background: var(--main-nav-active-bg); color: var(--main-nav-active-txt) }


@media (max-width: 768px) {
	.main-nav .nav { overflow: hidden; }
	#mainNavigation > ul { grid-template-columns: repeat(1, 1fr); }
	#mainNavigation > ul > li { flex-wrap: wrap; }
	#mainNavigation > ul > li .dropdown { position: relative; width: 100%; z-index:0; min-width: 100%; top: 0;}
}

.next-prev-links { display: flex;  width: 100%;  justify-content: space-between; margin: 2rem 0}
.next-prev-links > div { width: 40%;}
.next-prev-links div.next { margin-left: auto; text-align: right;}
.next-prev-links div a { display: inline-block;}
.next-prev-links div a .link-title { background-color: var(--np-title-bg-color); padding: 0.6rem; border-radius: var(--np-link-title-border-radius);  margin-bottom: 1rem; display: inline-block; color: var(--np-link-title-color); text-decoration: none;}
.next-prev-links div a .link-label { margin-bottom: 1rem; display: block; font-size: 1em;}


.rel-content { padding: 0; margin-block: 0 2rem; border-radius: var(--rc-border-radius); overflow: hidden; background-color: var(--rc-bg-color);}
.rel-content .title { padding: 1rem; margin: 0; font-size: 1rem; color: var(--rc-heading-txt-color); font-weight: var(--rc-heading-font-weight); background-color: var(--rc-heading-bg-color); }
.rel-content > ul { padding: 0; }
.rel-content > ul li { padding: 0; border-bottom: var(--rc-separator-border); }
.rel-content > ul > li.selected a { font-weight: var(--rc-selected-font-weight); background-color: var(--rc-selected-bg-color); color: var(--rc-selected-txt-color); }
.rel-content > ul > li a {  background-color: var(--rc-link-bg-color); color: var(--rc-link-txt-color); text-decoration: none; margin: 0; display: block; padding: 0.6rem 1rem;}
.rel-content > ul > li a:hover,.see-also-list li a:active,.see-also-list li a:focus { color: var(--rc-hover-txt-color);background-color: var(--rc-hover-bg-color); }


/* content tag list */
div.content > nav { position: absolute; }
div.content > nav .tag-list { display: flex; gap: 0.6rem; margin: 0.2rem 0 0 0}
div.content > nav .tag-list li a { text-decoration: none; color: #fff; height: 100%; padding: 0.6rem; background-color: var(--c-dark-grey);}
div.content > nav .tag-list li a:hover,
div.content > nav .tag-list li a:active,
div.content > nav .tag-list li a:focus { color: #fff}


/* tag entry list */
:root {
    --page-bg: #ffffff;
    --text: #181818;
    --muted-text: #4d4d4d;
    --link: #005eb8;
    --link-hover: #003f7f;
    --border: #d8d8d8;
    --divider: #e3e3e3;
    --tag-bg: #f3f7fc;
    --tag-border: #cbdcf1;
    --selected-bg: #004b91;
    --selected-text: #ffffff;
    --disabled-bg: #f3f3f3;
    --disabled-text: #a3a3a3;
}

.tag-entry-list {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1.25rem;
    margin-top: 1.25rem;
}

.tag-entry-card {
    display: flex;
    flex-direction: column;
    min-width: 0;
    padding: 1.45rem 1.5rem 1.25rem;
    border: 1px solid var(--border);
    border-radius: 0.55rem;
    background: #fff;
}

.tag-entry-card h2 {
    margin: 0;
    font-size: 1.3rem;
    line-height: 1.25;
}

.tag-entry-card h2 a {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    color: var(--link);
    text-decoration: none;
}

.tag-entry-card h2 a:hover,
.tag-entry-card h2 a:focus-visible {
    text-decoration: underline;
    text-underline-offset: 0.18em;
}

.card-arrow {
    flex: 0 0 auto;
    margin-top: -0.05em;
    font-size: 2rem;
    font-weight: 300;
    line-height: 0.8;
}

.tag-entry-card > p {
    margin: 0.9rem 0 1rem;
}

.card-tags {
    display: flex;
    align-items: flex-start;
    gap: 0.7rem;
    margin-top: auto;
    padding-top: 0.8rem;
    border-top: 1px solid var(--divider);
}

.tag-label {
    flex: 0 0 auto;
    padding-top: 0.18rem;
    font-weight: 700;
}

.card-tags ul {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
    margin: 0;
    padding: 0;
    list-style: none;
}

.card-tags a {
    display: inline-block;
    padding: 0.24rem 0.75rem;
    border: 1px solid var(--tag-border);
    border-radius: 0.5rem;
    background: var(--tag-bg);
    color: var(--link);
    text-decoration: none;
    line-height: 1.35;
}

.card-tags a:hover,
.card-tags a:focus-visible {
    text-decoration: underline;
    text-underline-offset: 0.14em;
}

.card-tags li:has(> a[data-tag-type="letter"]) {
    display: none;
}

.card-section { display: block; margin: 0.5rem 0; font-size: 0.8rem}
.content p img { max-width: 100%; height: auto;}
.content h2 { margin: 1.25rem 0 2rem 0 }


.page-tools { margin-top: 2rem;justify-content: center;}
.page-tools.horiz li { display: inline-block; margin-right: 1rem }

.comment-wrap { margin-bottom: 1em; display: none;}
.comment-list-wrap { margin-bottom: 20px; }
.comment-list-wrap h2 { font-size: 0.9em; }
.comment-list li { padding: 10px; margin-bottom: 10px; }
.comment-list li .auth-name,
.comment-list li .datestamp { font-size: 0.8em; display: block; }
.comment-list li .datestamp { margin-bottom: 10px; }
.comment-list li .reply { margin-left: 10px; padding: 10px 10px;}
.comment-form { padding: 0; margin-bottom: 20px; }
.comment-form textarea { width: 95%; }
.comment-form label { display: block; margin-top: 1rem}
.comment-form input[type="text"] { width: 95%; }
#commentError { margin-bottom: 10px; }


/*.subscribe { margin-bottom: 1rem; }*/
.subscribe .form-section { margin-top: 1rem; }
.subscribe input { padding: 0.4rem; width: 40%; }
.subscribe input[type="submit"] { margin: 1rem 0; width: auto}
.subscribe ul,.subscribe ol { margin-top: 0.5rem; list-style-type: none; padding: 0;}
.subscribe label p { margin: 0}

.errorMsg { color: red}

footer h3 { margin: 1rem 0 0.5rem 0; font-size: 1.2rem}


/* Tag alpha list element */

.tag-az-list {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;

    margin: 0;
    padding: 0;
    list-style: none;
}

.tag-index-title { margin-bottom: 1rem; display: block; font-weight: 600; }
.tag-az-list > li {
    float: none;
    margin: 0;
}

.tag-az-list .tag a,
.tag-az-list .tag-empty span {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    min-width: 2.25rem;
    min-height: 2.25rem;
    padding: 0.35rem 0.5rem;

    box-sizing: border-box;

    border: var(--tg-border);
	background-color: (--tg-bg-color);
    border-radius: var(--tg-border-radius);
	text-transform: uppercase;
    text-decoration: none;
}

.tag-az-list .tag a {
    color: var(--tg-link-txt-color);
    background: var(--tg-link-bg-color);
}

.tag-az-list .tag a:hover,
.tag-az-list .tag a:focus-visible {
    color: var(--tg-link-hover-txt-color);
    background: var(--tg-link-hover-bg-color);
}

.tag-az-list .tag a:focus-visible {
    outline: 2px solid currentColor;
    outline-offset: 2px;
}

.tag-az-list .tag-empty span {
    color: var(--tg-empty-txt-color);
    background: var(--tg-empty-bg-color);
    border-color: var(--tg-empty-border-color);
}

.tag-az-list .selected a {
    color: var(--tg-selected-txt-color);
    background: var(--tg-selected-bg-color);
    border-color: var(--tg-selected-border-color);
}

.tag-az-list .selected a:hover,
.tag-az-list .selected a:focus-visible {
    background: var(--tg-selected-hover-bg-color);
    color: var(--tg-selected-hover-txt-color);
    border-color: var(--tg-selected-hover-border-color);
}


.tag-index { width: 100%; }

/* Centre the whole list */
.tag-index.centered .tag-az-list {
    justify-content: center;
}

.tag-index.centered .tag-index-title {
    text-align: center;
}


/* Make items spread across the available width */
.tag-index.full-width .tag-az-list {
    display: grid;
    grid-template-columns: repeat(26, minmax(0, 1fr));
    gap: 0.4rem;
}

.tag-index.full-width .tag-az-list .tag a,
.tag-index.full-width .tag-az-list .tag-empty span {
    width: 100%;
    min-width: 0;
}


/* Put the title alongside the links */
.tag-index.inline-title {
    display: flex;
    align-items: center;
    gap: 1.25rem;
}

.tag-index.inline-title .tag-index-title {
    flex: 0 0 auto;
    margin: 0;
}

.tag-index.inline-title .tag-az-list {
    flex: 1 1 auto;
}


@media (max-width: 900px) {
    .tag-index.full-width .tag-az-list {
        grid-template-columns: repeat(13, 1fr);
    }
}

@media (max-width: 700px) {
    .tag-index.inline-title {
        display: block;
    }

    .tag-index.inline-title .tag-index-title {
        margin-bottom: 1rem;
    }

    .tag-index.full-width .tag-az-list {
        grid-template-columns: repeat(7, 1fr);
    }

    .tag-index.full-width .tag-az-list .tag a,
    .tag-index.full-width .tag-az-list .tag-empty span {
        min-height: 3rem;
        padding: 0.5rem;
    }
}

@media (max-width: 420px) {
    .tag-index.full-width .tag-az-list {
        grid-template-columns: repeat(5, 1fr);
    }
}



.feature-box { border-radius: var(--fb-border-radius); background-color: var(--fb-bg-color); color: var(--fb-color); padding: 0; margin-block-end: 2rem; overflow: hidden;}
.feature-box .title { font-size: 1rem; margin: 0 0 2rem 0; padding: 1rem; color: var(--fb-title-color); background: var(--fb-title-bg-color);}

.feature-box .content { padding: 0; }
.feature-box .content p,
.feature-box .content h1,
.feature-box .content h2,
.feature-box .content h3,
.feature-box .content h4 { margin: 1rem 0; font-size: 1rem; }

.feature-box .content h1 { font-size: 1.5rem; font-weight: 600 }
.feature-box .content h2 { font-size: 1.25rem; font-weight: 600 }

.feature-box .content { margin: 0; padding: 0; color: var(--fb-color); }
.feature-box img { max-width: 100%; height: auto; margin-bottom: 2rem}
.feature-box a { color: var(--fb-link-color); }
.feature-box a:hover, .feature-box a:active, .feature-box a:focus { color: var(--fb-link-hover-color); }

.feature-box.style-2 { padding: 0 }
.feature-box.style-2 .title { margin: 0; background-color: var(--fb-title-bg-color); color: var(--fb-title-txt-color); }
.feature-box.style-2.w-icon .title { padding-left: 52px; background-image: url(../img/icons/icon-star-light.png); background-repeat: no-repeat; background-position: 10px 11px; background-size: 30px }

.feature-box.style-2 .content { padding: 0 }
.feature-box.style-2 .content p,
.feature-box.style-2 .content h1,
.feature-box.style-2 .content h2,
.feature-box.style-2 .content h3,
.feature-box.style-2 .content h4 { margin: 1rem 1rem 1rem 1rem; font-size: 1rem}


.feature-box.style-2 .content p:has(> img:only-child) { margin: 0 0 1rem 0 }

.feature-box.style-2 .content p > a:only-child { display: inline-block; margin: 1rem 0; color: var(--fb-button-txt-color); background-color: var(--fb-button-bg-color); padding: 0.2rem 0.5rem; text-decoration: none;}
.feature-box.style-2 .content p a:only-child:hover,
.feature-box.style-2 .content p a:only-child:active,
.feature-box.style-2 .content p a:only-child:focus { display: inline-block; margin: 1rem 0; color: var(--fb-button-hover-txt-color); background-color: var(--fb-button-hover-bg-color); padding: 0.2rem 0.5rem; text-decoration: none;}

.cookie-banner { border: var(--cookie-border); background-color: var(--cookie-bg-color); margin: 0; color: var(--cookie-bg-color); padding: 0 20px;}
.cookie-banner a { color: var(--cookie-link-color); text-decoration: underline;}
.cookie-banner.top { position: absolute;top: 0;}
.cookie-banner.bottom { position: fixed; bottom: 0px; height: auto;}
.cookie-banner #chkAcceptCookie { margin-right: 1em;}

.no-pad { padding: 0 !important;}
.no-pad div > article { padding: 1.25rem  }
.no-pad div > h1 { padding: 1.25rem; text-align: center; color: #fff; background-color: var(--c-light-blue); font-size: 1.5rem} 


.slideshow-container {max-width: 100%; position: relative; height: var(--ss-height); overflow: hidden; margin-bottom: 2rem;}
.slideshow-container .slide { display: none; height: 100%;}
.slideshow-container .prev, .slideshow-container .next { background-color: var(--ss-button-bg-color);cursor: pointer; position: absolute; top: 50%; width: auto; margin-top: -22px; padding: 16px; color: var(--ss-button-txt-color); font-weight: bold; font-size: 1rem; transition: 0.6s ease; border-radius: 0 3px 3px 0; user-select: none; text-decoration: none; }
.slideshow-container .next { right: 0; border-radius: 3px 0 0 3px; }
.slideshow-container .prev:hover, .slideshow-container .next:hover { background-color: var(--ss-button-hover-bg-color); }
.slideshow-container #slideWrap, .slideshow-container #slideWrap .slide { height: 100%; width: 100%;}
.slideshow-container #slideWrap a { text-decoration: none; display: block;}
.slideshow-container #slideWrap .slide a { text-decoration: none; display: block; height: 100%;}
.slideshow-container #slideWrap .caption-wrap { position: absolute;inset: 0;display: flex;align-items: center;left: 6rem;pointer-events: none; }
.slideshow-container #slideWrap .caption { z-index:99;background-color: var(--ss-caption-bg-color); color: var(--ss-caption-txt-color); overflow: hidden;top: 20%;left: 10%;padding: 2rem;max-width: 40%; }

@media (max-width: 1024px) {
.slideshow-container { height: auto; overflow: visible; }
.slideshow-container #slideWrap .caption-wrap { position: relative; top: 0; left: 0; display: block; width: auto}
.slideshow-container #slideWrap .caption { width: auto; max-width: 100%}
}
@media (max-width: 768px) {
/*	.slideshow-container #slideWrap .caption {top: 20%;left: 10%;font-size: 0.8rem;max-width: 60%;}
	.slideshow-container #slideWrap .caption h2 { font-size: calc(1rem + 0.9vw);} 
	.slideshow-container #slideWrap .caption { display: block; }	
*/	
	
}	
.slideshow-container #slideWrap .caption > * { color: var(--ss-caption-txt-color); }	

.slideshow-container #slideWrap .caption .button { display: inline-block; width: auto; color: var(--ss-button-txt-color); background-color: var(--ss-button-bg-color); }

.slideshow-container #slideWrap img { object-fit: cover; object-position: center; height: 100%;width: 100%;}
.slideshow-container #slideWrap .text { color: #f2f2f2;font-size: 15px;padding: 8px 12px;position: absolute;bottom: 8px;width: 100%;text-align: center;}
.slideshow-container #slideDots { text-align: right; margin-right: 2rem; margin-top: -60px; z-index: 99; position: relative}
.slideshow-container .slide-dot { cursor: pointer;height: 15px;width: 15px;margin: 0 2px;background-color: #bbb;border-radius: 50%;display: inline-block;transition: background-color 0.6s ease;  padding-block: 0;}
.slideshow-container .active, .slideshow-container .slide-dot:hover { background-color: #717171;}
.slideshow-container #slideDots .slide-control {  cursor: pointer; height: 25px; width: 25px;  margin: 0 2px;  display: inline-block;  padding-block: 0;  border: none; }
.slideshow-container #slideDots .slide-control.pause{ background: url(/js/libs/slideshow/pause_light.png) 0 0 no-repeat; background-size: cover; }
.slideshow-container #slideDots .slide-control.play{ background: url(/js/libs/slideshow/play_light.png) 0 0 no-repeat;  background-size: cover;}

.fade { animation-name: fade; animation-duration: 1.5s;}
@keyframes fade { from {opacity: .4} to {opacity: 1} }

/* accordion */
.toggle-cross { cursor: pointer; color: var(--tc-txt-color); padding: 0.85rem 1rem; background-color: var(--tc-bg-color); line-height: 1.2;font-size: 1em;}
.toggle-cross:after { content: '+'; /*position: relative;*/ float: right; color: var(--tc-txt-color); font-size: 1.25em; margin-right: 1rem; }
.toggle-cross.open:after { content: '—';}
.toggle-cross:hover,
.toggle-cross:focus { background-color: var(--tc-hover-bg-color); color: var(--tc-hover-txt-color);}
.toggle-content { display: none; margin-left: 15px; margin-bottom: 3em; position: relative; overflow: hidden;}
.toggle-title {color: var(--tc-txt-color); padding: 8px; background-color: var(--tc-bg-color); line-height: 1.2;font-size: 1em; font-weight: 500}

#accControlWrap { text-align: right; padding-bottom: 1rem}
#allControl { padding: 0.5rem; color: var(--tc-txt-color); background-color: var(--tc-bg-color); text-decoration: none;}


/* polls */

.poll-wrap { background-color: var(--p-bg-color); margin: 0 0 20px 0;  border-radius: var(--p-border-radius); border: var(--p-border); overflow: hidden;}
.poll-wrap .title { color: var(--p-title-txt-color); background-color: var(--p-title-bg-color); margin: 0 0 0.8rem 0; font-size: 1rem; padding: 0.75rem 1rem} 
.poll-wrap .title.w-icon { background-position: 1rem center; background-image: url(../img/icons/icon-check-dark.png); background-repeat: no-repeat; background-size: 1.75rem; text-align: left; padding-inline: 3.25rem 1rem }
.poll-wrap .poll { padding: 0 1rem; margin-bottom: 20px;}
.poll-wrap .poll .graph { background-color: var(--p-graph-bg-color); color:  var(--p-graph-txt-color); margin-bottom: 5px;}
.poll-wrap .poll .totalVotes { color: var(--p-txt-color); display: block;font-weight: bold;margin: 10px 0;}
.poll-wrap .poll .novotes { color: var(--p-no-votes-color); }
.poll-wrap .poll .pollQ {color:  var(--p-txt-color); display: block;margin: 5px 0 10px 0;}
.poll-wrap .poll .option {color:  var(--p-txt-color);}
.poll-wrap .poll .option {display: flex;margin-bottom: 10px;}
.poll-wrap .poll .option input[type=radio],
.poll-wrap .poll .option input[type=checkbox]{margin-top: 0;}
.poll-wrap .poll .option span {margin-left: 0.5rem;line-height: 1.2em;}
.poll-wrap .voteButton {display: block;margin: 1.25rem 0;text-align: center;}



/* card content block */

.card { margin: 0; }
.card img { margin: 0 !important; max-width: 100%; }
.card a,
.card a:link { text-decoration: none; display: grid; /* height: 100% */}
.card .title { font-weight: 500; display: block; margin: 0 0 1.2rem 0; }
.card .summary { display: block; margin: 0 0 1.2rem 0; }
.card .summary p  { margin: 0; }
.card .pad { padding: 1.2rem; }
.card.w-grow-hover:hover { transform: scale(1.02); }
.card.w-shadow { box-shadow: 0 0 11px rgba(33,33,33,.2); }
.card.w-shadow-hover { transition: box-shadow .3s; }
.card.w-shadow-hover:hover { box-shadow: 0 0 11px rgba(33,33,33,.2); }


.card.style-2 a { display: flex;align-items: stretch; overflow: hidden;}
.card.style-2 img { width: 100px; height: 100%; object-fit: cover; flex-shrink: 0; width: 50%;}
.card.style-2 .text { padding: 1rem; display: flex; flex-direction: column;}


/* featured link cards */
.featured-links .card { background-color: var(--fl-bg-color); color: var(--fl-txt-color); border-radius: var(--fl-border-radius); } 
.featured-links .card.w-border { border: var(--fl-border) }
.featured-links .card img { /*border-top-right-radius: 10px; border-top-left-radius: 10px;*/ }
.featured-links .card a,
.featured-links .card a:link { color: var(--fl-link-txt-color); text-decoration: none }
.featured-links .card a:hover,
.featured-links .card a:active,
.featured-links .card a:focus { color: var(--fl-link-txt-color-hover);  } 
.featured-links .card .title { font-weight: 500; color: var(--fl-title-txt-color); margin: 0;}
.featured-links .card .summary { background-color: var(--fl-summary-bg-color); color: var(--fl-summary-txt-color);  }
.featured-links .card .button { background-color: var(--fl-button-bg-color); color: var(--fl-button-txt-color);  }


/* latest news cards */
.latest-news-row { background-color: var(--latest-news-row-bg-color); color: var(--latest-news-row-txt-color);}

.news-list .card { background-color: var(--nl-bg-color); color: var(--nl-txt-color); border-radius: var(--nl-border-radius); } 
.news-list .card.w-border { border: var(--nl-border) }
.news-list .card img { /*border-top-right-radius: 10px; border-top-left-radius: 10px;*/ }
.news-list .card a,
.news-list .card a:link { color: var(--nl-link-txt-color); text-decoration: none }
.news-list .card a:hover,
.news-list .card a:active,
.news-list .card a:focus { color: var(--nl-link-txt-color-hover);  } 
.news-list .card .title { font-weight: bold; color: var(--nl-title-txt-color)}
.news-list .card .summary { background-color: var(--nl-summary-bg-color); color: var(--nl-summary-txt-color);  }
.news-list .card .button { background-color: var(--nl-button-bg-color); color: var(--nl-button-txt-color);  }

.latest-news-wrap .all-news {text-align: center; margin: 2rem 0 0 0}
.latest-news-wrap .all-news .button { background-color: var(--nl-all-button-bg-color); color: var(--nl-all-button-txt-color);}

.latest-news-wrap h2 { color: var(--nl-heading-txt-color); background-color: var(--nl-heading-bg-color); padding: 1rem 0}




@media (min-width: 700px) and (max-width: 1024px) {
  .card.style-2 {flex-direction: column;}

  .card.style-2:nth-child(1) {grid-column: 1 / -1;}
}

.card.flat * { text-align: left; }
.card.flat a { display: grid; grid-template-columns: repeat(2, 1fr); width: 100%; }
.card.flat a .img-container { }
.card.flat a .img-container img {width: 100%; height: 100%; object-fit: cover; display: block; }
@media only screen and (max-width: 768px) {
	.card.flat a { display: grid; grid-template-columns: repeat(1, 1fr); }
	.card.flat a .img-container { grid-column-start: 1;    grid-row-start: 1; }
}


/* 2 col */
.cnt-grid.style-4 {display: grid;grid-template-columns: repeat(2, 1fr);grid-template-rows: 1fr;grid-column-gap: 20px;grid-row-gap: 0px;}
@media only screen and (max-width: 900px) {
	.cnt-grid.style-4 {grid-template-columns: repeat(1, 1fr);}
}

/* 2 col, stacked right */
.cnt-grid.style-1 { display: grid;grid-template-columns: 2.5fr 1fr; gap: 20px; }
.cnt-grid.style-1 .col1, 
.cnt-grid.style-1 .col2 { display: flex; flex-direction: column; }
.cnt-grid.style-1 .col2 { gap: 20px;justify-content: space-between; }
.cnt-grid.style-1 .col1 a { flex: 1; display: flex; }
.cnt-grid.style-1 .col1 img { width: 100%; height: 100%; object-fit: cover; display: block; }
@media (max-width: 1024px) {
  .cnt-grid.style-1 { grid-template-columns: 1fr; height: auto; }
  .cnt-grid.style-1 .col1 { height: auto; }
  .cnt-grid.style-1 .col1 a {height: auto; }
  .cnt-grid.style-1 .col1 img { height: auto; }
  .cnt-grid.style-1 .col2 { flex-direction: row; justify-content: space-between; gap: 20px; }
  .cnt-grid.style-1 .col2 .row { flex: 1; }
}
@media (max-width: 700px) {
  .cnt-grid.style-1 .col2 {flex-direction: column; gap: 20px; }
  .cnt-grid.style-1 .col2 .item2,
  .cnt-grid.style-1 .col2 .item3 { flex: none; }
}

/* 4 col */
.cnt-grid.style-2 { display: grid;	grid-template-columns: repeat(4, 1fr);gap: 1.4rem;width: 100%;margin: 0 auto 0 auto;	box-sizing: border-box;  }
@media only screen and (max-width: 1200px) { 
	.cnt-grid.style-2 { grid-template-columns: repeat(2, 1fr); }
} 
@media only screen and (max-width: 768px) { 
	.cnt-grid.style-2 { grid-template-columns: repeat(1, 1fr); }
} 

/* 3 col */
.cnt-grid.style-3 { display: grid;	grid-template-columns: repeat(3, 1fr);gap: 1.4rem;width: 100%;margin: 0 auto 0 auto;	box-sizing: border-box;  }
@media only screen and (max-width: 1200px) { 
	.cnt-grid.style-3 { grid-template-columns: repeat(2, 1fr); }
} 
@media only screen and (max-width: 768px) { 
	.cnt-grid.style-3 { grid-template-columns: repeat(1, 1fr); }
} 
@media (min-width: 700px) and (max-width: 1024px) {
  .cnt-grid.style-3 { grid-template-columns: repeat(2, 1fr); grid-auto-rows: auto; }
}


/* 3 col */
.cnt-grid.style-5 { display: grid;	grid-template-columns: repeat(3, 1fr);gap: 1.4rem;width: 100%;margin: 0 auto 0 auto;	box-sizing: border-box;  }
@media only screen and (max-width: 1200px) { 
	.cnt-grid.style-5 { grid-template-columns: repeat(3, 1fr); }
} 
@media only screen and (max-width: 768px) { 
	.cnt-grid.style-5 { grid-template-columns: repeat(1, 1fr); }
} 





.banner-row5 .logo { width: 100% }

.button { text-decoration: none; padding: 40px 20px; text-align: center; }
.button,
.button:link { text-decoration: none;}

.button.w-icon { background-position: 16px center; background-repeat: no-repeat; background-size: 60px; padding: 40px 20px 40px 86px;}

/*
.banner-row5 .button.concern { background-color: #0093d8; }
.banner-row5 .button.w-icon.concern { background-image: url({site-template-path}/img/icons/icon-report-concern.png); }
.banner-row5 .button.members { background-color: #2f2d3b;  }
.banner-row5 .button.w-icon.members { background-image: url({site-template-path}/img/icons/icon-members-area.png); }
		   
.banner-row5 .button { display: block; float: none; width: auto; margin-top: 0; padding: 20px;}
.banner-row5 .button.w-icon { padding: 30px 20px 30px 86px; background-position: 10px center; text-align: left; }
*/
.banner-row5 .banner-button-wrap {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 1rem;
	width: 100%;
	margin: 0 auto 1rem auto;
	box-sizing: border-box; 
}
@media only screen and (max-width: 1250px) {
.banner-row5 .banner-button-wrap {
	grid-template-columns: repeat(1, 1fr);
}
}
@media only screen and (max-width: 768px) {
.banner-row5 .banner-button-wrap {
	grid-template-columns: repeat(2, 1fr);
}
}
@media only screen and (max-width: 450px) {
.banner-row5 .banner-button-wrap {
	grid-template-columns: repeat(1, 1fr);
}
}



/* News ticker
-------------------------------------------------- */

.ticker-wrapper { position: relative; margin-bottom: 20px; padding: 0; overflow: hidden; background-color: var(--ticker-bg-color); color: var(--ticker-txt-color); }

.ticker { position: relative; min-height: 48px; overflow: hidden;  }

.ticker-title { position: relative; z-index: 2; margin-right: 1rem; float: left; min-height: 48px; padding: 0 18px; display: flex; align-items: center; background-color: var(--ticker-title-bg-color); }
.ticker-title span { display: block; margin: 0; padding: 0; color: inherit; font-size: 1.2rem; font-weight: 600; line-height: 1.2; white-space: nowrap; }

.ticker-content { margin: 0; padding: 14px 18px; color: inherit; font-size: 1.2rem; line-height: 1.25; white-space: nowrap; }

.ticker-wrapper a,
.ticker-wrapper a:link,
.ticker-wrapper a:visited { color: inherit; text-decoration: none; }
.ticker-wrapper a:hover { text-decoration: underline; }
.ticker-wrapper a:focus-visible { outline: 2px solid currentColor; outline-offset: 3px; }

.ticker-swipe {
    pointer-events: none;
}

@media (max-width: 600px) {
    .ticker-title { padding-inline: 12px; }
    .ticker-content { padding-inline: 12px; }
}
