/** 
 (useCssVariablesGlobalRootReplace = true) 
 *
 *	ALERT! 
 *		Only global variables may be declared and must be placed inside the :root section! 
 *		Other native CSS Variable / CSS Custom Properties functionality like 
 *		    the possibility of changing the variables locally (local scope), 
 *		    declaring variables inline, 
 *		    var() fallbacks etc 
 *		will not work with this set up!
 *		The variables will be extracted and be physically replaced where they are use in the css 
 *		so that older browsers that do not support CSS Variables will see the same result when the 
 *		CSS file is generated on the live site.
 *
 */

body.debug{
	/* visibility: visible; */
}

:root{
	/** = START === COLOR KEY === */

		/** TEXT BODY - (TEXT color:body text) */
		/* --color-text-body: #3e4343; */
		--color-text-body: #000000;
	
		/** TEXT HEADING */
		/* --color-text-heading: #262a2a; */
		--color-text-heading: #000000;
	
		/** LINK - (link, button, link gradient,button border) */
		--color-link:		#0f7072;
		--color-link-dark:	#0c5a5b;
	
		/** PRICE - (Pricing, some titles, button, button border) */
		--color-price:		#262a2a;
		--color-price-dark:	#000000;
	
		/** ALERT - (button, button gradient, button border) */
		--color-alert:		#d00400;
		--color-alert-dark:	#c00200;
	
		/** WARNING ERROR */
		--color-warning:		#9d0300;
		--color-warning-dark:	#890200;

		/** RATING: YELLOW */
		--color-rating:			#ffc200;
		--color-rating-dark:	#e69c00;

	
		/** BASE: TURQUOISE - (active state) */
		--color-base:		#209c9e;
		--color-base-dark:	#1a888b;
		--color-base-light:	#27b5b7;
	
		/** DARKGRAY - (Usually same as TEXT BODY) */
		--color-darkgray:		#3e4343;
		--color-darkgray-dark:	#323636;
	
		/** MIDGRAY - (menu, menu gradient) */
		--color-midgray:		#959595;
		--color-midgray-dark:	#808080;
	
		/** LIGHTGRAY - (body bg, dotted heading border, search-text, search-text input border bg etc) */
		--color-lightgray:		#f9f9f9;
		--color-lightgray-dark:	#f1f1f1;


		/** PRIMARY BACKGROUND */
		--color-background-text: #fff;

	
		/** ACCENT - LOGOGRAY - (CTA 'Call to action': button, button border, gradient) */
		--color-accent:			#706f6f;
		--color-accent-dark:	#5a5959;
	
		/** COMPLEMENTARY: LIGHT-TURQUOISE */
		--color-1:		#e1f6f7;
		--color-1-dark:	#d6f2f3;
	

		/** COMPLEMENTARY: LIGHT-GRAY */
		--color-2:		#dfdcdc;
		--color-2-dark:	#d9d5d5;

		--color-print-text-body:		var(--color-text-body);
		--color-print-text-heading:		var(--color-text-heading);
		--color-print-link:				var(--color-link);
		--color-print-rating:			var(--color-rating);
		--color-print-lightgray:		var(--color-lightgray);
		--color-print-lightgray-dark:	var(--color-lightgray-dark);


	/** = END === color KEY === */

	/** = START === font KEY === */

		/** FONT BODY - (TEXT color:body text) */
		--font-family-body: 'Avenir LT W01_55 Roman1475520',sans-serif;
		--font-weight-body: 400;



		--font-family-body-bold: 'Avenir LT W01_85 Heavy1475544',sans-serif;
		--font-weight-body-bold: normal;
	
		/** FONT HEADING */
		--font-family-heading: 'Avenir LT W01_55 Roman1475520',sans-serif;
		--font-weight-heading: 400;


		/** FONT HEADING */
		--font-family-heading: 'Avenir LT W01_55 Roman1475520',sans-serif;
		--font-weight-heading: 400;


		/** FONT BUTTON */
		--font-family-button: 'Avenir LT W01_85 Heavy1475544',sans-serif;
		--font-weight-button: normal;



	/** = END === font KEY === */	

	
}