/* made by /powfu! see /resource 4 more templates and awesome code snippets! ✧ദ്ദി( ˶^ᗜ^˶ ) */

.alt-page:target {
        display: block;
    }

    .alt-page:not(:target) {
        display: none;
    }  



@font-face {
 font-family: arial;
 src: url(https://files.catbox.moe/1zmi9t.TTF);
}

:root[data-theme="light"] {
    --color: black;
    --background: white;
}

:root[data-theme="dark"] {
    --color: white;
    --background: black;
}

body {
 background: var(--background); 
}

.text-container {
 background: var(--background);
border: 3px double var(--color);
border-radius: 0px;
  padding: 5px;
}


.text {
        height: 100%;
        width: 100%;
        background: var(--background);
        position: absolute;
        top: 0;
        left: 0;
      padding: 10px;
    }

main {
 width: 700px;
margin: auto;
}

*, a {
 color: var(--color); 
  font-family: arial;
      scrollbar-width: auto;
    scrollbar-color: #8c8c8c transparent;
}

b {
  color: var(--color);
   text-shadow:
       0.2px 0.2px 0 var(--color),
     -0.2px -0.2px 0 var(--color),  
      0.2px -0.2px 0 var(--color),
      -0.2px 0.2px 0 var(--color),
       0.5px 0.5px 0 var(--color);
  letter-spacing: 0.7px;
}


a {
 text-decoration: underline;
 text-decoration-style: wavy;
}

.button, .button:hover {
 background: none;
 color: var(--color);
}

#imgbox {
 width: 215px;
  float: left;
  height: 300px;
  padding: 0px;
  img {
   width: 90%; 
  }
}

#top {
 width: 450px;
  height: 40px;
  border: 1px solid var(--color);
  float: right;
  overflow-y: hidden;
  overflow-x: auto;
    white-space: nowrap;
  display: inline-block;
    -ms-overflow-style: none;
  scrollbar-width: none;
  padding: 10px;
}

#top::-webkit-scrollbar {
  display: none;
}

#bottom {
 width: 450px;
 height: 260px;
 border: 1px solid var(--color);
 float: right;
  margin-top: 5px;
  padding: 10px;
  overflow: auto;
  position: relative;
}

header.site-header { 
display: flex;
justify-content: center;
}

  *::-webkit-scrollbar {
    width: 3px;
  }

  *::-webkit-scrollbar-track {
    background: transparent;
  }

  *::-webkit-scrollbar-thumb {
    background-color: transparent;
    border-radius: 3px;
    border: 2px none #8c8c8c;
  }

#e {
background: rgba(148, 148, 148, 0.45);
}

    @media screen and (max-width: 500px) {
 main {
   width: 355px;
      }
      #top {
       margin-top: 5px;
       width: 322px;
      }
      #bottom {
       margin-top: 5px;
       width: 322px;
      }
      #imgbox {
       width: 322px;
        img {
          width: 60%;
          margin-right: 40px;
        }
      }
}