﻿    /* 滚动条样式 */
    ::-webkit-scrollbar {
      width: 6px;
      
  }
  /* 滑块样式 */
  ::-webkit-scrollbar-thumb{
      background-color: #e80505; 
      border-radius: 10px;
      
  }
  /* 滚动条轨道样式 */
  ::-webkit-scrollbar-track{
      background-color: #fcfcfc;
      border-radius: 10px;
     
  }

  /*!
 * Liu Haiyang
 * haiyangrtk@163.com
 * Copyright 2024-08-12
 * 
 */

 
 .MusicBox
   {  
        font: 9px 'Lucida Sans Unicode', 'Trebuchet MS', Arial, Helvetica;
        background-color: #212121;
        background-image: -webkit-gradient(linear, left top, left bottom, from(#1B1B1B), to(#212121));
        background-image: -webkit-linear-gradient(top, #1B1B1B, #212121);
        background-image: -moz-linear-gradient(top, #1B1B1B, #212121);
        background-image: -ms-linear-gradient(top, #1B1B1B, #212121);
        background-image: -o-linear-gradient(top, #1B1B1B, #212121);
        background-image: linear-gradient(top, #1B1B1B, #212121);
    
        /*设置边框的弧度值，为3px*/
        -moz-border-radius: 3px;
        -webkit-border-radius: 3px;
        border-radius: 3px;

        
        /*阴影*/
        text-shadow: 0 1px 0 rgba(255,255,255,0.5);
        -webkit-box-shadow: 10px 10px 25px #ccc; 
        -moz-box-shadow: 10px 10px 25px #ccc; 
        box-shadow: 10px 10px 25px #ccc; 
    
     /*透明度*/
     opacity:0.9; 
     
     /*基本性质*/
     padding:2px 5px;
     position:absolute;
     z-index:9;
     border-width: 1px;
     border-style: solid;
     border-color: #ba1626;
     width:810px;
     height:40px;
   }

   .LeftControl
   {
      width:0px;
      padding: 10px 10px 10px 10px;
      float:left; 
      height:20px;
      background:url(../Images/sk-dark.png) left 2px no-repeat;
      margin-right:8px;
      margin-left:10px;
      cursor: pointer;
      
   }
   
   .LeftControl:hover
   {
      background:url(../Images/sk-dark.png) left -30px no-repeat;
   }

   
   
   
   .RightControl
   {
      width:0px;
      padding: 10px 10px 10px 10px;
      float:left; 
      height:20px;
      background:url(../Images/sk-dark.png) left -62px no-repeat;
      margin-right:8px;
      cursor: pointer;
   }
   
   .RightControl:hover
   {
      background:url(../Images/sk-dark.png) left -93px no-repeat;
   }
   
   
   .ProcessControl
   {
      width:500px;
      padding: 5px 10px 10px 10px;
      float:left; 
      height:20px;
      margin-right:12px;
      color:#ffffff;
      background-image: none;
   }
   
   .ProcessControl .SongName
   {
      float:left;
   }

   .ProcessControl .SongTime
   {
      float:right;      
   }
   
   .ProcessControl .Process
   {
     width: 500px;
     float: left;
     height: 2px;
     cursor: pointer;
     background-color:#000000;   
     margin-top:7px;
   }
   
   .ProcessControl .ProcessYet
   {
     width: 0px;
     position:absolute;     
     height: 2px;
     left:131px;
     top:30px;
     cursor: pointer;
     background-color:#7A8093; 
   }
   
   .VoiceEmp
   {
      width:0px;
      padding: 10px 10px 10px 10px;
      float:left; 
      height:17px;
      background:url(../Images/sk-dark.png) -28px -180px no-repeat;  
      margin-right:2px;
      cursor: pointer;
   }
   
   .VoiceEmp:hover
   {
      background:url(../Images/sk-dark.png) -28px -212px no-repeat; 
   }
   
   .VoidProcess
   {
     width: 66px;
     height: 2px;
     cursor: pointer;
     background-color:#000;      
     float:left;
     margin-top:19px;
     margin-right:6px;   
   }
   
   .VoidProcessYet
   {
     width: 66px;
     position:absolute;     
     height: 2px;
     left:675px;
     top:21px;
     cursor: pointer;
     background-color:#7A8093; 
   }
   
   
   .VoiceFull
   {      
      width:0px;
      padding: 10px 10px 10px 10px;
      float:left; 
      height:17px;
      cursor: pointer;
      background:url(../Images/sk-dark.png) -28px -116px no-repeat;    
   }
   
   .VoiceFull:hover
   { 
      background:url(../Images/sk-dark.png) -28px -148px no-repeat;    
   }
   
   #MainControl{
    cursor: pointer;
   }
   
   .MainControl
   {
      width:25px;
      padding: 10px 15px 5px 10px;
      float:left; 
      height:20px;
      background:url(../Images/sk-dark.png) -80px -130px no-repeat;    
   }
   
   
   .MainControl:hover
   {
      background:url(../Images/sk-dark.png) -80px -166px no-repeat;
   }
   
   
   .StopControl
   {
      width:14px;
      padding: 10px 10px 5px 10px;
      float:left; 
      height:20px;
      background:url(../Images/sk-dark.png) -50px -130px no-repeat; 
      margin-right:16px;   
   }
   
   
   .StopControl:hover
   {
      background:url(../Images/sk-dark.png) -50px -165px no-repeat;
   }
   
   
   .MusicList
   {
        font: 9px 'Lucida Sans Unicode', 'Trebuchet MS', Arial, Helvetica;
        background-color: #212121;
        background-image: -webkit-gradient(linear, left top, left bottom, from(#1B1B1B), to(#212121));
        background-image: -webkit-linear-gradient(top, #1B1B1B, #212121);
        background-image: -moz-linear-gradient(top, #1B1B1B, #212121);
        background-image: -ms-linear-gradient(top, #1B1B1B, #212121);
        background-image: -o-linear-gradient(top, #1B1B1B, #212121);
        background-image: linear-gradient(top, #1B1B1B, #212121);
    
        -moz-border-radius: 3px;
        -webkit-border-radius: 3px;
        border-radius: 3px;
    
        text-shadow: 0 1px 0 rgba(255,255,255,0.5);
    
         -moz-box-shadow: 0 0 1px rgba(0, 0, 0, 0.3), 0 1px 0 rgba(255, 255, 255, 0.3) inset;
         -webkit-box-shadow: 0 0 1px rgba(0, 0, 0, 0.3), 0 1px 0 rgba(255, 255, 255, 0.3) inset;
         box-shadow: 0 0 1px rgba(0, 0, 0, 0.3), 0 1px 0 rgba(255, 255, 255, 0.3) inset;    
    
        border-width: 1px;
        border-style: solid;
        border-color: #ba1626;
    
        width:600px;
        height:200px;
        
     /*阴影*/
     -webkit-box-shadow: 10px 10px 25px #ccc; 
     -moz-box-shadow: 10px 10px 25px #ccc; 
     box-shadow: 10px 10px 25px #ccc; 
    
     /*透明度*/
     opacity:0.9; 
     
     /*基本性质*/
     padding:2px 5px;
     position:absolute;
     z-index:1000;
     display:none;
   }
   
   .MusicList .Author
   {
        font: 9px 'Lucida Sans Unicode', 'Trebuchet MS', Arial, Helvetica;
        background-color: #212121;
        background-image:url(../author/01.png);
    
        -moz-border-radius: 3px;
        -webkit-border-radius: 3px;
        border-radius: 3px;
    
        width:158px;
        height:200px;
        float:left;
   }
   
   .MusicList .List
   {
       font: 9px 'Lucida Sans Unicode', 'Trebuchet MS', Arial, Helvetica;
       background-color: #212121;    
       -moz-border-radius: 3px;
       -webkit-border-radius: 3px;
       border-radius: 3px;
       
       width:410px;
       height:180px;
       float:right;
       overflow:hidden;
       overflow-y: auto;
       padding:10px 13px;
       color:#fff;       
   }
   
     .MusicList .List .Single
    {
        width:100%;
        float:left;
        overflow:hidden;
        height:15px;
        font-size:13px;
        cursor:pointer;
        margin-bottom:8px;
    }
   
     .MusicList .List .Single .SongName
     {
       width:90%;
       float:left;
     }

     .MusicList .List .Single .active
     {
       color: red !important;
     }
     
     
     .ShowMusicList
     {        
      width:10px;
      padding: 10px 10px 5px 10px;
      float:left; 
      height:10px;
      background:url(../Images/sk-dark.png) -20px 0 no-repeat; 
      margin:5px 0 0 12px;
      cursor:pointer;
     }
     
     .ShowMusicList:hover
     {        
      background:url(../Images/sk-dark.png) -20px -29px no-repeat; 
     }