/* Dry Ice */

@font-face {
  font-family:"Apple Garamond";
  src:url("APPLEGARAMOND.TTF");
}
@font-face {
  font-family:"Caladea";
  src:url("CALADEA-REGULAR.TTF");
}

#nav {
	height:fit-content;
	width:fit-content;
  margin: auto;
  border: 1px solid #ffffff44;
  padding: 0px;
  background:#74888855;
  text-align: center;
  border-radius: 4px;
	display:block;

	backdrop-filter: blur(2px);

	z-index:100;
	position:fixed;
	left: 50%;
  transform: translateX(-50%);
}

#nav > a {
	display:inline-block;
	min-width:100px;
	margin:0px 0px;
	padding:5px 5px;
	border-left: 1px solid #ffffff44;
	color:white !important;
	text-decoration:none;
}
#nav > a:first-child {
	border:none;
}
#nav > a:hover {
	background:#ffffff44;
	text-shadow: gray 0px 0px 5px;
}

body {
  background: url("ice3.png"), url("sumi-sm.png"), url("sumi2.png"), black;
  background-position: center center, bottom right, center left;
  background-repeat: repeat, no-repeat, no-repeat;
  background-attachment:fixed;
  max-width:1000px;
  margin:auto;
	margin-top:0px;
	margin-bottom:0px;
  color:white;
  font-family:"Caladea";
  font-size:18px;
  text-align: center;
}

#wrapper {
	background: linear-gradient(90deg,rgba(0, 0, 0, 0) 0%, rgba(131, 142, 143, 0.62) 50%, rgba(0, 0, 0, 0) 100%);
	height:max-content;
	width:100%;
	padding-bottom: 5px;
  min-height: calc(100vh - 5px);
}

p, ul, ol {
  word-wrap:break-word;
  width:800px;
  /*! margin:auto; */
  margin-top:16px;
  margin-bottom:16px;
}

ul, ol {
  text-align: left;
}

a {color:#dbffa7 !important;}
b, strong, em {color:#bbf;text-decoration: underline;}

.author-meta, .author-meta * {color:#aaa !important;}

h1, h2, h3, h4 {font-family:"Apple Garamond";margin-bottom:-8px;margin-top:24px;}
#content h1:first-child,
#content h2:first-child,
#content h3:first-child,
#content h4:first-child
{margin-top:0px;}
h1 {font-size:36px;margin-bottom:-12px;}
h2 {font-size:32px;margin-bottom:-10px;}
h3 {font-size:28px;}
h4 {font-size:22px;}

p.footerText {font-family:"Arial", sans-serif;margin-top:6px;font-size:11px;width: auto;}

pre {
  text-align: left;
  /*! max-width: 600px; */
}
code {
  display: block;
  border: 1px solid #999;
  padding: 5px;
  word-wrap: ;
  overflow-x: scroll;
}

p.addendum {
  border:1px solid #ffbb99;
  background-color:#433100;
  padding:5px;
}

#footer {
  /*width: 768px;*/
  margin: auto;
  text-align: center;
}

#content {
  margin: auto;
  max-width: 800px;
  border: 1px solid #ffffff44;
  padding: 20px;
  background:#74888855;
  text-align: left;
  border-radius: 4px;

	backdrop-filter: blur(2px);
}
#content > p {width:800px;}

table {
  /*! border: 1px solid white; */
  max-width: 800px;
  margin: auto;
  display: block;
}

th {
  border: 1px dashed grey;
  padding: 5px;
}

td {
  background:#74888855;
  border: 1px solid #ffffff44;
  vertical-align: top;
  padding: 10px;
  width: 50%;

	backdrop-filter: blur(2px);
}
tbody > tr:first-child > td:first-child {
  border-radius: 4px 0px 0px 0px;
}
tbody > tr:first-child > td:last-child {
  border-radius: 0px 4px 0px 0px;
}
tbody > tr:last-child > td:first-child {
  border-radius: 0px 0px 0px 4px;
}
tbody > tr:last-child > td:last-child {
  border-radius: 0px 0px 4px 0px;
}
tbody {
  font-size: 14px;
}
caption {
  margin-bottom: 8px;
  margin-top: -24px;
}

#yinyang {
  animation:10s infinite linear spin;
}

@keyframes spin {
  from {transform:rotate(0deg);}
  to {transform:rotate(360deg);}
}