body {
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:#bd6aff; }
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: unset; left: unset; align-self: flex-start;}
	
.sb-title {
  background-color:#150066; 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:#150066;color:#def4fe;font: 24px "Determination Mono", serif; padding:12px; 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/24px "Determination Mono", monospace; padding: 5px; padding-top:20px; 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; text-indent: 10px;}
	
	p mark {background-color:#180078;color:#180078;
	}

  ps  {
  color:#9db0c7;font: 18px/26px "OpenDyslexic", sans-serif;}
  
  .sbtt {
  background-color:#150066; 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;}

  
  .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:8px; margin-bottom:4px; width:100%;
}
details {
  padding-bottom:10px;width:100%;
}
details >p {
    color:#def4fe; font: 18px/26px "FreeSans", sans-serif; padding-left:20px; text-indent: 20px; margin-top: unset; margin-bottom: 6px;
}
details >a {
    color:#def4fe; font: 18px/26px "FreeSans", sans-serif; padding-left:20px; text-indent: 20px; padding-bottom: unset;
}
.break {
    color:#150066; margin: 12px
}
@media only screen and (max-width:1000px) {
      details >p {padding-left:2px;}
      }


.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: unset;
}



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: '  '
}

.ht {
    color:#00ffff; font-weight:bold; font: 20px/26px "FreeSans", sans-serif; padding-bottom: 5px; text-indent: hanging; margin: 5px;
}
ht {
    color:#00ffff; font-weight:bold; font: 22px/32px "FreeSans", sans-serif; padding-bottom: 20px; text-indent: hanging;
}