html {
			/* this allows for easy conversion between px and rem, so 10 px is 1rem */
			font-size: 62.5% !important;
		}
		
				
		:root {
			--color-primary: #fb133c;
		  	--color-primary-50: #ffe7ec;
		  	--color-primary-100: #febdc8;
		  	--color-primary-200: #fd92a5;
		  	--color-primary-300: #fc6882;
		  	--color-primary-400: #fc3d5f;
		  	--color-primary-500: #fb133c;
		  	--color-primary-600: #ce1031;
		  	--color-primary-700: #a10c26;
		  	--color-primary-800: #73091c;
		  	--color-primary-900: #460511;
		  	--color-secondary: #1b2c8a;
		  	--color-secondary-50: #e8eaf3;
		  	--color-secondary-100: #bfc4de;
		  	--color-secondary-200: #969ec9;
		  	--color-secondary-300: #6d78b4;
		  	--color-secondary-400: #44529f;
		  	--color-secondary-500: #1b2c8a;
		  	--color-secondary-600: #162471;
		  	--color-secondary-700: #111c58;
		  	--color-secondary-800: #0c143f;
		  	--color-secondary-900: #080c27;
		  	--color-text: #18181B;
		  	--color-accent: #fb133c;
		  	--color-accent-50: #ffe7ec;
		  	--color-accent-100: #febdc8;
		  	--color-accent-200: #fd92a5;
		  	--color-accent-300: #fc6882;
		  	--color-accent-400: #fc3d5f;
		  	--color-accent-500: #fb133c;
		  	--color-accent-600: #ce1031;
		  	--color-accent-700: #a10c26;
		  	--color-accent-800: #73091c;
		  	--color-accent-900: #460511;
		  	--color-gray-50: #FAFAFA;
		  	--color-gray-100: #F4F4F5;
		  	--color-gray-200: #E4E4E7;
		  	--color-gray-300: #D4D4D8;
		  	--color-gray-400: #A1A1AA;
		  	--color-gray-500: #71717A;
		  	--color-gray-600: #52525B;
		  	--color-gray-700: #3F3F46;
		  	--color-gray-800: #27272A;
		  	--color-gray-900: #18181B;
		  	--color-light: #fff;
			  
			--color-primary-rgbv: 251,19,60;
		  	--color-primary-50-rgbv: 255,231,236;
		  	--color-primary-100-rgbv: 254,189,200;
		  	--color-primary-200-rgbv: 253,146,165;
		  	--color-primary-300-rgbv: 252,104,130;
		  	--color-primary-400-rgbv: 252,61,95;
		  	--color-primary-500-rgbv: 251,19,60;
		  	--color-primary-600-rgbv: 206,16,49;
		  	--color-primary-700-rgbv: 161,12,38;
		  	--color-primary-800-rgbv: 115,9,28;
		  	--color-primary-900-rgbv: 70,5,17;
		  	--color-secondary-rgbv: 27,44,138;
		  	--color-secondary-50-rgbv: 232,234,243;
		  	--color-secondary-100-rgbv: 191,196,222;
		  	--color-secondary-200-rgbv: 150,158,201;
		  	--color-secondary-300-rgbv: 109,120,180;
		  	--color-secondary-400-rgbv: 68,82,159;
		  	--color-secondary-500-rgbv: 27,44,138;
		  	--color-secondary-600-rgbv: 22,36,113;
		  	--color-secondary-700-rgbv: 17,28,88;
		  	--color-secondary-800-rgbv: 12,20,63;
		  	--color-secondary-900-rgbv: 8,12,39;
		  	--color-text-rgbv: 24,24,27;
		  	--color-accent-rgbv: 251,19,60;
		  	--color-accent-50-rgbv: 255,231,236;
		  	--color-accent-100-rgbv: 254,189,200;
		  	--color-accent-200-rgbv: 253,146,165;
		  	--color-accent-300-rgbv: 252,104,130;
		  	--color-accent-400-rgbv: 252,61,95;
		  	--color-accent-500-rgbv: 251,19,60;
		  	--color-accent-600-rgbv: 206,16,49;
		  	--color-accent-700-rgbv: 161,12,38;
		  	--color-accent-800-rgbv: 115,9,28;
		  	--color-accent-900-rgbv: 70,5,17;
		  	--color-gray-50-rgbv: 250,250,250;
		  	--color-gray-100-rgbv: 244,244,245;
		  	--color-gray-200-rgbv: 228,228,231;
		  	--color-gray-300-rgbv: 212,212,216;
		  	--color-gray-400-rgbv: 161,161,170;
		  	--color-gray-500-rgbv: 113,113,122;
		  	--color-gray-600-rgbv: 82,82,91;
		  	--color-gray-700-rgbv: 63,63,70;
		  	--color-gray-800-rgbv: 39,39,42;
		  	--color-gray-900-rgbv: 24,24,27;
		  	--color-light-rgbv: 255,255,255;
			--border-width: 1px;
			--color-background-light: var(--color-gray-50);
			--color-background-dark: var(--color-text);
			--color-dimmed: rgba(var(--color-text-rgbv), .5);
			--font-body-normal: 400;
			--font-body-bold: 700;
			--font-heading-normal: 700;
			--font-heading-bold: 700;
			--height-small: 30rem;
			--height-normal: 40rem;
			--height-big: 50rem;
			--padding-small:1.2rem;
			--padding-normal:2.4rem;
			--padding-big:4.8rem;
			--rounded-small: 8px;
			--rounded-normal: 40px;
			--width-small: 40rem;
			--width-normal: 70rem;
			--width-big: 90rem;  
			  
			  
			
			/* BREAKDANCE SPECIFIC VARIABLES */
			--column-gap-small: 1.2rem;
			--column-gap-normal: var(--bde-column-gap);
			--column-gap-big: 4.8rem;
			--content-gap-small: 0.8rem;
			--content-gap-normal: 2.4rem;
			--content-gap-big: 4.8rem;
			--gap-small: var(--content-gap-small);
			--gap-normal: var(--content-gap-normal);
			--gap-big: var(--content-gap-big);  
			--font-heading: var(--bde-heading-font-family);
		  	--font-body: var(--bde-body-font-family);		  	
		  	--text-xs: calc( var(--bde-body-font-size) - .4rem );
		  	--text-sm: calc( var(--bde-body-font-size) - .2rem );
		  	--text-md: var(--bde-body-font-size);
		  	--text-lg: calc( var(--bde-body-font-size) + .2rem );
		  	--text-xl: calc( var(--bde-body-font-size) + .4rem );
		  	--text-2xl: calc( var(--bde-body-font-size) + .6rem );
		  	--text-h1: var(--bde-h1-font-size);
		  	--text-h2: var(--bde-h2-font-size);
		  	--text-h3: var(--bde-h3-font-size);
		  	--text-h4: var(--bde-h4-font-size);
		  	--text-h5: var(--bde-h5-font-size);
		  	--text-h6: var(--bde-h6-font-size);		  	
		  	--transition-base: var(--bde-transition-duration);		  	
		  	--border-base: var(--border-base);		  	
		  	--w-xs: calc( var(--bde-section-width) * 0.1 );
		  	--w-sm: calc( var(--bde-section-width) * 0.2 );
		  	--w-md: calc( var(--bde-section-width) * 0.4 );
		  	--w-lg: calc( var(--bde-section-width) * 0.6 );
		  	--w-xl: calc( var(--bde-section-width) * 0.8 );
		  	--w-2xl: calc( var(--bde-section-width) * 0.9 );
		  	--w-full: var(--bde-section-width);		  	
		  	--section-padding-horizontal: var(--bde-section-horizontal-padding);
		  	--section-padding-vertical: var(--bde-section-vertical-padding);
			  
			  
			/* OVERRIDES OR ADDS */ 
					  
		}