body { background-color: #3c1976}

@font-face {
font-family: custom;
src: url('/n/catways.ttf');
font-weight: bold;}
                
body { font-family: Verdana; margin: 0px; background-image: url('/n/bowser.png'); image-rendering: pixelated;}
a { color: #ed64f5; font-weight: bold;}


@media screen and (max-width: 900px) { .sidesidebar {     display: none;   } }

 spoiler { background-color: black; color: black; display: inline-block; }
spoiler:hover { background-color: #00000055; color: white; display: inline-block; }

.container2 { width: 800px; height: 2500px; background-image: url('/n/clouds2.png'); margin: auto; }
.container {
  display: flex;
  flex-direction: column;
  width: 600px;
  margin: 0 auto;
  color: #dacfff;
  font-size: 12px;
  
}

.gtext {
  --bg-size: 400%;
  --color-one: #ed64f5;
  --color-two: #bd2f68;
  background: linear-gradient(
                90deg,
                var(--color-one),
                var(--color-two),
                var(--color-one)
              ) 0 0 / var(--bg-size) 100%;
  color: transparent;
  background-clip: text;
  -webkit-background-clip: text;
  animation: move-bg 8s infinite linear;
}

@media (prefers-reduced-motion: no-preference) {
  .gtext {
    animation: move-bg 8s linear infinite;
  }
  @keyframes move-bg {
    to {
      background-position: var(--bg-size) 0;
    }
  }
}

.floating {  
    animation-name: floating;
    animation-duration: 3s;
    animation-iteration-count: infinite;
    animation-timing-function: ease-in-out;
}
@keyframes floating {
    0% { transform: translate(0,  0px); }
    50%  { transform: translate(0, 10px); }
    100%   { transform: translate(0, -0px); }    
}

.gbg {
  --bg-size: 200%;
  --color-one: #ff6176;
  --color-two: #ffb561;
  --color-thr: #ffea62;
  --color-for: #76ff61;
  --color-fiv: #a0ced9;
  --color-six: #ff61ab;
  background: linear-gradient(
                90deg,
                var(--color-one),
                var(--color-two),
                var(--color-thr),
                var(--color-for),
                var(--color-fiv),
                var(--color-six),
                var(--color-one)
              ) 0 0 / var(--bg-size) 100%;
              
  animation: move-bg 8s infinite linear;
}

@media (prefers-reduced-motion: no-preference) {
  .gbg {
    animation: move-bg 8s linear infinite;
  }
  @keyframes move-bg {
    to {
      background-position: var(--bg-size) 0;
    }
  }
}


.linkstuff { text-align: center; }
.linkstuff a { padding: 6px; border-radius: 7px; color: #FFFFFF99; margin: 3px; display: inline-block;}
.linkstuff a:hover {color: white; transform: rotate(5deg);}

h1 { margin: 0px; text-align: center; margin: 0px; padding: 0px; font-family: Verdana; font-size: 16px; color: #f87bff}
.music {}

.header {
  text-align: center;
}

.intro {
  display: flex;
}

.about, .links {
  flex-grow: 1;
  flex-basis: 0;
}

.content {
  display: flex;
}

.left-content, .right-content {
  flex-grow: 1;
  flex-basis: 0;
}
.divider {text-align: center;}
.musicbox { width: 130px;}

@font-face {
                font-family: Dysentry;
                src: url('/OpenDyslexic-Regular.otf');
                font-weight: bold;
                font-size: 32px;
                
            }



div {
  outline: 1px solid transparent;
}

.sticker { height: 50px; image-rendering: auto; margin: 0 auto; display: block; filter: drop-shadow(5px 5px 2px #00000055);}
.sticker:hover {image-rendering: pixelated; transform: rotate(-5deg); }
.hover:hover {image-rendering: pixelated; transform: rotate(-5deg); }
.stickers2 { width: 32%; image-rendering: auto;}
.stars {padding-top: 5px; text-align: center}
.stars img {height: 50px; image-rendering: auto; filter: drop-shadow(2px 2px 1px #00000099);}
.stars img:hover {image-rendering: pixelated; transform: rotate(20deg);}

box { background-color: #271a55; padding: 4px; border-radius: 5px; display: block; margin: 5px; font-size: 10px;}

    tl { font-size: 14px; font-weight: bold; }
    tl2 { font-size: 8px; color: #fceaff88; }
    .blog {
                background-color: #1e1233;
                border: 1px solid #3c1976;
                font-size: 10px;
                border-radius: 3px;
                padding: 5px;
                color: #fceaff;
            }

#more {display: none;}

