#nowPlayingBg{
	animation-name: fadeInOpacity;
	animation-iteration-count: 1;
	animation-timing-function: ease-in;
	animation-duration: 2.5s;
  transition-behavior: allow-discrete;
}

#aPlayer{
  animation-name: fadeInOpacityDelay;
  animation-duration: 2s;
  transition: max-height 1s cubic-bezier(0.785, 0.135, 0.15, 0.86);
  max-height:100%;
}

@keyframes fadeInOpacity {
	0% {
		opacity: 0;
	}
	100% {
		opacity: 1;
	}
}

@keyframes fadeInOpacityDelay {
  0% {
		opacity: 0;
	}
  50% {
		opacity: 0;
	}
	100% {
		opacity: 1;
	}
}

nav:hover{
  opacity: 100%;
  transition-duration: 1s;
}

nav{
  opacity: 10%;
  transition-duration: 10s;
  transition-timing-function: cubic-bezier(0.785, 0.135, 0.15, 0.86);
}

.bg-none{
  background:none !important;
  background-color:none !important;
}

.h-0{
  height:0;
  max-height: 0 !important;
  overflow: hidden;
}

#player {
  width: 0;
  height: 0;
  overflow: hidden;
  display:none;
}

.range:not([disabled]){
  cursor: pointer;
}

#progress {
  width: 100%;
}

#progress{
  margin-top: -2rem;
}

#timeHolder{
  margin-top: -2.5rem;
}


#playlist .loaded-entry .loaded-thumb{
  max-width: 3rem;
  max-height: 3rem;
}

#playlist li:not(.active):not(:hover) {
  background:#00000020;
}

#playlist .btn img {
  transform: scale(1.5);
}

#nowPlayingBg {
  background-size: cover;
  background-position: center;
  background-color: gray;
}

.blur{
  backdrop-filter: blur(2rem);
}

#playlistToggle{
  visibility: hidden
}

.drag-over-top { border-top: 2px solid white; }
.drag-over-bottom { border-bottom: 2px solid white; }