/* VARIABLES */
:root {
	/* COLOR PALETTE (DON'T USE DIRECTLY) */
	--black:				rgb(0, 0, 0);
	--white:				rgb(255, 255, 255);
	--gray:					rgb(202, 202, 202);
	--light-blue:			rgb(0, 157, 236);
	--medium-blue:			rgb(1,96,163);
	--dark-blue:			rgb(1, 35, 90);
	--red: 					rgb(204, 0, 0);
	--orange:				rgb(255, 165, 0);
	--green:				rgb(143, 197, 2);
	--lightest-grey: 		rgb(230, 230, 230);
	--darkest-grey:			rgb(34, 34, 34);

	/* COLOR MAPPINGS (USE THESE) */
	--primary-bg-color:			var(--dark-blue);
	--alternative-bg-color:		var(--light-blue);
	--primary-color:			var(--light-blue);
	--secondary-color:			var(--dark-blue);
	--alert-color:				var(--red);
	--success-color:			var(--green);
	--warning-color:			var(--orange);
	--header-font-color:		var(--darkest-grey);
	--body-font-color:			var(--darkest-grey);
	--header-bg-color: 			var(--lightest-grey);
}

/* MATERIAL ICONS */
.material-icons.md-18 { font-size: 18px; }
.material-icons.md-24 { font-size: 24px; }
.material-icons.md-36 { font-size: 36px; }
.material-icons.md-48 { font-size: 48px; }
.material-icons.md-dark { color: rgba(0, 0, 0, 0.54); }
.material-icons.md-dark.md-inactive { color: rgba(0, 0, 0, 0.26); }
.material-icons.md-light { color: rgba(255, 255, 255, 1); }
.material-icons.md-light.md-inactive { color: rgba(255, 255, 255, 0.3); }
.material-icons.md-middle { vertical-align: middle; }