.jp-audio {
/*
	background: rgba(255,255,255, 0.25);
	background: -moz-linear-gradient(-45deg, rgba(32,32,32, 0.1) 0%, rgba(128,128,128,0.1) 100%);
	background: -webkit-gradient(left top, right bottom, color-stop(0%, rgba(255,255,255, 0.25)), color-stop(100%, rgba(0,0,0,0.25)));
	background: -webkit-linear-gradient(-45deg, rgba(255,255,255, 0.25) 0%, rgba(0,0,0,0.25) 100%);
	background: -o-linear-gradient(-45deg, rgba(255,255,255, 0.25) 0%, rgba(0,0,0,0.25) 100%);
	background: -ms-linear-gradient(-45deg, rgba(255,255,255, 0.25) 0%, rgba(0,0,0,0.25) 100%);
	background: linear-gradient(45deg, rgba(96,96,96, 0.4) 0%, rgba(64,64,64, 0.4) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#000000', GradientType=1 );
*/

	background: linear-gradient(45deg, rgba(96,96,96, 0.4) 0%, rgba(64,64,64, 0.4) 100%);
	border-radius: 10px;
	box-shadow: 0 10px 20px rgba(0,0,0,0.19), 0 6px 6px rgba(0,0,0,0.23);
	transition: all 0.3s cubic-bezier(.25,.8,.25,1);
/*
	height: calc(100% - 15px);
*/
	padding: 15px;
}

.jp-audio:hover{
	box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22);
}

.jp-audio button {
    border: hidden;
    border-radius: 50%;
    transition: all 0.5s cubic-bezier(.25,.8,.25,1);
}

.jp-audio button:hover {
    box-shadow: 0px 0px 10px 5px rgba(51, 78, 52, 0.5);
}

.jp-type-playlist {
	background: rgba(224,224,224, 0.75);
	border-radius: 10px;
	box-shadow: 0 10px 20px rgba(0,0,0,0.19), 0 6px 6px rgba(0,0,0,0.23);
	transition: all 0.3s cubic-bezier(.25,.8,.25,1);
	height: calc( 100% - 15px); 
	padding-bottom: 5px;
	position: relative;

.jp-type-playlist:hover {
	box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22);
}

.jp-controls {
	margin: 0 auto;
	padding-top: 10px;
	width: 175px; }

.jp-current-time, .jp-duration,
.jp-mute, .jp-volume-max { display: none !important; }

.jp-progress {
	width								: 90%;
	height								: 13px;
	margin								: 7px 5% 7px;
	overflow							: hidden; }

.jp-seek-bar {
	background: #ffffff;
	background: -moz-linear-gradient(top,  #ffffff 0%, #abbaab 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(100%,#abbaab));
	background: -webkit-linear-gradient(top,  #ffffff 0%,#abbaab 100%);
	background: -o-linear-gradient(top,  #ffffff 0%,#abbaab 100%);
	background: -ms-linear-gradient(top,  rgba(192,192,192, 0.1) 0%, rgba(192,192,192, 0.3) 100%);
	background: linear-gradient(to bottom,  rgba(178, 220, 191, 1) 0%, rgba(51, 78, 52, 1) 100%);
	border-radius						: 7px;
	width								: 0px;
	height								: 100%;
	overflow							: hidden;
	cursor								: pointer; }

.jp-play-bar {
	background: #abbaab;
	background: -moz-linear-gradient(top,  #abbaab 0%, #ffffff 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#abbaab), color-stop(100%,#ffffff));
	background: -webkit-linear-gradient(top,  #abbaab 0%,#ffffff 100%);
	background: -o-linear-gradient(top,  #abbaab 0%,#ffffff 100%);
	background: -ms-linear-gradient(top,  #abbaab 0%,#ffffff 100%);
	background: linear-gradient(to bottom,  rgba(51, 78, 52, 1) 0%, rgba(178, 220, 191, 1) 100%);
	border-radius						: 7px;
	width								: 0px;
	height								: 100%;
	overflow							: hidden; }

.jp-previous,
.jp-play,
.jp-pause,
.jp-stop,
.jp-next {
	background-size: cover;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	border:none;
	margin-bottom: 0;
	height: 40px;
	width: 40px;
	padding: 0; }


.jp-next {
	background: url(../../assets/playlist.controls/ic_skip_next_black_48px.svg) no-repeat center center;
}

.jp-pause {
	background: url(../../assets/playlist.controls/ic_pause_black_48px.svg) no-repeat center center;
}

.jp-play {
	background: url(../../assets/playlist.controls/ic_play_arrow_black_48px.svg) no-repeat center center;
}

.jp-previous {
	background: url(../../assets/playlist.controls/ic_skip_previous_black_48px.svg) no-repeat center center;
}

.jp-stop {
	background: url(../../assets/playlist.controls/ic_stop_black_48px.svg) no-repeat center center;
}

.jp-audio button {
	border: hidden;
	border-radius: 50%;
	transition: all 0.5s cubic-bezier(.25,.8,.25,1); }

.jp-audio button:hover {
	box-shadow: 0px 0px 10px 5px rgba(51, 78, 52, 0.5); }

.jp-playlist {
	margin: 15px;
	position: relative; }

.jp-playlist ul {
	margin-bottom: 1em;
	width: 100%; }

.jp-playlist ul li {
	line-height: 2em; /*
	padding: 2px 0px; */
	text-align: center; }

.jp-playlist ul li a {
	display: block;
	font-size: 1.25rem;
	line-height: 1.5em;
	padding: 0.5em;
	}

.jp-playlist-item  {
	border: 1px hidden;
	border-radius: 15px;
	color: #1e2d1f;
	font-weight: bold;
	text-shadow: 1px 1px 1px #DCE5E9;
	transition: all 0.5s cubic-bezier(.25,.8,.25,1);
	width: 85%;}

.jp-playlist-item:focus { outline: none; }

.jp-playlist-item:hover {
	background: rgba(121, 193, 143, 0.3);
	box-shadow: 0 1px 4px 4px rgba(0,0,0, 0.2);
	color: #1C2D1E;
	opacity: 1; }
/*
.jp-playlist ul li:last-child { padding-bottom: 15px; }
*/
.jp-playlist ul li div {
	padding-right: 15%;
	position: relative; }

li.jp-playlist-current a  {
	background: linear-gradient(to bottom, #89b3a1 0%,#334e34 100%);
	color: #B4DAD4;
	opacity: 0.9;
	text-shadow: 1px 1px #334e34; }

li.jp-playlist-current a:hover  {
	background: linear-gradient(to bottom, #89b3a1 0%,#334e34 100%);
	opacity: 0.9; }

.jp-playlist .jp-free-media {
	background: url(../../assets/playlist.controls/ic_file_download_black_24px.svg) no-repeat center;
	background-size: contain;
	border: 1px solid transparent;
	border-radius: 50%;
	height: 18px;
	width: 18px;
	opacity: 0.7;
	transition: all 0.5s cubic-bezier(.25,.8,.25,1);
	position: absolute;
		top: 0;
		right: 0; }

.jp-playlist .jp-free-media:hover {
	box-shadow: 0 0 6px 6px rgba(0,0,0, 0.5);
	background: rgba(51, 78, 52, 0.5) url(../../assets/playlist.controls/ic_file_download_black_24px.svg) no-repeat center;
	background-size: contain;
	opacity: 1;}
*/


/* MEDIA QUERY - max-width: 820px */

@media screen and (max-width: 820px) {
	.jp-playlist ul li a { line-height: 1.25rem; }
}
*/
