[data-theme="light"],
[data-theme="dark"] {

	--c-light-blue: #2b75bc;
	--c-dark-blue: #143757;
	--c-green: #88b540;
	--c-light-grey: #e8e8e8;
	--c-dark-grey: #59595b;
	
	--body-bg-color: var(--c-light-grey);

	--link-color: var(--c-dark-blue);
	--link-hover-color: var(--c-light-blue);


	--skip-links-bg: #000;
	--skip-links-txt: #fff;
 
	--button-bg-color: var(--dark-grey);
	--button-txt-color:#fff;
	--button-bg-color-hover: var(--dark-grey);
	--button-txt-color-hover: #fff;
	--button-border-width: 0;
	--button-border-style: solid;
	--button-border-color: #000;
	--button-border-radius: 10px;
 
	--main-nav-bg: var(--c-light-blue);
	--main-nav-txt: #fff;
	--main-nav-active-bg: var(--c-dark-blue);
	--main-nav-active-txt: #fff;
	--main-nav-drop-bg:  var(--c-light-grey);
	--main-nav-drop-active-bg: var(--c-dark-grey);
	--main-nav-drop-active-txt: #fff;
	--main-nav-hamburger: #fff;
	--main-nav-selected-txt: #fff;
	--main-nav-selected-bg: var(--c-dark-blue);
	
	--rc-border-radius: 1rem; 
	--rc-bg-color: var(--c-light-blue);
	--rc-heading-bg-color: var(--dark-grey);
	--rc-heading-txt-color: #fff; 
	--rc-heading-font-weight: 500; 
	--rc-link-bg-color: var(--c-light-blue);
	--rc-link-txt-color: #fff;
	--rc-hover-bg-color: var(--c-dark-blue);
	--rc-hover-txt-color: #fff;	
	--rc-selected-bg-color: var(--c-dark-blue);
	--rc-selected-txt-color: #fff;
	
	--ic-bg-color: #fff;
	--ic-border-radius: 1rem;
	--ic-caption-color: var(--c-light-blue);
	--ic-link-color: var(--c-light-blue);
	--ic-link-hover-color: var(--c-light-blue);
	--ic-alt-bg-color: inherit;
	--ic-alt-link-color: inherit;
	--ic-alt-link-hover-color: inherit;
	--ic-alt-caption-color: inherit;
	--ic-tag-bg-color: var(--c-dark-grey);
	--ic-tag-color: #fff;
	--ic-tag-hover-bg-color: var(--c-dark-grey);	
	--ic-tag-hover-color: #fff;
	
	--np-title-bg-color: var(--c-light-blue);
	--np-link-title-color: #fff;
	--np-link-title-border-radius: 6px;
	
	--bu-bg-color: var(--c-light-blue);
	--bu-txt-color: #fff;
	
	--cnt-issue-title-txt-color: var(--c-green);
	--cnt-pub-date-txt-color: var(--c-light-blue);
	
	--lr-bg-color: var(--c-green);
	
	--fbox-border-radius: 1rem;
	--fbox-bg-color: var(--c-light-blue);
	--fbox-title-color: #fff;
	--fbox-title-bg-color: var(--c-dark-blue);
	--fbox-color: #fff;
	--fbox-link-color: #fff;
	--fbox-link-hover-color: #fff;
	
	--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:var(--c-light-blue);
	--nav-layoutrow-bg-color:inherit;
	
	--icon-button-bg-color: var(--c-green);
	--icon-button-border-radius: 2rem;
	--icon-button-border: none;
	--icon-button-img-width: 35px;
	--icon-button-img-height: 35px;
	
	--content-bg-color: #fff;
	
	--cookie-bg-color: #fff;
	--cookie-txt-color: var(--off-white);
	--cookie-link-color: var(--off-white);
	--cookie-border: none;
	
	--p-bg-color: transparent;
	--p-txt-color: #000;
	--p-title-txt-color: #fff;
	--p-title-bg-color: var(--c-green);
	--p-graph-bg-color: #fff;
	--p-graph-txt-color: #000;
	--p-border: 1px solid var(--c-green);	
	--p-border-radius: 1rem;	
	
	--slide-caption-color: #fff;
	
}
[data-theme="dark"] {
	.content-wrap { background-color: var(--off-black); padding: 1.25rem; border-radius: 1rem; overflow: hidden;}
	
	--link-color: var(--c-green);
	--link-hover-color: #fff;
	
	--cnt-pub-date-txt-color: var(--c-green);;

	
	--body-bg-color: #000;
	--top-row-bg-color: var(--off-black);
	--top-layoutrow-bg-color: inherit;
	--banner-row-bg-color: var(--off-black);
	--banner-layoutrow-bg-color:inherit;
	--search-row-bg-color:var(--off-black);

	body { color: var(--off-white)}
	--cookie-bg-color: #000;
	--cookie-txt-color: var(--off-white);
	--cookie-link-color: var(--off-white);
	--cookie-border: none;
	
	--slide-caption-color: #fff;;
}

#google_translate_element {
    float: right;
    margin-left: 10px;
    margin-top: 4px;
}

.fBox1 { --fbox-bg-color: var(--c-green); --fbox-title-bg-color: var(--c-dark-grey); }

.content-wrap { background-color: var(--content-bg-color); padding: 1.25rem; border-radius: 1rem; overflow: hidden;}

.social-wrap { width: 22.5rem }
footer .social-wrap { margin-top: 2rem }
.welsh-eng { background-color: var(--c-green); padding: 0.3rem; color: #fff; text-decoration: none; margin-right: 0.5rem }
.welsh-eng:hover, .welsh-eng:active, .welsh-eng:focus { color: #fff }

.did-you-know .content p img { margin-right: 1rem; border-radius: 0.8rem}


.home .feature-box { background-color: var(--fbox-bg-color); margin-bottom: 0}
.home .feature-box .content { padding: 0;}
.home .feature-box .caption { padding-top: 0;}
.home .feature-box .caption .pub-date { margin-block-start: 0; color: var(--fbox-color)}
.home .feature-box .caption a { color: var(--fbox-link-color); text-decoration: none;}

.home .feature-box .caption a:before {
    bottom: 0;
    content: "";
    cursor: pointer;
    left: 0;
    padding: 20px;
    position: absolute;
    right: 0;
    top: 0;
    z-index: 1;
}
div.content p img {
    max-width: 100%;
    height: auto;
    margin-right: 10px;
}


.home .issue-wrap .feature-box { background-color: #fff; }
.home .issue-wrap .feature-box .caption a {color: var(--light-blue); ; }
