.spectrum-container {
   display: none;
}

ul.use-spectrum li.sm2_playing .spectrum-container {
   position: absolute;
   left: 0px;
   top: 0px;
   margin-left: -266px;
   margin-top: 0px;
   display: block;
   background-color: var(--highlightsi);
}

ul.use-spectrum .spectrum-box {
   position: relative;
   width: 255px;
   font-size: 1em;
   padding: 2px 0px;
   height: 1.2em;
   overflow: hidden;
}

ul.use-spectrum .spectrum-box .spectrum {
   position: absolute;
   left: 0px;
   top: -2px;
   margin-top: 20px;
   display: block;
   font-size: 1px;
   width: 1px;
   height: 1px;
   overflow: hidden;
   background-color: rgb(255, 255, 255);
}

ul.playlist {
   list-style-type: none;
   margin: 0px;
   padding: 0px;
   -webkit-font-smoothing: antialiased;
}

ul.playlist li {
   position: relative;
   display: block;
   width: auto;
   color: rgb(102, 102, 102);
   padding: 0.75em 0.5em 0.75em 0px;
   border-bottom-width: 1px;
   border-bottom-style: solid;
   border-bottom-color: black;
   background-color: rgb(255, 255, 255);
   height: 1.25rem; overflow: clip;
}

ul.playlist li:last-of-type {
   border-bottom-width: 0px;
   border-bottom-style: none;
   border-bottom-color: currentcolor;
}

ul.playlist li a {
   display: block;
   text-decoration: none;
   font-weight: normal;
   color: rgb(0, 0, 0);
   margin-left: 1rem;
   outline: currentcolor;
   position: relative;
   z-index: 2;
}

ul.playlist li.sm2_playing,
ul.playlist li.sm2_paused,
ul.playlist li.sm2_playing a {
   color: rgb(255, 255, 255);
   border-radius: 0px;
}

ul.playlist li:hover {
   background-color: var(--primarytext);
}

ul.playlist li:hover a {
   color: rgb(255, 255, 255);
}

ul.playlist li.sm2_playing,
ul.playlist li.sm2_playing:hover {
   background-color: var(--primarytext);
}

ul.playlist li.sm2_paused {
   background-color: #cbcbcb;

}

ul.playlist li.sm2_playing:hover a,
ul.playlist li.sm2_paused a {}

ul.playlist li .controls {
   display: none;
}

ul.playlist li .peak,
ul.playlist.use-peak li .peak {
   display: none;
   position: absolute;
   top: 0.55em;
   right: 0.5em;
}

ul.playlist li.sm2_playing .controls,
ul.playlist li.sm2_paused .controls {
   position: relative;
   display: block;
}

ul.playlist.use-peak li.sm2_playing .peak,
ul.playlist.use-peak li.sm2_paused .peak {
   display: inline-block;
}

ul.playlist.use-peak li .peak {
   display: none;
}

ul.playlist li.sm2_paused .controls {
   background-color: rgb(102, 102, 102);
}

ul.playlist li:hover .controls .statusbar {
   position: relative;
   cursor: grab;
}

ul.playlist li.sm2_paused .controls .statusbar {
   background-color: rgb(204, 204, 204);
}

ul.playlist li .controls {
   position: relative;
   margin-top: 0.25em;
   margin-bottom: 0.25em;
   background-color: rgb(255, 255, 255);
}

ul.playlist li .controls .statusbar {
   position: relative;
   height: fit-content;
   background-color: rgb(255, 255, 255);
   border: 0px;
   overflow: hidden;
   cursor: grab;
}

ul.playlist li .controls.dragging .statusbar {
   cursor: grabbing;
}

ul.playlist li .controls .statusbar .position,
ul.playlist li .controls .statusbar .loading,
ul.playlist li .controls .statusbar .annotation {
   position: absolute;
   left: 0px;
   top: 0px;
   height: 0.5em;
}

ul.playlist li .controls .statusbar .position {
   background-color: rgb(255, 255, 255);
}

ul.playlist li.sm2_paused .controls .statusbar .position {
   background-color: rgb(102, 102, 102);
}

ul.playlist li .controls .statusbar .loading {
   background-color: rgb(255, 255, 255);
   transition: width 0.15s ease-in-out;
}

ul.playlist li .controls .statusbar .position,
ul.playlist li .controls .statusbar .loading {
   width: 0px;
}

ul.playlist li.sm2_playing a.sm2_link,
ul.playlist li.sm2_paused a.sm2_link {
   margin-right: 0px;
}

ul.playlist li .timing {
   position: absolute;
   display: none;
   text-align: right;
   right: 0px;
   top: 0px;
   width: auto;
   height: fit-content;
   padding: 5px;
   background-color: rgb(255, 255, 255);
   letter-spacing: 0px;
   line-height: 1;
   vertical-align: middle;
   color: var(--primarytext);
   font-size: 0.75rem;
}

ul.playlist.use-peak li .timing {
   right: 4.25em;
}

ul.playlist li:hover .timing {
   z-index: 2;
}

ul.playlist li .timing div.sm2_timing {
   margin: -1em 0px 0px;
   padding: 0px;
}

ul.playlist li.sm2_playing .timing,
ul.playlist li.sm2_paused .timing {
   display: block;
}

ul.playlist li.sm2_paused .timing .sm2_position {
   text-decoration: blink;
}

ul.playlist li.sm2_paused .timing,
ul.playlist.use-peak li.sm2_paused .peak {
   background-color: #fff;

}

ul.playlist.use-peak li .peak {
   display: none;
   zoom: 1;
   border: 1px solid rgb(153, 204, 255);
   padding: 2px;
   border-radius: 4px;
   background-color: rgb(85, 136, 187);
   width: 0.8em;
   height: 0.55em;
   margin-top: -3px;
}

ul.playlist.use-peak li .peak-box {
   position: relative;
   width: 100%;
   height: 0.55em;
   overflow: hidden;
}

ul.playlist li .peak .l,
ul.playlist li .peak .r {
   position: absolute;
   left: 0px;
   top: 0px;
   width: 7px;
   height: 50px;
   background: rgb(255, 255, 255);
   border: 1px solid rgb(255, 255, 255);
   border-radius: 1px;
   margin-top: 1em;
}

ul.playlist li .peak .l {
   margin-right: 1px;
}

ul.playlist li .peak .r {
   left: 10px;
}

#control-template {
   display: none;
}