git.dj3c1t.com Git - mw_sourceml/blob - app/out/default/css/jaudio-player.1.1.css

   1 /*
   2   jaudioPlayer 1.1
   3   http://jaudio-player.dj3c1t.com/
   4
   5 */
   6
   7 .audio_player{
   8   position: relative;
   9   margin-bottom: 0.5em;
  10 }
  11
  12 .audio_player img.loading{
  13   position: absolute;
  14   top: 2px;
  15   left: 0;
  16   display: none;
  17 }
  18 .with_waveform .audio_player img.loading{
  19   top: 21px;
  20 }
  21
  22
  23 .audio_player .player_controls{
  24   margin: 0;
  25   position: absolute;
  26   top: 2px;
  27   left: 0px;
  28   width: 42px;
  29 }
  30
  31 .with_waveform .audio_player .player_controls{
  32   top: 21px;
  33 }
  34
  35 .audio_player .player_controls a{
  36   text-decoration: none;
  37   display: block;
  38   float: right;
  39   width: 16px;
  40   height: 16px;
  41   margin: 0 0 0 5px;
  42 }
  43
  44 .audio_player .player_controls a span{
  45   display: none;
  46 }
  47
  48 .audio_player .player_controls a.play{
  49   background-position: 0px 0px;
  50 }
  51
  52 .audio_player .player_controls a.play:hover{
  53   background-position: -16px 0px;
  54 }
  55
  56 .audio_player .player_controls a.pause{
  57   background-position: 0px -16px;
  58   display: none;
  59 }
  60
  61 .audio_player .player_controls a.pause:hover{
  62   background-position: -16px -16px;
  63 }
  64
  65 .audio_player .player_controls a.stop{
  66   background-position: 0px -32px;
  67   display: none;
  68 }
  69
  70 .audio_player .player_controls a.stop:hover{
  71   background-position: -16px -32px;
  72 }
  73
  74
  75 .audio_player .player_progress{
  76   height: 20px;
  77   overflow: hidden;
  78   margin: 0 10em 0 55px;
  79   position: relative;
  80 }
  81
  82 .audio_player .player_progress div,
  83 .audio_player .player_progress img{
  84   cursor: pointer;
  85 }
  86
  87 .audio_player .player_progress .bg{
  88   background-color: #e5e5e5;
  89   width: 100%;
  90   height: 100%;
  91   position: absolute;
  92   top: 0;
  93   left: 0;
  94   overflow: hidden;
  95 }
  96
  97 .audio_player .player_progress .loaded{
  98   background-color: #c0c0c0;
  99   width: 0;
 100   height: 100%;
 101   position: absolute;
 102   top: 0;
 103   left: 0;
 104   overflow: hidden;
 105 }
 106
 107 .audio_player .player_progress .position{
 108   background-color: #666666;
 109   width: 0;
 110   height: 100%;
 111   position: absolute;
 112   top: 0;
 113   left: 0;
 114   overflow: hidden;
 115 }
 116
 117 .with_waveform .audio_player .player_progress{
 118   height: 60px;
 119   background-color: transparent;
 120 }
 121
 122 .with_waveform .audio_player .player_progress img{
 123         height:100%;
 124 }
 125
 126 .with_waveform .audio_player .player_progress .bg{
 127   background-color: transparent;
 128   opacity: 0.4;
 129 }
 130
 131 .with_waveform .audio_player .player_progress .loaded{
 132   background-color: transparent;
 133   opacity: 0.4;
 134 }
 135
 136 .with_waveform .audio_player .player_progress .position{
 137   background-color: transparent;
 138   opacity: 1;
 139   border-right: solid 1px #555555;
 140 }
 141
 142 .audio_player .time{
 143   position: absolute;
 144   top: 0px;
 145   right: 5px;
 146 }
 147
 148 .with_waveform .audio_player .time{
 149   top: 22px;
 150 }
 151
 152 .audio_player .time .duration{
 153   color: #888888;
 154   border-left: solid 1px #888888;
 155   padding-left: 0.5em;
 156 }