/* FONTS */

@font-face {
    font-family: '2Credits';
    src: url(fonts/2Credits.ttf)
}
@font-face {
    font-family: 'W95FA';
    src: url(fonts/W95FA.otf);
}
@font-face {
    font-family: 'alarm clock';
    src: url(https://syntheticfruits.neocities.org/fonts/alarm\ clock.ttf);
}
@font-face {
    font-family: 'Cotton Cloud';
    src: url(fonts/CottonCloud.ttf);
}
@font-face {
    font-family: 'Organical';
    src: url(https://syntheticfruits.neocities.org/fonts/ORGANICAL\ PERSONAL\ USE.ttf);
}
@font-face {
    font-family: 'ModernDOS';
    src: url(fonts/ModernDOS8x16.ttf);
    
}
/* SITE */

html {
    image-rendering:crisp-edges;
    -webkit-font-smoothing: never;
    
}

body {
    cursor: url(https://cur.cursors-4u.net/cursors/cur-10/cur918.cur), default;
    background: url(backgrounds/sbbg2.gif);
    background-color: #325155;
    background-size: 300px;
    
    height: 100vh;
    position: relative;
    font-family: "W95FA";
    letter-spacing: 2px;
    overflow-y: scroll;
    overflow-x: hidden;
    margin: 0%;
}
div {
    display: block;
}

/* LINKS */

a {
    text-decoration: none;
}

/* SELECTION */

::selection {
    text-shadow: 1px 1px #faffb3;
    background: rgb(93, 162, 207);
}

hr {
    border-top: 3px double #3243db;
}


/* CURSORS */

a:hover {
    cursor: url('cursor/cur902.gif'), pointer;
}

.footer a:hover {
    color: #faffb3;
    background-color: #f7adff;
}



.music a:hover {
    color: #86e78b;
    text-decoration-color: #f7adff;
}

#musicpage {
    margin-top: 48px;
    margin-left: 18px;
}

img#new {
    position: absolute;
    margin-top: 24px;
    margin-left: -144px;
}

img#bunni {
    position: absolute;
    margin-top: 33px;
    margin-left: -126px;
}

#musicpage p {
    font-family: "ModernDOS";
    font-size: 12px;
    display: inline-block;
    letter-spacing: 1px;
    color: #39fa66;
    background-color: #6e8ae6;
    padding: 0px 2px 0px 3px;
    border-radius: 5px;
    box-shadow: 0px 2px #5d77cf;
    width: 95px;
}
#musicpage a {
    font-variant: small-caps;
    
    font-weight: 900;
    color: #f6b6fc;
    font-size: 15px;
    text-decoration: 1px underline wavy #f0ef8f;
}
#musicpage a:hover{
    font-style: italic;
    color: #59e9fc;
}


p:hover {
    cursor: url('cursor/cur905.gif'), text;
}

h1:hover {
    cursor: url('cursor/cur905.gif'), text;
}

li:hover {
    cursor: url('cursor/cur905.gif'), text;
}

button:hover {
    cursor: url('cursor/cur902.gif'), url(cursor/02.cur), default;
}

input:hover {
    cursor: url('cursor/cur902.gif'), url(cursor/02.cur), default;
}

/* UL */

ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
    font-size: 20px;
  }

/* ELEMENTS BOX SIZING */

* {
    box-sizing: border-box;
}

/* ZOOM CLASS */

.zoom {
    transition: transform .2s; /* Animation */
  }
  
  .zoom:hover {
    transform: scale(1.2); /* (150% zoom - Note: if the zoom is too large, it will go outside of the viewport) */
  }

/* LOADER */


span.sf {
    font-family: '2Credits';  
}
span.loadText {
    text-shadow: 1px 1px #78f9d2;
    color: #639aff;
}

span.loadTitle {
    background: linear-gradient(
        to right,
        #fa85a6 20%,
        #fa85a6 30%,
        #f7adff 70%,
        #917adb 80%
    );
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    text-fill-color: transparent;
    background-size: 500% auto;
    animation: textShine 5s ease-in-out infinite alternate;
}
@keyframes textShine {
    0% {
        background-position: 0% 50%;
    }
    100% {
        background-position: 100% 50%;
    }
}



.loader {
    height: 100vh;
    width: 100vw;
    overflow: hidden;
   background: #adffda;
background: radial-gradient(circle, rgba(173, 255, 218, 1) 0%, rgba(138, 175, 242, 1) 40%, rgba(54, 122, 247, 1) 60%, rgba(46, 40, 64, 1) 88%);
    position: absolute;
    z-index: 900;
    cursor:  url(cursor/load.gif), default;
}

.loader>div {
    width: max-content;
    height: max-content;
    position: absolute;
    margin: auto;
    text-align: center;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
}

body.loading {
   overflow-y: hidden; 
   
}

span.viewOnDesktop {
    margin: auto;
    left: 0;
    top: 53vh;
    right: 0;
    bottom: 0;
    position: absolute;
    text-align: center;
    font-size: 10px;
    font-variant: small-caps;
    font-style: italic;
    font-weight: bolder;
    color: #415fc0;
}

/* CONTAINER */

.container {
    width: 1200px;
    display: block;
    padding-top: 10px;
    margin: auto;
    z-index: 1;
     -ms-overflow-style: none;  /* Internet Explorer 10+ */
    scrollbar-width: none;  /* Firefox */
}
.container::-webkit-scrollbar {
    display: none;
}



/* SCROLLBAR */

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

::-webkit-scrollbar-button {
    background-color: #ab9889;
    background-size: 100%;
    border-width: 1px;
    border-style: solid;
    border-color: #424141;
    border-top-color: #c0c0c0;
    border-left-color: #c0c0c0;
    box-shadow: inset 1px 1px #fff, inset -1px -1px #543223;
}
::-webkit-scrollbar-button:horizontal:increment {
    background-image: url(scrollbar/POINTSRIGHT.png);
}
::-webkit-scrollbar-button:horizontal:decrement {
    background-image: url(scrollbar/POINTSLEFT.png);
}
::-webkit-scrollbar-button:vertical:increment {
    background-image: url(scrollbar/POINTSDOWN.png);
}
::-webkit-scrollbar-button:vertical:decrement {
    background-image: url(scrollbar/POINTSUP.png);
}
::-webkit-scrollbar-corner {
    background: #c0c0c0;
    background-image: url(icons/flowergreen.gif);
}
::-webkit-scrollbar-thumb {
    background-color: #ab9889;
    border-width: 1px;
    border-style: solid;
    border-color: #404040;
    border-top-color: #c0c0c0;
    border-left-color: #c0c0c0;
    box-shadow: inset 1px 1px #fff, inset -1px -1px #764b39;
}
::-webkit-scrollbar-track {
    background-size: 2px 2px;
    background-image: url(scrollbar/scrollbg.png);
    background-color: transparent;
}

/* HEADER */

table#banner {
   
    margin: auto;
}

#headerarea {
    width: 1200px;
    height: max-content;
   
}

.header {
    display: block;
    width: 800px;
    margin: auto;
    height: auto;
    
}
.header #Banner{
    display: block;
    width: 550px;
    margin: auto;
    padding-top: -10px;
}

img#titlebarbanner {
    margin-left: 2px;
}

span#titlebarbanner {
    font-family: "W95FA";
    font-size: 11px;
    letter-spacing: 1px;
    font-weight: 900;
    color: #1c5fc5;
}




img#bannerfairy {
    position: absolute;
    scale: 120%;
    margin-top: 70px;
    margin-left: 90px;
    z-index: 1;
    transform: rotate(-3deg);
}

img#bannerfairy:hover {
    scale: 150%;
    cursor: url(cursor/02.cur), url(cursor/cur902.gif), default;
}
img#moon {
    scale: 80%;
    position: absolute;
    margin-left: 110px;
    margin-top: -20px;
    display: none;
}

img#bannerfairy2 {
    position: absolute;
    scale: 100%;
    margin-left: 55px;
    margin-top: 20px;
    transform: rotate(5deg);
}
img#bannerfairy2:hover {
    cursor: url(cursor/02.cur), url(cursor/cur902.gif), default;
    scale: 120%;
}
img#fairyquote {
    position: absolute;
    scale: 80%;
    margin-left: 810px;
    margin-top: -50px;
    display: none;
}



status-banner {
    display: block;
    float: right;
    width: 110px;
    height: 200px;
    margin-top: -203px;
    
    
}

#statuscafe {
    padding: 2px;
    background-color: #a088f5;
    border-radius: 0px 0px 0px 20px;
    border-bottom: 2px solid #866eff;
    font-size: 12px;
    letter-spacing: normal;
    margin: 0%;
}

#statuscafe-username {
    font-family: "2Credits";
    text-align: right;
    margin-bottom: 2px;
    font-size: 11px;
    color: #59e9fc;
    background: #ADFFC9;
background: linear-gradient(180deg, rgba(173, 255, 201, 0) 4%, rgba(138, 175, 242, 1) 89%);
    padding-right: 5px;
    line-height: 10px;
    border-radius: 4px 0px 0px 8px;
}

#statuscafe-username a{
    color: #f7ecd1;
    font-style: italic;
    font-size: 12px;
}
#statuscafe-content {
    margin: 0 1em 0.5em 1em;
    color: #39fa66;
    text-align: right;
    letter-spacing: 1px;
}



#ct7 {
    font-family: "2Credits";
    letter-spacing: 1px;
    font-size: 12px;
    text-align: center;
    width: 100%;
    background-color: #e28bea;
    border-radius: 0px 0px 20px 0px;
    border-bottom: 2px solid #6e7fff;
    color: #39fa66;
    padding: 3px 8px 3px 8px;
    margin-top: 4px;
    margin-left: -29px;
}

#feeling {
    font-family: "2Credits";
    font-size: 10px;

    letter-spacing: 1px;
    display: block;
    font-weight: 800;
    float: left;
    margin-top: 0%;
    margin-left: 10px;
    margin-right: 0%;
    color: #f06fbd;
    padding: 1px;
    padding-left: 2px;
    padding-bottom: 3px;
   
}

#mood {
    display: block;
    float: left;
    margin-top: 0%;
    border-radius: 0px 0px 5px 5px;
    border-bottom: 2px solid #f7b4f1;

}






chat {
    display: block;
    float: left;
    padding-top: 40px;
    margin: 0%;
    margin-right: -130px;
}
chat img{
    
    transform: rotate(2deg);
    scale: 70%;
}
chat img:hover {
    scale: 75%;
    transform: rotate(-1deg);
}




/* MARQUEE */

.Badgemarquee {
    width: 100%;
    height: 48px;
  background: #ADFFC9;
background: linear-gradient(180deg, rgba(173, 255, 201, 0) 4%, rgba(138, 175, 242, 1) 93%);
margin: 0%;
}


.Badgemarquee img#text {
    margin-top: 2px;
}

.Badgemarquee img#badgelink {
    display: inline-block;
    margin-bottom: 3px;
}

.Badgemarquee img#badges {
    display: inline-block;
    margin-bottom: 3px;
    border: 2px solid #f5c8fa;
    border-bottom: 2px solid #7386FF;
    border-top: 3px solid #f8f8a9;
}

.Badgemarquee img#badges:hover {
    scale: 105%;
    box-shadow: 0px 0px 5px #5165da;
}



img#leftfairy {
    position: absolute;
    scale: 100%;
    margin-left: -35px;
    margin-top: -5px;
}
img#leftfairy:hover {
    scale: 150%;
    cursor: url(cursor/02.cur), url(cursor/cur902.gif), default;

}

img#cloud {
    position: absolute;
    scale: 100%;
    margin-left: 155px;
    margin-top: 80px;
    z-index: 200;
    display: none;
    transform: rotate(10deg);
}



/* LEFT */

#leftsidewindow {
    
    display: inline-block;
    margin-bottom: 0px;
    margin-right: 0px;
    margin-left: 0px;
  
}

/* NAVIGATION */

a#naviList{
    font-family: "ModernDOS";
    font-size: 20px;
    text-transform: capitalize;
    color: #e27ced;
    background: #fff569;
    background: linear-gradient(180deg, rgba(255, 245, 105, 1) 1%, rgba(225, 232, 123, 1) 46%, rgba(72, 168, 167, 1) 100%);
    border-radius: 5px 15px 5px 15px;
    padding: 2px;
    display: block;
    width: 130px;
    margin-bottom: 4px;
    text-decoration: none;
    letter-spacing: 0px;
}


a#naviList:hover {
 
    text-shadow: 1px 1px #8b81e1;
    color: #eff68d;
    background: #c7d1ff;
background: linear-gradient(180deg, rgba(199, 209, 255, 1) 37%, rgba(51, 143, 242, 1) 100%);
    letter-spacing: 2px;
    padding: 2px;
    font-family: "2Credits";
    font-size: 18px;
    font-style: italic;
    
}

a#naviList:active {
    background-color: #aafbb2;
    position: relative;
    top: 2px;
    
}




.Navmenu {
    margin-top: -154px;
    margin-left: -1px;
    display: block;
    z-index: 200;
}

.dropbtn#Navigationbutton {
    font-family: "2Credits";
    font-size: 20px;
    padding: 5px;
    padding-right: 10px;
    border: 1px solid #253876;
    color: #f6f35b;
    text-shadow: 1px 0px #000;
    box-shadow: inset 2px 2px 2px #fff, inset -1px -1px 5px #6351bf;
    border-radius: 0px 0px 20px 0px;
    vertical-align:middle;
    background: #e1e87b;
background: linear-gradient(180deg, rgba(225, 232, 123, 1) 0%, rgba(126, 196, 157, 1) 23%, rgba(101, 147, 207, 1) 57%, rgba(201, 149, 204, 1) 84%);
}

.dropbtn#Navigationbutton:hover, .dropbtn#Navigationbutton:focus {
    color: #70ff83;
    text-shadow: 1px 0px #2515a1;
   background: #e1e87b;
background: linear-gradient(180deg, rgba(225, 232, 123, 1) 0%, rgba(126, 196, 157, 1) 23%, rgba(101, 147, 207, 1) 57%, rgba(201, 149, 204, 1) 84%);
}

img#nvdownarw {
    transform: rotate(90deg);
    margin-left: 5px;
    margin-top: -10px;
    display: block;
    position: absolute;
}


.dropdown {
    position: relative;
    display: inline-block;
  
}

.dropdown-content {
    display: none;
    position: absolute;
    margin-top: 0px;
    margin-left: 15px;
    min-width: 130px;
    z-index: 1;
      text-align: center;
      background-color: rgb(240, 111, 189, 0.4);
   box-shadow: 0px 0px 8px #f06fbd;
       background-image: url(backgrounds/dta.gif);
    padding: 6px;
    padding-left: 12px;
    border-radius: 20px;
}

.dropdown-content a {
    border: 1px solid #000;
    box-shadow: inset 3px 3px 2px #fcf6c5, inset -3px -3px 2px #639aff;
    padding: 5px 16px;
    text-decoration: none;
    display: block;
}

.dropdown-content a:hover {
    background-color: #7386FF;
    color: #faffb3;
}

.dropdown img#new {
    padding: 0%;
    margin: 0%;
}

.show {
    display:block;
}

img#madeByAGirl {
    scale: 80%;
    position: absolute;
    margin-top: -70px;
    margin-left: 700px;
}

img#madeByAGirl:hover {
    scale: 90%;
}

img#kitty {
    position: absolute;
    margin-left: -120px;
    scale: 100%;
   
    padding: 3px;
    
}
img#kitty:hover {
    scale: 105%;
   
}
img#rainbow {
    position: absolute;
    width: 120px;
    margin-top: -20px;
    margin-left: 80px;
    z-index: -1;
    scale: 110%;
    
}

/* MUSIC AREA */




.adbox span#CDplayer p {
    font-family: '2Credits';
    font-size: 16px;
    line-height: 15px;
    color: #f8f8a9;
    text-shadow: 1px 1px #dc67bd;
    background-color: #b8b8f0;
    padding: 2px;
    border-radius: 5px;
    margin: 0%;
    box-shadow: 0px 2px 5px #5d77cf, inset 0px 0px 5px #8997f3;
    border: 1px dotted #e9bfec;
    cursor: url(https://syntheticfruits.neocities.org/cursor/cur918.gif), default;
}


.adbox span#CDplayer {
    text-align: center;
}


span#clickhere {
    color: #ADFFC9;
    text-decoration: 1px underline wavy #fff86e;
    font-size: 17px;
}

span#clickhere:hover {
    color: #7288e9;
    text-shadow: 1px 1px #523cdf;
}


img#newpp {
    margin-top: 30px;
    margin-left: 25px;
    scale: 120%;
    display: inline-block;
    position: absolute;
    z-index: 200;
}

img#minidisc {
    display: inline-block;
    width: 90px;
    transform: rotate(2deg);
    z-index: 100;
    margin-left: 40%;
    border: 3px double #ff8edb;
}

span#CDplayer a:hover {
    mix-blend-mode: normal;
    background-color: none;
    box-shadow: none;
}





img#adboxfairy {
    position: absolute;
    margin-top: -200px;
    margin-left: 1130px;
    scale: 100%;
    transform: rotate(-3deg);
}

img#adboxfairy:hover {
    scale: 150%;
    cursor: url(cursor/02.cur), url(cursor/cur902.gif), default;
}




img#sanrio {
    display: block;
    margin: auto;
    margin-top: 100px;
    z-index: 900;
   
}

img#sanrio:hover {
    scale: 105%;
}




.music {
    width: 188px;
    height: 40px;
    display: inline-block;
    margin-left: 3px;
    margin-top: 0px;
    margin-bottom: 0%;
    text-align: center;  
    background-color: rgba(182, 189, 246, 0.5);
    border-radius: 0px 0px 30px 30px;
    box-shadow: 1px 0px 1px #5365d7,
    inset 2px 0px 3px #f6e4f8;
    border: 1px solid #6b4c6e;
    border-top: none;
    padding: 1px;
    font-size: 12px;
    letter-spacing: 1px;
    font-family: "ModernDOS";
    color: #39fa66;
}

.music a{
    color: #eb93f5;
    text-shadow: 1px 1px #a877c9;
    letter-spacing: 3px;
    font-weight: 900;
    font-variant: small-caps;
    font-size: 18px;
    text-decoration: 1px wavy underline #f0ef8f;
}


#quaver{
    scale: 80%;
    position: absolute;
    margin-top: -50px;
    margin-bottom: 60px;
    margin-left: 175px;
    display: none;
    transform: rotate(5deg);
}

#shroom {
    position: absolute;
    margin-top: -190px;
    margin-left: -9px;
    transform: rotate(-6deg);
    display: none;
}

#snail {
    position: absolute;
    margin-top: -181px;
    margin-left: 130px;
    display: none;
}
/* MAIN MIDDLE AREA */

#bottomzone {
    width: 1090px;
    margin: auto;
    margin-top: 10px;
    padding: 0%;
    display: flex;
   
}

#main {
  
    display: inline-block;
    position: inherit;
    width: 618px;
    height: max-content;
    padding: none;
    margin-left: 40px;
    margin-right: 40px;
    
}

#main_iframe {
    width: 100%;
    border: none;
    overflow: none;
    margin-bottom: 0%;
    margin-top: 0%;
}


.footer {
    width: 600px;
    height: 60px;
    margin: auto;
    margin-top: 10px;
    margin-bottom: 20px;
    box-shadow: inset -1px -1px #523cdf,
    inset 1px 1px #dfdfdf, inset -1px -1px #f16eff,
    inset 1px 1px #ffffff;
  border: 1px solid #7386FF;
    border-top-right-radius: 50px;
    border-top-left-radius: 50px;
    border-bottom-left-radius: 500px;
    border-bottom-right-radius: 500px;
    background-image: url(backgrounds/98sky.gif);
    background-size: cover;
    background-position: -1000px 200px;
    text-align: center;
    
    
}



.footer h1{
    font-family: "2Credits";
    font-size: medium;
    line-height: 0%;
    color: #f5c8fa;
    text-shadow: 1px 1px #415fc0;

}

.footer h1:hover {
    color: #faffb3;
    text-shadow: 1px 1px #f16eff;
}

.footer p{
    font-size: 12px;
}

.footer img#copyright {
    margin-right: 5px;
}


img#disc 
{
    display: inline-block;
    scale: 120%;
    transform: rotate(3deg);
}
#rightsidewindow {
   
    position: inherit;
    display: inline-block;
    width: 190px;
    height: auto;
    padding-top: -30px;
    margin-top: 0px;
    margin-left: 0px;
}






a#chat {
    font-family: "2Credits";
    font-weight: bolder;
    font-size: 12px;
    letter-spacing: normal;
    color: #f7adff;
    text-shadow: 2px 1px 1px #3243db;
    border: 1px dotted #96fbb3;
    background-color: #4e5bd0;
    border-radius: 50%;
    padding: 5px;
    box-shadow: 0px 3px #e15ea2;
}

a#chat:hover {
    color: #e2e6a4;
    background-color: #3243db;
}


.badgeLink {
    display: block;
    cursor: url(cursor/06b.cur), url(cursor/cur905.gif), default;
    overflow-y: scroll;
    overflow-x: hidden;
    line-height: 2px;
    background-color: #91d6c4;
    color: #685aff;
    text-shadow: 0px 1px #faffb3;
    height: 25px;
    width: 150px;
    margin: 5px 0px 0px -5px;
    border: 1px #8c6759 solid;

}

.badgeLink code{
    font-family: "W95FA";
    font-size: 10px;
    font-weight: bold;
    text-align: left;
    line-height: 8px;
    letter-spacing: 1px;
    user-select: all;
}

#stats {
    width: 100px;
    height: 30px;
    display: block;
    position: absolute;
    margin-top: 4px;
    background-color: #7b6de9;
    padding-left: 3px;
    border-radius: 0px 0px 8px 0px;
    border-right: 2px solid #a89dfc;
    box-shadow: 0px 3px #a89dfc;
}

#stats p{
    font-family: 'ModernDOS';
    font-size: 12px;
    letter-spacing: 1px;
    display: inline;
    font-variant: small-caps;
    color: #ef91fa;
}

.statscene {
    background-image: url(backgrounds/2979-grass.png);
    border: 1px groove #917adb;
    background-size: cover;
    width: 115px;
    height: 102px;
    margin-left: 3px;
    margin-top: 28px;
}



img#stats {
    display: block;
    position: absolute;
    width: 110px;
    margin-left: -20px;
    margin-top: -35px;
    transform: rotate(-10deg);
    z-index: 200;
    
}


img#fairystats {
    position: absolute;
    display: block;
    scale: 100%;
    z-index:100;
    margin-left: 175px;
    margin-top: -60px;
    transform: rotate(2deg);
}

img#fairystats:hover {
    scale: 120%;
    cursor: url(cursor/02.cur), url(cursor/cur902.gif), default;
}

img#fairyquote2 {
    position: absolute;
    display: block;
    margin-left: 202px;
    margin-top: -95px;
    scale: 90%;
    display: none;
}


.badges {
    display: block;
    background-image: url(gifs/skyscreen.gif);
    background-size: 100%;
    background-repeat: no-repeat;
    width: 150px;
    height: 140px;
    padding: 5px;
    padding-top: 25px;
    margin-top: 0px;
   margin: auto;
   text-align: center;
}

img#badgesfairy {
    position: absolute;
    scale: 200%;
    margin-left: 110px;
}
img#badgecover {
    position: absolute ;
    margin-left: -18px;
    margin-top: -11px;
    width: 123px;
    height: 90px;
}
img#badgecover:hover {
    cursor: url(cursor/02.cur), url(cursor/cur902.gif), default;
    border: 2px solid #88f796;
    mix-blend-mode:luminosity;
}


/* MUSIC PLAYER */

.title-bar {
    background-image: url(backgrounds/98sky.gif);
    background-position: 90%;
}

.player {
    cursor: url('https://cur.cursors-4u.net/cursors/cur-10/cur918.cur'), url(cursor/01.cur), default;
    width: 190px;
    border: #242424 solid 1px;
    border-width: 1px 0px 0px 1px;
    margin: 5px 0px 0px 3px;
}


table.window td.menubar#menu_bar {
    color: #3f3836;
    text-shadow: 0.5px 0.5px #647b96;
    font-size: smaller;
    height: 20px !important;
    display: block;

}

td.menubar p.trackwindmenu span.menu_bar_items {
    display: inline-block;
}

td.menubar p.trackwindmenu label#file:hover {
    
    color: #faffb3;
}


td.menubar p.ul {
    display: inline-block;
    text-decoration: underline;
    padding: 0 auto;
    margin: 0 auto;
}

td.menubar p.one {
    margin-left: 1%; 
}

table.window td.menubar#menu_bar p.trackwindmenu {
    white-space: nowrap;
    text-overflow: hidden;
    display: inline-block;
    margin: 0%;
}




i.fas:hover {
    cursor: url('cursor/cur905.gif') text;
}

i.fas.fa-pause, i.fas.fa-play, i.fas.fa-forward, i.fas.fa-backward{
    color:#f7adff; /* color of controls */
    text-shadow: 0px -1px #f8f8a9;
}    

input[type="range"] {
    -webkit-appearance: none;
    appearance: none;
    width: 100%;
    background: transparent;
  }
   
  input[type="range"]:focus {
    outline: none;
  }
   
  input[type="range"]::-webkit-slider-thumb {
    -webkit-appearance: none;
    height: 15px;
    width: 15px;
    background: url(icons/minispin.gif);
    background-size: cover;
    transform: translateY(-8px);
    box-shadow: none;
    border: none;
  }
   
  input[type="range"].has-box-indicator::-webkit-slider-thumb {
    background: svg-load("https://raw.githubusercontent.com/jdan/98.css/main/icon/indicator-rectangle-horizontal.svg");
    transform: translateY(-10px);
  }
   
  input[type="range"]::-moz-range-thumb {
    height: 21px;
    width: 11px;
    border: 0;
    border-radius: 0;
    background: svg-load("https://raw.githubusercontent.com/jdan/98.css/main/icon/indicator-horizontal.svg");
    transform: translateY(2px);
  }
   
  input[type="range"]::-moz-range-thumb {
    background: url("https://raw.githubusercontent.com/jdan/98.css/main/icon/indicator-horizontal.svg");
    border: 0;
    border-radius: 0;
    height: 21px;
    transform: translateY(2px);
    width: 11px;
    }
   
  input[type="range"].has-box-indicator::-moz-range-thumb {
    background: svg-load("https://raw.githubusercontent.com/jdan/98.css/main/icon/indicator-rectangle-horizontal.svg");
    transform: translateY(0px);
  }
   
  input[type="range"]::-webkit-slider-runnable-track {
    width: 100%;
    height: 2px;
    box-sizing: border-box;
    background: #543223 ;
    border-right: 1px solid grey;
    border-bottom: 1px solid grey;
    box-shadow: 1px 0 0 white, 1px 1px 0 white, 0 1px 0 white, -1px 0 0 darkgrey,
      -1px -1px 0 darkgrey, 0 -1px 0 darkgrey, -1px 1px 0 white, 1px -1px darkgrey;
  }
   
  input[type="range"]::-moz-range-track {
    width: 100%;
    height: 2px;
    box-sizing: border-box;
    background: #242424;
    border-right: 1px solid grey;
    border-bottom: 1px solid grey;
    box-shadow: 1px 0 0 white, 1px 1px 0 white, 0 1px 0 white, -1px 0 0 darkgrey,
      -1px -1px 0 darkgrey, 0 -1px 0 darkgrey, -1px 1px 0 white, 1px -1px darkgrey;
  }
   
  button,input,label,option,select,table,textarea,ul.tree-view   {-webkit-font-smoothing:none;font-family:"Pixelated MS Sans Serif",Arial;font-size:11px}h1{font-size:5rem}h2{font-size:2.5rem}h3{font-size:2rem}h4{font-size:1.5rem}u{border-bottom:.5px solid #222;text-decoration:none}button,input[type=reset],input[type=submit]{border:none;border-radius:0;box-sizing:border-box;color:transparent;min-height:23px;min-width:75px;padding:0 12px;text-shadow:0 0 #222}.vertical-bar,button,input[type=reset],input[type=submit]{background:#ab9889;box-shadow:inset -1px -1px #0a0a0a,inset 1px 1px #fff,inset -2px -2px grey,inset 2px 2px #dfdfdf}.vertical-bar{height:20px;width:4px}button:not(:disabled):active,input[type=reset]:not(:disabled):active,input[type=submit]:not(:disabled):active{box-shadow:inset -1px -1px #fff,inset 1px 1px #0a0a0a,inset -2px -2px #dfdfdf,inset 2px 2px grey;text-shadow:1px 1px #222}@media (not(hover)){button:not(:disabled):hover,input[type=reset]:not(:disabled):hover,input[type=submit]:not(:disabled):hover{box-shadow:inset -1px -1px #fff,inset 1px 1px #0a0a0a,inset -2px -2px #dfdfdf,inset 2px 2px grey}}button:focus,input[type=reset]:focus,input[type=submit]:focus{outline:1px dotted #000;outline-offset:-4px}button::-moz-focus-inner,input[type=reset]::-moz-focus-inner,input[type=submit]::-moz-focus-inner{border:0}:disabled,:disabled+label,input[readonly],input[readonly]+label{color:grey}:disabled+label,button:disabled,input[type=reset]:disabled,input[type=submit]:disabled{text-shadow:1px 1px 0 #fff}
   
  .title-bar-controls button {border:none;border-radius:0;box-sizing:border-box;color:transparent;min-height:23px;min-width:75px;padding:0 12px;text-shadow:0 0 #222}
   
  .title-bar-controls button {background:#ab9889;box-shadow:inset -1px -1px #0a0a0a,inset 1px 1px #fff,inset -2px -2px grey,inset 2px 2px #dfdfdf}
   
  .title-bar-controls button:not(:disabled):active {box-shadow:inset -1px -1px #fff,inset 1px 1px #0a0a0a,inset -2px -2px #dfdfdf,inset 2px 2px grey;text-shadow:1px 1px #222}
   
  @media (not(hover)){
      button:not(:disabled):hover {
      box-shadow:inset -1px -1px #fff,inset 1px 1px #0a0a0a,inset -2px -2px #dfdfdf,inset 2px 2px grey}
  }
   
  .title-bar-controls button:focus {outline:1px dotted #000; outline-offset:-4px}
  .title-bar-controls button::-moz-focus-inner {border:0}
   
   

  
   
  .window, .title-bar {
    font-family: "W95FA";
    -webkit-font-smoothing: none;
    font-size: 13px;
  }
   
  .window {
    box-shadow: inset -1px -1px #242424,
      inset 1px 1px #dfdfdf, inset -2px -2px #808080,
      inset 2px 2px #ffffff;
    background: #ab9889;
    padding: 3px;
    width:190px;
  }
   
  .title-bar {
    padding: 3px 2px 3px 3px;
    display: flex;
    justify-content: space-between;
    align-items: center;
  }
   
  .title-bar-text {
    font-family: "W95FA";
    font-weight: 600;
    font-size: 10px;
    color: #4f95ff;
    
    letter-spacing: 1px;
    margin-right: 24px;
  }
   
  .title-bar-controls {
    float: inline-end;
    display: flex;
  }
   
  .title-bar-controls button {
    padding: 0;
    display: block;
    min-width: 16px;
    min-height: 14px;
  }
   
  .title-bar-controls button:active {
    padding: 0;
  }
   
  .title-bar-controls button:focus {
    outline: none;
  }
   
  .title-bar-controls button[aria-label=Minimize]{
  background-image:url("https://raw.githubusercontent.com/jdan/98.css/main/icon/minimize.svg");
  background-position:bottom 3px left 4px;
  background-repeat:no-repeat}
   
  .title-bar-controls button[aria-label=Maximize]{
  background-image:url("https://raw.githubusercontent.com/jdan/98.css/4a2282dd9170cabf730fb5803d1153d86b2e94e3/icon/maximize.svg");
  background-position:top 2px left 3px;
  background-repeat:no-repeat}
   
  .title-bar-controls button[aria-label=Close]{
  background-image:url("https://raw.githubusercontent.com/jdan/98.css/main/icon/close.svg");
  background-position:top 3px left 4px;
  background-repeat:no-repeat;
  margin-left:2px}
   
  .window-body { margin:0px; height:121px; }
   
  input[type=range] {
          -webkit-appearance: none;
          appearance:none;
          width: 100%;
      }
   
      input[type=range]:focus {
          outline: none;
      }
   
      /* settings for chrome browsers */
      input[type=range]::-webkit-slider-runnable-track {
          width: 100%;
          height: 2px; /* thickness of seeking track */
          cursor: url('cursor/cur902.gif');
      }
   
   
      /* settings for firefox browsers */
      input[type=range]::-moz-range-track {
          width: 100%;
          height: 2px; /* thickness of seeking track */
          cursor: url('cursor/cur902.gif');
      }
   
      .flex {display: flex;}
   
      .titlebaricon { height:14px; width:14px;}
   

    
   
      .songtitlewindow {
          background-color:#faffb3;
          box-shadow:inset -1px -1px #fff,inset 1px 1px grey,inset -2px -2px #dfdfdf,inset 2px 2px #0a0a0a;
          color: #6cb9fc;
          padding: 0px 2px 0px 2px;
          text-shadow: 0px 1px #55f5b0;
      }
   
      #musicplayer {
          border:2px solid #ab9889; /* border around player */
          border-width: 2px 0px 0px 0px;
          width:184px; /* width of the player */
      }
   
      #imagestyle {
          background:#ab9889; /* background color of player */
          border:2px solid #ab9889; /* border around player */
          width:85px; /* width of the player */
          height:85px;
          box-shadow:inset -1px -1px #fff,inset 1px 1px grey,inset -2px -2px #dfdfdf,inset 2px 2px #0a0a0a;
      }
   
      .ic {
          width:90px;
          position:relative;
          bottom:1px;
          right:1px;
          overflow:hidden;
          padding:2px;
          border:2px solid transparent;
      }
   
      .songtitlearrow {
          background-size:100%;
          background-repeat:no-repeat;
          background-image:url(https://files.catbox.moe/f5e8np.png);
          height:21px;
          width:21px;
          position:relative;
          top:2px;
          left:-2px;
          border:0px solid transparent;
          border-width:0px 0px 0px 0px;
      }
   
      .songtitle {
          padding:5px; /* padding around song title */
          border-bottom:0px; /* border under song title */
          display:block;
          font-family: "2Credits";
      }
   
      .controls {
          font-size:18px !important; /* size of controls */
          text-align:center;
          width:100%;
          position:relative;
          bottom:10px;
      }
   
      .controls td {
          padding:8px 3px 0px 3px; /* padding around controls */
      }
   
      button {
          min-width:40px;
      }
   
      .seeking {
          background-color:#ab9889; /* background color of seeking bar */
          color: #543223;
          display:flex;
          justify-content: space-evenly;
          padding:14px; /* padding around seeking bar */
      }

      input.seek_slider {
        color: #253770;
      }

      .volume {
          background-color:#ab9889; /* background color of volume bar */
          color: #543223;
          display:flex;
          align-items: center;
          justify-content: space-evenly;
          font-size: 11px;
          padding:0px 14px 12px 14px; /* padding around volume bar */
      }

      input.volume_slider {
        color: #253770;
        margin: 0px 6px;
      }
   
      .current-time {
          padding-right:5px;
      }
   
      .total-duration {
          padding-left:5px;
      }



table.window #titlebar {
    background-image: url(backgrounds/98sky.gif);
    background-position: 50%;
    height: 25px
}

td.windowbody#bannerwindow {
    background-image: url(backgrounds/sky2.gif);
    background-size: 220px;
    padding: 0%;
}


td.windowbody#leftwindow {
    background-color: #fa85a6;
    padding: 2%;
    width: 200px;
    height: 300px;
    overflow-y: scroll;
    overflow-x: hidden;
}

td.windowbody#ads {
    background-image: url(images/houses.gif);
    background-position: 36%;
    height: 145px;
    overflow-y: scroll;
    display: block;
    text-align: center;
}

table#leftads {
    width: 190px;
    max-height: 100px;
}

table#leftnavmenu {
    display: inline-block;
    margin: auto;
    width: 190px;
}

td.windowbody#navmenu {
    width: 190px;
    height: 280px;
    background-image: url(images/tumblr_n2fknnvrS01rbm0olo1_500.gif);
    background-size: cover;
}


td.windowbody#rightwindow {
    background-image: url(backgrounds/mb2.gif);
    background-size: contain;
    overflow-y: scroll;
    width: 190px;
    height: 300px;
    padding:10px
}

table#right {
    width: 190px;
}

td#titlebar.leftside {
    background-image: url(backgrounds/98sky.gif);
    background-position: 200px;
}

td#titlebar.rightside {
    background-image: url(backgrounds/98sky.gif);
    background-position: 20px;
}