html,body,div,span,h1,h2,h3,p,a,em,img,strong,article,section,header,footer,dl,dd,dt,table,th,td,figure,figcaption,aside{margin:0;padding:0;border:0;outline:0;font-size:100%;vertical-align:baseline;background:transparent}
table{border-collapse: collapse;border-spacing: 0; }

@font-face {font-family: 'GuanabaraSans-Book';
	src: url('2EC742_0_0.woff2') format('woff2'),
		 url('2EC742_0_0.woff') format('woff');}

@font-face {font-family: 'GuanabaraSans-Light';
	src: url('2EC742_1_0.woff2') format('woff2'),
		 url('2EC742_1_0.woff') format('woff');}
 
@font-face {font-family: 'GuanabaraSans-LightItalic';
	src: url('2EC760_0_0.woff2') format('woff2'),
		 url('2EC760_0_0.woff') format('woff');}

body{font-family: Arial, Helvetica, sans-serif; font-size:16px; line-height:1.5em;color:#333;background-color: #fefefe; counter-reset: notation-counter}

h1, h2, h3, h4 { margin: 1.4rem 0; }
h1 { font-size: 2.4rem; line-height: 1.2em; font-weight: normal; }
h2, h3, h4 { line-height: 1.2em; }
h2 { font-size: 1.8rem; margin-top: 3rem; }
h3 { font-size: 1.4rem; margin-top: 3rem; color: #444; }
h4 { font-size: 1rem; color: #444; }
p,ul,ol,blockquote,aside{margin:1.5em 0}
figcaption, aside, table { font-size: .92rem; line-height: 1.5em; }
ul ul {margin: 0;}
li{margin:.75em 0;}
a{color:#06c;}
a:visited{color:#034c95;}

header { background: #333;  color: #fff; padding: 1.2rem 0; }
footer { padding: 0.6rem 0; background: #e5e5e5; margin: 4rem 0 0; text-align: center; font-size: 0.9rem; }
article, header h1, header h2, header p { width: 600px; margin-right: auto; margin-left: auto; }

nav a { display: block; width: 60px; padding: 50px 0; font-size: 50px; text-decoration: none; text-align: center;
	position: fixed; right: 0; top: 45%; }
	#forward, #backward { color: #ccc !important; }
	#backward { left: 0; }
	#buy-it { height: auto; text-align: center; width: 120px;
		top: 30px; width: 300px; right: -60px; padding: 10px 0;
		color: #fff; font-size: 0.9rem; text-decoration: none; text-indent: 0;
		background: #BA4185; 
		-ms-transform: rotate(35deg); /* IE 9 */
		-webkit-transform: rotate(35deg); /* Chrome, Safari, Opera */
	    transform: rotate(35deg);
}
.subtitle { font-size: 1.2rem; margin-top: -1rem; font-style: oblique; }
.cover { float: right; margin: 0 0 .6rem .6rem; }
.buy { list-style: none; padding: 0; overflow: hidden; margin: 0; font-size: 1.2rem; }
.buy li { margin: 0; }
.buy a:link, .buy a:visited { width: 45%; display: block; float: left; margin-right: 5%; background: #e85151; text-decoration: none; padding: 25px 0; text-align: center; border-radius: 5px; color: #fff; }
.buy a:hover { background: #BA4185; }
.anchorjs-link { background: url('link.svg') no-repeat; background-size: auto 100%; text-decoration: none; display: inline-block; 
	width: 24px; height: 24px; vertical-align: text-top; margin-left: 8px; }
	h3 .anchorjs-link { height: 19px; margin-left: 6px ;}
#book-title { font-style: oblique; }
	#book-title a:link, #book-title a:visited { text-decoration: none; color: #fff; font-size: 1.1rem;}
	#book-title a:hover { text-decoration: underline; }
#toc, #toc ol { list-style: none; line-height: 1.6rem; }
	#toc > li li { margin: .6rem 0; }
#dedication { text-align: center; font-style: oblique; }
#dedication blockquote { margin-left: 0; }
#praise blockquote { margin: 1.2rem 0 .4rem; }

cite { text-align: right; display: block; font-style: normal;}
blockquote { font-style: oblique; margin-left: 1.5rem; }
a:link { color: #e85151; }
a:visited { color: #BA4185; }
ol ol { margin: 0; }

figure { margin: 1.2rem 0 1.2rem; }
figure img { display: block; }
figcaption { font-style: oblique; margin: .4rem 0 1.2rem; display: block; }
figure table { margin-top: -.6rem; }
img, table { max-width: 100%; height: auto; }
.comparison ul { list-style: none; margin: 0; padding: 0; overflow: auto; text-align: center; }
	.comparison li { width: 50%; float: left; position: relative; margin: 0; }
		.four-up li { width: 25%; }
	.comparison figure { margin: 0; }
	.comparison img { margin: 0 auto; }
	.overlay li figcaption { position: absolute; top: 10px; left: 10px; color: #fff; text-align: left; }

aside { background: #f8f8f8; border-top: 2px #ccc solid; border-bottom: 2px #ccc solid; padding: 0 1.2rem; margin: 1.2rem 0; }
th, td { padding: 8px 10px; border-bottom: 1px #ccc solid; text-align: left; }
th { font-weight: bold; border-width: 2px; background: #eee; }

pre, code, .notation li:before { font-family: Consolas, Monaco, 'Andale Mono', monospace; }
pre { margin: .5rem 0; padding: 1em; overflow: auto; background: #f8f8f8; }
	code.notation, ol.notation li { counter-increment: notation-counter; }
	code.notation:after, ol.notation > li:before { 
		display: inline-block; content:counter(notation-counter); border-radius: 50%; height: 1rem; width: 1rem; margin-left: 2px; 
	font-size: .65rem; background: #e85151; color: #fff; text-align: center; line-height: 1.1rem; vertical-align: middle; }
	ol.notation { counter-reset:li; /* Initiate a counter */ }
	ol.notation > li { position:relative; list-style:none; }
	ol.notation > li:before {
	    content:counter(li); counter-increment:li;
	    position:absolute; left:-1.5rem;
	    -moz-box-sizing:border-box;
	    -webkit-box-sizing:border-box;
	    box-sizing:border-box;
	    margin-right:8px;
	}
pre::-webkit-scrollbar:horizontal, table::-webkit-scrollbar:horizontal { height: 11px; }
code, pre { text-align: left; white-space: pre; word-spacing: normal; word-break: normal; line-height: 1.5;
	-moz-tab-size: 4; -o-tab-size: 4; tab-size: 4;
	-webkit-hyphens: none; -moz-hyphens: none; -ms-hyphens: none; hyphens: none;
}

.token.comment, .token.prolog, .token.doctype { color: slategray;}
.token.punctuation { color: #999; }
.namespace { opacity: .7; }
.token.property, .token.tag, .token.number { color: #BA4185; }
.token.selector, .token.attr-name, .token.string { color: #690; }
.token.url, .token.string, .style .token.string { color: #a67f59; }
.token.atrule, .token.attr-value, .token.keyword { color: #07a; }
.token.function { color: #DD4A68; }
.token.important { color: #e90; font-weight: bold; }

@media (max-width: 850px) {
/* do something about the floating back/forward links */
	/*h1,h2,h3,h4,p { margin-left: 2rem; margin-right: 2rem; }*/
	header { padding-top: 2.4rem; }
	#buy-it { 
		top: 0; left: 0; width: 100%;
		-ms-transform: rotate(0); /* IE 9 */
		-webkit-transform: rotate(0); /* Chrome, Safari, Opera */
	    transform: rotate(0);
	}
}

@media (min-width:680px) {
	body { font-family: 'GuanabaraSans-Light', Arial, Helvetica, sans-serif; }
	header { background: url(bird-600.png) #333 no-repeat right -50px; }
	figcaption, .subtitle, #book-title, #dedication, em, blockquote { font-family: 'GuanabaraSans-LightItalic', Arial, Helvetica, sans-serif; font-style: normal; }
	h1, h2, h3, h4, .buy, #buy-it, strong, th, #forward, #backward { font-family: 'GuanabaraSans-Book', Arial, Helvetica, sans-serif; font-weight: normal; }
	#book-title a:link { font-size: 1.4rem; margin: 1rem auto; }
}

@media (max-width: 700px) {
	p, li { line-height: 1.6em; }
	article, header h1, header h2, header p { width: 80%; }
	li code, table code {
	 white-space: pre-wrap;       /* css-3 */
	 white-space: -moz-pre-wrap;  /* Mozilla, since 1999 */
	 white-space: -pre-wrap;      /* Opera 4-6 */
	 white-space: -o-pre-wrap;    /* Opera 7 */
	 word-wrap: break-word;       /* Internet Explorer 5.5+ */
	}
	table { table-layout: fixed; display: block; overflow: auto; font-size: .8rem; }
	nav a { width: 30px; }
}

@media (max-width: 500px) {
	h1 { margin: 0; font-size: 2rem; }
	h2 { font-size: 1.5rem; }
	h3 { font-size: 1.2rem; }
	ul, ol { padding-left: 1.5rem; }
	aside { margin-left: -10%; margin-right: -10%; padding-left: 10%; padding-right: 10%; }
	.subtitle { margin-top: 1rem; }
	.cover { display: none; }
	.anchorjs-link { display: none; }
	.buy a:link { width: 100%; padding: 10px 0; margin: 0 0 1rem; }
	#forward, #backward { font-size: 35px; }
	#toc { padding-left: 0; }
	#toc ol { padding-left: 1.2rem; }
}