
body {
  background-image: url(https://file.garden/Z2JWlPfoVFPx7BzK/googg.gif);
  background-color: rgb(255, 255, 255);
  cursor: url(https://cur.cursors-4u.net/food/foo-5/foo509.cur), auto !important;
  overflow-x: hidden;
  overflow-y: scroll;
  display: flex;
  flex-direction: column;
}




        .Buttonreturn {
      width: 200px;
      height: 50px;
      top: 0px;
      margin: auto 0;
      position: absolute;
      padding: 0px;
      background-color: #fcecf2;
      border:  transparent;
      border-radius: 10px 10px 10px 10px;
      font-family:"Winky Rough";
      text-size-adjust: large;
      text-align: center;
      color: #eb91cd;
      box-shadow: 2px 2px 4px rgb(192, 93, 162);
      z-index: 9;
     }



      .Buttonreturn:hover {
        background-color: #f1abd7;
        color: #f0f0f0;
        transform: rotateX(5deg) rotateY(5deg) scale(1.05);
        box-shadow: 2px 2px 4px rgb(192, 93, 162);
      }


      .HeaderYay {
    position: absolute;
    z-index: 4;
    top: 0px;
    width: 780px;
    height: 180px;
    background-color: #ffffff;
    left: 10px;
    border: solid 5px rgb(255, 255, 255);;
      }

        .NavBar {
    position: absolute;
    z-index: 5;
    top: 175px;
    width: 140px;
    height: 500px;
    background-color: #ffc5e9;
    background-image: url(https://file.garden/Z2JWlPfoVFPx7BzK/Tumblr_l_136538484463591.gif);
    left: 10px;
    border: solid 5px rgb(255, 255, 255);
      }


         .ImageSideBar {
    position: absolute;
    z-index: 11;
    top: 0px;
    width: 95px;
    height: 675px;
    background-color: #f7b7de;
    right: 0px;
    border: solid 5px rgb(255, 255, 255);
      }



               .topbar {
    position: absolute;
    z-index: 11;
    top: 6px;
    width: 50px;
    height: 90px;
    background-color: transparent;
    right: 83px;
    border: solid transparent;
      }


          .Bottombar {
    position: absolute;
    z-index: 11;
    top: 395px;
    width: 90px;
    height: 90px;
    background-color: transparent;
    right: 40px;
    border: solid transparent;
      }


               .ButtonsUnder {
    position: absolute;
    z-index: 11;
    top: 100px;
    width: 134px;
    height: 300px;
    background-color: transparent;
    right: 0px;
    border: solid transparent;
      }


              .Intro-Button {
    position: absolute;
    z-index: 11;
    top: 10px;
    padding-top: 10px;
    width: 120px;
    height: 30px;
    background: #f0bbdd;
    background: linear-gradient(90deg, rgba(240, 187, 221, 1) 36%, rgba(255, 122, 153, 1) 100%);
    right: 8px;
    border: solid white 2px;
    color: white;
    text-align: center;
    border-radius: 10px 10px 10px 10px;
      }

         .ArtPage-Button {
    position: absolute;
    z-index: 11;
    top: 130px;
    padding-top: 10px;
    width: 120px;
    height: 30px;
    background: #f0bbdd;
    background: linear-gradient(90deg, rgba(240, 187, 221, 1) 36%, rgba(255, 122, 153, 1) 100%);
    right: 8px;
    border: solid white 2px;
    color: white;
    text-align: center;
    border-radius: 10px 10px 10px 10px;
      }

        .Backstory-Button {
    position: absolute;
    z-index: 11;
    top: 70px;
    padding-top: 10px;
    width: 120px;
    height: 30px;
    background: #f0bbdd;
    background: linear-gradient(90deg, rgba(240, 187, 221, 1) 36%, rgba(255, 122, 153, 1) 100%);
    right: 8px;
    border: solid white 2px;
    color: white;
    text-align: center;
    border-radius: 10px 10px 10px 10px;
      }

          .IrlShrine-Button {
    position: absolute;
    z-index: 11;
    top: 190px;
    padding-top: 10px;
    width: 120px;
    height: 30px;
    background: #f0bbdd;
    background: linear-gradient(90deg, rgba(240, 187, 221, 1) 36%, rgba(255, 122, 153, 1) 100%);
    right: 8px;
    border: solid white 2px;
    color: white;
    text-align: center;
    border-radius: 10px 10px 10px 10px;
      }

         .IdkYet-Button {
    position: absolute;
    z-index: 11;
    top: 250px;
    padding-top: 10px;
    width: 120px;
    height: 30px;
    background: #f0bbdd;
    background: linear-gradient(90deg, rgba(240, 187, 221, 1) 36%, rgba(255, 122, 153, 1) 100%);
    right: 8px;
    border: solid white 2px;
    color: white;
    text-align: center;
    border-radius: 10px 10px 10px 10px;
      }

        .Intro-Button:hover, .ArtPage-Button:hover, .Backstory-Button:hover, .IrlShrine-Button:hover, .IdkYet-Button:hover {
        background-color: #f1abd7;
        transform: rotateX(5deg) ;
        box-shadow: 2px 2px 4px rgb(192, 93, 162);
      }


        .GeneralSquare {
    position: absolute;
    z-index: 5;
    top: 175px;;
    width: 640px;
    height: 500px;
    background-color: #ffeefe;
    left: 150px;
    border: solid 5px rgb(255, 255, 255);
    overflow-y: hidden;
    overflow-x: hidden;
    color: white;
    font-family: "Winky Rough";
    display: flex;
    flex-direction: column;

      }

          .GeneralSquare iframe {
            height: 100%;
            width: 100%;
          }


      .box-container-1 {
    position: relative;
    z-index: 4;
    top: 10px;
    background-attachment: fixed;
    width: 900px;
    height: 690px;
    overflow-y: scroll;
    overflow-x: hidden;
    font-family:"Winky Rough";
    justify-content: center;
    text-align: center;
    color: #fab2ce;
    margin: auto;
    background-color: white;
    border:  transparent #ccc;
    border-radius: 6px 6px 6px 6px;
    border: 40px solid transparent; 
    background-image: url('https://file.garden/Z2JWlPfoVFPx7BzK/f00831be77f5f6cb6bffc236eaaa18b3ebc1aa1d.gifv');
    border-image-source: url('https://file.garden/Z2JWlPfoVFPx7BzK/shhhds.pnj'); 
      border-image-slice: 45%;
      border-image-width: 150px;
      border-image-outset: 25px;
      border-image-repeat: round;
    overflow-y: hidden;
    overflow-x: hidden;
    }


         
        .ButtonBar {
      width: 200px;
      height: 50px;
      position: relative;
      margin: auto;
      background-color: transparent;
      top: 850px;
     }

     .box-container-11 {
      width: 200px;
      height: 300px; 
      margin-top: 0px;
      right:200px;
      position: absolute;
      background-color: transparent;
      z-index: 99;
      border: solid 5px transparent;
      border-radius: 2px 2px 2px 2px;

    }

    .title-overlay {
    height: auto;
    top: auto;
    opacity: 0;
}
.item:hover .title-overlay {
    opacity: 1;
    height: auto;
    padding: 50px 0;
}
.text {
    color: white;
    font-size: 1.2vw;
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    text-align: center;
}

    /* width */
::-webkit-scrollbar {
  width: 10px;
}

/* Track */
::-webkit-scrollbar-track {
  background: #e8a1d5;
  border-radius: 10px 10px 10px 10px;
}

/* Handle */
::-webkit-scrollbar-thumb {
  background-image: url(https://file.garden/Z2JWlPfoVFPx7BzK/dojtlb.gif);
  border-radius: 10px 10px 10px 10px;
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
  background-image: url(https://file.garden/Z2JWlPfoVFPx7BzK/dojtlb.gif)
}



#glenplayer02 {
position:absolute;
top:180px;
left: 30px;
display:flex;
z-index:99;
border-radius: 163px 163px 163px 163px;
 border: 7px solid transparent; 
 width: 80px;
 align-content:center;
 height: 100px;
 background-color: #f0f0f0;
 background-image: url(https://file.garden/Z2JWlPfoVFPx7BzK/0267e1f72c74c8fd8e84a19e47478cdca92d3930.jpg);
 border-image: url(https://file.garden/Z2JWlPfoVFPx7BzK/Untitled2873_20250822150521.png);
 border-image-width: auto;
 border-image-slice: 49.9%;
 border-image-width: 60%;
 border-image-repeat: round;
 border-image-outset: 30px;
 padding: 12px;
}

#glenplayer02 a {text-decoration:none;}
 
#glenplayer02 > div {
align-self:center;
-webkit-align-self:center;
}
 
.music-controls {
user-select:none;
-webkit-user-select:none;
width:5px;
font-size:18px;
cursor:pointer;
}
 
.playy, .pausee {
  color:#F6D5F0;
   text-shadow: -1px 0 #000, 0 1px #000, 1px 0 #000, 0 -1px #000, 0 0;
   position: absolute;
   top: 75px;
   right: 40px;
  } /* color of play & pause buttons */
 
.pausee {display:none;}
 
.sonata {
font-family: 'M PLUS Rounded 1c', sans-serif;
font-size:14px;
color:#F6D5F0;
font-weight: bold;
text-shadow: -1px 0 #000, 0 1px #000, 1px 0 #000, 0 -1px #000, 0 0; /* color of music note symbol */
}
 
.Iframe-Container iframe  {
  border: solid 5px transparent;
  border-image-source: url(https://file.garden/Z2JWlPfoVFPx7BzK/borderff.png);
   border-image-width: auto;
      border-image-slice: 45%;
      border-image-width: 200px;
      border-image-outset: 15px;
      border-image-repeat: round;
}



    @keyframes slide {
      0% {
        transform: translateY(-100%);
      }
      100% {
        transform: translateY(0);
      }
    }

.logos {
  overflow: hidden;
  padding: 15px 0;
    width: 95px;
    height: 645px;
  border: 1px;
  top: 0px;
  border-style: transparent;
  border-color: transparent;
  background: transparent;
  white-space: nowrap;
  position: absolute;

  background-color: transparent;
}

.logos:before,
.logos:after {
  position: absolute;
  top: 0;
  width: 250px;
  height: 100%;
  content: "";
  z-index: 2;
}

.logos:hover .logos-slide {
  animation-play-state: paused;
}

.logos-slide {
  display: flex;
  animation: 45s slide infinite linear;
}

.logos-slide img {
  height: 60;
  width: 90px;
  margin: 10px;
}
