header, nav, section, article, aside, footer, hgroup {
	display: block;
}

@font-face {
	font-family: 'MuseoSlab500';
	font-weight: normal;
	font-style: normal;
	src: url('../fonts/Museo_Slab_500.eot');
	src: local('Museo Slab 500'), local('MuseoSlab-500'), url('../fonts/Museo_Slab_500.woff') format('woff'), url('../fonts/Museo_Slab_500.otf') format('opentype');
}

@font-face {
  font-family: 'PT Sans';
  font-style: normal;
  font-weight: 400;
  src: local('PT Sans'), local('PTSans-Regular'), url('../fonts/PT_Sans.woff') format('woff');
}

body {
	font-size: 16px;
	line-height: 1.5em;
	font-family: "PT Sans", "Helvetica Neue", "Lucida Grande", "Lucida Sans Unicode", Helvetica, Arial, sans-serif;
	background: #f4f4f4;
}

a, a:visited {
	color: #444;
	text-decoration: underline;
}
a:active, a:hover {
	color: #000;
}

h1, h2, h3, h4, h5, h6, .toc_title {
	font-family: MuseoSlab500, "Lucida Grande", "Lucida Sans Unicode", "Helvetica Neue", "Bitstream Vera Sans", Helvetica, Arial, sans-serif;
}
	h1, h2 {
		text-shadow: 0 1px 0 #FFFFFF;
	}
	h1 {
		font-size: 2em;
		line-height: 1.5;
		margin: 0.75em 0 0.75em 0;
	}
	h2 {
		font-size: 1.5em;
		line-height: 1.25;
		margin: 1.5833em 0 0.6667em;
	}
	h3 {
		font-size: 1.25em;
		line-height: 1.2;
		margin: 1.8em 0 0.6em;
	}
	h4 {
		font-size: 1.125em;
		line-height: 1.3333;
		margin: 2em 0 0.66667em;
	}
	h5, h6 {
		font-size: 1em;
		line-height: 1.5;
		margin: 1.5em 0 0;
	}
	h1 small, h2 small, h3 small, h4 small, h5 small, h6 small {
		font-size: 12px;
		font-family:  "Helvetica Neue", "Lucida Grande", "Lucida Sans Unicode", Helvetica, Arial, sans-serif;
		font-weight: normal;
	}

p, ol, ul, dl, pre, figure, footer {
    margin: 0 0 1.5em 0;
}

ul {
	padding-left: 0;
	list-style-type: none;
}
	ul li {
		margin: 0;
	}
	ul li:before {
		content: "\2013";
		position: relative;
		left: -1ex;
	}

dl {
	clear: both;
}
	dl dt {
		clear: left;
		float: left;
		margin-bottom: .5em;
		width: 5em;
	}
	dl dd {
		margin-left: 5em;
		margin-bottom: .5em;
	}

.button {
	display: inline-block;
	outline: none;
	cursor: pointer;
	text-align: center;
	text-decoration: none;
	font: 14px/100% Arial, Helvetica, sans-serif;
	padding: .5em 2em .55em;
	text-shadow: 0 1px 1px rgba(0,0,0,.3);
	-webkit-border-radius: .4em; 
	-moz-border-radius: .4em;
	border-radius: .4em;
	-webkit-box-shadow: 0 1px 2px rgba(0,0,0,.2);
	-moz-box-shadow: 0 1px 2px rgba(0,0,0,.2);
	box-shadow: 0 1px 2px rgba(0,0,0,.2);
}
	.button:hover {
		text-decoration: none;
	}
	.button:active {
		position: relative;
		top: 1px;
	}
	
/* white */
.white {
	color: #606060;
	border: solid 1px #b7b7b7;
	background: #fff;
	background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#ededed));
	background: -moz-linear-gradient(top,  #fff,  #ededed);
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#ededed');
}
	.white:hover {
		background: #ededed;
		background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#dcdcdc));
		background: -moz-linear-gradient(top,  #fff,  #dcdcdc);
		filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#dcdcdc');
	}
	.white:active {
		color: #999;
		background: -webkit-gradient(linear, left top, left bottom, from(#ededed), to(#fff));
		background: -moz-linear-gradient(top,  #ededed,  #fff);
		filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#ededed', endColorstr='#ffffff');
	}
	
/* orange */
.orange {
	color: #fef4e9;
	border: solid 1px #da7c0c;
	background: #f78d1d;
	background: -webkit-gradient(linear, left top, left bottom, from(#faa51a), to(#f47a20));
	background: -moz-linear-gradient(top,  #faa51a,  #f47a20);
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#faa51a', endColorstr='#f47a20');
}
	.orange:hover {
		color: #fef4e9;
		background: #f47c20;
		background: -webkit-gradient(linear, left top, left bottom, from(#f88e11), to(#f06015));
		background: -moz-linear-gradient(top,  #f88e11,  #f06015);
		filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#f88e11', endColorstr='#f06015');
	}
	.orange:active {
		color: #fcd3a5;
		background: -webkit-gradient(linear, left top, left bottom, from(#f47a20), to(#faa51a));
		background: -moz-linear-gradient(top,  #f47a20,  #faa51a);
		filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#f47a20', endColorstr='#faa51a');
	}

div#sidebar {
	background: #fff;
	position: fixed;
	z-index: 10;
	top: 0;
	left: 0;
	bottom: 0;
	width: 240px;
	overflow-y: auto;
	overflow-x: hidden;
	-webkit-overflow-scrolling: touch;
	padding: 15px 15px 30px 30px;
	border-right: 1px solid #bbb;
	-webkit-box-shadow: 0 0 20px #ccc;
	-moz-box-shadow: 0 0 20px #ccc;
	box-shadow: 0 0 20px #ccc;
}
	div#sidebar a, a:visited {
		color: black;
		text-decoration: none;
	}
	div#sidebar a:hover {
		text-decoration: underline;
	}
	a.toc_title, a.toc_title:visited {
		display: block;
		font-weight: bold;
		margin: 1em 0 .2em;
	}
	div#sidebar .version {
		font-size: 10px;
		font-weight: normal;
	}
	div#sidebar ul {
		font-size: 12px;
		line-height: 20px;
		margin-bottom: .5em;
	}
		div#sidebar ul ul {
			margin: 0 0 0 1em;
		}
			div#sidebar li.link_out:before {
				content: "\00BB";
			}
			
div.container {
	position: relative;
	width: 45em;
	margin: 40px 0 50px 320px;
}
	div.container ul li {
		margin-bottom: .5em;
		text-indent: -1.5ex;
	}
	div.container ul.small {
		font-size: 14px;
	}

div.run {
	cursor: pointer;
	font-family: Arial, Courier, Times New Roman, serif;
	font-size: 16px;
	position: absolute;
	bottom: 15px;
	right: 15px;
}
	div.run a {
		border-radius: .2em;
		padding: .2em .5em .2em .6em;
	}

p.warning {
	font-size: 13px;
	font-style: italic;
}

p.notice {
	background-color: #ffeeaa;
	border: 0 solid #eedd88;
	border-left-width: 5px;
	box-shadow: 0 0 6px rgba(0, 0, 0, 0.5);
	color: #443;
	font-size: 12px;
	padding: 2px 6px 2px 15px;
	margin: 1.5em 0 1.5em -1em;
}

a.punch {
	display: inline-block;
	background: #4162a8;
	border-top: 1px solid #38538c;
	border-right: 1px solid #1f2d4d;
	border-bottom: 1px solid #151e33;
	border-left: 1px solid #1f2d4d;
	border-radius: .4em;
	-webkit-box-shadow: inset 0 1px 10px 1px #5c8bee, 0px 1px 0 #1d2c4d, 0 6px 0px #1f3053, 0 8px 4px 1px #333;
	-moz-box-shadow: inset 0 1px 10px 1px #5c8bee, 0px 1px 0 #1d2c4d, 0 6px 0px #1f3053, 0 8px 4px 1px #333;
	box-shadow: inset 0 1px 10px 1px #5c8bee, 0px 1px 0 #1d2c4d, 0 6px 0px #1f3053, 0 8px 4px 1px #333;
	color: #fff;
	font-weight: bold;
	line-height: 1;
	margin-bottom: 15px;
	padding: 10px 0;
	text-align: center;
	text-shadow: 0px -1px 1px #1e2d4d;
	text-decoration: none;
	width: 225px;
	-webkit-background-clip: padding-box;
}
	a.punch:hover {
		-webkit-box-shadow: inset 0 0px 20px 1px #87adff, 0px 1px 0 #1d2c4d, 0 6px 0px #1f3053, 0 8px 4px 1px #333;
		-moz-box-shadow: inset 0 0px 20px 1px #87adff, 0px 1px 0 #1d2c4d, 0 6px 0px #1f3053, 0 8px 4px 1px #333;
		box-shadow: inset 0 0px 20px 1px #87adff, 0px 1px 0 #1d2c4d, 0 6px 0px #1f3053, 0 8px 4px 1px #333;
		cursor: pointer;
	}
	a.punch:active {
		-webkit-box-shadow: inset 0 1px 10px 1px #5c8bee, 0 1px 0 #1d2c4d, 0 2px 0 #1f3053, 0 4px 3px 0 #333;
		-moz-box-shadow: inset 0 1px 10px 1px #5c8bee, 0 1px 0 #1d2c4d, 0 2px 0 #1f3053, 0 4px 3px 0 #333;
		box-shadow: inset 0 1px 10px 1px #5c8bee, 0 1px 0 #1d2c4d, 0 2px 0 #1f3053, 0 4px 3px 0 #333;
		margin-top: 5px; margin-bottom: 10px;
	}

a img {
	border: 0;
}

img.example_image {
	margin: 0 auto;
}
	img.example_retina {
		margin: 20px;
		box-shadow: 0 8px 15px rgba(0,0,0,0.4);
	}

span.alias {
	font-size: 14px;
	font-style: italic;
	margin-left: 20px;
}

table {
	margin: 15px 0 0; padding: 0;
}
	table .rule {
		height: 1px;
		background: #ccc;
		margin: 5px 0;
	}
	tr, td {
		margin: 0; padding: 0;
	}
		td {
			padding: 0px 15px 5px 0;
		}

h3.code, h4.code, h5.code, code, pre, q {
	font-family: Consolas, Monaco, 'Andale Mono', 'Liberation Mono', 'Lucida Console', monospace;
	font-style: normal;
}
code, pre, q {
	font-size: 13px;
	font-weight: normal;
	line-height: 18px;

	direction: ltr;
	text-align: left;
	white-space: pre;
	word-spacing: normal;

	-moz-tab-size: 4;
	-o-tab-size: 4;
	tab-size: 4;

	-webkit-hyphens: none;
	-moz-hyphens: none;
	-ms-hyphens: none;
	hyphens: none;
}
	q:before, q:after {
		content: '';
	}
	q {
		border-radius: .2em;
		display: inline-block; /* Prevents the syndrome where the left border and part of the padding are rendered on the previous line */
		padding: 0 3px;
		margin: 0;
		background: #fff;
		border: 1px solid #ddd;
		white-space: nowrap;
	}
		li q {
			display: inline; /* No idea why, but having them `inline-block` in a list gets the sizing wrong */
		}
		a q {
			border-bottom: none;
			color: #111;
			text-decoration: underline;
		}
			a:hover q {
				color: #000;
			}
	code {
		margin-left: 20px;
	}
		h4 code {
			white-space: pre-wrap;
		}
	pre {
		box-shadow: 0 0 6px rgba(0, 0, 0, 0.5);
		font-size: 12px;
		padding: 2px 6px 2px 15px;
		position: relative;
		border: 0 solid #aaa;
		border-left-width: 5px;
		margin: 1.5em 0 1.5em -1em;
	}
	pre code {
		margin: 0;
	}
	pre.nomargin {
		border-top: 1px solid #444;
		margin-top: -1.5em;
	}

#change-log small {
	float: right;
}
	#change-log small .date {
		color: #999;
	}


@media only screen and (-webkit-max-device-pixel-ratio: 1) and (max-width: 600px),
		only screen and (max--moz-device-pixel-ratio: 1) and (max-width: 600px) {
	div#sidebar {
		display: none;
	}
	img#logo {
		max-width: 450px;
		width: 100%;
		height: auto;
	}
	div.container {
		width: auto;
		margin-left: 15px;
		margin-right: 15px;
	}
	p, div.container ul {
		width: auto;
	}
}


@media only screen and (-webkit-min-device-pixel-ratio: 1.5) and (max-width: 640px),
	only screen and (-o-min-device-pixel-ratio: 3/2) and (max-width: 640px),
	only screen and (min-device-pixel-ratio: 1.5) and (max-width: 640px) {
	img {
		max-width: 100%;
		height: auto;
	}
	div#sidebar {
		-webkit-overflow-scrolling: initial;
		position: relative;
		width: 90%;
		height: 120px;
		left: 0;
		top: -7px;
		padding: 10px 0 10px 30px;
		border: 0;
	}
	img#logo {
		width: auto;
		height: auto;
	}
	div.container {
		margin: 0;
		width: 100%;
	}
	p, div.container ul {
		max-width: 98%;
		overflow-x: scroll;
	}
	table {
		position: relative;
	}
		tr:first-child td {
			padding-bottom: 25px;
		}
		td.text {
			padding: 0;
			position: absolute;
			left: 0;
			top: 48px;
		}
		tr:last-child td.text {
			top: 122px;
		}
	pre {
		overflow: scroll;
	}
}

/**
 * Prism
 */

code[class*="language-"],
pre[class*="language-"] {
	color: #FFF;
}

/* Code blocks */
pre[class*="language-"] {
	padding: 1em;
	overflow: auto;
}

:not(pre) > code[class*="language-"],
pre[class*="language-"] {
	background: #0C131C;
}

/* Inline code */
:not(pre) > code[class*="language-"] {
	padding: .1em;
	border-radius: .3em;
}

.token.comment,
.token.prolog,
.token.doctype,
.token.cdata {
	color: #3FBF3F;
}

.token.punctuation {
	color: #FFF;
}

.namespace {
	opacity: .7;
}

.token.property,
.token.boolean,
.token.number {
	color: #FF8080;
}

.token.selector,
.token.attr-value,
.token.string {
	color: #A0FFA0;
}

.token.attr-name,
.token.operator,
.token.entity,
.token.url,
.language-css .token.string,
.style .token.string {
	color: #FFF;
}

.token.tag,
.token.atrule,
.token.keyword {
	color: #0099FF;
	font-weight: bold;
}
.token.atrule,
.token.keyword {
	font-style: italic;
}

.token.regex,
.token.important {
	color: #e90;
}

.token.important {
	font-weight: bold;
}

.token.entity {
	cursor: help;
}