/* @group Copy */
	
	@font-face {
		font-family: 'TeX Gyre Adventor';
		font-weight: normal;
		src: url('../fonts/tex-gyre-adventor-regular.otf');
	}
	
	@font-face {
		font-family: 'TeX Gyre Adventor';
		font-weight: bold;
		src: url('../fonts/tex-gyre-adventor-bold.otf');
	}
	
	* {
		border: none;
		box-sizing: border-box;
		-moz-box-sizing: border-box;
		-webkit-box-sizing: border-box;
		color: inherit;
		font-family: inherit;
		font-size: inherit;
		font-style: inherit;
		font-weight: inherit;
		line-height: inherit;
		list-style: none;
		margin: 0;
		outline: none;
		padding: 0;
	}
	article,
	details,
	header,
	footer,
	section {
		display: block;
		position: relative;
	}
	
	/* @group Inline */
		
		a {
			color: hsl(210, 40%, 50%);
			display: inline-block;
		}
		a:hover {
			background: hsla(210, 25%, 50%, 0.15);
			border-radius: 5px;
			-moz-border-radius: 5px;
			-webkit-border-radius: 5px;
			-moz-box-shadow: 0 0 50px hsla(210, 25%, 50%, 0.05);
			-webkit-box-shadow: 0 0 50px hsla(210, 25%, 50%, 0.05);
			color: hsl(210, 40%, 40%);
			margin: -6px -10px;
			padding: 6px 10px;
			position: relative;
		}
		
		em {
			font-style: italic;
		}
		
		strong {
			font-weight: bold;
		}
		
		code {
			font-family: 'andale mono', 'lucida console', 'bitstream vera sans mono', 'liberation mono', 'consolas';
		}
		
	/* @end */
	
	/* @group Headers */
		
		h1 {
			color: hsla(0, 0%, 0%, 1);
			font-family: 'TeX Gyre Adventor';
			font-size: 37.5pt;
			font-weight: normal;
			line-height: 55px;
			margin: 20px 0 15px 0;
		}
		h1 em {
			font-weight: bold;
			font-style: normal;
		}
		h1 a,
		h1 a:hover {
			color: inherit;
			text-decoration: none;
		}
		
		h2 {
			color: hsla(0, 0%, 0%, 1);
			font-family: 'TeX Gyre Adventor';
			font-size: 16.5pt;
			font-weight: normal;
			line-height: 28px;
			margin: 20px 0 16px 0;
		}
		h2 em {
			font-weight: bold;
			font-style: normal;
		}
		
		h3 {
			font-size: 9pt;
			font-weight: bold;
			margin: 20px 0 10px 0;
		}
		h2 + h3 {
			margin-top: 10px;
		}
		
		details {
			height: 20px;
			font-family: 'TeX Gyre Adventor';
			font-size: 8pt;
			font-weight: bold;
			line-height: 20px;
			margin: 0;
			text-transform: uppercase;
		}
		details + h1 {
			margin: 0 0 15px 0;
		}
		
	/* @end */
	
	/* @group Paragraphs */
		
		blockquote {
			border-bottom: 10px solid hsla(210, 25%, 50%, 0.05);
			border-top: 10px solid hsla(210, 25%, 50%, 0.05);
			margin: 20px 0;
			padding: 20px 0;
		}
		blockquote:first-child {
			margin-top: 0;
		}
		blockquote:last-child {
			margin-bottom: 0;
		}
		
		p {
			margin: 10px 0;
		}
		p:first-child {
			margin-top: 0;
		}
		p:last-child {
			margin-bottom: 0;
		}
		
		pre {
			border-bottom: 10px solid hsla(210, 25%, 50%, 0.05);
			border-top: 10px solid hsla(210, 25%, 50%, 0.05);
			color: hsl(0, 0%, 30%);
			counter-reset: lines;
			font-family: 'andale mono', 'lucida console', 'bitstream vera sans mono', 'liberation mono', 'consolas';
			font-size: 9pt;
			margin: 20px 0;
			padding: 20px 0;
			white-space: pre-wrap;
		}
		pre:first-child {
			margin-top: 0;
		}
		pre:last-child {
			margin-bottom: 0;
		}
		pre + pre {
			border-top: none;
			padding-top: 0;
		}
		
		pre > .line {
			counter-increment: lines;
			display: inline-block;
			position: relative;
			width: 100%;
		}
		pre > .line:after {
			color: hsl(0, 0%, 80%);
			content: counter(lines);
			display: block;
			position: absolute;
			right: 0;
			top: 0;
		}
		
		/* @group Syntax */
			
			pre .comment {
				color: hsl(0, 0%, 70%);
			}
			
			/* @group Source */
				
				pre .context-source .class,
				pre .context-source .function,
				pre .context-source .constant {
					color: hsl(0, 0%, 40%);
				}
				
				pre .context-source .keyword {
					color: hsl(0, 0%, 20%);
				}
				
				pre .context-source .number {
					color: hsl(80, 60%, 40%);
				}
				
				pre .context-source .property {
					color: hsl(0, 0%, 40%);
				}
				
				pre .context-source .selector {
					color: hsl(0, 0%, 20%);
				}
				
				pre .context-source .string {
					color: hsl(210, 60%, 40%);
				}
				
				pre .context-source .variable {
					color: hsl(300, 60%, 40%);
				}
				
			/* @end */
			
			/* @group Markup */
				
				pre .context-markup .declaration,
				pre .context-markup .tag {
					color: hsl(0, 0%, 20%);
				}
				
				pre .context-markup .attribute {
					color: hsl(0, 0%, 40%);
				}
				
				pre .context-markup .entity {
					color: hsl(300, 60%, 40%);
				}
				
				pre .context-markup .value {
					color: hsl(210, 60%, 40%);
				}
				
				pre .context-markup .xpath {
					color: hsl(30, 60%, 40%);
				}
				
			/* @end */
			
		/* @end */
		
	/* @end */
	
	/* @group Lists */
		
		dl {
			margin: 10px;
			overflow: hidden;
		}
		dl dt {
			clear: both;
			float: left;
			width: 170px;
		}
		dl dd {
			margin: 0 0 0 190px;
		}
		
		ol {
			counter-reset: list;
			margin: 10px;
		}
		ol:first-child {
			margin-top: 0;
		}
		ol:last-child {
			margin-bottom: 0;
		}
		ol li:before {
			content: counter(list) '.';
			counter-increment: list;
			display: inline-block;
			margin: 0 5px 0 0;
		}
		
		ul {
			margin: 10px;
		}
		ul:first-child {
			margin-top: 0;
		}
		ul:last-child {
			margin-bottom: 0;
		}
		ul li:before,
		dl dt:before {
			content: '\2022';
			display: inline-block;
			margin: 0 5px 0 0;
		}
		
	/* @end */
	
	/* @group Navigation */
		
		nav {
			font-family: 'TeX Gyre Adventor';
			font-size: 8pt;
			font-weight: bold;
			line-height: 20px;
			margin: 10px 0;
			text-transform: uppercase;
		}
		nav:first-child {
			margin-top: 0;
		}
		nav:last-child {
			margin-bottom: 0;
		}
		nav > ul {
			margin: 0;
		}
		nav > ul li {
			display: inline-block;
		}
		header nav li:before {
			content: '\00b7\00a0';
			margin: 0;
		}
		header nav li:first-child:before {
			display: none;
		}
		
		footer nav li {
			display: inline-block;
		}
		footer nav li:before {
			display: none;
		}
		footer nav li.older + li.newer:before {
			content: '\00a0\00b7\00a0';
			display: inline;
			margin: 0;
		}
		footer nav li.older a:before {
			content: '\00ab\00a0';
		}
		footer nav li.newer a:after {
			content: '\00a0\00bb';
		}
		
	/* @end */
	
	/* @group Images */
		
		img {
			border-bottom: 10px solid hsla(210, 25%, 50%, 0.05);
			border-top: 10px solid hsla(210, 25%, 50%, 0.05);
			display: block;
			margin: 20px 0;
			max-width: 100%;
			padding: 20px 0;
		}
		img:first-child {
			margin-top: 0;
		}
		img:last-child {
			margin-bottom: 0;
		}
		img.zoomable {
			cursor: pointer;
		}
		header + img,
		img + img,
		img:first-child {
			border-top: none;
			padding-top: 0;
		}
		
		.backdrop {
			background: hsla(0, 0%, 0%, 0.8);
			bottom: 0;
			left: 0;
			position: fixed;
			right: 0;
			top: 0;
		}
		img.popup {
			background: #ffffff;
			border: none;
			box-shadow: 0 0 10px hsla(0, 0%, 0%, 0.8);
			-moz-box-shadow: 0 0 10px hsla(0, 0%, 0%, 0.8);
			-webkit-box-shadow: 0 0 10px hsla(0, 0%, 0%, 0.8);
			max-width: none;
			margin: 0;
			padding: 20px;
			position: absolute;
		}
		
		img.avatar {
			border: none;
			border-left: 10px solid hsla(210, 25%, 50%, 0.05);
			float: right;
			margin: 0 0 0 20px;
			padding: 0 0 0 20px;
			vertical-align: bottom;
		}
		
	/* @end */
	
	/* @group Forms */
		
		form input,
		form textarea {
			border-radius: 5px;
			-moz-border-radius: 5px;
			-webkit-border-radius: 5px;
			margin: 10px 0;
			padding: 10px;
			width: 100%;
		}
		form textarea {
			height: 200px;
		}
		form button {
			border-radius: 5px;
			-moz-border-radius: 5px;
			-webkit-border-radius: 5px;
			padding: 10px;
			margin: 7px 0 0 0;
		}
		form button,
		form input,
		form textarea {
			background: hsla(210, 25%, 50%, 0.1);
		}
		form button:hover,
		form button:focus,
		form input:hover,
		form input:focus,
		form textarea:hover,
		form textarea:focus {
			background: hsla(210, 25%, 50%, 0.15);
		}
		
	/* @end */
	
/* @end */