body{
  background:url('/css/assetswiki/background.jpg') center local;
  scrollbar-color:#a00 #200;
  overflow-y:scroll;
  scrollbar-gutter:auto
}
html{scrollbar-color:#600 #300}

@font-face{font-family:'LT';src:url('/Consolas.ttf')}

h1{
  padding-bottom:42px;
  border-bottom:solid 1px #500;
  color:#f00;
  font-weight:100;
  font-size:48px;
  font-family:LT;
  text-shadow:#000 -4px 3px 0;
  letter-spacing:1px;
  text-wrap:nowrap;
  text-overflow:ellipsis
}

@media (max-width:1440px){
  #container{width:87%}
  .text-entry:first-of-type,
  .text-entry:nth-of-type(2),
  h1{width:calc(98vw - 512px);min-width:423px}
}

@media (max-width:1280px){
  .text-entry{font-size:18px;line-height:1.5}
  #text-content{line-height:12px}
  h1{font-size:42px}
}

.infobox{font-size:14px}

@media (max-height:768px){
  #container{margin-top:86px;}
}

#container{
  display:flex;
  position:relative;
  max-width:1300px;
  margin:128px auto 42px;
  overflow:hidden;
  background:linear-gradient(0deg,#300 0,#4009 69%),url('./assetswiki/background.jpg') right/cover;
  border:2px inset #600;
  outline:#300 solid 1px;
  image-rendering:pixelated;
  backdrop-filter:blur(3px);
  box-shadow:inset #420 0 2px 16px 2px,0 6px 24px 12px
}

#text-content{
  font-family:Georgia;
  color:#d11;
  padding:10px 21px;
  box-sizing:border-box;
  font-size:18px;
  max-width:1060px;
  text-shadow:
    0px 4px 3px rgba(0,0,0,0.3),
    0px 4px 8px rgba(0,0,0,0.8),
    0px 3px 14px rgba(0,0,0,0.3);
}

@media (max-width:1360px){
  #text-content{max-width:70%;}
}

#image-frame{
  width:220px;
  box-sizing:border-box;
  padding:0 10px;
  margin:0 20px;
  right:1px;
  position:absolute
}

#image-container{
  width:200px;
  min-height:200px;
  height:fit-content;
  max-height:239px;
  overflow:hidden;
  border:1px solid #100;
  background:#000
}

#image-container img{
  width:210px;
  height:auto;
  display:block
}

.appearance-buttons{
  display:flex;
  margin:1px -1px;
  padding-left:2px
}

button{
  width:100px;
  border-radius:0;
  color:#e00;
  outline:inset 2px #500;
  border:outset 1px #d11;
  background:#500;
  cursor:pointer
}

button:hover{background:#600}
button.pressed{background:#522}

.text-entry{
  border-bottom:solid 1px #900;
  margin-bottom:10px;
  line-height:33px
}

.infobox{
  height:109px;
  width:200px;
  background:#100a;
  border:1px inset #800;
  color:#e00;
  box-shadow:#100 0 5px 7px -5px;
  font-family:'Franklin Gothic','Arial Narrow';
  font-size:16px;
  line-height:12px
}

.textbox{
  height:19px;
  width:200px;
  background:#e006;
  border:1px inset #e00;
  color:#100;
  margin-top:25px;
  text-align:center;
  line-height:1;
  font-family:'Franklin Gothic','Arial Narrow';
  font-size:16px
}

#header-container{
  position:fixed !important;
  top:0;
  width:100%;
  z-index:2;
  height:80px
}

#redirnotice{
  width:fit-content;
  max-width:80%!important;
  padding:12px;
  margin-top:-12px;
  margin-bottom:50px
}

#authorsign{
  position:absolute;
  bottom:3px;
  right:3px;
  font-size:13px;
  font-weight:700;
  font-style:italic;
  color:#756a;
  font-family:Consolas;
  text-align:right
}
#authorsign:hover{color:#765}

#cfix{
  position:absolute;
  width:100%;
  height:100vh;
  z-index:-1;
  top:0;
  left:0
}

.none{
  font-style:italic;
  color:#900;
  text-decoration:underline
}

.text-entry:last-of-type{border-bottom:none}

*{ cursor: default; }
button, a{ cursor: pointer; }