body {
	background-color: #eee;
	color: #222;
	font: 16px"Lucida Grande",Arial,sans-serif;
	line-height: 1.5em;
	margin: 0;
	padding: 0;
	counter-reset: h2
}

body>header {
	box-sizing: border-box;
	margin: 1em auto 2em;
	text-align: center;
	font-weight: 700;
	max-width: 768px
}

body>header p {
	margin: .5em
}

body>header .category {
	font-size: 20px;
	list-style-type: none
}

body>header ol {
	font-size: 20px;
	margin: .5em;
	padding: 0
}

body>header li {
	display: inline-block;
	white-space: nowrap
}

body>header li:not(:first-child)::before {
	color: #666;
	content: "› "
}

body>footer {
	margin: 2em auto 1em;
	text-align: center;
	max-width: 768px
}

body.dark {
	background-color: #111;
	color: #aaa
}

a,a:visited {
	color: #000;
	text-decoration: none
}

a:hover,a:visited:hover {
	text-decoration: underline
}

.dark a,.dark a:visited {
	color: #aaa
}

h2:before,h3:before {
	color: #888;
	font-size: 14px
}

h2 {
	counter-reset: h3
}

section>h3 {
	font-size: 18px;
	margin: 1.5em 0 1em
}

section>h3:before {
	counter-increment: h3;
	content: counter(h2)"."counter(h3)" "
}

article {
	background-color: #fafafa;
	box-sizing: border-box;
	padding: 1em;
	margin: 1em auto;
	max-width: 768px
}

article header h1 {
	display: inline-block;
	font-size: 32px;
	margin: 0
}

article header p {
	display: inline-block;
	font-weight: 700;
	margin: 0 0 0 .5em
}

article header ul {
	font-style: italic;
	list-style-type: none;
	margin: 1.5em;
	padding: 0
}

article header ul li {
	margin: 0;
	padding: 0
}

article section h2 {
	font-size: 20px;
	margin: 2em 0 1em
}

article section h2:before {
	counter-increment: h2;
	content: counter(h2)" "
}

article p {
	margin: 1em 0
}

article a,article a:visited {
	color: #a00
}

.license,.repository,a[download] {
	display: block;
	margin: 1em;
	font-size: 14px;
	text-align: right
}

b,code,i {
	white-space: nowrap
}

del,ins {
	background-color: #fafa99;
	color: inherit;
	font-style: inherit;
	font-weight: inherit;
	text-decoration: none
}

del {
	text-decoration: line-through
}

figure {
	text-align: center;
	display: block;
	margin: 2em auto;
	padding: 0
}

figure img {
	max-width: 100%;
	height: auto
}

figcaption {
	font-size: 14px;
	font-style: italic
}

.formula {
	padding: 0 0 0 1em
}

code {
	font: 13px Courier,monospace
}

.directive {
	color: #aa616a;
	font-weight: 700
}

.comment {
	color: #555;
	font-style: italic
}

.constant {
	color: #909
}

.keyword {
	color: #900
}

.cc-type,.msdn-type,.type,.unity-type {
	color: #050!important;
	font-weight: 700
}

.unity-method {
	color: #000!important;
	font-weight: 700
}

.cg-function,.cg-macro {
	color: #009!important;
	font-weight: 700
}

article table {
	margin: 0 auto;
	text-align: center;
	border-collapse: collapse
}

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

.dark article tr:nth-child(even) {
	background-color: #444
}

article td {
	padding: 0 1em
}

aside {
	background-color: #ddd;
	border: 2px solid #ccc;
	font-size: 14px;
	margin: 1em;
	padding: 0 1em
}

aside h3 {
	font-size: 14px;
	margin: 0 0 1em;
	padding: 1em 0 0;
	cursor: pointer
}

aside div {
	display: none
}

aside div.expanded {
	display: block
}

.dark #theme-switcher,.dark #toc,.dark article {
	background-color: #333
}

.dark article a,.dark article a:visited {
	color: #f44
}

.dark del,.dark ins {
	background-color: #411
}

.dark .directive {
	color: #a67
}

.dark .comment {
	color: #888a85
}

.dark .constant {
	color: #edd400
}

.dark .keyword {
	color: #099
}

.dark .cc-type,.dark .msdn-type,.dark .type,.dark .unity-type {
	color: #ad7fa7!important
}

.dark .unity-method {
	color: #aaa!important
}

.dark .cg-function,.dark .cg-macro {
	color: #719ecf!important
}

.dark aside {
	background-color: #444;
	border-color: #555
}

pre {
	border-width: 1px;
	border-style: solid;
	border-color: #999;
	font: 13px Courier,monospace;
	padding: 1em;
	tab-size: 4;
	overflow: none;
	-moz-tab-size: 4;
	-webkit-text-size-adjust: 100%
}

.tutorials ol,article aside h3 {
	text-align: center
}

.tutorials li {
	background-color: #000;
	background-origin: content-box;
	background-repeat: no-repeat;
	background-position: center top;
	background-size: contain;
	height: 150px;
	width: 240px;
	display: inline-block;
	margin: 2px;
	padding: 0
}

.tutorials li a,.tutorials li a:visited {
	color: #fafafa;
	display: block;
	padding: 122px 0 0;
	font-size: 16px
}

.tutorials li a:hover {
	text-decoration: none
}

.tutorials li:hover {
	background-color: #a00
}

#theme-switcher,#toc,.dark .tutorials li {
	background-color: #ccc
}

.dark .tutorials li:hover {
	background-color: #f44
}

.dark .tutorials li a,.dark .tutorials li a:visited {
	color: #333;
	display: block;
	padding: 122px 0 0;
	font-size: 16px
}

.dark .tutorials li a:hover {
	color: #000
}

#theme-switcher,#toc {
	font-size: 13px
}

#theme-switcher {
	position: absolute;
	top: 4px;
	left: 4px;
	width: 100px;
	height: 24px;
	text-align: center;
	cursor: pointer
}

#toc {
	border: 4px solid #eee;
	position: fixed;
	top: 0;
	right: 0;
	padding: 0 10px;
	counter-reset: toc-h2
}

#toc :before {
	color: #555
}

#toc a,#toc div {
	cursor: pointer
}

#toc ol,.tutorials ol {
	list-style-type: none;
	margin: 0;
	padding: 0
}

#toc li {
	margin: 2px 1em;
	padding: 0
}

.dark #toc {
	border-color: #111
}

.dark #toc :before {
	color: #888
}

.toc-h2:before {
	counter-reset: toc-h3;
	counter-increment: toc-h2;
	content: counter(toc-h2)" "
}

.toc-h3:before {
	counter-increment: toc-h3;
	content: counter(toc-h2)"."counter(toc-h3)" "
}

@media print {
	article,body {
		background-color: #fff
	}

	article {
		max-width: 100%
	}

	article a,article a:visited,body {
		color: #000
	}

	#theme-switcher,#toc,article a[download] {
		display: none
	}

	article section h2 {
		page-break-before: always
	}

	aside,figure,p,pre,section section,table,footer {
		page-break-inside: avoid
	}

	aside div {
		display: block
	}
}

.support-ko-fi,.support-patreon {
	display: inline-block;
	width: 100px;
	height: 100px;
	background-size: contain;
	background-image: url(/proxy/123456/catlikecoding.com/images/logo-patreon-black.svg)
}

.dark .support-patreon {
	background-image: url(/proxy/123456/catlikecoding.com/images/logo-patreon-white.svg)
}

.support-ko-fi {
	width: 145px;
	background-image: url(/proxy/123456/catlikecoding.com/images/logo-ko-fi.png)
}