html {

    /* colors */
    
	--header: 31,41,55;
	--header-light: 40,53,71;
	--header-lighter: 46,61,82;
	--header-text: 150,175,199;
	--header-text-light: 218,227,235;
	--header-text-lighter: 255,254,254;
	--background: 228,231,235;
	--background-light: 255,255,255;
	--background-lighter: 255,255,255;
	--primary: 186,218,85;
	--primary-light: 216,234,159;
	--primary-lighter: 236,245,209;
	--accent: 219,102,50;
	--accent-light: 231,153,118;
	--accent-lighter: 239,187,164;
	--secondary: 70,88,132;
	--secondary-light: 93,115,169;
	--secondary-lighter: 119,138,183;
	--main: 51,51,51;
	--main-light: 66,66,66;
	--main-lighter: 76,76,76;
	--header-item-background: 31,41,55;
	--header-item-background-light: 40,53,71;
	--header-item-background-lighter: 46,61,82;
	--header-item-text: 255,255,255;
	--header-item-text-light: 255,255,255;
	--header-item-text-lighter: 255,255,255;
	--header-item-background-active: 76,84,95;
	--header-item-background-active-light: 98,109,123;
	--header-item-background-active-lighter: 114,126,142;
	--header-item-text-active: 255,255,255;
	--header-item-text-active-light: 255,255,255;
	--header-item-text-active-lighter: 255,255,255;




}


/* styles */