body{background-color:#000;}
/* Misc.
================================================== */

.add-bottom { margin-bottom:2rem !important; }
.left { float:left; }
.right { float:right; }
.center { text-align:center; }


/* Audio Player Styles
================================================== */

audio {
	margin:0 15px 0 14px;
	width:670px;
}

#mainwrap {
	position: fixed;
    bottom: 77px;
    right: 0;
    margin: 0 auto;
    max-width: 260px;
    background-color: rgba(202, 194, 3, 0.85);
	z-index:99999;

}
#playList{
	background-color: transparent;
    border: 0;
	outline:0;
	margin-top:3px;
	color: #4e4b02;
}

#audiowrap,
#plwrap {
margin:0 auto;
}
#plwrap ul{
	padding:0;
	margin:0;
	background: url(../../images/playList1.png) no-repeat center 0px;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    height: 400px;
    overflow-y: scroll;
}

#tracks {
	position:relative;
	text-align:center;
	margin-left:5px;
	margin-top: 4px;
}
.plyr--audio .plyr__controls button{
	color:#000;
}
.plyr--audio .plyr__controls button.tab-focus:focus, .plyr--audio .plyr__controls button:hover, .plyr__play-large {
    background: #3498db;
    color: #aca705;
}

#nowPlay {
	display:inline;
}

#npAction {
	padding:21px;
	position:absolute;
}

#npTitle {
	padding: 0px;
    margin: 8px 0px 6px 4px;
    color: #000000;
    font-size: 11px;
    width: 185px;
    text-align: center;
}

#plList li {
	cursor:pointer;
	display:block;
	margin:0;
	padding: 5px 0;
    font-size: 11px;
    color: #c9cca8;
    background-color: rgba(0, 0, 0, 0.62);
	border-bottom: 1px dashed #e6de03;
}
#plList li:last-child {
	border-bottom:0;
}

#plList li:hover {
	background-color:rgba(0,0,0,.1);
}

.plItem {
	position:relative;
}

.plTitle {
	left:50px;
	overflow:hidden;
	position:absolute;
	right:65px;
	text-overflow:ellipsis;
	top:0;
	white-space:nowrap;
}

.plNum {
	padding-left:21px;
	width:25px;
}

.plLength {
	padding-left:21px;
	position:absolute;
	right:21px;
	top:0;
}

.plSel,
.plSel:hover {
	background-color:rgba(10, 10, 10, 0.6);
	color:#fff !important;
	cursor:default !important;
}

a[id^="btn"] {
	border-radius: 3px;
    color: #4e4b02;
    cursor: pointer;
    display: inline-block;
    font-size: 11px;
    line-height: .8;
    margin: 0 0px 5px;
    padding: 5px 10px;
    text-decoration: none;
    transition: background .3s ease;
    width: 10px;
}

a[id^="btn"]:last-child {
	margin-left:-4px;
}

a[id^="btn"]:hover,
a[id^="btn"]:active {
	background-color:rgba(0,0,0,.1);
	color:#fff;
}

a[id^="btn"]::-moz-focus-inner {
	border:0;
	padding:0;
}


/* Plyr Overrides
================================================== */

.plyr--audio .plyr__controls {
	background-color: transparent;
    border: none;
    color: #4c4b4b;
    padding: 5px 12px 5px 5px;
    width: 100%;
    border-bottom: 1px dashed #fdf207;
}

.plyr--audio .plyr__controls button.tab-focus:focus,
.plyr--audio .plyr__controls button:hover,
.plyr__play-large {
	background:rgba(0,0,0,.1);
}

.plyr__progress--played, .plyr__volume--display {
	color:rgba(0,0,0,.1);
}

.plyr--audio .plyr__progress--buffer,
.plyr--audio .plyr__volume--display {
	background:rgba(0,0,0,.1);
}

.plyr--audio .plyr__progress--buffer {
	color:rgba(0,0,0,.1);
}


/* Media Queries
================================================== */
@media (min-width: 768px){
	.plyr .plyr__volume {
		max-width: 40px;
	}
}
@media only screen and (max-width:850px) {
    #nowPlay { /*display:none;*/ }
}