:root {
	--primaryColor: #205e52;
	--primaryRGBA: rgba(32, 94, 82, .7);
	--primaryColorHover: #153d36;
	--headerBackground: rgba(255, 255, 255, .8);
	--headerBarLinks: #fff;
	--headerBarLinksHover: #205e52;
	--navBarBackground: #205e52;
	--navBarLinks: #fff;
	--navBarLinksHover: #153d36;
	--footerBackground: #1b1b1b;
	--footerHeaders: #fff;
	--footerLinks: #fff;
	--footerLinksHover: #ae6219;
}

/* Primary Colors */

a {
	color: var(--primaryColor);
}

a:hover, a:focus {
	--primaryColor: var(--primaryColorHover);
}

a:focus, input:focus {
	outline-color: var(--primaryColor);
}

hr {
	background-color: var(--primaryColor);
}

.cis-icon {
	color: var(--primaryColor);
}

#side-nav .side-nav-header {
	color: var(--primaryColor);
}

#promo-top .promo {
	color: var(--primaryColor);
}

#promo-top .promo::after {
	background-color: var(--primaryColor);
}

.btn-troon, .btn-template, .btn-primary {
	background-color: var(--primaryColor);
}

.btn-troon:hover, .btn-template:hover, .btn-primary:hover,
.btn-troon:focus, .btn-template:focus, .btn-primary:focus {
	--primaryColor: var(--primaryHover);
}

.portfolio-shuffle a:hover, .portfolio-shuffle a:focus {
	color: var(--primaryColorHover);
}

.portfolio-shuffle a.active {
	color: var(--primarycolor);
}

a.modaal.gallery:hover figure::after,
a.modaal.gallery:focus figure::after {
	background-color: var(--primaryRGBA);
}

/* Body Layout Colors */

#nav-stick.header-affix {
	background-color: var(--headerBackground);
}

#nav-contact a {
	color: var(--headerBarLinks);
}

#nav-contact a:hover,
#nav-contact a:focus {
	--headerBarLinks: var(--headerBarLinksHover);
}

.menu-icon {
	background-color: var(--headerBarLinks);
}

#lateral-nav {
	background-color: var(--navBarBackground);
}

.trn-nav-link {
	color: var(--navBarLinks);
}

.trn-nav-link:hover,
.trn-nav-link:focus {
	--navBarLinks: var(--navBarLinksHover);
	outline-color: var(--navBarLinks);
}

#footer {
	color: var(--footerHeaders);
	background-color: var(--footerBackground);

}

#footer a {
	color: var(--footerLinks);
}

#footer a:hover,
#footer a:focus {
	--footerLinks: var(--footerLinksHover);
}