#nowPlayingBg {
  background-size: cover;
  background-position: center;
	opacity:0;
}

#nowPlayingBg.reveal{
	animation-name: fadeInOpacity;
	animation-iteration-count: 1;
	animation-timing-function: ease-in;
	animation-duration: .1s;
  transition-behavior: allow-discrete;
	opacity: 100%;
}

#hearIt{
	--bs-bg-opacity: 100%;
}

#hearIt.reveal{
	transition-duration: 2s;
  transition-timing-function: cubic-bezier(0.785, 0.135, 0.15, 0.86);
	 --bs-bg-opacity: 75%;
}

#aPlayer.reveal{
  animation-name: fadeInOpacityDelay;
  animation-duration: 1.5s;
  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):not(.drag-over-top):not(.drag-over-bottom) {
  background:#00000020;
}

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

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

#playlistToggle{
  visibility: hidden
}

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

body:not(i){
  font-family: "NTR", sans-serif;
  font-weight: 400;
  font-size: 125%;
}

*:not(i){
  font-family: "NTR", sans-serif;
  font-weight: 200;
  letter-spacing: -.025rem;
}

i{line-height: unset !important}