/* @import url(https://scyrellax.github.io/ankasa.css); */

@font-face {
  src:url('https://file.garden/aRLO62dQMCKHp7YG/fonts/Gontserrat.ttf');
  font-family:gontserrat;
}

@font-face {
  src:url('https://file.garden/aRLO62dQMCKHp7YG/fonts/Minecraftia-Regular.ttf');
  font-family:minecraftia;
}

.text-container {
  width:475px !important;
  height:475px;
  background-color:transparent !important;
  overflow-y:hidden;
  margin:0 auto; 
  color:#000;
}

#icon-sun, #icon-moon, svg, #theme-toggle {
	display:none !important;
}

.paste-info, .footer-line, .site-header {
  display:none !important;
}

.site-footer, .site-footer a {
  color:#fff;
}

.button {
  background:none;
  color:#fff;
}

.button.edit::before {
  content:"☆ edit";
  font-size:14px;
}

.button.edit {
  font-size:0;
}

body {
  height:100%;
  margin:0;
  display:flex;
  justify-content:center;
  align-items:center;
  background-image:linear-gradient(to bottom, rgba(255, 201, 52, 0.6), rgba(253, 121, 39, 0.2)),
    url("https://i.postimg.cc/Rhj3RBZp/tsuan-bg.jpg");
  background-size:cover;
  background-repeat:no-repeat;
  font-family:gontserrat; 
  color:#000;
  font-size:15px;
}

.wrapper {
  display:block;
}

.container {
  width:420px;
  display:grid; 
  grid-template-columns:200px 200px; 
  grid-template-rows:200px 200px; 
  gap:16px 20px; 
  grid-template-areas: 
    "topleft topright"
    "bottomleft bottomright"; 
}
    
.topleft { grid-area:topleft; }
.topright { grid-area:topright; }
.bottomleft { grid-area:bottomleft; }
.bottomright { grid-area:bottomright; }

.scrollbox {
  width:215px;
  padding:8px;
  background-color:#f0bf4d;
  border:4px #e18127 solid;
  outline:2px #ba4b13 dashed;
  color:#563121;
  font-family:gontserrat;
  font-size:13px;
  overflow-y:scroll;
  text-align:justify;
  z-index:20;
}
    
i, b, a, span {
  font-family:gontserrat;
}

.underline {
  text-decoration:underline;
  color:#ba4b13;
  font-family:gontserrat;
}

.scrollbox a {
  color:#243560;
  text-decoration:underline;
  letter-spacing:normal;
  transition:0.3s;
  font-size:13px;
}
    
.scrollbox a:hover {
  filter:blur(0.5px);
  transition:0.25s ease-in;
  letter-spacing:1.5px;
  font-size:13.5px;
}
    
.footer {
  display:flex;
  align-items:center;
  justify-content:space-between;
  width:100%;
  max-width:440px;
  margin-top:5px;
}

.left {
  grid-area:left;
  align-items:center;
}

.right {
  grid-area:right;
  justify-self:end;
}

.labeltext { 
  position:absolute;
  width:170px;
  overflow-x:hidden;
  padding-left:15px;
  margin-left:44px; 
  font-family:minecraftia; 
  font-size:16px; 
  font-weight:bold; 
  color:#fff; 
  text-shadow:-1px 0 #000, 0 1px #000, 1px 0 #000, 0 -1px #000, 0 0; 
  z-index:5;
}

.marquee {
	max-width:700px;
	min-width:700px;
  overflow-y:auto;
  padding-left:100%;
  animation:marquee 5s linear infinite;
  font-family:minecraftia;
  color:#fff;
  font-size:12px;
  z-index:2;
}
 
@keyframes marquee {
  0% {
    transform:translate(0, 0);
  }
  100% {
    transform:translate(-100%, 0);
  }
}

.musicwrapper { 
  margin-top:5px;
  width:25px;
  height:15px;
}

#audio {
  position:absolute;
  z-index:1;
  opacity:0.0;
  margin-top:-17px;
  margin-left:-5px;
  width:100px;
  scale:95%
}

#player {
  display:flex;
}

.play {
  width:30px;
  height:30px;
  border-radius:15px;
  margin-left:4px;
  margin-top:-5px;
}

.play img {
  margin-top:7px; 
  margin-left:9px;
  width:15px;
  height:15px;
  filter:invert(100%) sepia(100%) saturate(0%) hue-rotate(288deg) brightness(102%) contrast(102%);
}

.credits {
  width:100%;
  height:auto;
  padding:2px 6px;
  background-color:#f0bf4d;
  border:4px #e18127 solid;
  outline:2px #ba4b13 dashed;
  color:#563121;
  font-family:gontserrat;
  font-size:11px;
  z-index:20;
}

.credits a {
  color:#243560;
  letter-spacing:normal;
  transition:0.3s;
  font-size:11.5px;
}
    
.credits a:hover {
  filter:blur(0.5px);
  transition:0.25s ease-in;
  letter-spacing:1.5px;
  font-size:11.5px;
}

.image {
  width:200px;
  position:relative;
  top:10%;
  scale:110%;
  z-index:10;
}

.pixel {
  width:15px;
  height:auto;
}

p {
  color:#fbf4f4;
}

i {
  color:#ba4b13;
}

b {
  color:#243560;
}

u, .underline {
  text-decoration:underline;
  color:#ba4b13;
}

a {
  color:#243560;
  letter-spacing:normal;
  transition:0.3s;
  font-size:13px;
}
    
a:hover {
  filter:blur(0.5px);
  transition:0.25s ease-in;
  letter-spacing:1.5px;
  font-size:13.5px;
}

::-webkit-scrollbar {
  width:0px;
  height:0px;
  background:transparent;
}

::-webkit-scrollbar-thumb {
  background:transparent;
}

@media screen and (max-width:600px) {
  .text-container {
    scale:80%;
    margin:0 auto;
  }
}