/* Custom jPlayer */



.jp-audio {}

	.jp-type-single {
	box-sizing:border-box;
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	-ms-box-sizing:border-box;
	padding:4px;
	border-radius:4px;
	border:solid #f7f6f0 1px;
	position:relative;	
	}

	.jp-controls {
	position:absolute;
	top:4px;
	left:4px;	
	}

	.jp-controls button {
	position:absolute;
	overflow:hidden;
	text-indent:-9999px;
	width:50px;
	height:50px;
	margin:0 0 0 0;
	padding:0 0 0 0;
	border:none;
	outline:none;
	cursor:pointer;
	}
		
		.jp-type-single .jp-play {
		top:0px;
		left:0px;
		background-color:#c3a453;
		border-top-left-radius:4px;
		border-bottom-left-radius:4px;
		-moz-transition:all .2s ease-out;
		-webkit-transition:all .2s ease-out;
		transition:all .2s ease-out;
		position:relative;
		}
			.jp-type-single .jp-play:hover {background-color:#ffffff;}
			
			.jp-type-single .jp-play::before {
			content: "";
			position:absolute;
			left:20px;
			top:17px;
			width:0;
			height:0;
			border-style:solid;
			border-width:8px 0 8px 14px;
			border-color:transparent transparent transparent #ffffff;
			}
				.jp-type-single .jp-play:hover::before {border-color:transparent transparent transparent #c3a453;}
		
		/* Pause button */
		.jp-state-playing .jp-type-single .jp-play {}
		
			.jp-state-playing .jp-type-single .jp-play::before {
			content: "";
			position:absolute;
			left:18px;
			top:18px;
			width:5px;
			height:14px;
			border:none;
			border-radius:1px;
			background-color:#ffffff;
			}
				.jp-state-playing .jp-type-single .jp-play:hover::before {background-color:#c3a453;}
		
			.jp-state-playing .jp-type-single .jp-play::after {
			content: "";
			position:absolute;
			right:18px;
			top:18px;
			width:5px;
			height:14px;
			border-radius:1px;
			background-color:#ffffff;
			}
				.jp-state-playing .jp-type-single .jp-play:hover::after {background-color:#c3a453;}
		
		/* Seeking button */
  		.jp-state-seeking .jp-type-single .jp-play {}
		
			@keyframes spinner {
				to {transform: rotate(360deg);}
			}
			 
			@-webkit-keyframes spinner {
				to {-webkit-transform: rotate(360deg);}
			}
			 
			.jp-state-seeking .jp-type-single .jp-play:after {
			min-width:12px;
			min-height:12px;
			border:none !important;
			background:none !important;
			}
		 
				.jp-state-seeking .jp-type-single .jp-play:before {
				content:'';
				position:absolute;
				top:50%;
				left:50%;
				width:10px !important;
				height:10px !important;
				margin-top:-10px;
				margin-left:-10px;
				border:none !important;
				background:none !important;
				}
				 
				.jp-state-seeking .jp-type-single .jp-play:not(:required):before {
				content:'';
				border:none;
				border-radius:50%;
				border:5px solid #ffffff !important;
				border-top-color:#c3a453 !important;
				animation:spinner .8s linear infinite;
				-webkit-animation:spinner .8s linear infinite;
				}
				 
					.jp-state-seeking .jp-type-single .jp-play:hover:not(:required):before {
					border:5px solid #c3a453 !important;
					border-top-color:#ffffff !important;
					}


	.jp-details .jp-title {
	position:absolute;
	top:4px;
	left:68px;
	right:80px;
	font-size:14px;
	color:#c3a453;
	line-height:50px;
	height:50px;
	padding:0;
	margin:0;
	overflow:hidden;
	text-align:left;
	pointer-events:none;
	}
	
	
		.jp-current-time, 
		.jp-duration {
		position:absolute;
		top:4px;
		font-family:"interface-n7", "interface", Arial, Helvetica, sans-serif;
		font-weight:700;
		font-size:13px;
		line-height:50px;
		display:inline-block;
		text-align:right;
		color:#c3a453;
		pointer-events:none;
		}
			.jp-current-time {right:20px;}
			.jp-duration {right:120px;}


	.jp-progress {
	width:100%;
	height:50px;
	padding:0 0 0 50px;
	box-sizing:border-box;
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	-ms-box-sizing:border-box;
	border-top-right-radius:4px;
	border-bottom-right-radius:4px;
	overflow:hidden;
	}
	
		/* Background of progress bar */
		.jp-seek-bar {
		background-color:#285236;
		width:0;
		height:100%;
		overflow:hidden;
		cursor:pointer;
		border-top-right-radius:4px;
		border-bottom-right-radius:4px;
		-webkit-backface-visibility:hidden;
		}
		
		/* Progress of progress bar */
		.jp-play-bar {
		background-color:#3c6749;
		width:0;
		height:100%;
		overflow:hidden;
		-webkit-backface-visibility:hidden;
		}
	
	
	
	.audio-player .jp-type-single {
	border:solid #f1f0e9 1px;
	border-bottom-right-radius:0px;
	}	
		
	.jp-playlist {
	box-sizing:border-box;
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	-ms-box-sizing:border-box;
	padding:0px;
	border-radius:4px;
	border-top-left-radius:0px;
	border-top-right-radius:0px;
	border:solid #f1f0e9 1px;	
	border-top:none;
	margin-left:55px;
	}
	
		.jp-playlist ul {
		padding:0;
		margin:0;	
		}
		
			.jp-playlist ul li {
			list-style:none;
			padding:0;
			margin:0;	
			background:none;
			}
	
			.jp-playlist ul li a {
			display:block;
			font-family:"interface-n7", "interface", Arial, Helvetica, sans-serif;
			font-weight:700;
			font-size:15px;
			color:#987b2f;
			line-height:34px;
			height:34px;
			border-top:solid #f1f0e9 1px;
			padding-left:40px;
			overflow:hidden;
			text-align:left;
			position:relative;
			outline:none;
			}
			
				.jp-playlist ul li a:before {
				content:"";
				position:absolute;
				top:9px;
				left:11px;
				width:16px;
				height:16px;
				background-color:#c3a453;
				border-radius:8px;
				}
					.jp-playlist ul li.jp-playlist-current a:before {background-color:#285236;}
				
				.jp-playlist ul li a:after {
				content:"";
				position:absolute;
				top:13px;
				left:17px;
				width:0;
				height:0;
				border-style:solid;
				border-width:4px 0 4px 6px;
				border-color:transparent transparent transparent #ffffff;
				}
			
				.jp-playlist ul li:first-child a {border-top:none;}
			
				.jp-artist {
				font-family:"interface-n3", "interface", Arial, Helvetica, sans-serif;
				font-weight:300;
				font-size:14px;	
				color:#c3a453;
				}
			
				.jp-playlist ul li a:hover {
				background-color:#f7f6f0;
				}
			
			.jp-playlist ul li.jp-playlist-current a,
			.jp-playlist ul li.jp-playlist-current a:hover {
			color:#285236;
			background-color:#f1f0e9;
			}