html {
	padding: 0;
	margin: 0;
	font-family: sans;
	background-color: hsl({{hue}},0%,0%);
	color: hsl({{hue}},0%,100%);
}

body {
	max-width: 960px;
	padding: 8px;
	margin: auto;
	background-color: hsl({{hue}},0%,5%);
	color: hsl({{hue}},0%,75%);
}

a {
	text-decoration: none;
	color: hsl({{hue}},100%,25%);
}

a:hover {
	text-decoration: none;
	color: hsl({{hue}},100%,50%);
}

.api {
	padding: 8px;
}

.api_tocentry {
	list-style-type: "» ";
}

.api_actionlist {
	padding: 0;
	margin: 0;
	list-style-type: none;
}

.api_action {
	margin: 24px;
	padding: 12px;
	border-radius: 4px;
	background-color: hsl({{hue}},0%,10%);
}

.api_action_head {
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
}

.api_action_head_left {
	flex-basis: 90%;
	flex-grow: 1;
	flex-shrink: 0;
}

.api_action_head_right {
	flex-basis: 10%;
	flex-grow: 0;
	flex-shrink: 0;
	text-align: right;
}

.api_action_stuff {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
}

.api_action_snippet {
	margin: 8px;
	padding: 8px;
	border-radius: 4px;
	background-color: hsl({{hue}},0%,15%);
}

.api_action_snippet_head {
	font-weight: bold;
	margin-bottom: 4px;
	color: hsl({{hue}},0%,10%);
	text-transform: uppercase;
}

.api_action_description {
	flex-shrink: 1;
	flex-basis: 90%;
	flex-grow: 1;
}

.api_action_input {
	flex-shrink: 1;
	flex-basis: 45%;
	flex-grow: 1;
}

.api_action_output {
	flex-shrink: 1;
	flex-basis: 45%;
	flex-grow: 1;
}

.api_version {
	text-align: right;
}