@import url('https://fonts.googleapis.com/css2?family=Sofia+Sans:ital,wght@0,1..1000;1,1..1000&display=swap');
:root {
	--black: #07070E;
	--black-2: #1C1C35;
	--dark-accent-color: #31315E;
	--accent-color: #898AC4;
	--light-accent-color: #A2AADB;
	--white2: #FFEDD6;
	--white: #FFF8EF;
}

body,html {
    margin: 0;
    padding: 0;
}

body {
	color: var(--black);
	background: var(--white);
	font-size: 1.25rem;
	line-height: 1.2;
	font-family: system,-apple-system,"San Francisco",Roboto,"Segoe UI","Helvetica Neue","Lucida Grande",Verdana, Arial, Tahoma, sans-serif;
	font-family: "Sofia Sans", sans-serif;
	font-optical-sizing: auto;
	font-style: normal;
	font-weight: 140;
	min-height: 100dvh;
}

#content {
	max-width: 1200px;
	margin: auto;
	display: grid;
	grid-template-rows: auto 1fr auto;
	height: 100%;
}

main {
	max-width: 650px;
	margin: 40px auto;
	padding: 0 10px;
}

h1, h2, h3{
	line-height: 1.2;
}

h1 {
	font-weight: 400;
}

h2 {
	font-weight: 300;
}

h3 {
	font-weight: 200;
}

header {
	font-size: 1rem;
	padding: 0.5rem 1rem 0.5rem 1rem;
}

footer {
	font-size: 1rem;
	text-align: right;
	padding: 0.5rem 1rem 0.5rem 1rem;

}

.header-content {
	text-align: center;
	line-height: 1;
	margin-bottom: 5rem;
}
.header-content h1{
	line-height: 1;
	margin-bottom: 0;
}

ol {
	list-style-type: decimal-leading-zero;
	list-style-position: outside;
	font-weight: 100;
}

.entry-list {
	padding-left: 0rem;

}

.entry-list-link {
	list-style: "";
	display: block;
	margin: 0 0 1rem 0; 
	padding: 0;
}

.entry-list-link .id,
.entry-list-link h3,
.entry-list-link p {
	line-height: 1.25;
	margin-top: 0;
	margin-bottom: 0;
	padding-left: .25rem;
}

.entry-list-link .id {
	font-size: .95rem;
	padding: 0 0 .25rem 0;
}
.entry-list-link h3 {
	font-weight: 600;
}

a:link, a:visited, a:hover, a:active {
	color: inherit;
	text-decoration: none;
}

a:hover {
	color: var(--accent-color);
}

a:active {
	color: var(--dark-accent-color);
}

@media (prefers-color-scheme: dark) {
	body {
		color: var(--white);
		background: var(--black);
	}

	a:active {
		color: var(--light-accent-color);
	}
}

