.panel{ 
    margin: 20px;
     padding:0px; 
     height:34px;
    }
.audio-panel{
    border:none  !important;
}
#playlist{
   
    width: 50%;
    height: 371px;
    overflow-x: hidden;
    overflow-y: scroll;
  
}

#playlist li  i{
 font-size: 30px;
 color: white;
}
.backto{ 
    margin-top: 20px;
}
.imgs span{
 font-weight: 900;
 font-size: 27px;
}
.imgs img{
    width:90px;
     height:100px;
}
.telecharger{
    text-align:center; 
    font-size: 23px;
   
}
.telecharger a {
    color: black;
    text-decoration: none;
}
.telecharger i:hover
{ 

   color: red;

}
.backto a {
    color: black;
    font-size: 23px;
    text-decoration: none;
}

#playlist,audio{width:100%;}
.active a{color:#fff;text-decoration:none;}
ul{list-style:none; margin:0px; padding:20px;   text-align:center; }
li{margin:0px; padding:0px;}
li, a{transition:all 0.5s;}
.list-group-item.active { 
    background-color: #333;
}
#playlist .list-group-item.active {
    background-color: #333;
    border-color: #333;
}
.list-group-item.active a{ text-decoration:none; color:#fff;}
a{display:block; position:relative; width:100%;}
li a{display:block; text-decoration:none; color: black; font-weight: 900; font-size: 25px;} 
li:hover{background-color:#333;}
li a:hover{text-decoration:none; color: #fff;}
a{color:#fff; text-decoration:none;}
.last{display:none;}


#dd1,#dd2,#dd3,#dd4,#dd5,#dd6,#dd7,#dd8,#dd9,#dd10,
#dd11,#dd12,#dd13,#dd14,#dd15,#dd16,#dd17,#dd18,#dd19,#dd20,
#dd20,#dd21,#dd22,#dd23,#dd24,#dd25,#dd26,#dd27,#dd28,#dd29,#dd30,
#dd31,#dd31,#dd32,#dd33,#dd34,#dd35,#dd36,#dd37,#dd38,#dd39,#dd40,
#dd41,#dd41,#dd42,#dd43,#dd44,#dd45,#dd46,#dd47,#dd48,#dd49,#dd50,
#dd51,#dd51,#dd52,#dd53,#dd54,#dd55,#dd56,#dd57,#dd58,#dd59,#dd60,
#dd61,#dd61,#dd62,#dd63,#dd64,#dd65,#dd66,#dd67,#dd68,#dd69,#dd70,
#dd71,#dd71,#dd72,#dd73,#dd74,#dd75,#dd76,#dd77,#dd78,#dd79,#dd80,
#d881,#dd81,#dd82,#dd83,#dd84,#dd85,#dd86,#dd87,#dd88,#dd89,#dd90,
#dd91,#dd91,#dd92,#dd93,#dd94,#dd95,#dd96,#dd97,#dd98,#dd99,#dd100,
#dd101,#dd102,#dd103,#dd104,#dd105,#dd106,#dd107,#dd108,#dd109,#dd110,
#dd111,#dd112,#dd113,#dd114{ 
    display: none;
}

#d1,#d2,#d3,#d4,#d5,#d6,#d7,#d8,#d9,#d10,
#d11,#d12,#d13,#d14,#d15,#d16,#d17,#d18,#d19,#d20,
#d20,#d21,#d22,#d23,#d24,#d25,#d26,#d27,#d28,#d29,#d30,
#d31,#d31,#d32,#d33,#d34,#d35,#d36,#d37,#d38,#d39,#d40,
#d41,#d41,#d42,#d43,#d44,#d45,#d46,#d47,#d48,#d49,#d50,
#d51,#d51,#d52,#d53,#d54,#d55,#d56,#d57,#d58,#d59,#d60,
#d61,#d61,#d62,#d63,#d64,#d65,#d66,#d67,#d68,#d69,#d70,
#d71,#d71,#d72,#d73,#d74,#d75,#d76,#d77,#d78,#d79,#d80,
#d881,#d81,#d82,#d83,#d84,#d85,#d86,#d87,#d88,#d89,#d90,
#d91,#d91,#d92,#d93,#d94,#d95,#d96,#d97,#d98,#d99,#d100,
#d101,#d102,#d103,#d104,#d105,#d106,#d107,#d108,#d109,#d110,
#d111,#d112,#d113,#d114{
    background-color:#333;
    color: #fff;
    height: 300px;  
    overflow-x: hidden;
    overflow-y: scroll;
   text-align: center;
   margin-bottom: 10px;
 font-size: 29px;

} 

/* #d1 i,#d2 i,#d3 i,#d4 i,#d5 i,#d6 i,#d7 i,#d8 i,#d9 i,#d10 i,
#d20 i,#d22 i,#d23 i,#d24 i,#d25 i,#d26 i,#d27 i,#d28 i,#d29 i,#d30 i,
#d31 i,#d32 i,#d33 i,#d34 i,#d35 i,#d36 i,#d37 i,#d38 i,#d39 i,#d40 i,
#d41 i,#d42 i,#d43 i,#d44 i,#d45 i,#d46 i,#d47 i,#d48 i,#d49 i,#d50 i,
#d51 i,#d52 i,#d53 i,#d54 i,#d55 i,#d56 i, #d57 i,#d58 i,#d59 i,#d60 i ,
#d61 i,#d62 i,#d63 i,#d64 i,#d65 i,#d66 i,#d67 i,#d68 i,#d69 i,#d70 i,
#d71 i,#d72 i,#d73 i,#d74 i,#d75 i,#d76 i,#d77 i,#d78 i,#d79 i,#d80 i,
#d881 i,#d82 i,#d83 i,#d84 i,#d85 i,#d86 i, #d87 i,#d88 i,#d89 i,#d90 i,
#d91 i,#d92 i,#d93 i,#d94 i,#d95,#d96 i,#d97 i,#d98 i,#d99 i,#d100 i,
#d101 i,#d102 i,#d103 i,#d104 i,#d105 i,#d106 i,#d107 i,#d108 i,#d109 i,#d110 i,
#d111 i,#d112 i,#d113 i,#d114 i{ 
        font-size: 27px;
       
}

/* Style the buttons */
.sidenavlist {
    background-color:#333;
    color: #fff;
    height:  100%;
    width: 30px;
    position: relative fixed;
    z-index: 1;
    top: 0;
    left: 0;
    overflow-x: hidden;
    overflow-y: hidden;

  }
  
  .sidenavlist  .btn {
    color: #fff;
    border: none;
    outline: none;
    padding: 12px 16px;
    cursor: pointer;
     margin-bottom: 3px ;
     font-size: 21px;
  font-weight: 900;
  
  } 
  .sidenavlist  .btn:hover {
    background-color: #666;
  }
  
  .btn.active {
    background-color: #666;
    color: white;
  }












/* #d2 i{
    font-size: 27px;
}
#d2{
    background-color:#333;
    color: #fff;
    height: 200px;
    overflow-x: hidden;
    overflow-y: scroll;
   text-align: center;
   margin-bottom: 10px;
 font-size: 29px;
} */