* { scrollbar-color:#1f9b92 #000;}
*::-webkit-scrollbar { width:6px;height:6px; }
*::-webkit-scrollbar-track { background:#000; }
*::-webkit-scrollbar-thumb { background-color:#1f9b92;border-radius:0;border:none; }
*::-webkit-scrollbar-corner { background:#000; }
body { font-family:serif;color:#c9c9c9;background:#000;padding:0;margin:0;font-size:14px; }
a { color:#1f9b92;font-weight:bold;text-decoration:none; }
a:hover { color:#fff; }
header { white-space:nowrap;display:block;min-height:128px;overflow-x:auto;font-family:sans-serif;-webkit-overflow-scrolling:touch;z-index:1;position:absolute;left:0;top:0;display:grid;grid-template-columns: auto 1fr;overflow-y:hidden;z-index:99; }
h1 { max-height:128px;display:inline-block;margin:0;padding:0;}
nav { display:grid;max-width:unset; }
nav ul { vertical-align:top;position:relative;list-style:none;display:inline-block;margin:0;padding:0;line-height:128px; }
nav ul li { display:inline;padding-left:1ch;padding-right:1ch; }
nav ul li:first-child { padding-left:0; }
nav ul li details { vertical-align:text-top;display:inline-block; }
nav ul li a { text-shadow:0 0 0.25em #000, 0 0 0.5em #000;;vertical-align:top; }
nav ul li a::before {content:"- "; }
nav ul li details summary { line-height:1em;color:#1f9b92;font-weight:bold;text-decoration:none;text-shadow:0 0 0.25em #000, 0 0 0.5em #000; }
nav ul li details summary:hover { color:#fff; }
nav ul li details ul { display:block;line-height:1em;margin:0;margin-top:0.25em;margin-bottom:50px; }
nav ul li details ul li { display:block;padding:0;padding-top:0.25em;padding-bottom:0.25em; }
nav ul li details ul li details * { margin-bottom:0; }
* ul * ul { padding-left:1em; }
summary { outline:none;cursor:pointer; }
#about, #twtxtFeed, main * { position:relative;box-sizing:border-box;margin:2em;margin-left:auto;margin-right:auto;z-index:97; }
#about {text-align:center;}
.miniprofile { display: grid; grid-template-rows:auto 1fr auto; grid-template-columns: auto auto 1fr;margin-left:auto;margin-right:auto;text-align:left; }
.miniprofile img { grid-row:1/4; grid-column: 1/3;width: 500px;max-width: 80vw;z-index:1; }
.miniprofile h2.mp-name { text-transform: uppercase; background: #c9c9c9; color: #000; grid-row:1/2; grid-column:1/2;margin:0;font-size:1em;font-weight:normal;z-index:2;}
.miniprofile h3.mp-tagline { grid-row:3/4;grid-column:1/4;text-align: left;margin:0;font-size:1em;text-transform:unset;font-weight:normal;width:fit-content;display:inline-block;z-index:3;}
.miniprofile details { grid-row: 3/4; grid-column: 1/4;text-align: right;background:rgba(0,0,0,0.75);z-index:2;}
.miniprofile li { list-style:none; }
.mainprofile { display:grid;  grid-template-rows:1fr auto;grid-template-columns:1fr;width:500px;max-width:80vw; }
.mainprofile img {  grid-column:1/2;grid-row:1/3;max-width:80%;margin: 0;text-align:center; margin-left:auto;margin-right:auto; }
main .mainprofile-panel { margin: 0;}
.mainprofile .mainprofile-panel { grid-column:1/2;grid-row:2/3;background:rgba(0,0,0,0.8); }
.mainprofile-panel * { max-width: 100%; margin: 0 !important;}
#twtxtFeed { margin:0;position:fixed;bottom:0;left:0;background:rgba(0,0,0,0.7);width:100%;padding:2em; }
#twtxtFeed h2 { font-size:1em;font-weight:bold;text-align:left; }
#twtxtFeed table tbody td { padding:0.5em; }
#twtxtFeed a { float:right; }
#twtxtFeed td.twtxt-date::after { content:"»"; }
#twtxtFeed td.twtxt-twt a { float: none; }
h2, h3, h4 { text-transform:capitalize; }
h3, h4 { text-align:center; }
time.publish-date { text-align:right;display:block;font-size:90%;font-style:italic;margin-bottom:4em; }
main p, main ul, main ol { line-height:150%;margin-top:1em;margin-bottom:1em; }
main li { margin-top:0.5em;margin-bottom:0.5em;width:100%; }
main table, main pre { width:fit-content;max-width:100vw;margin-left:max(10vw, max(0px, calc(50vw - 250px)));transform:translateX(max(min(0px, calc(min(40vw, 250px) - 50%)), min(-10vw, calc(250px - 50%)))); }
code, pre { background:#00263b;color:#93a1a1;padding:0.25em; }
pre { white-space:pre;overflow-x:auto; }
blockquote {padding-left:1ch;line-height:150%;border-left:solid 2px #797979; }
main video, main audio, main img { text-align:center;outline:none;display:block; }
main a { display:block; }
main * a { display:inline; }
.mono { font-family:monospace; }
footer { text-align:left;font-size:80%;margin-top:8em; }
#twtxtFeed + footer { position:fixed;bottom:0;right:0;z-index:98; }
main table { border:solid 1px #797979;border-collapse:collapse; }
main * td, main * th { padding:0.5em;border:solid 1px #797979;border-right:dotted 1px #797979;border-left:dotted 1px #797979;width:auto; }
main * th { font-weight:bold; }
*::selection { background-color:#1f9b92;color:#000;text-decoration:none;text-shadow:none; }
br { margin: 0;}

.glitch {
	position: fixed;
	left: 0;
	top:0;
	overflow: hidden;
		background-image: url('/img/cybercrystal.jpg');
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
	width: 100%;
	height: 100%;
	right:0;
	bottom:0;
}

.glitch img {
	position: relative;
	z-index: 1;
	display: block;
}
.glitch__layers {
	position: absolute;
	z-index: 2;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
}
.glitch__layer {
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	background-image: url('/img/cybercrystal.jpg');
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
}
.glitch__layer:nth-child(1) {
	transform: translateX(-5%);
	animation: glitch-anim-1 2s infinite linear alternate;
}
.glitch__layer:nth-child(2) {
	transform: translateX(3%) translateY(3%);
	animation: glitch-anim-2 1.1s -.8s infinite linear alternate;
}
.glitch__layer:nth-child(3) {
	transform: translateX(5%);
	animation: glitch-anim-flash 3s infinite linear;
}

.portrait {
  text-align: center;
  max-height: 70vh;
  max-width: 100%;
  margin: 15vh;
  margin-left: auto;
  margin-right: auto;
  position: absolute;
  left:50%;
  top:0;
  z-index:3;
  transform: translateX(-50%);
}
@keyframes glitch-anim-1 {
	0% {
		clip-path: polygon(0 0%, 100% 0%, 100% 5%, 0 5%);
	}
	10% {
		clip-path: polygon(0 15%, 100% 15%, 100% 15%, 0 15%);
	}
	20% {
		clip-path: polygon(0 10%, 100% 10%, 100% 20%, 0 20%);
	}
	30% {
		clip-path: polygon(0 1%, 100% 1%, 100% 2%, 0 2%);
	}
	40% {
		clip-path: polygon(0 35%, 100% 35%, 100% 35%, 0 35%);
	}
	50% {
		clip-path: polygon(0 45%, 100% 45%, 100% 46%, 0 46%);
	}
	60% {
		clip-path: polygon(0 50%, 100% 50%, 100% 70%, 0 70%);
	}
	70% {
		clip-path: polygon(0 70%, 100% 70%, 100% 70%, 0 70%);
	}
	80% {
		clip-path: polygon(0 80%, 100% 80%, 100% 80%, 0 80%);
	}
	90% {
		clip-path: polygon(0 50%, 100% 50%, 100% 55%, 0 55%);
	}
	100% {
		clip-path: polygon(0 60%, 100% 60%, 100% 70%, 0 70%);
	}
}
@keyframes glitch-anim-2 {
	0% {
		clip-path: polygon(0 15%, 100% 15%, 100% 30%, 0 30%);
	}
	15% {
		clip-path: polygon(0 3%, 100% 3%, 100% 3%, 0 3%);
	}
	25% {
		clip-path: polygon(0 8%, 100% 8%, 100% 20%, 0 20%);
	}
	30% {
		clip-path: polygon(0 20%, 100% 20%, 100% 20%, 0 20%);
	}
	45% {
		clip-path: polygon(0 45%, 100% 45%, 100% 45%, 0 45%);
	}
	50% {
		clip-path: polygon(0 50%, 100% 50%, 100% 57%, 0 57%);
	}
	65% {
		clip-path: polygon(0 60%, 100% 60%, 100% 60%, 0 60%);
	}
	75% {
		clip-path: polygon(0 80%, 100% 80%, 100% 80%, 0 80%);
	}
	80% {
		clip-path: polygon(0 40%, 100% 40%, 100% 60%, 0 60%);
	}
	95% {
		clip-path: polygon(0 45%, 100% 45%, 100% 60%, 0 60%);
	}
	100% {
		clip-path: polygon(0 11%, 100% 11%, 100% 15%, 0 15%);
	}
}
@keyframes glitch-anim-flash {
	0% {
		opacity: .2;
	}
	30%, 100% {
		opacity: 0;
	}
}