@font-face {
    font-family:'yomogi';
    src: url("https://chouxgat.neocities.org/fonts/Yomogi-Regular.ttf");
}

@font-face {
    font-family:'dotemp demo';
    src:url("https://chouxgat.neocities.org/fonts/Dotemp-8bit.ttf");
}

@font-face {
    font-family:'happy hippie';
    src:url("https://chouxgat.neocities.org/fonts/Happy%20Hippie.otf");
}

@font-face {
    font-family:'cherrybomb';
    src:url("https://chouxgat.neocities.org/fonts/CherryBombOne-Regular.ttf");
}

* {
  cursor: url('https://cdn.cursors-4u.net/previews/pink-double-sketch-heart-f8f5194a-32.webp') 32 32, auto !important;
}

body {
    display:flex;
    flex-direction:row;
    justify-content:left;
    align-items:center;
    margin:0;
    padding:0;
    overflow-y:scroll;
    background-image:url("https://chouxgat.neocities.org/graphics/flowers.gif");
    background-size:150px;
    font-family:'yomogi';
    color:rgb(142, 91, 103);
    font-size:16px;
}

.custom-tooltip {
  position: absolute;
  background-color: white;
  color: black;
  font-family:'yomogi';
  font-style:italic;
  padding:0;
  border:15px solid;
  border-image:url("https://chouxgat.neocities.org/graphics/border14.png") 30 round;
  border-image-outset:10px;
  font-size: 14px;
  font-family: sans-serif;
  pointer-events: none;
  z-index: 9999;
  display: none;
}

a {
    color:rgb(250, 146, 163);
}

::selection {
    background-color:rgba(255, 212, 219, 0.708);
}

/* scrollbar code */

::-webkit-scrollbar {
    width:15px;
}

::-webkit-scrollbar-track {
    background-color:rgba(255, 255, 255, 0.335);
    box-shadow: inset 3px 3px 3px #00000017;
}

::-webkit-scrollbar-thumb {
    border:2px solid darkgrey;
    border-radius:5px;
    background: #e8e8e8;
    background: linear-gradient(90deg,rgba(232, 232, 232, 1) 34%, rgb(191, 191, 191) 52%);
    box-shadow: inset 0px 0px 6px #fff;
}

::-webkit-scrollbar-thumb:active {
    border:2px solid rgb(125, 125, 125);
    background: linear-gradient(90deg,rgb(172, 172, 172) 34%, rgb(131, 131, 131) 52%);
}

/* end scrollbar code */

.crt::before {
  content: " ";
  display: block;
  position: fixed;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  background: linear-gradient(rgba(18, 16, 16, 0) 50%, rgba(0, 0, 0, 0.25) 50%), linear-gradient(90deg, rgba(255, 0, 0, 0.06), rgba(0, 255, 0, 0.02), rgba(0, 0, 255, 0.06));
  z-index: 999;
  filter:opacity(0%);
  background-size: 100% 2px, 3px 100%;
  pointer-events: none;
}

.nav {
    display:flex;
    gap:0;
    font-family:'cherrybomb';
    display:grid;
    width:260px;
    height:695px;
    position:absolute;
    right:3px;
    top:270px;
    border:15px solid;
    border-image:url("https://chouxgat.neocities.org/graphics/border12.png") 60 round;
}

#navtop {
    margin:0;
    padding:0;
    display:grid;
    place-items:center;
    border-radius: 10px 10px 0px 0px;
    border:3px ridge pink;
    height:40px;
    background-image:url("https://chouxgat.neocities.org/graphics/sweater.jpg");
    background-size:30px;
    box-shadow:inset 0px 0px 5px;
}

#navtop p {
    font-size:25px;
    margin:0;
    background:linear-gradient(to right, rgb(255, 123, 123), rgb(255, 207, 118), rgb(255, 255, 150), rgb(141, 255, 141), rgb(130, 130, 255), rgb(255, 146, 255), rgb(255, 208, 215));
    background-clip:text;
    -webkit-background-clip:text;
    color:transparent;
    text-shadow:none;
    -webkit-text-stroke:1px rgba(71, 41, 41, 0.552);
}

#navbottom {
    margin:0;
    padding:0;
    display:grid;
    border-radius: 0px 0px 10px 10px;
    border:3px ridge pink;
    border-top:none;
    height:40px;
    background-image:url("https://chouxgat.neocities.org/graphics/sweater.jpg");
    background-size:30px;
    place-items:center;
    box-shadow:inset 0px 0px 5px;
}

#navbottom p {
    font-size:25px;
    margin:0;
    background:linear-gradient(to right, rgb(255, 123, 123), rgb(255, 207, 118), rgb(255, 255, 150), rgb(141, 255, 141), rgb(130, 130, 255), rgb(255, 146, 255), rgb(255, 208, 215));
    background-clip:text;
    -webkit-background-clip:text;
    color:transparent;
    text-shadow:none;
    -webkit-text-stroke:1px rgba(71, 41, 41, 0.552);
}

#button1 {
    margin:0;
    padding:0;
    display:grid;
    place-items:center;
    height:40px;
    height:40px;
    border-left:3px ridge pink;
    border-right:3px ridge pink;
    border-bottom:3px ridge pink;
    background-image:url('https://chouxgat.neocities.org/graphics/pinkargyle.webp');
    background-size:40px;
    box-shadow:inset 0px 0px 5px;
}

#button2 {
    margin:0;
    padding:0;
    display:grid;
    place-items:center;
    height:40px;
    border-left:3px ridge pink;
    border-right:3px ridge pink;
    border-bottom:3px ridge pink;
    background-image:url('https://chouxgat.neocities.org/graphics/blueargyle.png');
    background-size:40px;
    box-shadow:inset 0px 0px 5px;
}

#button1 a {
    font-size:25px;
    color:rgb(244, 166, 188);
    font-family:'cherrybomb';
    text-shadow: 
    -1px -1px 0px #fff,  1px -1px 0px #fff, 
    -1px  1px 0px #fff,  1px  1px 0px #fff;
    transition:all 0.2s ease-in-out;
    text-decoration:none;

}

#button2 a {
    font-size:25px;
    color:rgb(166, 178, 244);
    font-family:'cherrybomb';
    text-shadow: 
    -1px -1px 0px #fff,  1px -1px 0px #fff, 
    -1px  1px 0px #fff,  1px  1px 0px #fff;
    transition:all 0.2s ease-in-out;
    text-decoration:none;
}

#button1 a:hover {
    transform:scale(1.2);
}

#button2 a:hover {
    transform:scale(1.2);
}

#button1 a:active {
    transform:scale(0.9);
}

#button2 a:active {
    transform:scale(0.9);
}

#navdiv {
    margin:0;
    padding:0;
    display:grid;
    border:3px ridge pink;
    border-top:none;
    height:40px;
    background-image:url("https://chouxgat.neocities.org/graphics/sweater.jpg");
    background-size:30px;
    place-items:center;
    box-shadow:inset 0px 0px 5px;
}

#navdiv p {
    font-size:25px;
    margin:0;
    background:linear-gradient(to right, rgb(255, 123, 123), rgb(255, 207, 118), rgb(255, 255, 150), rgb(141, 255, 141), rgb(130, 130, 255), rgb(255, 146, 255), rgb(255, 208, 215));
    background-clip:text;
    -webkit-background-clip:text;
    color:transparent;
    text-shadow:none;
    -webkit-text-stroke:1px rgba(71, 41, 41, 0.552);
}

.contain {
    position:relative;
    display:flex;
    justify-content:center;
    margin:30px;
    width:950px;
    height:2000px;
    background-image:url("https://chouxgat.neocities.org/graphics/polkadotbg.webp");
    background-size:150px;
    position:relative;
    display:flex;
    flex-direction:column;
    border:25px solid;
    border-image:url("https://chouxgat.neocities.org/graphics/border8.png") 40 round;
    border-image-outset:20px;
    
}

.contain img {
    display:inline-block;
    vertical-align:middle;
}

#last {
    display:flex;
    position:relative;
    background-image:url('https://chouxgat.neocities.org/graphics/strawbbg.gif');
    border:3px ridge pink;
    height:3000px;
    width:940px;
    box-shadow:inset 0px 0px 5px;
}

#banner {
    position:absolute;
    display:flex;
    width:913px;
    height:250px;
    background-image:url("https://chouxgat.neocities.org/graphics/banner.jpg");
    background-position:50%;
    background-size:1100px;
    margin:10px;
    border:3px ridge pink;
}

#wrap1 {
    display:flex;
    position:absolute;
    width:570px;
    height:550px;
    left:10px;
    top:280px;
    background-image:url('https://chouxgat.neocities.org/graphics/peachplaid.gif');
    border:15px solid;
    border-image:url("https://chouxgat.neocities.org/graphics/border9.png") 20 round;
    border-image-outset:10px;
    padding:10px;
}

#content1 {
    position:relative;
    border:1px dashed rgb(174, 115, 128);
    width:96%;
    height:96%;
    padding:10px;
    background-image:url("https://chouxgat.neocities.org/graphics/sakurabg.webp");
    border-radius:10px;
    overflow-y:scroll;
}

#winamp-container {
    position:absolute;
    display:flex;
    bottom:600px;
    left:1300px;
}

#title {
    position:absolute;
    font-family:'happy hippie';
    top:160px;
    left:20px;
    filter:drop-shadow(1px 1px 0px rgba(0, 0, 0, 0.332));
    font-size:50px;
    -webkit-background-clip:text;
    background-clip:text;
    background-size:30px;
    -webkit-text-fill-color: transparent;
    color:transparent;
    background-image:url("https://chouxgat.neocities.org/graphics/polkadotbg2.jpg");
}

.mediac {
    width:60%;
    height:100%;
    margin:0 auto;
    position: absolute;
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    background-color:rgba(255, 255, 255, 0.693);
    border:8px solid;
    border-image:url("https://chouxgat.neocities.org/graphics/border4.png") 20 round;
}

.mediac img {
    transition: transform 0.2s ease-in-out;
    margin-left:20px;
    margin-right:20px;
}

.mediac img:hover {
    transform:rotate(5deg) scale(1.07);
    filter:sepia(1) hue-rotate(300deg);
}

#wrwrap {
    font-family:'cherrybomb';
    display:flex;
    background-image:url("https://chouxgat.neocities.org/graphics/blueplaid.png");
    width:370px;
    height:300px;
    position:absolute;
    display:grid;
    place-items:center;
    top:1020px;
    right:15px;
    padding:10px;
    border:15px solid;
    border-image:url("https://chouxgat.neocities.org/graphics/border13.png") 20 round;
    border-image-outset:10px;
}

#wr {
    display:grid;
    place-items:center;
    background-image:url("https://chouxgat.neocities.org/graphics/sakurablue.png");
    position:relative;
    border:1px dashed rgb(113, 113, 189);
    width:96%;
    height:96%;
    border-radius:10px;
    overflow-y:scroll;
    padding:10px;
}

#stamps {
    border-radius:10px;
    position:absolute;
    background-image:url("https://chouxgat.neocities.org/graphics/stripebg.jpg");
    width:99%;
    margin:0 auto;
    height:5%;
    bottom:5px;
    left:5px;
    display:flex;
    justify-content:center;
    align-items:center; 
    box-shadow:inset 0px 0px 20px;   
}

#decome {
    position:relative;
    display:grid;
    vertical-align:middle;
    place-items:center;
    width:630px;
    height:13vh;
    top:895px;
    left:10px;
    border:1px dotted black;
    border-radius:10px;
    background-image:url("https://chouxgat.neocities.org/graphics/rainbowknit.jpeg");
    background-size:180px;
}

#decome img {
    width:50px;
}

#bar {
    padding:0;
    place-items:center;
    align-items:center;
    background-color:rgb(252, 203, 211);
    border:3px outset rgb(252, 203, 211);
    margin:30px;
    width:260px;
    height:40px;
    font-size:30px;
    font-family:'cherrybomb';
    color:white;
    text-shadow:
    -1px -1px 0px rgb(184, 131, 140),  1px -1px 0px rgb(184, 131, 140), 
    -1px  1px 0px rgb(184, 131, 140),  1px  1px 0px rgb(184, 131, 140);
}

#bar p {
    position:relative;
    margin:0;
    vertical-align:middle;
    display:grid;
    bottom:5px;

}


.lm {
   display: grid;
   position:absolute;
   top:1020px;
   left:20px;
   width:470px; 
   height:200px;
}

#lmtop {
    display:grid;
    place-items:center;
    align-items:center;
    border:2px pink ridge;
    border-radius:10px 10px 0px 0px;
    background-image:url("https://chouxgat.neocities.org/graphics/yellowbg.png");
    background-size:50px;
    height:40px;
}

#lmtop h1 {
    font-size:30px;
    margin:0 auto;
    font-family:'cherrybomb';
}

#linkme {
   height:250px;
   background-image:url("https://chouxgat.neocities.org/graphics/multicolorbow.gif");
   border:2px ridge pink;
   border-radius: 0px 0px 10px 10px;
   border-top:none;
   overflow-y:scroll;
}

.doll:hover {
    animation: bounce 2.5s infinite;
   -webkit-animation: bounce 2.5s infinite; 
   -moz-animation: bounce 2.5s infinite; 
   -o-animation: bounce 2.5s infinite; 
}

@-webkit-keyframes bounce {
    0%,  
    100% {
       -webkit-transform: translateY(0);
    } 
    50% {
        -webkit-transform: translateY(-10px);
    }
}
@-moz-keyframes bounce {
    0%, 
    100% {
       -moz-transform: translateY(0);
    }
    50% {
       -moz-transform: translateY(-10px);
    }
}
@-o-keyframes bounce {
    0%,
    100% {
       -o-transform: translateY(0);
    }
    50% {
       -o-transform: translateY(-10px);
    }
}
@keyframes bounce {
    0%,  
    100% {
        transform: translateY(0);
    }
    50% {
        transform: translateY(-10px);
    }
}