/* CSS is how you can add style to your website, such as colors, fonts, and positioning of your
   HTML content. To learn how to do something, just try searching Google for questions like
   "how to change link color." */
   
body {
background-image: url('https://blueprintedblood.neocities.org/images.html/bg1.jpg');
background-attachment: fixed;
background-size: cover;
}

/* Start https://www.cursors-4u.com */ * {cursor: url(https://cur.cursors-4u.net/anime/ani-12/ani1141.ani), url(https://cur.cursors-4u.net/anime/ani-12/ani1141.gif), auto !important;} /* End https://www.cursors-4u.com */

html {
overflow: scroll;
overflow-x: hidden;
}
::-webkit-scrollbar {
width: 0; /* remove scrollbar space */
background: transparent; /* to make scrollbar invisible */
}
::-webkit-scrollbar-thumb {
background: transparent;
}

::selection {
/* Change highlight background color */
background: #3EC2FF;
/* Change highlight text color */
color: #FFFFFF;
}


 
 
    .player {
      position: absolute;
        width:fit-content;
        border: #CECECE solid 2px;
        border-radius: 100px;
        margin-left:auto;
        margin-right:auto;
      background: linear-gradient(0deg, rgba(205,205,205,1) 0%, rgba(230,230,230,1) 30%, rgba(255,255,255,1) 100%); 
      padding:5px;
    }
 



.seek_slider {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  height: 6px;
  background: #e4d5dc;
  opacity: 0.7;
  -webkit-transition: .2s;
  transition: opacity .2s;
  border-radius: 8px;
}

.seek_slider::-webkit-slider-thumb {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  width: 8px;
  height: 8px;
  background: white;
  cursor: pointer;
  border-radius: 50%;
  border:1px solid #cecece;
  padding-top:3px;
  position:relative;
  bottom:3px;
}
 
button,input,label,option,select,table,textarea,ul.tree-view{-webkit-font-smoothing:none;font-family:"Myriad Pro";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].vertical-bar{height:20px;width:4px}button:not(:disabled):active,input[type=reset]:not(:disabled):active,input[type=submit]:not(:disabled):active{opacity:0.5}}@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{opacity:1}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}}
 

 
 
@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}
}

 
@font-face {
  font-family: "Myriad Pro";
  src: url("https://dl.dropbox.com/scl/fi/z8hqw29h8a9i3a3cbbxkt/MYRIADPRO-REGULAR.OTF?rlkey=begwqxljs2gzyw26h00oeovzi&st=px0mbeax&dl=0") format("woff");
}
 
 
 
.window, .title-bar {
  font-family: "Myriad Pro";
  -webkit-font-smoothing: none;
  font-size: 11px;
}
 
.window {
  padding:10px;
  width:290px;
}
 
 
.window-body { 
  display:block;
  margin:auto; 
  border-radius:0em;
}
 
 
 
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: pointer;
    }
 
 
    /* settings for firefox browsers */
    input[type=range]::-moz-range-track {
        width: 100%;
        height: 2px; /* thickness of seeking track */
        cursor: pointer;
    }
 
    .flex {display: flex;}
 
   
 
 
    
 
    #musicplayer {
display:block;
        float:right;
      background: linear-gradient(0deg, #F1E3F0, white) padding-box, linear-gradient(to top, white, #A2A2A2) border-box;
  border-radius: 60em;
  border: 2px solid transparent;
      margin-left:8px;
      padding-left:10px;
      box-shadow: 1px 1px 10px 0px rgba(128,128,128,0.27) inset;
-webkit-box-shadow: 1px 1px 10px 0px rgba(128,128,128,0.27) inset;
-moz-box-shadow: 1px 1px 10px 0px rgba(128,128,128,0.27) inset;
    }

 
    .wheel {
      display: block;
  justify-content: center;
        margin:auto;
      background: linear-gradient(white, white) padding-box, linear-gradient(to top, white, #A2A2A2) border-box;
  border-radius: 50em;
  border: 2px solid transparent;
      padding-top:0px;
      box-shadow: 1px 1px 10px 0px rgba(128,128,128,0.27) inset;
-webkit-box-shadow: 1px 1px 10px 0px rgba(128,128,128,0.27) inset;
-moz-box-shadow: 1px 1px 10px 0px rgba(128,128,128,0.27) inset;
    }

.innerwheel {
  border-radius: 50em;
  border: 2px solid #E2E2E2;
  
      padding:9px;
  padding-left:10px;
  padding-right:12px;
  margin:0;
  box-shadow: 1px 1px 10px 0px rgba(128,128,128,0.17) inset;
-webkit-box-shadow: 1px 1px 10px 0px rgba(128,128,128,0.17) inset;
-moz-box-shadow: 1px 1px 10px 0px rgba(128,128,128,0.17) inset;
  
}
th{
  width:20px;
 
  margin:0;
}
.fas fa-minus{
  margins:0;
  padding-bottom:5px;
}

 
    .wheelcontrols {
        font-size:14px !important; /* size of controls */
        text-align:center;
        padding-top:2px;
color: #aaa;
    opacity: 0.8;
    }

.wheelcontrols button {
    background: none;
    border: none;
    color: #aaa;
    opacity: 0.6;
    font-size: 14px;
    padding: 2px;
    cursor: pointer;
}
.wheelcontrols button:hover {
  opacity: 1;
}

.controls button:hover {
   opacity: 1;
  
}

.playpause-track button{
  display:block;
  color:#C1C1C1;
  font-size: 20px;
  margin:auto;
}

.playpause-track {
    font-size: 22px !important;
    padding: 3px;
}
 
    .songtitle {
        padding:25px; /* padding around song title */
        color:#A3A3A3;
      padding-bottom:0;
      margin-left:15px;
      margin-right:20px;
        font-size: 16px;
        display:block;
        font-family:Myriad Pro;
    }
 
    .controls button{
      display:block;
      
      margin-left:15px;
        font-size:14px !important; /* size of controls */
        text-align:center;
        color:#ccb3be;
      opacity:0.6
        
    } 
 
    button {
      min-width:20px;
      background:none;
      
      text-align:center;
    }
button:active {
    opacity: 0.7;
}

 
    .seeking {
        display:flex;
        justify-content: space-evenly;
        padding:10px; /* padding around seeking bar */
      padding-left:0;
      padding-bottom:0px;
      color:#A3A3A3;
    }
 
    .current-time {
        padding-right:5px;
    }
 
    .total-duration {
        padding-left:5px;
    }
    
    
.ui-draggable .ui-dialog-titlebar {
	cursor: move;
}
.ui-draggable-handle {
	touch-action: none;