﻿.ap-main-container {
	background-color: #424242;
	padding: 15px;
	border-radius: 6px;
	text-align: left;
	color: white;
}

.ap-button-container {
	float: left;
	padding-right: 5px;
}

.ap-volume-container {
	float: right;
	width: 150px;
	background: #808080;
	padding-right: 10px;
	border-radius: 3px;
}

.ap-volume-slider-container {
	position: relative;
	float: right;
}

.ap-volume-slider-background {
	margin-top: 13px;
	height: 3px;
	width: 100px;
	background-color: white;
	cursor: pointer;
	border-radius: 1px;
}

.ap-volume-slider {
	margin-top: 13px;
	width: 50px;
	height: 3px;
	background-color: #000000;
	cursor: pointer;
	border-top-left-radius: 1px;
	border-bottom-left-radius: 1px;
}

.ap-volume-slider-draggable {
	left: 49px;
	margin-top: 10px;
	position: absolute;
	cursor: pointer;
    background: #000000;
    width: 10px;
    height: 10px;
    border-radius: 50%;
}

.ap-progress-container {
	position: relative;
	padding-top: 14px;
}

.ap-progress-bar-background {
	margin-top: 6px;
	background-color: white;
	cursor: pointer;
	border-radius: 3px;
}

.ap-progress-bar {
	width: 0px;
	height: 6px;
	background-color: #ff8500;
	cursor: pointer;
	border-top-left-radius: 3px;
	border-bottom-left-radius: 3px;
	-webkit-box-shadow: inset 0 -1px 0 rgba(0, 0, 0, .15);
	box-shadow: inset 0 -1px 0 rgba(0, 0, 0, .15);
}

.ap-progress-draggable {
	position: absolute;
	margin-top: 3px;
	cursor: pointer;
    background: #ff8500;
    width: 12px;
    height: 12px;
    border-radius: 50%;
}

.ap-progress-time-container {
	background-color: #ff8500;
	left: 0;
}

.ap-progress-duration-container {
	background-color: white;
	color: #424242;
	right: 0;
}

.ap-progress-duration-container, .ap-progress-time-container {
	position: absolute;
	height: 18px;
	min-width: 35px;
	transition: opacity .25s ease-in-out;
   -moz-transition: opacity .25s ease-in-out;
   -webkit-transition: opacity .25s ease-in-out;
   pointer-events:none;
}

.ap-text-container {
	padding-top: 15px;
	overflow: hidden;
}

.ap-transparent {
	opacity: 0;
}

.ap-highlight {
	color: #ff8500;
}

aptracktime, aptrackduration, apvolumebackground, apvolumebar, apvolumedraggable, approgressbackground, approgressbar, approgressdraggable {
	display: block;	
}

