@import url("https://fonts.googleapis.com/css2?family=Noto+Sans:wght@400;500;600;700;800;900&display=swap");

:root,
:root.light {
	--text: #0D1023;
	--invertText: #fff;
	--grey: #c7c7c7;
	--highlight: #def8f6;
	--primary: #028378;
	--primaryLt: #7ddfd7;
	--bg: #fff;
	--dark: #0D1023;
	--borderRadius: 3px;
	--white: #fff;
	--headerHeight: 3rem;
}

:root.dark {
	--text: #fff;
	--invertText: #0D1023;
	--grey: #c7c7c7;
	--highlight: #028378;
	--primary: #53fdee;
	--primaryLt: #028378;
	--bg: #0D1023;
	--dark: #0D1023;
	--borderRadius: 3px;
	--white: #fff;
	--headerHeight: 3rem;
}

@supports (font: -apple-system-body) {
  html {
    font: -apple-system-body;
  }
}

html,
body {
	padding: 0;
	margin: 0;
	font-family: "Noto Sans", -apple-system, BlinkMacSystemFont, Segoe UI, Roboto,
		Oxygen, Ubuntu, Cantarell, Fira Sans, Droid Sans, Helvetica Neue, sans-serif;
	color: var(--text);
	background-color: var(--bg);
}

a {
	color: inherit;
}

* {
	box-sizing: border-box;
}

*:focus-visible {
	outline: 2px transparent solid;
	box-shadow: 0 0 0 2px #000, 0 0 0 4px #fff;
}



.active {
	font-weight: bold;
	background-color: var(--primary);
	color: var(--invertText);
	text-decoration: none;
	display: inline-block;
	border-radius: 5px;
}

.center {
	display: grid;
	place-items: center;
}

[hidden] {
	display: none;
}

h2,
h3,
h4,
h5,
h6 {
	margin: 1rem 0 0 0;
	scroll-margin-top: 5rem;
}

h1{ 
	font-size: 2rem; 
	margin: 0 0 1rem 0;
}

h2 {
	font-size: 1.5rem;
}

h3 {
	font-size: 1.1rem;
}

p {
	line-height: 1.5;
}

/*Classes used on multiple content pages*/


.imageContainer {
	display: flex;
	gap: 1rem;
	flex-wrap: wrap;
}

.blockLink {
	display: block;
}

.list > li {
	margin-bottom: 0.7rem;
}

.textContainer {
	max-width: 52rem;
}
