html {
	font-family: sans-serif;
	font-size: 1rem;
	scroll-behavior: smooth;
}

body {
	background: #121212;
	color: #ffffff;
	line-height: 1.5;
	margin: 0;
}

#site-header {
	display: flex;
	gap: 1rem;
	padding: 1.5rem 1rem;
}

#site-navigation ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

main {
	padding: 3rem 0;
}

article {
	margin: 0 auto; /* Centers the element */
	padding: 0 1rem;
	max-width: 768px;
}

p, ul, ol, img, h1, h2, h3, h4, h5, h6 {
	margin: 0 0 1rem;
}

h1 {
	font-size: calc(28px + (45 - 28) * ((100vw - 250px) / (1600 - 300)));
}

img {
	max-width: 768px;
	width: 100%;
}

a, a:visited {
	color: #4eb5ff;
	text-decoration: none;
	transition: color .3s ease;
}

a:hover, a:focus {
	color: #00f3ff;
}

::-webkit-scrollbar {
	background: none;
	width: 8px;
}

::-webkit-scrollbar-thumb {
	background: gray;
	border-radius: 8px;
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }
  a {
  	transition: none!important;
  }
}