​
 
 
    .player {
    width: fit-content;
    border: #CECECE solid 2px;
    border-radius: 100px;
    margin-left: auto;
    margin-right: auto;
    background: linear-gradient(
    0deg,
    #5A1D73 0%
    #5A1D73 35%
    #5A1D73 100%
    );
    padding: 5px;

    transform: scale(0.62);
    transform-origin: top left;
    margin-bottom: -110px;
}
 



.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: 9px;
}
 
.window {
    padding: 0;
    width: 160px;
}
 
 
.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;
    width: 100px;
    background: linear-gradient(0deg, #B5B5B5, #D45FBD) padding-box,
linear-gradient(to top, #4F4F4F, #4F4F4F) border-box;
    border-radius: 60em;
    border: 2px solid transparent;
    margin-left: 4px;
    padding: 6px;
    box-shadow: inset 1px 1px 10px rgba(128,128,128,.27);
}

 
    .wheel {
      display: block;
      justify-content: center;
      margin:auto;
      width:75px;
      height:75px;
      background: linear-gradient(#D45FBD, #B5B5B5) padding-box,
linear-gradient(to top, #FFFFFF, #FFFFFF) border-box;
      border-radius: 50em;
      border: 2px solid #0D0D0D;
      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: 50%;
    border: 2px solid #FFFFFF;
    width: 28px;
    height: 28px;
    padding: 0;
    margin: 0;
    display: flex;
    justify-content: center;
    align-items: center;

    box-shadow: inset 1px 1px 10px rgba(128,128,128,.17);
}
th {
    width: 16px;
    padding: 0;
    margin: 0;
}
.fas.fa-minus {
    margin: 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: #FFFFFF;
    opacity: .85;
    font-size: 9px;
    padding: 0;
    min-width: 12px;
    min-height: 12px;
    cursor: pointer;
}
.wheelcontrols button:hover {
  opacity: 1;
}

.controls button:hover {
   opacity: 1;
  
}

.playpause-track {
    font-size: 14px !important;
    padding: 0;
    margin: 0;
    line-height: 1;
}
 
    .songtitle {
    width: 88px;
    padding: 8px;
    padding-bottom: 0;
    margin: 0 auto;
    font-size: 9px;
    color: #030303;
    display: block;
    font-family: "Myriad Pro";
}
 
    .controls button {
    display: block;
    margin: auto;
    font-size: 9px;
    color: #FFFFFF;
    opacity: .85;
} 
 
    button {
      min-width:20px;
      background:none;
      
      text-align:center;
    }
button:active {
    opacity: 0.7;
}

 
    .seeking {
    display: flex;
    justify-content: space-evenly;
    align-items: center;
    padding: 6px;
    color: #FFFFFF;
    font-size: 9px;
}
 
    .current-time {
    padding-right: 5px;
    color: #FFFFFF !important;
}
 
    .total-duration {
    padding-left: 5px;
    color: #FFFFFF !important;
}

    .music-player{
    margin-left: -30px;
}