@charset "utf-8";

:root {
	--link-color: #003BC6;
	--code-color: #7701B9;
}

*, *:before, *:after {
  box-sizing: border-box;
}

html, body {
	font-size: 16px;
	height: 100%;
}

body {
	font-family: Menlo, Consolas, monospace;
	line-height: 1.6;
	padding: 1rem 2rem;

	color: #333;
	background-color: #ebeaef;
}

a {
	color: var(--link-color);
	text-decoration: none;
	cursor: pointer;
	border-bottom: 1px solid rgba(0, 124, 188, 0.25);
}

a:hover {
	border-bottom: 1px solid var(--link-color);
}

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


h1, h2, h3, h4, h5, h6 {
	margin: 0 0 2.0rem 0;
	line-height: 1.0;
}

h1 { font-size: 24px; }
h2 { font-size: 20px; }
h3 { font-size: 18px; }

table{
    border-collapse:collapse;
    font-size:0.9rem;
}

td,th {
    padding: 4px 16px 4px 4px;
}

th:last-child,td:last-child{
    padding-right:4px;
}

tr:nth-child(even){
    background-color:#eee
}

th{
    text-decoration: underline;
    text-align:left;
}

header {
	margin-bottom: 3rem;
}

header h3 { margin: 0; }

main {
	min-height: calc(100vh - 14rem);

	display: flex;
	flex-grow: 1;
}

aside {
	width: 240px;
	margin-right: 4rem;
}

aside h3 {
	margin-bottom: 1rem;
}

aside ul {
	padding-left: 0;
	list-style: none;
	margin: 0.25rem 0 2.0rem 0;
}

aside .title {
	font-size: 1.25rem;
	font-weight: bold;
}

aside li {
	padding-top: 0.25rem;
	padding-bottom: 0.25rem;
}

aside li.active a {
	font-weight: bold;
	border-bottom: 1px solid var(--link-color);
}

footer {
	margin: 4rem 0 1rem 0;
}

@media (max-width: 720px) {

	header {
		margin-bottom: 2rem;
	}

	main {
		display: block;
		padding-top: 0;
	}

	aside {
		width: 100%;
		margin-bottom: 2rem;
		margin-right: 0;
	}

	aside h3 {
		display: none;
	}

	aside ul {
		display: flex;
		flex-wrap: wrap;
		margin-bottom: 0;
	}

	aside li {
		width: 7em;
		margin-right: 2em;
	}

}

article {
	width: 100%;
	margin: 0;
}

/* Make things readable and wrap at 42rem
 * we don't do all because we want images, code to be wide. */
article blockquote,
article p,
article li {
	max-width: 42rem;
}

article blockquote,
article p {
	margin-top: 1.75rem;
	margin-bottom: 1.75rem;
}

article h2,
article h3,
article h4,
article h5,
article h6 {
    border-bottom: 1px solid #999;
	max-width: 42rem;
	margin-top: 3.0rem;
	margin-bottom: 0;
    padding-bottom: 4px;

}

article blockquote {
	border-left: 10px solid black;
	padding: 0.25rem 0.5rem;
	margin-left: 0;
	font-style: italic;
}

section ul {
	padding-left: 0;
	list-style: none;
}

section li {
	line-height: 0;
	margin-bottom: 2.0rem;
}

code {
	color: var(--code-color);
}