@import url(https://fonts.googleapis.com/css?family=Roboto:400,100,500,700|Roboto+Mono);

html,
body {
	font-family: 'Roboto', sans-serif;
	font-size: 16px;
	line-height: 1.66;
	margin: 0;
	padding: 0;
	color: #555;
	font-weight: 400;
	text-align: justify;
	-webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4, h5, h6 {
	text-rendering: optimizeLegibility;
	font-weight: 100;
	color: #000;
}

table {
	line-height: 2;
}

table tr:nth-child(odd) {
	background: #efefef;
}

table th,
table td {
	padding: 8px;
}

h2 {
	font-size: 45px;
}

h3 {
	font-size: 24px;
}

h4 {
	font-size: 16px;
	font-weight: 500;
	margin: 0;
}

pre {
	overflow: auto;
}

pre > code {
	display: block;
}

kbd, code {
	font-family: 'Roboto Mono', monospace;
	background: #f6f6f6;
	padding: 2px 5px;
	font-size: 80%;
}

code {
	font-family: "Roboto Mono", monospace;
	font-size: 80%;
}

code .identifier {
	color: #990000;
	font-weight: 700;
}

code .keyword {
	color: #008080;
}

code .type {
	color: #458;
}

code .string {
	color: #990073;
}

dt {
	margin: 1em 0 0 0;
}

dd p {
	margin: 0 0 1em 0;
}

a:link {
	text-decoration: underline;
	color: #447fae;
}

a:visited {
	color: #447fae;
}

a:hover {
	text-decoration: none;
}

div.img {
	text-align: center;
}

.list {
	display: flex;
}

.list > section {
	flex: 1;
	margin-right: 16px;
}

.list > section:last-child {
	margin-right: 0;
}

html {
}

body {
	max-width: 900px;
	margin: 0 auto;
}

header {
	text-rendering: optimizeLegibility;
	text-align: center;
	margin: 112px 0;
}

header h1 {
	font-weight: 700;
	font-size: 112px;
	margin: 0;
}

header .desc {
	font-weight: 100;
	font-size: 34px;
}

nav {
	margin: 50px 0;
}

nav ul {
	display: flex;
	list-style: none;
	text-align: center;
	padding: 0;
	margin: 0;
}

nav ul li {
	flex: 1;
}

nav ul li a:link ,
nav ul li a:visited {
	display: block;
	margin: 8px;
	padding: 8px;
	background: #efefef;
	color: #333;
	transition: all 0.2s;
	text-decoration: none;
	border-bottom: 1px solid #fff;
}

nav ul li a[href='#overview'] {
	background: #00bcd4;
	color: #fff;
}

nav ul li a[href='#screenshots'] {
	background: #e91e63;
	color: #fff;
}

nav ul li a[href='#download'] {
	background: #8bc34a;
	color: #fff;
}

nav ul li a[href='#usage'] {
	background: #00bcd4;
	color: #fff;
}

nav ul li a:hover {
	background: #fff !important;
	color: #000 !important;
	border-bottom: 1px solid #000;
}
main {
	padding: 8px;
}

main > section {
	margin: 0 0 112px 0;
}

main > section > h2 {
	border-bottom: 1px solid #666;
}

main > section > section {
	margin: 0 0 56px 0;
}

main #overview > h2 {
	border-bottom: 1px solid #00bcd4;
}

main #overview img {
	max-width: 100%;
	width: 100%;
	border: 1px solid #ccc;
	box-sizing: border-box;
}

main #screenshots > h2 {
	border-bottom: 1px solid #e91e63;
}

main #screenshots img {
	max-width: 100%;
	width: 100%;
	border: 1px solid #ccc;
	box-sizing: border-box;
}

main #download > h2 {
	border-bottom: 1px solid #8bc34a;
}

main #usage > h2 {
	border-bottom: 1px solid #00bcd4;
}

main #indexers .list {
	display: flex;
	flex-wrap: wrap;
	margin: 0 -8px;
}

main #indexers .list a:link ,
main #indexers .list a:visited {
	display: block;
	min-width: 10em;
	padding: 8px;
	margin: 8px;
	flex: 1;
	text-decoration: none;
	transition: all 0.2s;
	border-bottom: 1px solid #fff;
}

main #indexers .list a:hover {
	color: #000;
	border-bottom: 1px solid #000;
}

footer {
	padding: 8px;
	text-align: center;
	border-top: 1px solid #ccc;
}
