/*-----------------------------------------------------------------------------

Copyright (C) 2019 Jacob Barkdull

I, Jacob Barkdull, hereby release this work into the public domain.
This applies worldwide. If this is not legally possible, I grant any
entity the right to use this work for any purpose, without any
conditions, unless such conditions are required by law.

-----------------------------------------------------------------------------*/

@font-face {
	font-family: "Main";
	font-display: swap;
	src: local("Cantarell Regular"), url("fonts/cantarell.otf");
}

@font-face {
	font-family: "Main";
	font-display: swap;
	src: local("Cantarell Bold"), url("fonts/cantarell-bold.otf");
	font-weight: bold;
}

body {
	margin: 0px;
	padding: 0px;
	cursor: default;
	background-color: #FFFFFF;
}

*[contenteditable] {
	cursor: initial;
}

body, td, textarea, input, select {
	font-family: "Main", "Cantarell", "Arial", "Helvetica", "FreeSans", sans-serif;
	color: #000000;
	font-size: 18px;
}

body, td, textarea {
	line-height: 1.5em;
}

input, select {
	min-height: 2em;
	vertical-align: middle;
}

input[type="checkbox"],
input[type="radio"] {
	min-height: auto;
}

input[type="button"],
input[type="submit"],
select {
	cursor: pointer;
}

input, textarea {
	max-width: 100%;
}

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

img {
	-moz-box-sizing: content-box;
	-webkit-box-sizing: content-box;
	-o-box-sizing: content-box;
	box-sizing: content-box;
}

body, a, a:link, a:visited {
	text-decoration: none;
	text-transform: none;
}

a, a:link, a:visited {
	color: #0C56A0;
}

a:hover {
	color: #0098FF;
	text-decoration: underline;
	cursor: pointer;
}

img {
	vertical-align: middle;
}

table.styled {
	border-collapse: collapse;
}

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

table.styled th {
	font-weight: bold;
	text-align: center;
}

table.styled th,
table.styled td {
	border: 1px solid #CCCCCC;
}

table.styled tbody tr:nth-child(even) td {
	background-color: #F9F9F9;
}

table.styled thead th {
	background-color: #EEEEEE;
}

table, .table, dl {
	margin-bottom: 2em;
}

.table {
	display: table;
	width: 100%;
}

.table > * {
	display: table-row;
}

.table > * > * {
	display: table-cell;
	width: 50%;
}

.table > * > *:nth-child(1) {
	padding-right: 15px;
}

.table > * > *:nth-child(2) {
	padding-left: 15px;
}

.section,
.navigation-links {
	position: relative;
}

.section {
	width: 100%;
	margin-bottom: -1px;
	background-color: #F6F6FA;
	border-top: 1px solid #CCCCCC;
}

.section,
#headline h1,
#content h2,
#content h3,
.underlined {
	border-bottom: 1px solid #CCCCCC;
}

#main {
	border-top: none;
	padding-top: 60px;
}

#main.double-navigation {
	padding-top: 120px;
}

#main :last-child.container {
	padding-bottom: 60px;
}

#content.container {
	padding-top: 0px;
}

#main img,
#main video,
#main iframe,
#main .iframe-wrapper {
	max-width: 100%;
}

#main img,
#main video {
	height: auto;
}

#main .iframe-wrapper {
	overflow: auto;
	-webkit-overflow-scrolling: touch;
}

.container {
	padding: 40px;
	max-width: 980px;
	margin: 0px auto 0px auto;
	overflow: hidden;
}

.section:nth-child(even):not(:last-child),
#donate {
	background-color: #FFFFFF;
	z-index: 10;
}

#navigation {
	position: fixed;
	top: 0px;
	left: 0px;
	min-height: 60px;
	border-top: none;
	z-index: 1000000;
}

#mobile-menu {
	position: relative;
	padding-right: 80px;
	font-weight: bold;
	padding-top: 0px;
	padding-bottom: 0px;
	min-height: 59px;
	z-index: 10;
}

#search-form {
	position: relative;
	border-top: 1px solid transparent;
	overflow: hidden;
	z-index: 10;

	-moz-transition: all 300ms linear 200ms;
	-webkit-transition: all 300ms linear 200ms;
	transition: all 300ms linear 200ms;
}

#search-form,
#navigation.hidden #search-form {
	max-height: 0px;
	margin-bottom: -1px;
}

#search-form.open {
	border-color: #CCCCCC;
	background-color: #FFFFFF;
	max-height: 100px;
	margin-bottom: 0px;
}

#navigation.hidden #steps-section,
#navigation:not(.shadow) #search-form.open {
	box-shadow: 0px 4px 4px 1px rgba(0, 0, 0, 0.10);
}

#search-form .container {
	padding-top: 20px;
	padding-bottom: 20px;
}

#search-container {
	text-align: center;
}

#search-form.open.has-results {
	max-height: 300px;
}

#search-form.has-results #search-container {
	padding-bottom: 1em;
	border-bottom: 1px solid #CCCCCC;
	margin-bottom: 1em;
}

#search-results {
	max-height: 186px;
	overflow: auto;
}

#search-results .search-title {
	margin-bottom: 0.5em;
	padding-bottom: 0.5em;
	border-bottom: 1px dashed #CCCCCC;
}

#search-results .search-title a {
	font-weight: bold;
}

#search-results .search-title cite {
	display: block;
	color: #008800;
}

#search-results .search-title cite,
#search-results .search-text {
	font-size: 14px;
}

#navigation.shadow,
#mobile-menu.open .navigation-links.logo {
	background-color: #FFFFFF;

	-moz-box-shadow: 0px 0px 8px 1px rgba(0, 0, 0, 0.20);
	-webkit-box-shadow: 0px 0px 8px 1px rgba(0, 0, 0, 0.20);
	box-shadow: 0px 0px 8px 1px rgba(0, 0, 0, 0.20);
}

#navigation.hidden {
	top: -60px;

	-moz-box-shadow: none;
	-webkit-box-shadow: none;
	box-shadow: none;
}

#mobile-menu, #headline {
	text-align: center;
}

.animate-all {
	-o-transition: all 200ms linear 0s;
	-moz-transition: all 200ms linear 0s;
	-webkit-transition: all 200ms linear 0s;
	transition: all 200ms linear 0s;
}

.left {
	float: left;
}

.right {
	float: right;
}

.center {
	text-align: center;
}

.inline-block {
	display: inline-block;
}

.navigation-links {
	font-size: 0px;
}

.navigation-links a {
	display: inline-block;
	height: 59px;
	padding: 16px 12px 0px 12px;
	margin-bottom: 0px;
	border-bottom: 4px solid transparent;
	font-size: 17px;
	line-height: 27px;
}

.navigation-links a.htms-active {
	border-color: rgba(0, 152, 255, 0.5);
}

.navigation-links a:hover {
	border-color: #0098FF;
	text-decoration: none;
}

.navigation-links.logo {
	display: block;
	width: 100%;
	position: absolute;
	top: 0px;
	left: 0px;
}

#logo,
#search-button,
#mobile-menu-button,
.rss-feed:after,
.share-icon,
#donate {
	background-attachment: scroll;
	background-repeat: no-repeat;
}

#search-button,
#mobile-menu-button {
	position: absolute;
	top: 0px;
}

#mobile-menu-button {
	display: none;
	left: 20px;
	width: 50px;
	padding: 0px;
	vertical-align: top;
	background-image: url("images/mobile-menu-button.svg");
	background-position: center 14px;
}

#search-button {
	right: 40px;
	width: 40px;
	padding: 0px;
	background-image: url("images/search-button.png");
	background-position: center 14px;
}

.mobile #search-button {
	background-image: url("images/search-button.svg");
}

#logo {
	width: 88px;
	padding: 0px;
	vertical-align: top;
	background-image: url("images/navigation-logo.png");
	background-position: center top;
}

.mobile #logo {
	background-image: url("images/navigation-logo.svg");
}

#headline {
	padding-top: 20px;
}

#headline.container {
	padding-top: 60px;
}

#headline h2,
#headline h3 {
	font-weight: normal;
	margin: 0px;
}

#hashover-comment-count:after {
	content: " comments";
	white-space: nowrap;
}

#hashover-comment-count:empty:after {
	content: "Comment";
}

h1, .h1 {
	font-size: 32px;
	font-weight: bold;
	line-height: 1.5em;
	margin-top: -0.25em;
}

h2, .h2 {
	font-size: 24px;
	font-weight: bold;
	line-height: 1.5em;
	margin-top: -0.25em;
}

h3, .h3 {
	font-size: 20px;
	font-weight: bold;
	line-height: 1.5em;
	margin-top: -0.25em;
}

h1, h2, h3 {
	margin: 2em 0px 1em 0px;
}

h1:first-child,
h2:first-child,
h3:first-child {
	margin-top: -0.25em;
}

p, .p {
	margin: 0px 0px 1em 0px;
}

ol, ul {
	margin: 0px 0px 1em 0px;
	padding: 0px 0px 0px 2em;
}

li {
	margin-bottom: 16px;
}

.hashover li {
	margin-bottom: 0px;
}

ol, ul {
	margin: 0px 0px 1em 0px;
	padding: 0px 0px 0px 3em;
	clear: both;
}

#headline h1,
#content h2,
#content h3,
.underlined {
	display: block;
	padding-bottom: 0.5em;
	margin-bottom: 0.5em;
	overflow: hidden;
}

.muted-text {
	color: #808080;
}

.container.featurette:not(:last-child) {
	padding-bottom: 0px;
}

.htms-summary {
	padding-top: 32px;
	border-top: 2px solid #CCCCCC;
}

.htms-summary:not(:last-child) {
	margin-bottom: 32px;
}

.htms-summary-title {
	margin-bottom: 0.25em;
	font-size: 24px;
	line-height: 1.5em;
	font-weight: bold;
}

.htms-summary-leads {
	margin-top: 1em;
	padding-top: 1em;
	border-top: 1px dashed #CCCCCC;
}

abbr {
	text-decoration: none;
	border-bottom: 1px dashed rgba(0, 0, 0, 0.5);
	cursor: help;
}

.suggestions,
.featurette-table {
	display: table;
}

.suggestions > *,
.featurette-table > * {
	display: table-cell;
}

.suggestions > * {
	width: 33%;
}

.suggestions > *:nth-child(1) {
	padding-right: 20px;
}

.suggestions > *:nth-child(2) {
	padding-right: 10px;
	padding-left: 10px;
}

.suggestions > *:nth-child(3) {
	padding-left: 20px;
}

.suggestions .htms-summary-title {
	font-size: 18px;
	height: 1.5em;
	overflow: hidden;
}

.suggestions .htms-summary-leads > p,
.suggestions .htms-summary-leads > span {
	display: block;
	height: 106px;
	overflow: hidden;
}

.suggestions .htms-summary-leads > img {
	width: 106px;
	margin-left: 10px;
	float: right;
}

.suggestions:not(.upperlined) .htms-summary {
	border-top: none;
}

#newest-software .htms-summary-date {
	display: none;
}

.featurette-table {
	width: 100%;
	border-top: 2px solid #CCCCCC;
	padding-top: 40px;
}

.featurette-table > * {
	vertical-align: middle;
}

.feature-description {
	height: 250px;
}

.featurette h2 {
	font-size: 32px;
	margin-bottom: 15px;
}

.featurette h2 a {
	color: #0098FF;
}

.featurette h2 a:hover {
	border-color: #0098FF;
}

.featurette .muted-text {
	font-size: 24px;
	line-height: 40px;
}

.feature-image {
	width: 38%;
}

.feature-image > * {
	display: block;
}

.feature-image img {
	width: auto;
}

.feature-image .left {
	margin-right: 40px;
}

.feature-image .right {
	margin-left: 40px;
}

.rss-feed:after {
	content: "";
	display: inline-block;
	width: 22px;
	height: 20px;
	margin: 0px 0px -3px 6px;
	background-position: -102px 0px;
	background-size: cover;
}

.rss-feed:after,
.share-icon {
	background-image: url("images/share-icons.png");
}

.mobile .rss-feed:after,
.mobile .share-icon {
	background-image: url("images/share-icons.svg");
}

#main .left.img,
#main img[align="left"] {
	margin: 0px 10px 10px 0px;
}

#main .right.img,
#main img[align="right"] {
	margin: 0px 0px 10px 10px;
}

#main center {
	display: block;
}

#main center,
#main table {
	margin-bottom: 1em;
}

#main .feature-image img {
	margin: 0px;
}

pre, code.block, .code {
	display: block;
	width: 100%;
	max-height: 400px;
	padding: 5px;
	margin-bottom: 1em;
	font-family: monospace;
	font-size: 14px;
	white-space: nowrap;
	line-height: 1.5em;
	overflow: auto;
	cursor: initial;
}

pre, code, .code {
	background-color: rgba(196, 196, 196, 0.25);
}

code {
	padding: 1px 4px;
	font-family: inherit;
	white-space: nowrap;
	line-height: 1em;
}

code code, .code code {
	background-color: transparent;
}

.paragraph-summary {
	display: inline-block;
	text-align: center;
	width: 320px;
	font-size: 34px;
	line-height: 1.25em;
}

.paragraph-summary.left {
	float: left;
	margin: 0px 0.5em 0.5em 0px;
}

.paragraph-summary.right {
	float: right;
	margin: 0px 0px 0.5em 0.5em;
}

hr {
	border: 0px;
	height: 1px;
	background-color: #CCCCCC;
}

#donate {
	padding-top: 100px;

	background-image: url("images/backgrounds/donate.gif");
	background-position: center top;
}

#donate.mobile {
	background-image: url("images/backgrounds/donate.svg");
}

.button,
a.button {
	display: inline-block;
	padding: 0.5em 1em 0.5em 1em;
	margin: 0.25em 0px 0.25em 0px;
	border: 1px solid rgba(128, 128, 128, 0.5);
	background-color: #FFFFFF;
	-moz-border-radius: 2em;
	-webkit-border-radius: 2em;
	border-radius: 2em;
	cursor: pointer;
}

.button:hover {
	border-color: #0098FF;
	text-decoration: none;
	color: #0098FF;
}

.button:active {
	background-color: #F8F8F8;
}

.footer-links > a {
	margin-right: 10px;
}

.footer-links > a,
.footer-links > span {
	white-space: nowrap;
}

.changelog-table td {
	padding: 8px 0px;
}

.changelog-table td:not(:first-child) {
	padding-left: 8px;
}

.changelog-table td:not(:last-child) {
	padding-right: 8px;
}

.changelog-fixed,
.changelog-changed,
.changelog-removed {
	display: inline-block;
	float: right;
	vertical-align: top;
	padding: 3px 10px 3px 10px;
	border-right: 3px solid rgba(128, 128, 128, 0.2);
	text-align: center;
}

.changelog-fixed {
	background-color: #FBFBBB;
}

.changelog-changed {
	background-color: #DDEEFF;
}

.changelog-removed {
	background-color: #FFDDDD;
}

.big-button {
	display: inline-block;
	text-align: center;
	font-size: 24px;
	line-height: 3em;
	padding: 0px 12px;
	background-color: #555555;
	color: #FCFCFC;
}

a.big-button:hover {
	background-color: #777777;
}

.big-button.wide {
	width: 100%;
}

a.big-button {
	color: #FCFCFC;
}

a.big-button:hover {
	color: #FFFFFF;
	text-decoration: none;
}

.big-button.download {
	background-color: #55BB44;
}

a.big-button.download:hover {
	background-color: #77CC66;
}

.big-button.docs {
	background-color: #4455BB;
}

a.big-button.docs:hover {
	background-color: #6677CC;
}

.share-icon {
	display: inline-block;
	width: 66px;
	height: 64px;
	margin: 0px 5px 0px 5px;
	vertical-align: middle;
}

.share-icon.twitter {
	background-position: -3px -4px;
}

.share-icon.facebook {
	background-position: -77px -4px;
}

.share-icon.reddit {
	background-position: -151px -4px;
}

.share-icon.linkedin {
	background-position: -225px -4px;
}

.share-icon.email {
	background-position: -299px -4px;
}

#contact-table {
	border-collapse: collapse;
}

#contact-table td {
	border: 1px solid #CCCCCC;
}

#contact-table textarea {
	resize: vertical;
}

#required-fields {
	display: none;
}

#hashover, #disqus_thread {
	border-top: 1px solid #CCCCCC;
	padding-top: 80px;
}

#main .paragraph, .paragraph {
	margin-bottom: 2em;
	clear: both;
}

p:last-child,
pre:last-child,
code.block:last-child,
.code:last-child {
	margin-bottom: 0px;
}

#footer {
	border-bottom: none;
}

#edit-form .container {
	border: 2px solid #CCCCAA;
	background-color: #FFFFDD;
}

@media only screen and (max-width: 800px) {
	body {
		-webkit-text-size-adjust: 100%;
	}

	body, td, textarea, input, select {
		font-size: 14px;
	}

	h1, .h1, .featurette h2 {
		font-size: 24px;
	}

	h2, .h2, h3, .h3 {
		font-size: 16px;
	}

	.table,
	.table > *,
	.table > * > * {
		display: block;
		width: 100%;
	}

	.table > * > *:nth-child(1) {
		padding-right: 0px;
		padding-bottom: 15px;
	}

	.table > * > *:nth-child(2) {
		padding-left: 0px;
		padding-top: 15px;
		padding-bottom: 0px;
	}

	.rss-feed:after {
		width: 16px;
		height: 16px;
		margin: 0px 0px -2px 4px;
		background-position: -82px 0px;
	}

	.featurette .muted-text {
		font-size: 18px;
		line-height: 30px;
	}

	.container {
		padding: 40px 20px 40px 20px;
	}

	#mobile-menu {
		padding-right: 60px;
	}

	#search-button {
		right: 20px;
	}

	.htms-summary-title {
		font-size: 18px;
	}
}

@media only screen and (max-width: 640px) {
	#mobile-menu .navigation-links:not(.logo) a {
		display: none;
	}

	#mobile-menu #search-button,
	#mobile-menu #mobile-menu-button {
		display: inline-block;
	}

	#mobile-menu {
		position: static;
		padding-right: 20px;
	}

	#mobile-menu.open {
		position: fixed;
		top: 0px;
		left: 0px;
		width: 100%;
		height: 100%;
		padding-top: 80px;
		background-color: #FFFFFF;
		overflow: auto;
	}

	#mobile-menu.open .navigation-links.logo {
		position: fixed;
		background-color: #F6F6FA;
		border-bottom: 1px solid #CCCCCC;
		height: 60px;
		z-index: 10;
	}

	#mobile-menu.open .navigation-links,
	#mobile-menu.open .navigation-links:not(.logo) a {
		display: block;
		width: 100%;
		float: initial;
	}

	#mobile-menu.open .navigation-links:not(.logo) {
		margin-bottom: 20px;
	}

	#mobile-menu.open .navigation-links:not(.logo) a {
		vertical-align: middle;
		border: none;
		margin: 0px 0px 0.5em 0px;
		background-color: #F4F4FF;
	}

	.suggestions,
	.suggestions > *:nth-child(n) {
		display: block;
	}

	.suggestions > *:nth-child(n) {
		width: 100%;
		padding-right: 0px;
		padding-left: 0px;
	}

	.suggestions .htms-summary-title {
		font-size: 18px;
		line-height: 1.5em;
		height: auto;
	}

	.suggestions .htms-summary-leads {
		height: auto;
		overflow: hidden;
	}

	.featurette-table > * {
		vertical-align: top;
	}

	.feature-image .left {
		margin-right: 20px;
	}

	.feature-image .right {
		margin-left: 20px;
	}

	.share-icon.email {
		display: none;
	}
}