#myProgress {
  width: 637px;
  border: solid 1px #61b283;   
  cursor: pointer;
  border-radius: 10px;
}

#myBar {
  width: 0%;
  height: 5px;
  background-color: #61b283;
  border-radius: 10px;
}

.btn-action{
  cursor: pointer;
  padding-top: 10px;
  width: 30px;
}

.btn-ctn, .infos-ctn{
  display: flex;
  align-items: center;
  justify-content: center;
}

.infos-ctn{
padding-top: 0px;
}

.btn-ctn > div {
 padding: 5px;
 margin-top: 18px;
 margin-bottom: 18px;
}

.infos-ctn > div {
 margin-bottom: 8px;
 color: #61b283;
}

.first-btn{
  margin-left: 3px;
}

.duration{
  margin-left: 10px;                          
}

.title{
  margin-left: 10px;
  width: 280px;
  text-align: center;
  display: none;
}

.player-ctn{
  border-radius: 15px;
  width: 640px;                          
  padding: 10px;
  background-color: black;
  margin:auto;
  margin-top: 100px;
}

.playlist-track-ctn{
  display: flex;
  background-color: #090909;
  border: solid 1px #15251d;
  margin-top: 3px;
  border-radius: 10px;
  cursor: pointer;
}

.playlist-track-ctn:hover{
  display: flex;
  color:black;
  background-color: #1c1c1c;
  border: solid 1px #a8a8aa;
  margin-top: 3px;
  border-radius: 10px;
  cursor: pointer;
}

.playlist-track-ctn > div{
  margin:3px;
}
.playlist-info-track{
  width: 568px;                        
}
.playlist-info-track,.playlist-duration{
  padding-top: 7px;
  padding-bottom: 7px;
  color: #61B283;
  pointer-events: none;
}

.playlist-ctn{
   padding-bottom: 1px;
}

.active-track{
background: #131313;
border: solid 1px #61b283;
}

.active-track > .playlist-info-track,.active-track >.playlist-duration,.active-track > .playlist-btn-play{
  color: #61b283 !important; z-index:+2;
}


.playlist-btn-play{
  pointer-events: none;
  padding-top: 5px;
  padding-bottom: 5px;
}
.fas{
  color: #61b283;
  font-size: 20px;
}


.iti {
   height:24px;
}