:root {
	
	/* global page width */
	--global-container-width: 80vw;
	--global-max-container-width: 1400px;
	
	

	
	/* typography */

	
	/* fonts */
  	--font-sans: 'Scandia', Avenir, Helvetica, Arial, sans-serif;
  	--font-sans-text: 'Scandia', Avenir, Helvetica, Arial, sans-serif;
	--font-serif: 'Elena', Constantia, Georgia, serif;
	
	/* font sizes */
	/* 12,14,16,18,21,24,36,48,60,72 */
	
	--font-size-00: calc(12px + 0 * ((100vw - 320px) / 680));
	--font-size-01: calc(12px + 1 * ((100vw - 320px) / 680));
	--font-size-02: calc(14px + 1 * ((100vw - 320px) / 680));
	--font-size-03: calc(16px + 1 * ((100vw - 320px) / 680));
	--font-size-04: calc(18px + 1 * ((100vw - 320px) / 680));
	--font-size-05: calc(21px + 2 * ((100vw - 320px) / 680));
	--font-size-06: calc(24px + 2 * ((100vw - 320px) / 680));
	--font-size-07: calc(36px + 2 * ((100vw - 320px) / 680));
	--font-size-08: calc(48px + 2 * ((100vw - 320px) / 680));
	--font-size-09: calc(60px + 2 * ((100vw - 320px) / 680));
	--font-size-10: calc(72px + 2 * ((100vw - 320px) / 680));
	
	--font-leading-00: calc(14px + 2 * ((100vw - 320px) / 680));
	--font-leading-01: calc(16px + 2 * ((100vw - 320px) / 680));
	--font-leading-02: calc(18px + 2 * ((100vw - 320px) / 680));
	--font-leading-03: calc(21px + 2 * ((100vw - 320px) / 680));
	--font-leading-04: calc(24px + 2 * ((100vw - 320px) / 680));
	--font-leading-05: calc(26px + 2 * ((100vw - 320px) / 680));
	--font-leading-06: calc(32px + 2 * ((100vw - 320px) / 680));
	--font-leading-07: calc(42px + 2 * ((100vw - 320px) / 680));
	--font-leading-08: calc(52px + 2 * ((100vw - 320px) / 680));
	--font-leading-09: calc(64px + 2 * ((100vw - 320px) / 680));
	--font-leading-10: calc(80px + 2 * ((100vw - 320px) / 680));
	
	
	--font-size-p:  calc(16px + .5 * ((100vw - 320px) / 680));
	--font-size-p-article:  21px;
	--font-leading-p-article:  28px;
	--font-size-h1: calc(32px + 8 * ((100vw - 320px) / 680));
	--font-size-h2: calc(24px + 8 * ((100vw - 320px) / 680));
	--font-size-h3: calc(18px + 2 * ((100vw - 320px) / 680));
	--font-size-h4: calc(14px + 2 * ((100vw - 320px) / 680));
	--font-size-h5: calc(12px + 2 * ((100vw - 320px) / 680));
	--font-size-h6: calc(10px + 2 * ((100vw - 320px) / 680));
	--footer-about-text:  calc(12px + 2 * ((100vw - 320px) / 680));
	--footer-utility-text:  calc(12px + 1 * ((100vw - 320px) / 680));
	--footer-copyright-text:  calc(10px + 1 * ((100vw - 320px) / 680));
	
	--font-size-xxsm: 1rem;
	--font-size-xsm: 1.2rem;
	--font-size-sm: calc(12px + 1 * ((100vw - 320px) / 680));
	--font-size-lg: calc(21px + 3 * ((100vw - 320px) / 680));
	--font-size-xlg: 3.6rem;
	--font-size-xxlg: 4.8rem;
	
	--font-leading-p: calc(24px + 4 * ((100vw - 320px) / 680));
	--font-leading-h1: calc(36px + 8 * ((100vw - 320px) / 680));
	--font-leading-h2: calc(26px + 8 * ((100vw - 320px) / 680));
	--font-leading-h3: calc(26px + 4 * ((100vw - 320px) / 680));
	--font-leading-lg: calc(28px + 3 * ((100vw - 320px) / 680));
	--font-leading-sm: calc(18px + 4 * ((100vw - 320px) / 680));
	--font-leading-xlg: 4.0rem;

	/* font weights */
	--font-weight-light: 200;
	--font-weight-normal: 400;
	--font-weight-medium: 500;
	--font-weight-bold: 700;
	
	/* font styles */
	--font-style-normal: normal;
	--font-style-italic: italic;




	/* layout */
	/* layout */
	/* layout */

	/* breakpoint widths */
	--page-desktop: 2000px;
	--page-laptop: 1200px;
	--page-tablet-landscape: 960px;
	--page-tablet-portrait: 700px;
	--page-mobile-landscape: 480px;
	--page-mobile-portrait: 320px;	
	

	/* colors */
	--color-white: rgba(255,255,255,1.0);
	--color-white-1: rgba(255,255,255,0.1);
	--color-white-2: rgba(255,255,255,0.2);
	--color-white-3: rgba(255,255,255,0.3);
	--color-white-4: rgba(255,255,255,0.4);
	--color-white-5: rgba(255,255,255,0.5);
	--color-white-6: rgba(255,255,255,0.6);
	--color-white-7: rgba(255,255,255,0.7);
	--color-white-8: rgba(255,255,255,0.8);
	--color-black: rgba(0,0,0,1.0);
	--color-trans: rgba(0,0,0,0.0);
	--color-grey-0: rgba(0,0,0,0.05);
	--color-grey-1: rgba(0,0,0,0.1);
	--color-grey-2: rgba(0,0,0,0.2);
	--color-grey-3: rgba(0,0,0,0.3);
	--color-grey-4: rgba(0,0,0,0.4);
	--color-grey-5: rgba(0,0,0,0.5);
	--color-grey-6: rgba(0,0,0,0.6);
	--color-grey-7: rgba(0,0,0,0.7);
	--color-grey-8: rgba(0,0,0,0.8);
	--color-grey-9: rgba(0,0,0,0.9);
	
	--color-brand-red: rgba(223, 49, 22, 1);
	--color-brand-red-hover: rgba(208, 49, 26, 1);
	--color-brand-yellow: rgba(255, 195, 18,1.0);
	--color-utility: rgba(174,41,22, .5);
	--color-section-nav: rgba(230, 230, 230, 1);
	--color-section-nav-link: rgba(0,0,0,0.8);
	--color-footer-band-promo: rgba(250,250,250,1);
	--color-footer-band: rgba(20,20,20,1);
	--color-brand-yellow-local-nav: rgba(0,0,0,0.8);
	
	
}