:root {
	--c-almost-black: #121212;
	--c-almost-white: #f8f4f0;
	
	--c-orange: #624e8b;
	--c-blue: #9578d2;
	--c-light-grey: #e8e8e8;
	--c-dark-grey: #59595b;
	--c-blue: #0171bb;
	--c-orange: #ff9e19;
	--c-dark-blue: #304064;
}



:root,
[data-theme="light"] {

	--body-bg-color: #fff;
	--body-color: #000;
	
	--content-bg-color: #fff;
	
	--link-color: #000;
	--link-hover-color: #000;
	
	--submit-border-radius: 0;
	--submit-bg: buttonface;
	--submit-txt: buttontext;
	--submit-border-color: #000;
	--submit-border-style: solid;
	--submit-border-width: 1px;
	
	--txt-resize-txt: #000;
	--txt-resize-focus-bg: #000;	
	--txt-resize-focus-txt: #fff;	
	
	--soc-icon-bg-color: transparent;
	
	--search-label-txt: #000;
	--search-filter-label-txt: #000;
	
	--skip-links-bg: #000;
	--skip-links-txt: #fff;
	
	--backissue-label-txt: #000;
	
	--panic-bg: #ecad3c;
	--panic-txt: #000;
	
	--fbox-border-radius: none;
	--fbox-bg-color: var(--c-almost-black);
	--fbox-title-color: var(--c-almost-white);
	--fbox-title-bg-color: inherit;
	--fbox-color: var(--c-almost-white);
	--fbox-link-color: inherit;
	--fbox-link-hover-color: inherit;

	--fbox-alt-bg-color: var(--c-almost-black);
	--fbox-alt-title-color: var(--c-amost-white);
	--fbox-alt-title-bg-color: inherit;
	--fbox-alt-color: var(--c-almost-white);
	--fbox-alt-link-color: inherit;
	--fbox-alt-link-hover-color: inherit;
	
	--button-bg-color: var(--c-blue);
	--button-txt-color:#000;
	--button-bg-color-hover:var(--c-blue);
	--button-txt-color-hover: #000;
	--button-border-width: 0;
	--button-border-style: solid;
	--button-border-color: #000;
	--button-border-radius: inherit;
	
	--main-nav-bg: var(--c-blue);
	--main-nav-link-txt: #fff;
	--main-nav-link-bg: inherit;
	--main-nav-active-bg: var(--c-orange);
	--main-nav-active-txt: #000;
	--main-nav-hamburger: #fff;
	--main-nav-selected-txt: #fff;
	--main-nav-selected-bg: var(--c-dark-blue);	
	--main-nav-drop-bg:  var(--c-blue); 
	--main-nav-drop-link-bg: transparent;
	--main-nav-drop-link-txt: #fff;
	--main-nav-drop-active-bg: var(--c-dark-blue);
	--main-nav-drop-active-txt: #fff;
	--main-nav-grid-col-width: 25%;
	
	--np-title-bg-color: var(--c-lobster);
	--np-link-title-color: #fff;
	--np-link-title-border-radius: 6px;
	
	--ss-caption-bg-color: rgba(0, 160, 176, 0.8);
	--ss-caption-txt-color: #000;
	
	--rc-border-radius: 0; 
	--rc-bg-color: inherit;
	--rc-heading-bg-color: #000;
	--rc-heading-txt-color: var(--c-orange); 
	--rc-heading-font-weight: 500; 
	--rc-link-bg-color: inherit;
	--rc-link-txt-color: #000;
	--rc-hover-bg-color: var(--c-orange);
	--rc-hover-txt-color: #000;	
	--rc-selected-bg-color: var(--c-dark-blue);
	--rc-selected-txt-color: #fff;
	--rc-selected-font-weight: 500;
	--rc-separator-border: 1px solid var(--c-dark-grey);
	
	--tc-txt-color: #fff;
	--tc-bg-color: var(--c-dark-blue);
	--tc-hover-bg-color: var(--c-orange);
	--tc-hover-txt-color: #000;

	--bu-bg-color: var(--c-blue);
	--bu-txt-color: #000;
	
	--cnt-issue-title-txt-color: var(--c-almost-black);
	--cnt-pub-date-txt-color: var(--c-almost-black);
	
	--lr-bg-color: var(--light-grey);
	
	--icon-button-bg-color: var(--c-blue);
	--icon-button-border-radius: 2rem;
	--icon-button-border: none;
	--icon-button-img-width: 35px;
	--icon-button-img-height: 35px;
	
	--ic-bg-color: var(--c-lobster);
	--ic-border-radius: inherit;
	--ic-caption-color: var(--c-all-white);
	--ic-link-color: var(--c-all-white);
	--ic-link-hover-color: var(--c-almost-white);
	--ic-alt-bg-color: var(--c-all-white);
	--ic-alt-link-color: var(--c-almost-black);
	--ic-alt-link-hover-color: var(--c-almost-black);
	--ic-alt-caption-color: var(--c-almost-black);
	--ic-tag-bg-color: var(--c-almost-black);
	--ic-tag-color: var(--c-all-white);
	--ic-tag-hover-color: var(--c-almost-black);
	--ic-tag-hover-bg-color: var(--c-all-white);
	
	--top-row-bg-color: #fff;
	--top-layoutrow-bg-color: inherit;
	--banner-row-bg-color: #fff;
	--banner-layoutrow-bg-color:inherit;
	--search-row-bg-color:#fff;
	--search-layoutrow-bg-color:inherit;
	--nav-row-bg-color:inherit;
	--nav-layoutrow-bg-color:inherit;
	--content-row-bg-color: inherit;
	--content-layoutrow-bg-color:inherit;
	--footer-row-bg-color:var(--c-blue);
	--footer-layoutrow-bg-color: inherit;
	--footer-txt-color: #fff;
	
	--cookie-bg-color: transparent;
	--cookie-txt-color: var(--c-almost-white);
	--cookie-link-color: var(--c-almost-white);
	--cookie-border: none;
	
	--p-bg-color: inherit;
	--p-txt-color: #000;
	--p-title-txt-color: #000;
	--p-title-bg-color: var(--c-orange);
	--p-graph-bg-color: #000;
	--p-graph-no-votes-color: #fff;
	--p-graph-txt-color: #fff;
	--p-border: 0;
	--p-border-radius: 0;	
	
	--nl-bg-color: #fff;
	--nl-txt-color: #000;
	--nl-summary-bg-color: inherit;
	--nl-summary-txt-color: #000;
	--nl-link-txt-color: inherit;
	--nl-link-txt-color-hover: inherit;
	--nl-title-txt-color: inherit;
	--nl-button-bg-color: #000;
	--nl-button-txt-color: #fff;	
	--nl-border: 1px solid black;

}


[data-theme="dark"] {
	/* --body-font-family: var(--font-sans-serif);*/
	--body-bg-color: #000;
	--body-color: var(--c-almost-white);
	
	--link-color: var(--c-light-blue);
	--link-hover-color: var(--c-light-blue);
	
	--submit-border-radius: 0;
	--submit-bg: buttonface;
	--submit-txt: buttontext;
	--submit-border-color: var(--c-almost-black);
	--submit-border-style: solid;
	--submit-border-width: 1px;
	
	--txt-resize-txt: inherit;
	--txt-resize-focus-bg: var(--c-almost-white);	
	--txt-resize-focus-txt: var(--c-almost-white);	
	
	--soc-icon-bg-color: var(--c-almost-white);
	
	--search-label-txt: #000;
	--search-filter-label-txt: #000;
	
	--skip-links-bg: #000;
	--skip-links-txt: #fff;
	
	--backissue-label-txt: #000;
	
	--panic-bg: #ecad3c;
	--panic-txt: #000;
	
	--fbox-border-radius: 1rem;
	--fbox-bg-color: var(--c-almost-black);
	--fbox-title-color: var(--c-almost-white);
	--fbox-title-bg-color: inherit;
	--fbox-color: var(--c-almost-white);
	--fbox-link-color: inherit;
	--fbox-link-hover-color: inherit;
	
	--button-bg-color: var(--c-almost-black);
	--button-txt-color:var(--c-almost-white);
	--button-bg-color-hover: var(--c-almost-black);
	--button-txt-color-hover: #fff;
	--button-border-width: 0;
	--button-border-style: solid;
	--button-border-color: #000;
	--button-border-radius: 0;
	
	--main-nav-bg: var(--c-almost-black);
	--main-nav-link-txt: #fff;
	--main-nav-link-bg: inherit;
	--main-nav-active-bg: var(--c-dark-grey);
	--main-nav-active-txt: var(--c-almost-white);
	--main-nav-hamburger: var(--c-almost-white);
	--main-nav-selected-txt: #000;
	--main-nav-selected-bg: var(--c-almost-white);	
	--main-nav-drop-bg:  var(--c-almost-black); 
	--main-nav-drop-link-bg: transparent;
	--main-nav-drop-link-txt: #fff;
	--main-nav-drop-active-bg: var(--c-light-grey);
	--main-nav-drop-active-txt: #000;
	--main-nav-grid-col-width: 25%;
	
	--np-title-bg-color: var(--c-almost-black);
	--np-link-title-color: #fff;
	--np-link-title-border-radius: 6px;
	
	--rc-border-radius: 0; 
	--rc-bg-color: var(--c-almost-black);
	--rc-heading-bg-color: inherit;
	--rc-heading-txt-color: #fff; 
	--rc-heading-font-weight: 500; 
	--rc-link-bg-color: var(--light-grey);
	--rc-link-txt-color: #fff;
	--rc-hover-bg-color: var(--c-light-grey);
	--rc-hover-txt-color: #000;	
	--rc-selected-bg-color: var(--c-almost-white);
	--rc-selected-txt-color: #000;
	--rc-separator-border: 1px solid var(--c-dark-grey);
	
	--bu-bg-color: var(--c-almost-black);
	--bu-txt-color: #fff;
	
	--cnt-issue-title-txt-color: #000;
	--cnt-pub-date-txt-color: #000;
	
	--lr-bg-color: var(--light-grey);
	
	--icon-button-bg-color: var(--dark-grey);
	--icon-button-border-radius: 2rem;
	--icon-button-border: none;
	--icon-button-img-width: 35px;
	--icon-button-img-height: 35px;
	
	--ic-bg-color: var(--c-almost-black);
	--ic-border-radius:inherit;
	--ic-caption-color: var(--c-almost-white);
	--ic-link-color: var(--c-almost-white);
	--ic-link-hover-color: var(--c-almost-white);
	--ic-alt-bg-color: #fff;
	--ic-alt-link-color: var(--c-almost-black);
	--ic-alt-link-hover-color: var(--c-almost-black);
	--ic-alt-caption-color: var(--c-almost-black);
	--ic-tag-bg-color: var(--c-almost-black);
	--ic-tag-color: var(--c-almost-white);
	--ic-tag-hover-color: var(--c-almost-black);
	--ic-tag-hover-bg-color: var(--c-almost-white);
	
	--top-row-bg-color: inherit;
	--top-layoutrow-bg-color: inherit;
	--banner-row-bg-color: #000;
	--banner-layoutrow-bg-color:inherit;
	--search-row-bg-color:inherit;
	--search-layoutrow-bg-color:inherit;
	--nav-row-bg-color:inherit;
	--nav-layoutrow-bg-color:inherit;
	--content-row-bg-color: inherit;
	--content-layoutrow-bg-color:inherit;
	--footer-row-bg-color:inherit;
	--footer-layoutrow-bg-color: inherit;
	
	--cookie-bg-color: #fff;
	--cookie-txt-color: var(--c-almost-white);
	--cookie-link-color: var(--c-almost-white);
	--cookie-border: none;
	
	--ss-caption-bg-color: rgba(255, 255, 255, 0.8);
	--ss-caption-txt-color: #000;
	
	--p-bg-color: var(--c-almost-black);
	--p-txt-color: #fff;
	--p-title-txt-color: #fff;
	--p-title-bg-color: inherit;
	--p-graph-bg-color: var(--c-dark-grey);
	--p-graph-txt-color: #fff;
	--p-graph-no-votes-color: #fff;
	--p-border: 0;
	--p-border-radius: 0;	
	
	--nl-bg-color: var(--c-dark-grey);
	--nl-txt-color: white;
	--nl-summary-bg-color: transparent;
	--nl-summary-txt-color: inherit;
	--nl-link-txt-color: inherit;
	--nl-link-txt-color-hover: inherit;
	--nl-title-txt-color: inherit;
	--nl-button-bg-color: var(--c-almost-white);
	--nl-button-txt-color: black;

}

[data-theme="hcdark"] {
	--c-almost-black: #121212;
	--c-almost-white: #fAf9f6;
	--dark-grey: #404040;
	--light-grey: #d7d7d7;
	
	/* --body-font-family: var(--font-sans-serif);*/
	--body-bg-color: #000;
	--body-color: var(--c-almost-white);
	
	--link-color: var(--c-almost-white);
	--link-hover-color: var(--c-almost-white);
	
	--content-bg-color: var(--c-almost-black);
	--submit-border-radius: 0;
	--submit-bg: buttonface;
	--submit-txt: buttontext;
	--submit-border-color: var(--c-almost-black);
	--submit-border-style: solid;
	--submit-border-width: 1px;
	
	--txt-resize-txt: #fff;
	--txt-resize-focus-bg: #fff;	
	--txt-resize-focus-txt: #fff;	
	
	--soc-icon-bg-color: var(--c-almost-white);
	
	--search-label-txt: #fff;
	--search-filter-label-txt: #fff;
	
	--skip-links-bg: #000;
	--skip-links-txt: #fff;
	
	--backissue-label-txt: #fff;
	
	--panic-bg: #ecad3c;
	--panic-txt: #000;
	
	--fbox-border-radius: 1rem;
	--fbox-bg-color: var(--c-almost-black);
	--fbox-title-color: var(--c-almost-white);
	--fbox-title-bg-color: inherit;
	--fbox-color: var(--c-almost-white);
	--fbox-link-color: inherit;
	--fbox-link-hover-color: inherit;
	
	--button-bg-color: var(--c-almost-black);
	--button-txt-color:var(--c-almost-white);
	--button-bg-color-hover: var(--c-almost-black);
	--button-txt-color-hover: #fff;
	--button-border-width: 0;
	--button-border-style: solid;
	--button-border-color: #000;
	--button-border-radius: 0;
	
	--main-nav-bg: var(--c-almost-black);
	--main-nav-link-txt: #fff;
	--main-nav-link-bg: inherit;
	--main-nav-active-bg: var(--c-dark-grey);
	--main-nav-active-txt: var(--c-almost-white);
	--main-nav-hamburger: var(--c-almost-white);
	--main-nav-selected-txt: #000;
	--main-nav-selected-bg: var(--c-almost-white);	
	--main-nav-drop-bg:  var(--c-almost-black); 
	--main-nav-drop-link-bg: transparent;
	--main-nav-drop-link-txt: #fff;
	--main-nav-drop-active-bg: var(--c-light-grey);
	--main-nav-drop-active-txt: #000;
	--main-nav-grid-col-width: 25%;
	
	--np-title-bg-color: var(--c-almost-black);
	--np-link-title-color: #fff;
	--np-link-title-border-radius: 6px;
	
	--rc-border-radius: 0; 
	--rc-bg-color: var(--c-almost-black);
	--rc-heading-bg-color: inherit;
	--rc-heading-txt-color: #fff; 
	--rc-heading-font-weight: 500; 
	--rc-link-bg-color: var(--c-almost-black);
	--rc-link-txt-color: #fff;
	--rc-hover-bg-color: #000;
	--rc-hover-txt-color: #fff;	
	--rc-selected-bg-color: var(--light-grey);
	--rc-selected-txt-color: #000;
	--rc-separator-border: 1px solid var(--dark-grey);
	
	--bu-bg-color: var(--c-almost-black);
	--bu-txt-color: #fff;
	
	--cnt-issue-title-txt-color: var(--c-almost-white);
	--cnt-pub-date-txt-color: var(--c-almost-white);
	
	--lr-bg-color: var(--c-almost-black);
	
	--icon-button-bg-color: var(--c-almost-black);
	--icon-button-border-radius: 2rem;
	--icon-button-border: none;
	--icon-button-img-width: 35px;
	--icon-button-img-height: 35px;
	
	--ic-bg-color: var(--c-almost-black);
	--ic-border-radius: 1rem;
	--ic-caption-color: var(--c-almost-white);
	--ic-link-color: var(--c-almost-white);
	--ic-link-hover-color: var(--c-almost-white);
	--ic-alt-bg-color: var(--c-almost-black);
	--ic-alt-link-color: var(--c-almost-white);
	--ic-alt-link-hover-color: var(--c-almost-white);
	--ic-alt-caption-color: var(--c-almost-white);
	--ic-tag-bg-color: var(--c-almost-black);
	--ic-tag-color: var(--c-almost-white);
	--ic-tag-hover-color: var(--c-almost-black);
	--ic-tag-hover-bg-color: var(--c-almost-white);
	
	--top-row-bg-color: var(--c-almost-black);
	--top-layoutrow-bg-color: inherit;
	--banner-row-bg-color: #000;
	--banner-layoutrow-bg-color:inherit;
	--search-row-bg-color:#000;
	--search-layoutrow-bg-color:inherit;
	--nav-row-bg-color:var(--c-almost-black);
	--nav-layoutrow-bg-color:inherit;
	--content-row-bg-color: inherit;
	--content-layoutrow-bg-color:inherit;
	--footer-row-bg-color:inherit;
	--footer-layoutrow-bg-color: inherit;
	
	--cookie-bg-color: #000;
	--cookie-txt-color: var(--c-almost-white);
	--cookie-link-color: var(--c-almost-white);
	--cookie-border: none;
	
	--ss-caption-bg-color: #000;
	--ss-caption-txt-color: #fff;
	
	--nl-bg-color: var(--c-dark-grey);
	--nl-txt-color: white;
	--nl-summary-bg-color: transparent;
	--nl-summary-txt-color: inherit;
	--nl-link-txt-color: inherit;
	--nl-link-txt-color-hover: inherit;
	--nl-title-txt-color: inherit;
	--nl-button-bg-color: #000;
	--nl-button-txt-color: #fff;	
	--nl-border: 1px solid black;	
	
	--p-bg-color: var(--c-almost-black);
	--p-txt-color: #fff;
	--p-title-txt-color: #fff;
	--p-title-bg-color: inherit;
	--p-graph-bg-color: var(--c-dark-grey);
	--p-graph-txt-color: #fff;
	--p-graph-no-votes-color: #fff;
	--p-border: 0;
	--p-border-radius: 0;		
	
}
[data-theme="hclight"] {
	--c-almost-black: #121212;
	--c-almost-white: #fAf9f6;
	--dark-grey: #404040;
	--light-grey: #d7d7d7;
	
	/* --body-font-family: var(--font-sans-serif);*/
	--body-bg-color: var(--c-almost-white);
	--body-color: var(--c-almost-black);
	
	--link-color: var(--c-almost-black);
	--link-hover-color: var(--c-almost-black);
	
	--content-bg-color: var(--c-almost-white);
	--submit-border-radius: 0;
	--submit-bg: buttonface;
	--submit-txt: buttontext;
	--submit-border-color: var(--c-almost-black);
	--submit-border-style: solid;
	--submit-border-width: 1px;
	
	--txt-resize-txt: #000;
	--txt-resize-focus-bg: #000;	
	--txt-resize-focus-txt: #000;	
	
	--soc-icon-bg-color: transparent;
	
	--search-label-txt: #000;
	--search-filter-label-txt: #000;
	
	--skip-links-bg: #000;
	--skip-links-txt: #fff;
	
	--backissue-label-txt: #000;
	
	--panic-bg: #ecad3c;
	--panic-txt: #000;
	
	--fbox-border-radius: 1rem;
	--fbox-bg-color: var(--c-almost-white);
	--fbox-title-color: var(--c-almost-black);
	--fbox-title-bg-color: inherit;
	--fbox-color: var(--c-almost-black);
	--fbox-link-color: inherit;
	--fbox-link-hover-color: inherit;
	
	--button-bg-color: var(--c-almost-black);
	--button-txt-color:var(--c-almost-white);
	--button-bg-color-hover: var(--c-almost-black);
	--button-txt-color-hover: #fff;
	--button-border-width: 0;
	--button-border-style: solid;
	--button-border-color: #000;
	--button-border-radius: 0;
	
	--main-nav-bg: var(--c-almost-white);
	--main-nav-link-txt: #000;
	--main-nav-link-bg: inherit;
	--main-nav-active-bg: var(--c-light-grey);
	--main-nav-active-txt: #000;
	--main-nav-hamburger: #000;
	--main-nav-selected-txt: #000;
	--main-nav-selected-bg: var(--c-almost-white);	
	--main-nav-drop-bg:  var(--c-almost-white); 
	--main-nav-drop-link-bg: transparent;
	--main-nav-drop-link-txt: #000;
	--main-nav-drop-active-bg: var(--c-light-grey);
	--main-nav-drop-active-txt: #000;
	--main-nav-grid-col-width: 25%;
	
	--p-bg-color: var(--c-almost-white);
	--p-txt-color: #000;
	--p-title-txt-color: #fff;
	--p-title-bg-color: var(--c-almost-black);
	--p-graph-bg-color: var(--c-dark-grey);
	--p-graph-txt-color: #fff;
	--p-graph-no-votes-color: #000;
	--p-border: 0;
	--p-border-radius: 0;		
	
	--np-title-bg-color: var(--c-almost-black);
	--np-link-title-color: #fff;
	--np-link-title-border-radius: 6px;
	
	--rc-border-radius: 0; 
	--rc-bg-color: var(--c-almost-white);
	--rc-heading-bg-color: var(--c-almost-black);
	--rc-heading-txt-color: #fff; 
	--rc-heading-font-weight: 500; 
	--rc-link-bg-color: #var(--c-almost-white);
	--rc-link-txt-color: #000;
	--rc-hover-bg-color: #000;
	--rc-hover-txt-color: #fff;	
	--rc-selected-bg-color: var(--light-grey);
	--rc-selected-txt-color: #000;
	
	--bu-bg-color: var(--c-almost-white);
	--bu-txt-color: #000;
	
	--cnt-issue-title-txt-color: var(--c-almost-white);
	--cnt-pub-date-txt-color: var(--c-almost-white);
	
	--lr-bg-color: var(--c-almost-white);
	
	--icon-button-bg-color: var(--c-almost-black);
	--icon-button-border-radius: 2rem;
	--icon-button-border: none;
	--icon-button-img-width: 35px;
	--icon-button-img-height: 35px;
	
	--ic-bg-color: var(--c-almost-white);
	--ic-border-radius: 1rem;
	--ic-caption-color: var(--c-almost-black);
	--ic-link-color: #000;
	--ic-link-hover-color: #000;
	--ic-alt-bg-color: var(--c-almost-white);
	--ic-alt-link-color: #000;
	--ic-alt-link-hover-color: #000;
	--ic-alt-caption-color: var(--c-almost-black);
	--ic-tag-bg-color: var(--c-almost-white);
	--ic-tag-color: var(--c-almost-black);
	--ic-tag-hover-color: var(--c-almost-white);
	--ic-tag-hover-bg-color: var(--c-almost-black);
	
	--top-row-bg-color: var(--c-almost-white);
	--top-layoutrow-bg-color: inherit;
	--banner-row-bg-color: var(--c-almost-white);
	--banner-layoutrow-bg-color:inherit;
	--search-row-bg-color:var(--c-almost-white);
	--search-layoutrow-bg-color:inherit;
	--nav-row-bg-color:var(--c-almost-white);
	--nav-layoutrow-bg-color:inherit;
	--content-row-bg-color: inherit;
	--content-layoutrow-bg-color:inherit;
	--footer-row-bg-color:inherit;
	--footer-layoutrow-bg-color: var(--c-almost-white);
	
	--cookie-bg-color: var(--c-almost-white);
	--cookie-txt-color: var(--c-almost-white);
	--cookie-link-color: var(--c-almost-white);
	--cookie-border: none;
	
	--ss-caption-bg-color: #fff;
	--ss-caption-txt-color: #000;
	
	--nl-bg-color: var(--c-almost-white);
	--nl-txt-color: black;
	--nl-summary-bg-color: transparent;
	--nl-summary-txt-color: inherit;
	--nl-link-txt-color: inherit;
	--nl-link-txt-color-hover: inherit;
	--nl-title-txt-color: inherit;
	--nl-button-bg-color: #fff;
	--nl-button-txt-color: black;	
	--nl-border: 1px solid black;	
}


.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)}
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)
    }
}	
*/

.site-title { font-size: calc(1rem + 1.5vw); font-weight: bold; color: var(--c-orange)}
.site-title .site-sub-title { color: var(--c-blue); display: block}

.carousel-row  div.title { text-align: center; margin-bottom: 1.2rem; font-size: 1.5rem; }

.banner {  background-color: var(--banner-row-bg-color) } 
.banner .layout-wrap { background-color: var(--banner-layoutrow-bg-color); padding: 0 } 

.banner-logo-wrap a { display: grid;grid-template-columns: 22% 78%; align-items: center; text-decoration: none}
.banner .logo { max-width: 100%; width: 100% }

@media only screen and (max-width: 768px) {
.banner-logo-wrap a { grid-template-columns: repeat(1, 1fr); grid-gap: 0; }
.banner .logo:first-child { max-width: 100%; width: 20%;  }
}

.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-row5 .logo { width: 100% }
.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(1, 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);
}
}


.social-wrap { margin-left: 1rem;}
.social-wrap a { display: inline-block; background-color: var(--soc-icon-bg-color); margin-right: 3px;  }


.back-up-row { background-color: var(--bu-bg-color); margin-top: 3rem }
.back-up-row .layout-wrap { text-align: center;}
.back-up a { color: var(--bu-txt-color); text-decoration: none; padding: 4em 0 1.5em;  position: relative; display:inline-block}
.back-up a:before { background-image: url(../img/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="hclight"],
[data-theme="light"] {
	.back-up a:before {	background-image: url(../img/icons-back-to-top-dark.png); }
}
[data-theme="hcdark"],
[data-theme="dark"] {
	.back-up a:before {	background-image: url(../img/icons-back-to-top-light.png); }
}


.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) }
.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-txt-color); text-decoration: none;}


/* content specific */

.issue-title { color: var(--cnt-issue-title-txt-color); font-size: 1.65rem }
.pub-date { display: block; margin: 1rem 0; color: var(--cnt-pub-date-txt-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-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: 1.25rem;}
.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 }


/* font resize elements */

#font-resize-wrap { display: inline-block; color: var(--txt-resize-txt); width: 10rem;display: flex; gap: 0;justify-content: center;flex-wrap: wrap;}
.font-resize_label-wrap { display: flex; justify-content:center; margin-bottom: 0.5rem }
.font-resize_label-wrap .font-resize_label { text-align: center;display: flex;justify-content: center;align-items: center;color: var(--txt-resize-txt);height: 100%;width: 100%;font-weight: normal;font-size: 0.9em;}
.font-resize-control {display: flex;justify-content: center;align-items: center;align-items: flex-end;height: 2rem;transition: visibility 0s, opacity 0.5s linear;}
.font-resize-control { display:none; }
.font-resize_up.font-resize_up,
.font-resize_down.font-resize_down {
  padding-bottom: 0.3em; background: none;border: solid 1px var(--txt-resize-txt);color: var(--txt-resize-txt);height: 1.2em;width: 1.2em;border-radius: 100%;display: flex;align-items: center;justify-content: center;text-decoration: none;transition: 0.2s;font-size: 1.6em;
}
.font-resize_up.font-resize_up:hover,
.font-resize_down.font-resize_down:hover,
.font-resize_up.font-resize_up:focus,
.font-resize_down.font-resize_down:focus { background: var(--txt-resize-focus-bg);  color: var(--txt-resize-focus-txt);}
.font-resize_scale { padding: 0.325em 0; margin: 0 0.625em; }


.panic { position: fixed; top: 0; left: 0; z-index: 100000; overflow: hidden; }
.panic a,.panic .panic a:link, .panic a:hover .panic a:active { background-color: var(--panic-bg); display: block; padding: 0.375rem 0.625rem; font-weight: bold; color: var(--panic-txt) !important; }

.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;}
.breadcrumb-list li:last-child:after {content: ""; }
.breadcrumb-list li a,
.breadcrumb-list li a:link { color: #404040; }
.breadcrumb-list li a:hover { color: #404040; }
.breadcrumb-list li a:active { color: #404040; }


.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); color: var(--button-txt-color-hover);}



.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 }

.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; }

@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) }

.home #mainNavigation > ul > li.home-link {color: var(--main-nav-selected-txt); background-color:var(--main-nav-selected-bg)  }
#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;}

/*
#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}

div.content p img { max-width: 100%; height: auto;}


.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 li { display: inline-block; padding: 0.3125rem; }
    .tag-alpha-list li a {display: block;border-radius: 1rem;padding: 0.3125rem;text-transform: uppercase;text-align: center;width: 1.25rem;background: #bfbfbf;color: #fff;}

.tag-entry-list { margin: 2rem 0;}

.all-tags-wrap { border-radius: 1rem; overflow: hidden; background-color: #fff;}
.all-tags-wrap h2 { font-size: 1rem; color: #fff; font-weight: normal; background-color: var(--c-dark-grey);padding: 1rem;  }
.all-tags-wrap ul { display: flex; gap: 0.6rem; margin: 1rem 0;    flex-wrap: wrap; justify-content: center;}
.all-tags-wrap li.selected a {  background-color: var(--c-dark-grey); color: #fff; }
.all-tags-wrap li a { color: #fff; text-decoration: none; margin: 0; display: block; padding: 0.6rem 1rem;background-color: var(--c-dark-grey);}
.all-tags-wrap li a:hover,.see-also-list li a:active,.see-also-list li a:focus {  }
.tag-entry-list li { margin: 1rem 0}		  

.feature-box { border-radius: var(--fbox-border-radius); background-color: var(--fbox-bg-color); color: var(--fbox-color); padding: 0; margin-block-end: 2rem; overflow: hidden;}
.feature-box .title { font-size: 1rem; margin: 0 0 1rem 0; padding: 1rem; color: var(--fbox-title-color); background: var(--fbox-title-bg-color);}
.feature-box .content { margin: 0; padding: 0 1rem 1rem 1rem; color: var(--fbox-color); }
.feature-box img { max-width: 100%; height: auto;}
.feature-box a { color: var(--fbox-link-color); }
.feature-box a:hover, .feature-box a:active, .feature-box a:focus { color: var(--fbox-link-hover-color); }

.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: 600px; overflow: hidden;}
.slideshow-container .slide { display: none; height: 100%;}
.slideshow-container .prev, .slideshow-container .next { cursor: pointer; position: absolute; top: 50%; width: auto; margin-top: -22px; padding: 16px; color: white; 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: rgba(0,0,0,0.8); }
.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 { background-color: var(--ss-caption-bg-color); color: var(--ss-caption-txt-color); overflow: hidden;position: absolute;top: 20%;left: 10%;padding: 2rem;max-width: 40%; }
@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 > * { color: var(--ss-caption-txt-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} }


.toggle-cross { cursor: pointer; color: var(--tc-txt-color); padding: 8px; 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: 1em;}
.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;}

#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;}

.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/icon-poll-light.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;}


.latest-news-row { background-color: #f6f6f6 !important}
.latest-news-wrap .all-news {text-align: center; margin: 2rem 0 0 0}


.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: bold; 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;}


.news-list .card { background-color: var(--nl-bg-color); color: var(--nl-txt-color) } 
.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);  }

@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 { color: #fff; 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/icon-report-concern.png); }
.banner-row5 .button.members { background-color: #2f2d3b;  }
.banner-row5 .button.w-icon.members { background-image: url({site-template-path}/img/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(1, 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);
}