
/* for variables primary css  */
:root {
	 font-size:62.5%; /*  62.5/100 * 16px = 10px */


	 --color--black-00:hsl(0 0% 0%);		/* #000000	Black */
	 --color--DM-black:hsl(207 33.3% 6.5%); /* #0b1116 */

	 --color--white-01:hsl(0 0% 100%);	/* #ffffff;	White */

	 --color--THS-primary-background:hsl(0 0% 99.2%); /* #fdfdfd */
	 --color--THS-primary-foreground:var(--color--black-00);

	 /*Tints of #0b1116 (Dark Mode Black)*/
	--color--DM-black-tint-9:#23282D;
	--color--DM-black-tint-8:#3B4044;
	--color--DM-black-tint-7:#54585B;
	--color--DM-black-tint-6:#6C7073;
	--color--DM-black-tint-5:#85888A;
	--color--DM-black-tint-4:#9D9FA1;
	--color--DM-black-tint-3:#B5B7B9;
	--color--DM-black-tint-2:#CECFD0;
	--color--DM-black-tint-1:#E6E7E7;
	--color--DM-black-tint-0:#FFFFFF;


	 /* dark green ths logo  */

	--color--THS-green-900:hsl(144 66.7% 11.8%); /* #0a321a P */
	--color--THS-green-800:hsl(149 56.7% 19%); /* #154c30 */
	--color--THS-green-700:hsl(150 52.9% 23.3%); /* #1c5b3c */
	--color--THS-green-600:hsl(152 52.5% 27.3%); /* #216a48 */
	--color--THS-green-500:hsl(152 51.3% 30.6%); /* #267651 */
	--color--THS-green-400:hsl(154 42% 37.8%); /* #388966 */
	--color--THS-green-300:hsl(154 30.5% 46.9%); /* #539c7c */
	--color--THS-green-200:hsl(153 28.3% 61.2%); /* #80b89f */
	--color--THS-green-100:hsl(153 29.5% 76.1%); /* #b0d4c4 */
	--color--THS-green-050:hsl(157 32% 90.2%); /* #deeee8 */

	--color--THS-purple-900:hsl(324 66.7% 11.8%); /* #320a22 P */
	--color--THS-purple-800:hsl(329 50.6% 17.5%); /* #43162d */
	--color--THS-purple-700:hsl(333 44.8% 22.7%); /* #542037 */
	--color--THS-purple-600:hsl(336 39.9% 28%); /* #642b42 */
	--color--THS-purple-500:hsl(336 37.9% 31.6%); /* #6f324a */
	--color--THS-purple-400:hsl(339 26.2% 42%); /* #874f63 */
	--color--THS-purple-300:hsl(340 21% 52.4%); /* #9f6c7d */
	--color--THS-purple-200:hsl(340 26.3% 66.5%); /* #c093a2 */
	--color--THS-purple-100:hsl(342 41.7% 81.2%); /* #e3bbc7 */
	--color--THS-purple-050:hsl(348 100% 93.9%); /* #ffe0e6 */




	--color--THS-blue-900:hsl(211 31% 33.5%);	/* #3b5570 */
	--color--THS-blue-800:hsl(206 33.9% 43.3%);	/* #497394 */
	--color--THS-blue-700:hsl(204 36% 48.4%);	/* #4f84a8 */
	--color--THS-blue-600:hsl(203 42.5% 54.3%);	/* #5996bc */
	--color--THS-blue-500:hsl(201 49.1% 58.4%);	/* #61a4c9 */
	--color--THS-blue-400:hsl(198 53.1% 61.6%);	/* #69b1d1 */
	--color--THS-blue-300:hsl(197 56.1% 66.1%);	/* #78bed9 */
	--color--THS-blue-200:hsl(196 60.6% 74.1%);	/* #95d0e5 */
	--color--THS-blue-100:hsl(194 61.4% 83.7%);	/* #bce3ef */
	--color--THS-blue-050:hsl(194 63.6% 93.5%);	/* #e4f4f9 */




	--color--primary-text:var(--color--THS-primary-foreground);

	--color--ths:var(--color--THS-green-700);
	--color--officers:var(--color--THS-green-700);
	--color--para-link:var(--color--THS-green-700);
	--color--header-fill:var(--color--THS-green-400);
	--color--header-menu-link-fill:var(--color--THS-green-200);
	--color--header-menu-link-bar:var(--color--DM-black-tint-7);


	--color--photo-caption:var(--color--THS-purple-700);
	--color--ui-widget-header-fill:var(--color--THS-green-200);


	--letter-spacing--015em:.015em;
	--letter-spacing--0-16px:.16px;
	--letter-spacing--0-25px:.25px;
	--letter-spacing--0-35px:.35px;
	--letter-spacing--0-50px:.50px;
	--letter-spacing--1-00px:1px;
	--letter-spacing--2-00px:2px;
	--letter-spacing--inherit:inherit;
	--letter-spacing--normal:normal;
	--letter-spacing--revert:revert; /* The revert CSS keyword resets the property to its inherited value if it inherits from its parent or to the default value established by the user agent's stylesheet (or by user styles, if any exist) */
	--letter-spacing--unset:unset;   /* The unset CSS keyword resets a property to its inherited value if the property naturally inherits from its parent, and to its initial value if not. */

	--letter-spacing--primary-text:var(--letter-spacing--normal);



	--font-family--fallBack-s: serif;
	--font-family--fallBack-ss: sans-serif;
	--font-family--sans-serif:Arial,Helvetica,var(--font-family--fallBack-ss);

	--font-family--RobotoFlex:"RobotoFlex",var(--font-family--sans-serif);
	--font-family--Raleway:"Raleway",var(--font-family--sans-serif);
	--font-family--Oswald:"Oswald",var(--font-family--sans-serif);
	--font-family--Montserrat:"Montserrat",var(--font-family--sans-serif);

	--font-family--primary-text:var(--font-family--RobotoFlex);
	--font-family--section-title:var(--font-family--Raleway);
	--font-family--header-title:var(--font-family--Oswald);
	--font-family--ui-dialog-title:var(--font-family--Raleway);

	/* font size by rem, the font size is relative to the size of the font used by the <html> (root) element
		which is set to 62.5%;	(10px)
	*/

	--font-size--08px:.8rem;
	--font-size--10px:1rem;
	--font-size--10_5px:1.05rem; /* 8pt (close 10.6667) */
	--font-size--12px:1.2rem;    /* 9pt */
	--font-size--13px:1.3rem;
	--font-size--13boostpx:1.3333rem;  /* 10pt */
	--font-size--14px:1.4rem;
	--font-size--16px:1.6rem;  /* 12pt */
	--font-size--17px:1.7rem;
	--font-size--18px:1.8rem;  /* 14pt (close 18.6667px) */
	--font-size--19px:1.9rem;
	--font-size--20px:2.0rem;
	--font-size--22px:2.2rem;  /* 16pt (close 21.3333px) */
	--font-size--24px:2.4rem;  /* 18pt */
	--font-size--26px:2.6rem;  /* 20pt (close 26.6667px) */
	--font-size--28px:2.8rem;
	--font-size--30px:3.0rem;  /* 22pt (close 29.3333px) */
	--font-size--32px:3.2rem;  /* 24pt */
	--font-size--34px:3.4rem;  /* 26pt (close 34.6667px) */
	--font-size--36px:3.6rem;

	--font-size--primary-text:var(--font-size--16px);
	--font-size--copyright:var(--font-size--10px);
	--font-size--footerlink:var(--font-size--10px);
	--font-size--header-title:var(--font-size--30px);
	--font-size--section-title:var(--font-size--24px);
	--font-size--heading:var(--font-size--20px);
	--font-size--menulink:var(--font-size--14px);
	--font-size--ui-dialog-title:var(--font-size--16px);
	--font-size--button:var(--font-size--24px);


	--font-style--inherit:inherit;
	--font-style--italic:italic;
	--font-style--normal:normal;
	--font-style--oblique :oblique;

	--font-style--primary-text:var(--font-style--normal);



	--font-variation-settings--normal:normal;
	--font-variation-settings--grad-012:"GRAD" 12;
	--font-variation-settings--grad-010neg:"GRAD" -10;
	--font-variation-settings--grad-140neg:"GRAD" -140;
	--font-variation-settings--grad-160neg:"GRAD" -160;

	--font-variation-settings--primary-text:var(--font-variation-settings--grad-012);

	--font-variant--all-small-caps:all-small-caps;
	--font-variant--inherit:inherit;
	--font-variant--none:none; /* Sets the value of the font-variant-ligatures to none and the values of the other longhand property as normal */
	--font-variant--normal:normal;
	--font-variant--small-caps:small-caps;
	--font-variant--unicase:all-small-caps;

	--font-variant--primary-text:var(--font-variant--normal);

	--font-weight--extraThin:100;
	--font-weight--thin:100;
	--font-weight--light-thin:200;
	--font-weight--light:300;
	--font-weight--book:300;
	--font-weight--demi:300;
	--font-weight--normal:400;
	--font-weight--regular:400;
	--font-weight--medium:500;
	--font-weight--semibold:600;
	--font-weight--demibold:600;
	--font-weight--bold:700;
	--font-weight--heavy:700;
	--font-weight--stout:700;
	--font-weight--black:800;
	--font-weight--extraBold:800;
	--font-weight--extraBlack:900;
	--font-weight--fat:900;
	--font-weight--poster:900;
	--font-weight--ultraBlack:900;

	--font-weight--primary-text:var(--font-weight--regular);
	--font-weight--section-title:var(--font-weight--stout);
	--font-weight--menulink:var(--font-weight--regular);
	--font-weight--header-title:var(--font-weight--stout);
	--font-weight--ui-dialog-title:var(--font-weight--stout);
	--font-weight--button:var(--font-weight--stout);
	--font-weight--link:var(--font-weight--stout);



	--line-height--0-00:0.00;
	--line-height--1-00:1.00;
	--line-height--1-15:1.5;
	--line-height--1-20:1.2;
	--line-height--1-25:1.25;
	--line-height--1-50:1.5;
	--line-height--1-75:1.75;
	--line-height--2-50:2.50;
	--line-height--normal:normal;

	--line-height--primary-text:var(--line-height--normal);
	--line-height--copyright:var(--line-height--normal);
	--line-height--footerlink:var(--line-height--normal);
	--line-height--menulink:var(--line-height--normal);
	--line-height--ui-dialog-title:var(--line-height--normal);
	--line-height--button:var(--line-height--normal);

	/* FONT
		It must include values for <font-size> and <font-family>
		Other values are optional
		[ [ <font-style> || <font-variant> || <font-weight> || <font-stretch> ]? <font-size> [ / <line-height> ]? <font-family> ]
	*/
	--font--primary-text:var(--font-style--primary-text) var(--font-variant--primary-text) var(--font-weight--primary-text) var(--font-size--primary-text)/var(--line-height--primary-text) var(--font-family--primary-text);
	--font--copyright:var(--font-style--primary-text) var(--font-variant--primary-text) var(--font-weight--primary-text) var(--font-size--copyright)/var(--line-height--copyright) var(--font-family--primary-text);
	--font--footerlink:var(--font-style--primary-text) var(--font-variant--primary-text) var(--font-weight--primary-text) var(--font-size--footerlink)/var(--line-height--footerlink) var(--font-family--primary-text);
	--font--menulink:var(--font-style--primary-text) var(--font-variant--primary-text) var(--font-weight--menulink) var(--font-size--menulink)/var(--line-height--menulink) var(--font-family--primary-text);
	--font--ths:var(--font-style--italic) var(--font-variant--small-caps) var(--font-weight--semibold) var(--font-size--18px)/var(--line-height--primary-text) var(--font-family--primary-text);
	--font--button:var(--font-style--primary-text) var(--font-variant--primary-text) var(--font-weight--button) var(--font-size--button)/var(--line-height--button) var(--font-family--primary-text);

	--font--section-title:var(--font-style--primary-text) var(--font-variant--primary-text) var(--font-weight--section-title) var(--font-size--section-title)/var(--line-height--primary-text) var(--font-family--section-title);
	--font--heading:var(--font-style--primary-text) var(--font-variant--primary-text) var(--font-weight--section-title) var(--font-size--heading)/var(--line-height--primary-text) var(--font-family--section-title);
	--font--header-title:var(--font-style--primary-text) var(--font-variant--primary-text) var(--font-weight--header-title) var(--font-size--header-title)/var(--line-height--primary-text) var(--font-family--header-title);
	--font--ui-dialog-title:var(--font-style--primary-text) var(--font-variant--primary-text) var(--font-weight--ui-dialog-title) var(--font-size--ui-dialog-title)/var(--line-height--primary-text) var(--font-family--ui-dialog-title);



	--text-shadow--heading:.25px .25px var(--color--THS-green-700);
	--text-shadow--header-title:.5px .5px white;
}

@media (prefers-color-scheme: dark) {
	:root {
		--color--THS-primary-background:hsl(207 33.3% 6.5%); /* #0b1116 */
		--color--THS-primary-foreground:hsl(0 0% 99.2%); /* #fdfdfd */
		--color--ths:var(--color--THS-green-200);
		--color--officers:var(--color--THS-green-200);
		--color--header-fill:var(--color--THS-green-900);
		--color--header-menu-link-fill:var(--color--THS-green-800);
		--color--header-menu-link-bar:var(--color--DM-black-tint-3);

		--color--photo-caption:var(--color--THS-purple-200);
		--color--para-link:var(--color--THS-green-200);
		--color--ui-widget-header-fill:var(--color--THS-green-700);


		--font-variation-settings--primary-text:var(--font-variation-settings--grad-140neg);
		--xxx:#200000;
	--text-shadow--heading:.25px .25px var(--color--THS-green-200);
		--text-shadow--header-title:.5px .5px black;


	}
}


