@import url('https://fonts.googleapis.com/css2?family=Dosis:wght@200&display=swap'); /* TODO remove unused font sizes */
@import url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@300;400;500;600;700&display=swap');
/* @import url("https://fonts.googleapis.com/css2?family=Montserrat:wght@100;300;400;500;600;700&display=swap");	 */
/* @import url('https://fonts.googleapis.com/css2?family=Roboto:wght@100;300;400;500;700&display=swap'); */
/* @import url('https://fonts.googleapis.com/css2?family=Lato:wght@100;300;400;700&display=swap'); */
/* @import url('https://fonts.googleapis.com/css2?family=Nunito+Sans:wght@200;300;400;600;700&display=swap'); */
/* @import url('https://fonts.googleapis.com/css2?family=Oxygen:wght@300;400;700&display=swap'); */




* {
	box-sizing: border-box;
	margin: 0;
	padding: 0;
}
:root {
	--clr-background: rgb(255, 255, 255);
	--clr-background-100: rgb(252, 252, 252);
	--clr-foreground-csv: 32, 33, 34;
	--clr-foreground: rgb(32, 33, 34);
	--clr-foreground-100: rgb(51, 51, 53);
	--clr-foreground-200: rgb(120, 120, 124);
	--clr-foreground-300: rgb(170, 175, 180);
	--clr-link: #0000EE;
	--clr-link-visited: #551A8B;
}

/* TODO dark mode link colors */

.dark-mode {
	--clr-background: rgb(30, 31, 33);
	--clr-background-100: rgb(33, 34, 36);
	--clr-foreground-csv: 200, 205, 210;
	--clr-foreground: rgb(200, 205, 210);
	--clr-foreground-100: rgb(185, 185, 185);
	--clr-foreground-200: rgb(153, 153, 153);
	--clr-foreground-300: rgb(90, 95, 100);
	--clr-link: #6988e6;
	--clr-link-visited: #917fbb;	/* 8974bb */
}


body {
	--size-tablet: 850px;

	font-family: 'Open Sans', sans-serif;
	/* font-family: "Montserrat", sans-serif; */
	/* font-family: 'Lato', sans-serif; */
	/* font-family: 'Nunito Sans', sans-serif; */
	/* font-family: 'Oxygen', sans-serif; */
	font-size: 1em;
	background-color: var(--clr-background);
	color: var(--clr-foreground);
	line-height: 1.6;							/* check */
	transition: background-color 0.3s, color 0.3s;
}

a {
	color: var(--clr-link);
}
a:visited {
	color: var(--clr-link-visited);
}
