html, body				{ margin: 0; 
					  padding: 0; }
body					{ color: #222; 
					  font-family: "Alegreya sans", sans-serif;  }
code, pre				{ font-size: 65%; }
pre					{ margin: 0; }
a					{ text-decoration: none; 
					  color: blue; }
strong, b				{ font-weight: 700; }
body > header				{ background-color: #333;
					  padding: 5rem 0 0 0;
					  color: #fff; }
body > header a				{ color: #dd5; }
body > header a:hover			{ color: #ff0; }
#breadcrumbs				{ font-size: 90%; }
#version ul				{ margin: auto 0; 
					  padding: 0;
					  list-style-type: none; }
#version nav li				{ margin: 0; }
#usage nav ul				{ list-style-type: none; 
					  padding: 0; }
#header					{ padding-top: 2em; }
#header nav				{ font-size: 90%;
					  padding: 2pt 0; 
					  display: -webkit-box;
					  display: -ms-flexbox;
				 	  display: flex; }
#header nav > *				{ padding: 4pt 0; }
#header nav > :last-child		{ -webkit-box-flex: 1;
				          -ms-flex: 1;
				              flex: 1;
					  text-align: right; }
#header nav > :last-child a		{ border: 3px solid rgba(255, 255, 50, 0.5);
					  border-radius: 4pt;
					  transition: border linear 0.2s;
					  padding: 4pt 8pt; }
#header nav > :last-child a:hover	{ border: 3px solid rgba(255, 255, 50, 0.9); }
#header nav .version			{ border-right: thin solid silver; 
					  color: #abc;
					  padding-right: 0.5rem;
					  margin-right: 0.5rem; }
#header nav .fa				{ font-size: 80%; }
#version				{ background-color: #eee; }
#version a, 
#version time, 
#version span.version			{ font-style: normal; }
#version div.content > div + div	{ margin-top: 1rem; }
#version nav .title			{ font-weight: 500; 
					  margin-bottom: 1em; }
#version .archive			{ text-align: center; }
h1					{ font-size: 175%; 
					  margin: 0;
					  line-height: 34pt;
					  font-weight: 400; }
.nm, .file				{ font-style: italic; }
h1 .nm					{ text-shadow: 1px 1px #666; 
					  font-style: inherit; }
h1 .nd					{ text-shadow: 1px 1px #333; }
#intro					{ font-size: 125%; }
#sample					{ color: #666; 
				  	  padding: 1rem 0;
					  background-color: #f6f6f6; }
#sample > input				{ display: none; }
#sample > input ~ nav label,
#sample > input ~ pre			{ max-height: 0;
					  display: block;
					  opacity: 0;
					  overflow: hidden; }
#sample > input ~ pre			{ transition: opacity 0.5s ease-in; }
#sample > input ~ nav label		{ cursor: pointer; }
#sample					{ text-align: left; }
#sample nav label			{ color: #44b; }
#sample nav				{ margin-bottom: 0.5rem; }
#sample .fa				{ font-size: 80%; }
#show-comments:checked ~ nav #label-nocomments,
#show-nocomments:checked ~ nav #label-comments,
#show-comments:checked ~ #comments,
#show-nocomments:checked ~ #nocomments	
					{ max-height: 1000em; 
					  opacity: 1; }
footer					{ margin-top: 1em; 
					  text-align: center;
					  font-size: smaller;
					  color: #666; }
footer a				{ color: #000; }
footer span				{ border-left: thin solid #ccc; 
					  padding-left: 1ex; }
footer div + div			{ margin-top: 0.5em; }
body > section h2			{ font-size: 120%; 
					  font-weight: 500; 
					  text-align: center;
					  font-variant: small-caps;
					  color: #333; }
body > section h3			{ font-size: inherit;
					  font-weight: inherit;
					  margin-bottom: 0.25ex;
					  color: #333; }
#version > div, body > section		{ padding: 1rem 0; }
figure figcaption			{ margin: 0.5em 0.2em; }
figure					{ margin: 0; 
					  text-align: center; 
					  color: #444; }
dd					{ margin: 0 0 1em 0; }
pre.prettyprint				{ border: none; 
					  line-height: 1.4em;
					  color: #333;
					  overflow: hidden;
					  width: auto; }
pre.prettyprint .cpp			{ color: rgb(150, 150, 255); }
pre.prettyprint .ident			{ color: rgb(0, 100, 0); }
pre.prettyprint .flow			{ color: rgb(200, 100, 0); }
pre.prettyprint .literal		{ color: rgb(100, 0, 0); }
footer					{ padding: 1ex;
					  margin-top: 1em;
					  margin-bottom: 1em; }
.flag					{ font-weight: 500; }
#mannav ul				{ display: grid;
					  font-size: 90%;
					  line-height: 1.3em;
					  grid-template-columns: auto auto auto; }

@media only screen and (max-width: 768px), only screen and (max-device-width: 768px) {
   h1					{ font-size: 125%;
	   				  line-height: 125%; }
   #intro				{ font-size: 100%; }
   figure img				{ display: block;
  					  max-width: 400px;
  					  margin-left: auto;
  					  margin-right: auto;
  					  width: 100%; }
#mannav ul				{ grid-template-columns: auto auto; }
}
