body {
width:100%;
color:#ffffff;
background-color:#1f1d40;
background-repeat: repeat;
display: flex;}


@font-face {
  font-family: "Determination Mono";
  src: local("Determination Mono"), url("/DTM-Mono.otf") format("opentype");
}
@font-face {
  font-family: "OpenDyslexic";
  src: local("OpenDyslexic"), url("/OpenDyslexic.otf") format("opentype");
}

@media only screen and (max-width:1000px) {
      div.sb {width:25%;max-width:200px;}
      }


a  { color:#64ffff; }
a:visited { color:#8328cb; }
a:hover { color:#64ffff; }
a:active { color:#64ffff; }
	

#main {
  width:100%; margin-left:5%; margin-right:5%}
  @media screen and (max-width: 720px) {
    #main {width:75%;}
  }
  
.sb {
	width:25%; max-width:250px; text-align:center; overflow-wrap:break-word; position:sticky; top: 8px; bottom: 0px; left:0px; align-self: flex-start;}
	
.sb-title {
  background-color:#180078; padding:10px;}
  
.fuck {
  width:25%; max-width:250px; text-align:center; overflow-wrap:break-word;}
  
  
  
h1 {
	color:#d5fffe;font: 52px "Determination Mono", serif;text-align:center;}
	
h2 {
	background-color:#180078;color:#def4fe;font: 36px "Determination Mono", serif; padding:15px; width:75%;}

h3 {
	background-color:#0b0b3b;color:#def4fe;font: 20px/25px "Determination Mono", monospace; padding:10px; width:100%;}
	
h4 {
	color:#def4fe;font: 18px/26px "Determination Mono", monospace; margin-left:20px; padding-top:5px; font-style:italic;}

nav-ttl {
	color:#def4fe;font: 20px/25px OpenDyslexic, sans-serif; padding:5px; margin:5px; text-align:center}

nav {
	color:#def4fe;font: 20px/22px "Determination Mono", monospace; padding: 5px; padding-top:30px;}
.navsub {
    font: 16px/10px "Determination Mono", monospace; padding-top: 2px;
}
.navhd {
    font: 24px/10px "Determination Mono", monospace; padding: 5px; padding-top:30px; text-decoration-line: underline;
}
nav > a:visited { color:#64ffff;}
nav > a {font-style:normal;text-decoration-line: none;}
	
p   { 
	color:#def4fe;font: 18px/26px "OpenDyslexic", sans-serif;}
	
	p mark {background-color:#180078;color:#180078;
	}

  ps  {
  color:#9db0c7;font: 18px/26px "OpenDyslexic", sans-serif;}
  
  .sbtt {
  background-color:#180078; font-style:italic;}
	


blt {
  color:#def4fe;font: 18px/26px "Determination Mono", sans-serif;}
	
hr {
	color:#c40000;}
	
	
sbtt{
  color:#a5a5ff;font: 20px/22px "Determination Mono", monospace;}
  
sbtt2{
  color:#a5a5ff;font: 18px/18px "Determination Mono", monospace; font-style:italic;}

neo {
  color:#a5a5ff; font-weight:bold;}
.neo  {
  color:#a5a5ff; font-weight:bold;}

sa  {
  color:#fe1e5f;font: 16px/18px "Determination Mono", monospace;}
.sa   {
  color:#fe1e5f;}

or  {
  color:#64ffff;}
.or  {
  color:#64ffff;}

cu  {
  color:#fedc00;}
.cu   {
  color:#fedc00;}
  
  
  .msg   { 
	color:#def4fe;font: 18px/26px "Determination Mono", monospace;}
      


.sb2  {
  width:25%; max-width:250px; text-align:center; overflow-wrap:break-word;}

#sb2link  {
  color:#ffffff;font: 20px/25px "Determination Mono", monospace; padding-top:20px; padding-bottom:20px; padding-left:10px; padding-right:10px}
  
  






details > summary {
  background-color:#0b0b3b;color:#def4fe;font: 20px/25px "Determination Mono", monospace; padding-left:40px; padding:10px; width:100%;
}
.lrg {
  background-color:#3a006a;color:#64ffff;font: 24px/28px "Determination Mono", monospace; padding-left:40px; padding:10px; margin-bottom:8px; width:100%;
}
details {
  padding-bottom:5px;width:100%;
}
details >p {
  color:#def4fe;font: 18px/26px "OpenDyslexic", sans-serif;padding-left:24px;
}
@media only screen and (max-width:1000px) {
      details >p {padding-left:2px;}
      }

.bio {
  color:#00ffff;font-weight:bold;
}
.sub {
  font: 16px/20px "OpenDyslexic", sans-serif; padding-left:8px;
}


.cw > summary {
  background-color:transparent;color:#fe1e5f;font: 18px/26px "Determination Mono", monospace; padding:5px;
}
.cw {
  padding-bottom:5px;
}
.cw > p {
  color:#def4fe;font: 18px/26px "OpenDyslexic", sans-serif;padding-left:0px;
}



textarea {
  width:80%;
  font: 20px/26px monospace;
}



.vtl {
  display: grid;
  justify-content: stretch;
  align-content: center;
  grid-template-columns: 3% 97%;
} 

.vtl > .bar {
  text-align:center;
  align-content: center;
  justify-content: center;
  background: #1b77f8;
}

.vtl > .txt {
  padding: 4px 5px;
  text-align:left;
  align-content: center;
  justify-content: center;
}
.vtl > .ttl {
  background-color:#0b0b3b;
  padding: 5px;
  text-align:left;
  align-content: center;
  justify-content: center;
}

.vtl > .txt > details > summary {
  background-color:transparent; color:#def4fe; font: 20px/28px "OpenDyslexic", sans-serif; margin: 2px;
}
.vtl > .txt > details {
  background-color:transparent; margin: 4px;
}
.vtl > .txt > p {
  color:#def4fe; font: 18px/26px "OpenDyslexic", sans-serif; margin-left: 2px;
}
.vtl > .txt > .lrg {
color:#def4fe; font: 20px/28px "OpenDyslexic", sans-serif; margin: 6px 6px 6px 40px;
}
.hide > summary {
  list-style-type: '  '
}



