.button-container {
	position: absolute;
	right: 1em;
	top: 1em;
}
#dialog-trigger {
	background: #3F3;
	border: 2px solid #777;
	border-radius: 1em;
	cursor: pointer;
	font: 1em sans-serif;
	padding: 0.25em 1em;
}
#view-source {
	background: #0FF;
	border: 2px solid #099;
	border-radius: 1em;
	font: 1em sans-serif;
	padding: 0.25em 1em;
	text-decoration: none;
}
#dialog {
	background-color: #FFF;
	border: 5px solid #CCC;
	border-radius: 1em;
	box-shadow: 0 0 100px #CCC;
	display: none;
	font-family: sans-serif;
/*	left: 10%;*/
	margin: 0 auto;
	position: absolute;
	text-align: center;
	top: 70px;
/*	width: 80%;*/
	z-index: 15;
}
#dialog-head {
	margin: 0;
	padding: 0.5em;
	background-color: #CCC;
}
#dialog-body {
	border: 1px solid #777;
	border-collapse: collapse;
}
#dialog th, #dialog td {
	border: 1px solid #777;
	padding: 0.5em;
	width: 10%;
	vertical-align: top;
}
#dialog th img {
	width: 50%;
}
#close {
	margin: 1em;
}

/* View Source https://css-tricks.com/examples/ViewSourceButton/  */
#source-code { display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(255,255,255,0.8); }
#source-code:target { display: block; }
#source-code pre { padding: 20px; font: 14px/1.6 Monaco, Courier, MonoSpace; margin: 50px auto; background: #000; color: white; width: 80%; height: 80%; overflow: auto; }
#source-code pre a, #source-code pre a span { text-decoration: none; color: #00ccff !important; }
#x { position: absolute; top: 30px; left: 10%; margin-left: -41px; background: red; text-decoration: none; color: white; width: 1em; border-radius: 1em; height: 1em; text-align: center; vertical-align: middle; font-size: 2em; line-height: 1em; font-weight: bold; border: 2px solid #CCC;}

/* Pretty printing styles. Used with prettify.js. */
.str { color: #61ff74; }
.kwd { color: #ea5eff; }
.com { color: white; }
.typ { color: red; }
.lit { color: red; }
.pun { color: white; }
.pln { color: white; }
.tag { color: #ffab58; }
.atn { color: #fabb4e; }
.atv { color: #ffd996; }
.dec { color: red; }
pre.prettyprint { padding: 2px; border: 1px solid #888 }

/* Specify class=linenums on a pre to get line numbering */
ol.linenums { margin-top: 0; margin-bottom: 0 } /* IE indents via margin-left */
li.L0,
li.L1,
li.L2,
li.L3,
li.L5,
li.L6,
li.L7,
li.L8 { list-style-type: none }
/* Alternate shading for lines */
li.L1,
li.L3,
li.L5,
li.L7,
li.L9 { background: #eee }

@media print {
  .str { color: #060; }
  .kwd { color: #006; font-weight: bold; }
  .com { color: #600; font-style: italic; }
  .typ { color: #404; font-weight: bold; }
  .lit { color: #044; }
  .pun { color: #440; }
  .pln { color: #000; }
  .tag { color: #006; font-weight: bold; }
  .atn { color: #404; }
  .atv { color: #060; }
}