:root {
  --dark: #1b1b1f;
  --light: #efdfde;
}
.about {
	border-top: 1px solid white;
	color: white;
	padding: 20px;
}
.profile {
	padding: 10%;
	margin: 40px;
	border: 1px dashed white;
	overflow: scroll;
}
div.profile a {
	color: aquamarine;
}
div.profile code {
	font-size: 8pt;
}
.lock {
	color: white;
	font-size: 10pt;
	border-bottom: 1px solid grey;
	border-top: 1px solid grey;
	overflow: hidden;
	width:100%;
	box-sizing: border-box;
	white-space: nowrap;
	text-overflow: ellipsis;
	display: flex;
	align-items: center;
}
.lock p {
	margin: 0;
	width: 100%;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
	display: flex;
	align-items: center;
	gap: 0;
}
.lock a {
color: white;
}
.lock i {
	display: none;
	right: 20px;

}
.lock:hover i {
	display: inline;
margin-left: 60px;
color: #eee;
	overflow: hidden;
}
.lock img {
	width: 40px;
	margin: auto;
	border-right: 1px solid white;
	padding: 10px;
	margin: 0;
	margin-right: 10px;
}
.lock b {
	border-right: 1px solid white;
	padding: 10px;
	height: 40px;
	margin: 0;
	margin-right: 10px;
	display: flex;
	align-items: center;
}
.node {
	height: 500px;
	overflow: hidden;
	position: relative;
	border-bottom: 20px solid cornflowerblue;
}
.node img {
	width: 100%;
	object-fit: cover;
	z-index: 0;
	position: absolute;
}
.node h2 {
	position: relative;
	z-index: 1;
	background: cornflowerblue;
	color: white;
	left: 0px;
	width: 60%;
	padding: 20px;
	margin-top: 300px;
}
.node a {
	color: inherit;
	text-decoration: none;
}
div.focus {
	min-height: 300px;
	border-bottom: 10px solid cornflowerblue;
}
.focus h2 {
	margin-top: 70px;
	width: 80%;
	padding-left: 40px;
	background: cornflowerblue;
}
h3 { padding-left: 20px ;}
.focus p {
	position: absolute;
	z-index: 1;
	background: var(--dark);
	background: cornflowerblue;
	color: white;
	left: 0px;
	padding: 20px;
	padding-left: 40px;
bottom: 10px;
font-size: 14pt;
}

blockquote {
  border-left: 2px solid white;
  padding-left: 40px;
  position: relative;
  font-weight: 100;
  font-size: 14pt;
  line-height: 40px;
  display: grid; /* if needed for layout */
}

div.profile blockquote::before {
  content: "";
  position: absolute;
  inset-inline: 20%;
  /*inset-block: -20%; */
  aspect-ratio: 1;
  border-radius: 1000px;
  background: #2fc4;
  filter: blur(70px);
max-width: 100%;
max-height: 100%;
  z-index: -1;
}
div.root.main blockquote::before {
  content: "";
  position: absolute;
  inset-inline: 10%;
  /*inset-block: -20%; */
  aspect-ratio: 1;
  border-radius: 1000px;
  background: #0ff2;
  filter: blur(65px);
max-width: 100%;
height: 80%;
  z-index: -1;
}

small {
	size: 6pt;
	color: #488;
}
blockquote p {
  margin: 40px 0;
  text-wrap: balance;
}
#newthread {
width: 100%;
  height: 800px;
text-align: center;
}
#newthread input {
  background: none;
color: var(--light);
font-size: 70pt;
border: 1px solid var(--light);
border-radius: 100px;
padding: 20px;
padding-left: 30px;
padding-right: 30px;
}
.changeme::placeholder{ color: #777;}
.changeme {
  height: 500px;
  width: 80%;
  margin: auto;
  margin-top: 30px;
  margin-bottom: 30px;
  background-color: var(--dark);
  border: 1px solid var(--light);;
  padding: 19px;
border-radius: 30px;
color: var(--light);
font-size: 16pt;
}
body {
	background: #523;
	margin: 0px;
	font-family: "Helvetica";
	background: var(--dark);
	color: white;
}
#scheme {
	color: violet;
	border: 1px solid;
}
#scheme td {
	border: 1px solid;
	padding: 20px;
	min-width: 200px;
}
img.logo {
	max-height: 180px;
}
p.logo {
	display: inline
}
article {
	font-size: 13pt;;
	text-align: left;
	padding: 110px;
	background: antiquewhite;
}


li {
	margin: 10px;
	list-style: square;
}

nav {
	color: #ddd;
	margin: 80px;
	border-left: 1px solid white;
	padding: 40px;
}


nav a {
	text-decoration: none;
	color: inherit;
}
nav a:hover {
color: cornflowerblue;
}
.grid {
   display: grid;
   grid-template-columns: repeat(8, 1fr); /* 8 columns */
   grid-template-rows: repeat(4, 1fr);    /* 8 rows */
   width: 100%;
}

.cell {
	  aspect-ratio: 1 / 1; /* Make each cell square */
display: flex;
align-items: center;  /* Vertical centering */
justify-content: center; /* Horizontal centering */
color: var(--light);
border: 1px solid #999;
font-size: 1.5rem;
}
.head {
	display: flex;
	background: var(--dark);
	color: var(--light);
	padding 20px;
	vertical-align: center;
}
.head div.title {
	text-align: center;
	display: inline;
	margin: auto;
}
div.root {
	border-top: 2px solid #999;
	border-bottom: 2px solid #333;
	margin: 0px;
	background: var(--light);
	color: var(--dark);
	padding: 20px;
}
div.root.main {
	background: none;
color: var(--light);
}


div.root img{
  display: inline-block;
  vertical-align: text-bottom; /* or middle, baseline, depending on style */
  width: auto;
  margin: 0 0.1em; /* Optional spacing */
}



.root a {
	text-decoration: none;
	color: inherit;
}
.head img {
	max-height: 200px;
	display: inline;
	border-right: 1px solid var(--light);
	left: 0px;
}
.chicken { width: 100%;
	border-bottom: 1px solid white;
}
.chicken img { width: 100%; }
@keyframes fadeOut {
  from { opacity: 1; }
  to { opacity: 0; }
}
p img {
max-width: 40%;
}
/*.flash {
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  top: 0px;
  left: 0px;
  width: 100%;
  height: 50px;
  background: cornflowerblue;
  color: white;
  z-index: 10;
  opacity: 1;
  animation: fadeOut 1s linear forwards;
  animation-delay: 2s;
} */
.flash {
color: white;
border-top: 1px solid white;
padding: 20px;
text-align: center;
size: 14pt;
margin: 0px;
border-bottom: 6px solid aquamarine;
}
.flash a {
  color: white;
}
.flash.success { color: white; }
.flash.error { color: white; font-weight: 600; }   /* chicken goes here */
.flash.info { color: white; }
.terms {
	text-align: center;
	border-top: 1px solid white;
	line-height: 1.6;
margin: 0px;
}
div.terms nav {
text-align: center;
padding: 10px;
}
.terms .rules {
	margin: auto;
	width: 60%;
	text-align: left;
}
.terms li {
	line-height: 2.0;
}
.terms a {
	color: cornflowerblue;
}
.terms pre {
	color: white;
	color: rgb(216, 222, 233);
	width: fit-content;
	margin: auto;
	text-align: left;
	line-height: 1.6;
	padding: 20px;
	border: 1px dashed white;
}
/* syntax highlighting */
.let {
  color: rgb(129, 161, 193);
  font-weight: 400;
}
.let2 { /* this was junk? */
  color: rgb(143, 188, 187);
  font-weight: 400;
}
.string {
  color: rgb(213, 210, 140);
  font-weight: 400;
}
.string2 {
  color: rgb(223, 220, 140);
  font-weight: 400;
}
.string3 {
  color: rgb(163, 190, 140);
  font-weight: 400;
}
.var {
  color: rgb(129, 161, 193);
  font-weight: 400;
}
.heavy { font-weight: 400; }
.big { font-size: 13pt; }
.comment {
  color: rgb(243, 210, 140);
  font-weight: 400;
  font-size: 13pt;
}
/* syntax highlighting */