body, html				{ margin: 0; 
					  height: 100%; }
body					{ font-family: "Alegreya sans", sans-serif; 
					  font-weight: 400;
					  font-size: 14pt; 
					  display: flex;
					  flex-direction: column; }
body > nav				{ text-align: right; 
					  padding-top: 1rem;
					  padding-right: 0.5rem;
					  font-size: 0; }
body > nav a				{ display: inline-block;
					  padding: 0.25rem 0.5rem;
					  color: #888;
					  text-decoration: none;
					  border-top: thin solid #d0d0d0; 
					  font-weight: 500;
					  font-size: 13pt;
					  background-color: #ddd; }
body > nav a:hover			{ color: #444; 
					  background-color: #d8d8d8; }
body > nav > span > a + a		{ border-left: thin solid #ccc; }
body > nav > a				{ border-radius: 0.8rem; 
					  background-color: #444;
					  padding: 0.25rem;
					  border: thin solid #404040;
					  color: #aaa; }
body > nav > a:hover			{ color: #ccc; 
					  background-color: #3d3d3d; }
body > nav > span 			{ margin-right: 1rem; }
body > nav > span > a:first-child	{ border-top-left-radius: 0.8rem; 
					  border-left: thin solid #d0d0d0; 
					  border-bottom-left-radius: 0.8rem; }
body > nav > span > a:last-child	{ border-top-right-radius: 0.8rem; 
					  border-right: thin solid #d0d0d0; 
					  border-bottom-right-radius: 0.8rem; }
body > section				{ flex: 1; 
					  display: flex;
					  padding: 0 1%;
					  flex-direction: row;
					  align-items: center; }
body > section > article		{ flex: 1; }
body > footer				{ background-color: #E9C92D;
					  display: flex;
					  box-shadow: -1px -1px 2px #E9C92D;
					  padding: 2rem 0.5rem;
					  font-size: 14pt;
					  align-items: center;
					  color: #666; }
body > footer > div			{ flex: 1; }
body > footer > div a			{ color: #000; }
body > footer > nav 			{ font-size: 18pt; }
body > footer > nav a			{ color: #eee; 
					  text-decoration: none; 
					  text-shadow: 0 0 1px #666; }
body > footer > nav a:hover		{ color: #fff; 
					  text-shadow: 0 0 1px #333; }

article[data-sblg-article] > header	{ margin: 0 auto 4rem auto; }
.subtitle				{ font-variant: small-caps;
					  color: #666; }
article[data-sblg-article] > header h1	{ font-size: 32pt; 
					  font-weight: 500; }
article[data-sblg-article] > header h2	{ font-weight: 500; }
article[data-sblg-article] > header h1, 
article[data-sblg-article] > header h2	{ margin-bottom: 0; }
figure 					{ margin: 0;
					  text-align: center; }
strong					{ font-weight: 500; }
figcaption				{ font-variant: small-caps; }
section.paired				{ display: block; }
section.paired > *			{ flex: 1; 
					  text-align: left; }
section.paired > :last-child		{ text-align: left; }
section.paired.nojustify > :last-child	{ text-align: left; }
section.paired.topalign			{ align-items: flex-start; }
.row + .row				{ margin-top: 0.5rem; }
.row					{ display: flex; }
.row > *				{ flex: 1; }
.row > :first-child			{ text-align: right; }

#slide01 img				{ opacity: 0.5; 
					  margin-bottom: -6rem; }
#slide01 .links a			{ color: #222; }
#slide01 .links a:hover			{ color: #000; }
#slide01 .links				{ color: #888; }
#slide02b section.paired > :first-child	{ color: #aaa; }

#slide02 article			{ font-size: 20pt; 
					  color: #aaa; }
#slide02 strong				{ color: #000; }
img					{ width: 100%; }
figure.stretch img			{ box-shadow: 0 0 2px #000; }

pre.hl					{ color:#000000; 
					  font-size:12pt; 
					  position: relative;
				  	  font-family: 'Courier New',monospace;}
.hl.num 				{ color:#b07e00; }
.hl.esc 				{ color:#ff00ff; }
.hl.str 				{ color:#bf0303; }
.hl.pps 				{ color:#818100; }
.hl.slc 				{ color:#838183; font-style:italic; }
.hl.com 				{ color:#838183; font-style:italic; }
.hl.ppc 				{ color:#008200; }
.hl.opt 				{ color:#000000; }
.hl.ipl 				{ color:#0057ae; }
.hl.lin 				{ color:#555555; }
.hl.kwa 				{ color:#000000; font-weight:bold; }
.hl.kwb 				{ color:#0057ae; }
.hl.kwc 				{ color:#000000; font-weight:bold; }
.hl.kwd 				{ color:#010181; }

.kwebapp				{ font-size: 14pt; }
.kwebapp .fa				{ font-size: 11pt; }
.kwebapp .hide 				{ display: none; }
.kwebapp input 				{ display: none; }
.kwebapp input ~ section 		{ display: none; }
.kwebapp input ~ header .audit-toplevel-shown,
.kwebapp input ~ header .audit-is-shown 	
					{ display: none; }
.kwebapp input ~ header			{ font-size: 0; }
.kwebapp input ~ header > *		{ font-size: 13pt; }
.kwebapp input ~ header label		{ padding: 0.2rem 0.5rem;
					  margin: 0.5rem auto;
					  border: 2px solid #ccc;
					  cursor: pointer;
					  color: #000;
					  border-radius: 0.5rem; 
					  transition: border 2s linear, background-color 0.2s linear, color 0.2s linear;
					  display: -webkit-box;
					  display: -ms-flexbox;
					  display: flex; }
.kwebapp .noop > input ~ header label	{ color: #888; }
.kwebapp input ~ header label > span:first-child
					{ -webkit-box-flex: 1;
					  -ms-flex: 1; 
					  flex: 1; }
.kwebapp input ~ header label > span:last-child > span
					{ display: inline-block;
					  text-align: right;
					  width: 4.5ex; }
.kwebapp input:checked ~ header .audit-is-shown 
					{ display: -webkit-box;
					  display: -ms-flexbox;
					  display: flex; 
					  color: #fff;
					  background-color: #888;
					  border: 2px solid #666; }
.kwebapp input ~ header .audit-toplevel-shown:hover
					{ border: 2px solid #aaa;
					  background-color: rgba(255, 255, 0, 0.1); }
.kwebapp input:checked ~ section 	{ display: block; 
					  padding: 0 1rem; }
.kwebapp .audit-toplevel-view:checked ~ article header .audit-toplevel-shown
					{ display: -webkit-box; 
					  display: -ms-flexbox; 
					  display: flex;  }
.kwebapp .audit-data-field-noexport 	{ color: #aaa; }
.kwebapp #aside .audit-data-field-noexport
					{ color: red; }
.kwebapp .audit-data-list > div 	{ width: 100%; 
				  	  display: inline-block; }
.kwebapp .audit-noentry 		{ color: #666; 
					  font-style: italic; }
.kwebapp .audit-link			{ cursor: pointer; 
					  border-bottom: 1px dotted rgba(0, 0, 255, 0.4); }
.kwebapp h1				{ font-weight: 700;
					  margin-top: 0;
					  margin-bottom: 1rem;
					  font-size: 24pt; }
.kwebapp h2				{ font-weight: 500;
					  margin-top: 1rem;
					  font-size: inherit; }
.kwebapp h3				{ font-weight: 500;
					  font-size: inherit; }
.kwebapp h4				{ margin: 8pt 0; 
					  font-weight: 400;
					  font-size: inherit; }
.kwebapp .audit-access-list > section > section > h4:first-child
					{ margin-top: 2pt; }
.kwebapp h5				{ font-size: smaller; 
					  margin-bottom: 0;
					  margin-top: 1em;
					  font-weight: 400; }
.kwebapp #parsed			{ position: relative; 
					  width: 100%; }
.kwebapp #parsed > aside		{ position: fixed;
					  width: 50%;
					  top: 0;
					  -webkit-transition: left 0.2s linear;
					  -o-transition: left 0.2s linear;
					  transition: left 0.2s linear;
					  box-shadow: 2px 2px 2px #666;
					  background-color: #ccc;
					  left: 50%; }
.kwebapp #parsed > aside.hide		{ display: block;
					  left: 102%; }
.kwebapp #aside > div			{ position: relative; 
					  padding: 1.5rem; }
.kwebapp #aside-close 			{ position: absolute; 
					  z-index: 10;
					  top: 4px;
					  cursor: pointer;
					  color: #666;
					  left: 4px; }
.kwebapp #aside-close:hover		{ color: #000; }
.kwebapp code				{ font-family: monospace;
					  font-size: smaller; }
.kwebapp .audit-accessfrom-paths > li > span.path + span.path:before
					{ content: ' \2192 '; }
.kwebapp .audit-accessfrom-paths 	{ margin: 0; 
					  padding-left: 1em; }
.kwebapp footer				{ font-size: smaller; 
					  padding: 1rem;
					  text-align: center; }

@media (min-width: 75ex) {
.kwebapp .audit-data-list > div 	{ width: 48%; }
}

@media (min-width: 125ex) {
.kwebapp .audit-data-list > div 	{ width: 30%; }
}

@media (min-width: 175ex) {
.kwebapp .audit-data-list > div 	{ width: 23%; }
}

@media (min-width: 225ex) {
.kwebapp .audit-data-list > div 	{ width: 18%; }
}

@media (min-width: 750px) {
section.paired				{ display: flex; }
section.paired > :last-child		{ text-align: right; }
section.paired > *			{ padding: 2rem; }
body > section				{ padding: 0 10%; }
img					{ width: auto; }
figure.stretch img			{ width: 100%; }
body					{ font-size: 18pt; }
body > footer > nav 			{ font-size: 28pt; }
body > footer				{ padding: 2rem; }
body > nav				{ padding-right: 2rem; }
body > nav a				{ padding: 0.5rem 1rem; }
body > nav > a				{ padding: 0.5rem; }
#slide02 article			{ font-size: 32pt; }
}

@media (min-width: 1024px) {
body > section				{ padding: 0 20%; }
}
