@import url(/styles/core.css);
@import url(/styles/utility-classes.css);
@import url(/styles/themes/font/serif-mono.css);

:root {
    --page_color-main: green;
    --page_color-accent: gray;
    --page_color-text-main: var(--page_color-main);
    --page_color-text-accent: var(--page_color-accent);
    --page_tile: ;
    --page_font: ;
    --page_color-foreground: var(--global_color-foreground);
}

a {
	color: var(--page_color-text-main);
	text-transform: lowercase;
	&:hover {
		color: var(--page_color-text-accent);
	}
}

.new {
	color: red;
}

main.main {
	columns: 3 31rem;
}

header.header {

	h1 {
		display: inline;
		font-weight: bold;
		line-height: 1;
		font-size: 1rem;

		a {
			color: var(--page_color-foreground);
			text-decoration: none;
			&:hover {
				text-decoration: underline;
			}
		}
	}
}

div.nav {
	ul {
		list-style-type: none;
		margin: 0;
		padding: 0;
		display: inline;
		li {
			display: inline;
		}
	}
}

footer.footer {
	.date {
		display: block;
	}
}

.text-contents {
	margin-block: 2rem;

	p,
	div.p {
		margin-block: 1em;

		span.date {
			font-weight: bold;
			&::after {
				content: ':';
			}
		}
	}

	article.entry {
		a {
			text-transform: uppercase;
		}
	}

	.table-contents {
		a {
			text-transform: uppercase;
		}
	}
}

@media (min-width: 400px) {
	.text-contents {
		text-align: justify;
	}
}