#putnam-audio-player.disabled
{
  pointer-events: none;
  opacity: 0.4;
}

#putnam-audio-player.simplified .back-30-container,
#putnam-audio-player.simplified .sliderTrack
{
  display: none;
}

#putnam-audio-player.simplified .control-section.timeline div
{
  width: 50px;
}

#audioControls
{
  display: flex;
  width: 100%;
  height: 50px;
  background-color : rgba( 0, 0, 0, 0.8 );
  color : white;
}

#audioControls button
{
  outline: none;
  border: none;
  background: none;
}

#audioControls .control-section
{
  display : flex;
  align-items : center;
}

/* Player section */
#audioControls .control-section.player
{
  /*width : 150px;*/
  border-right : 1px #999 solid;
}

#audioControls .control-section.player button
{
  flex : 1;
  width: 50px;
}

/* Timeline section */
#audioControls .control-section.timeline
{
  flex : 1;
  border-right : 1px #999 solid;
}

#audioControls .control-section.timeline div
{
  padding: 0 5px;
  text-align: center;
}

@media (min-width:992px)
{
  #audioControls .control-section.timeline div
  {
    width : 60px;
    padding : 0;
  }
}

#audioControls .control-section.timeline .track
{
  flex : 1;
}

#audioControls .control-section.timeline .back-30 .putnamicon
{
  font-size: 2rem;
}

/* Volume section */
#audioControls .control-section.volume button,
#audioPlaylist li .duration
{
  width : 50px;
}

#audioControls .control-section.volume .volumeSlider
{
  width : 75px;
}

#audioControls .control-section.volume button .putnamicon
{
  display: none;
}

#audioControls .control-section.volume button[type="high"] .putnamicon-volume-high{ display: block; }
#audioControls .control-section.volume button[type="medium"] .putnamicon-volume-medium{ display: block; }
#audioControls .control-section.volume button[type="low"] .putnamicon-volume-low{ display: block; }
#audioControls .control-section.volume button[type="mute"] .putnamicon-volume-mute{ display: block; }
#audioControls .control-section.volume button[type="mute2"] .putnamicon-volume-mute2{ display: block; }

#audioControls .control-section.volume .sliderTrack
{
  flex : 1;
  padding-right: 15px;
}

/* Button Styles */
#audioControls .putnamicon
{
  color : white;
}

#audioControls .putnamicon.large
{
  font-size: 2.25rem;
}

#audioControls .putnamicon.medium
{
  font-size: 1.5rem;
}

#audioControls .putnamicon.small
{
  font-size: 1.25rem;
}

/* Playlist */
#audioPlaylist ul
{
  list-style: none;
  padding: 0;
}

#audioPlaylist li
{
  display: flex;
  padding: 10px 5px;
  border-bottom: 1px #ccc solid;
  color : #999;
}

#audioPlaylist li.current
{
  color : inherit;
}

#putnam-audio-player.playing #audioPlaylist li.current
{
  font-weight : 600;
}

#audioPlaylist li .sourceIndex
{
  display: block;
  width: 45px;
  padding-right: 5px;
  text-align: center;
}

#audioPlaylist li .title
{
  flex : 1;
  padding-right: 5%;
}

/* Custom Slider */
#audioControls input[type="range"]{
    -webkit-appearance: none;
    -moz-apperance: none;
    border-radius: 6px;
    height: 6px;
    width: 100%;
    background-image: -webkit-gradient(
        linear,
        left top,
        right top,
        color-stop(0, #3692d0),
        color-stop(0, #FDFDFD)
    );
    background-color: transparent;
}

input[type=range]::-moz-focus-outer {
  border: 0;
}

input[type=range]::-moz-range-track {
    background: transparent;
}

#audioControls input[type=range]:focus {
  outline: none;
}

#audioControls input[type='range']::-webkit-slider-thumb {
    -webkit-appearance: none !important;
    background-color: #E9E9E9;
    border: 1px solid #CECECE;
    height: 15px;
    width: 15px;
    border-radius: 100px;
}

/* Audio Visualizer */
#audioVisualizer
{
  position: relative;
}

#audioVisualizer #playheadCanvas
{
  position: absolute;
  overflow: hidden;
  top : 0;
  left : 0;
  z-index: 1;
  width: 0;
  transition: width 0.5s;
}

.playhead
{
  max-width: 100%;
}

/* iOS mobile loading */
.mobile-load-audio {
	display: block;
	position: absolute;
	width: 100%;
	left: 0;
	height: 100%;
	top: 0;
	line-height: 5em;
	text-align: center;
	font-size: 1.5rem;
}
a.mobile-load-audio:link,
a.mobile-load-audio:visited,
a.mobile-load-audio:hover,
a.mobile-load-audio:active {
	text-decoration: none;
}
