div.player {
  background-color: transparent;
  margin: 0;
  width:95%;
  max-height:6px;
  padding:0;
  margin: 0 0 130px 0;
}
  
div.player:after {
    content: "";
    display: table;
    clear: both;}
    
div.meta-container {
  float: left;
  width:100%;
  padding: 0px; }
  
.info {
font-family: "Playfair Display", serif;
font-size:0.7em;
position:relative;left:0px;top:60px;
display:inline-block;white-space:nowrap;}

.info-long {
font-family: "Playfair Display", serif;
font-size:0.7em;
position:relative;left:0px;top:60px;
display:inline-block;}

progress.amplitude-song-played-progress {

  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
display: block;
  cursor: pointer;
width:88%;
height:60px;
margin-left:51px;
  position:relative;top:23px;
background:transparent;
}

  
div.meta-container div.song-artist {
position:relative;top:54px;left:3px;
font-family: "Alatsi", sans-serif;
  font-weight: 400;
    text-transform:uppercase;
    font-size: 0.9em;
    color: #000;
    margin-top: 0px;
    margin-bottom:10px;
    }
    
div.song-artist a {
 
    border-top: 1px solid rgba(0, 0, 0, .08);
        border-right: 1px solid rgba(0, 0, 0, .08);
    border-bottom: 1px solid rgba(0, 0, 0, .08);
    border-left: 1px solid rgba(0, 0, 0, .08);
      background: url("images/download.png");
      background-size: cover;
      background-position: bottom center; 
      position:absolute;left:90%;top:-47px;
      width: 30px;
      height: 30px;
      cursor: pointer;
      display: inline-block;
      text-decoration:none; filter: grayscale(1);
      }
 
div.song-artist a:hover {filter: grayscale(0);
}   
    
div.control-container {
  text-align: left;
  margin-top: 12px;
  }  
  
div.control-container div.amplitude-play-pause {

    width: 60px;
    height: 60px;
    cursor: pointer;
    display: inline-block;
    position:relative;top:-9px;
}


/* 
.amplitude-active-song-container .control-container .song-artist {color:#ff6600;}
.amplitude-active-song-container .current-time, .amplitude-active-song-container .duration {color:#ff6600; font-weight:bold;}
 */


div.meta-container div.time-container {

    width:100%;
    font-family: "Playfair Display", serif;
    height:20px;
    font-size: 12px;
    color: #000;
    margin-left:8px; 
    }
    
  div.meta-container div.time-container:after {
      content: "";
      display: table;
      clear: both; 
      }
    
  div.meta-container div.time-container div.current-time {
      float: left;
       }
    
  div.meta-container div.time-container div.duration {
      float: left;
      margin-left:10px; 
      }
    
      


    div.control-container div.amplitude-play-pause.amplitude-paused {
    border-top: 1px solid rgba(0, 0, 0, .08);
        border-right: 1px solid rgba(0, 0, 0, .08);
    border-bottom: 1px solid rgba(0, 0, 0, .08);
        border-left: 1px solid rgba(0, 0, 0, .08);
        background:#ececec;
      background: url("images/play.png");
      background-size: cover;
      background-position: bottom center;
      }
   
   
    div.control-container div.amplitude-play-pause.amplitude-playing {
    border-top: 1px solid rgba(0, 0, 0, .08);
        border-right: 1px solid rgba(0, 0, 0, .08);
    border-bottom: 1px solid rgba(0, 0, 0, .08);
    border-left: 1px solid rgba(0, 0, 0, .08);
      background: url("images/pause.png");
      background-size: cover;
      background-position: bottom center;
      }
      

@media screen and (max-width: 39.9375em) {
  
  div.meta-container {width: 100%;
  } 

}


  
@media only screen and (min-width: 968px) {

div.player {
  background-color: transparent;
  margin: 0;
  width:90%;
  max-height:6px;
  padding:20px;
  margin: 0 0 80px 0;
}

div.control-container {
  text-align: left;
  margin-top:50px;
  }
  
div.control-container div.amplitude-play-pause {
position:relative;top:-45px;
    margin:0 0 0 6px;
    width: 60px;
    height: 60px;
    cursor: pointer;
    display: inline-block;
    }
    
progress.amplitude-song-played-progress {
   -webkit-appearance: none;
   -moz-appearance: none;
   appearance: none;
   display: block;
   width:100%;
   height:60px;
   margin-left:57px;
   position:relative;top:25px;
   }
  

   
   div.song-artist a {
 
    border-top: 1px solid rgba(0, 0, 0, .08);
        border-right: 1px solid rgba(0, 0, 0, .08);
    border-bottom: 1px solid rgba(0, 0, 0, .08);
    border-left: 1px solid rgba(0, 0, 0, .08);
      background: url("images/download.png");
      background-size: cover;
      background-position: bottom center; 
      position:absolute;left:100%;top:-83px;
      width: 30px;
      height: 30px;
      cursor: pointer;
      display: inline-block;
      text-decoration:none; filter: grayscale(1);
      }
      
      
    .info {
font-family: "Playfair Display", serif;
font-size:1em;
position:relative;left:80px;top:20px;
display:inline-block;
}  
      
    .info-long {
font-family: "Playfair Display", serif;
font-size:1em;
position:relative;left:80px;top:20px;
display:inline-block;
}      

} /* END min-width: 768px */

.tippy-content{   font-family: "Alatsi", sans-serif;
   font-weight: 400;
   text-align: left;
   width:100%;
   text-transform:uppercase;
   font-size: 1em;
   color: #fff;}

progress.amplitude-song-played-progress:not([value]) {
  background-color: #fff; }



progress[value]::-webkit-progress-bar {
background:transparent;
  
  border-top: 1px solid rgba(0, 0, 0, .08);
  border-right: 1px solid rgba(0, 0, 0, .08);
  border-bottom: 1px solid rgba(0, 0, 0, .08);
  border-left: none;
  border-radius: 0;
  margin-top:-48px; }

progress[value]::-moz-progress-bar {
background:transparent;
  
  border-top: 1px solid rgba(0, 0, 0, .08);
  border-right: 1px solid rgba(0, 0, 0, .08);
  border-bottom: 1px solid rgba(0, 0, 0, .08);
  border-left: none;
  border-radius: 0;
  margin-top:-48px; }

progress[value]::-webkit-progress-value {
  background-color: transparent;z-index:-1;border-right:solid #000 1px;
  border-radius: 0; margin-top:0px;}

  body div#preload {
    display: none; }
