js2/mwEmbed/skins/kskin/playerSkin.css

   1 /*
   2 * K-skin player
   3 */
   4 .k-player {
   5         color: white;
   6 }
   7
   8 /* large play button */
   9 .k-player .play-btn-large {
  10         width: 120px;
  11         height: 55px;
  12         background: url(images/ksprite.png) no-repeat 28px -433px;
  13         position: absolute;
  14         cursor: pointer;
  15         border: none;
  16 }  /*.ui-state-default */
  17 .k-player .play-btn-large.ui-state-hover {
  18         background: url(images/ksprite.png) no-repeat 28px -377px;
  19 }
  20
  21 /* control icons: */
  22 .k-player .ui-state-default .ui-icon,.k-player .ui-state-hover .ui-icon
  23         {
  24         background: transparent url(images/ksprite.png) no-repeat scroll 0 -48px
  25                 ;
  26 }
  27
  28 .k-player .ui-state-default .ui-icon-arrow-4-diag {
  29         background-position: 0 -32px;
  30 }  /* fullscreen */
  31 .k-player .ui-state-hover .ui-icon-arrow-4-diag {
  32         background-position: -16px -32px;
  33 }
  34
  35 .k-player .ui-state-hover .ui-icon-volume-on{
  36         background-position: -16px -48px;
  37 }
  38
  39 .k-player .ui-state-default .ui-icon-play {
  40         background: url(images/ksprite.png) no-repeat 0 0;
  41 }
  42
  43 .k-player .ui-state-hover .ui-icon-play {
  44         background-position: -16px 0;
  45 }
  46
  47 .k-player .ui-state-default .ui-icon-pause {
  48         background: url(images/ksprite.png) no-repeat 0 -17px;
  49 }
  50
  51 .k-player .ui-state-hover .ui-icon-pause {
  52         background-position: -16px -17px;
  53 }
  54
  55 .k-player .control-bar {
  56         border: 0px;
  57         height: 21px;
  58         padding: 2px 0 0 6px;
  59         margin-top: 0px;
  60         background: url(images/ksprite.png) repeat-x 0 -81px;
  61         font: normal 11px arial, sans-serif;
  62         color: #555;
  63 }
  64
  65 .k-player .play_head {
  66         background: url("images/ksprite.png") repeat-x scroll 0 -350px
  67                 transparent;
  68         display: inline;
  69         float: left;
  70         margin-left: 10px;
  71         border: 1px solid #EEEEEE;
  72         height: 8px;
  73         margin: 6px 10px 0 7px;
  74         position: relative;
  75 }
  76
  77 .k-player .play_head .ui-slider-handle {
  78         background: url("images/ksprite.png") no-repeat scroll -67px -341px
  79                 transparent;
  80         border: 1px solid #888888;
  81         display: block;
  82         height: 8px;
  83         margin: -1px 0 0 -5px;
  84         position: absolute;
  85         top: 0;
  86         width: 8px;
  87         cursor: pointer;
  88 }
  89
  90 .k-player .time-disp {
  91         border: medium none;
  92         display: inline;
  93         color: #555555;
  94         font: 11px arial, sans-serif;
  95         line-height: 20px;
  96         overflow: hidden;
  97         width: 36px;
  98         float: right;
  99 }
 100
 101 .k-player .lButton {
 102         cursor: pointer;
 103         float: left;
 104         list-style: none outside none;
 105         margin: 2px;
 106         padding: 0px 0;
 107         width: 24px;
 108         height: 16px;
 109         position: relative;
 110         background: none repeat scroll 0 0 transparent;
 111         border: medium none;
 112 }
 113
 114 .k-player .rButton {
 115         cursor: pointer;
 116         float: right;
 117         list-style: none outside none;
 118         margin: 2px;
 119         padding: 0px 0;
 120         width: 23px;
 121         height: 16px;
 122         position: relative;
 123         background: none repeat scroll 0 0 transparent;
 124         border: medium none;
 125 }
 126
 127 .k-player .k-options {
 128         border: 1px solid #AAAAAA !important;
 129         color: #555555;
 130         float: right;
 131         height: 22px;
 132         margin-top: -2px;
 133         margin-right: 0px;
 134         width: 50px;
 135         float: right;
 136         background: none repeat scroll 0 0 transparent;
 137         font-family: Lucida Grande, Lucida Sans, Arial, sans-serif;
 138         font-size: 11px;
 139         text-transform: uppercase;
 140 }
 141
 142 .k-player .k-options span {
 143         position: relative;
 144         top: 4px;
 145         left: 7px;
 146 }
 147
 148 .k-player .k-menu-screens {
 149         float: left;
 150         font-size: 11px;
 151         padding: 13px 10px 15px 15px;
 152         width: 320px;
 153 }
 154
 155 .k-player ul.k-menu-bar {
 156         background: url("images/ksprite.png") no-repeat scroll -99px -104px
 157                 transparent;
 158         bottom: 5px;
 159         height: 128px;
 160         list-style: none outside none;
 161         padding: 0 0 5px;
 162         position: absolute;
 163         right: 0;
 164 }
 165
 166 .k-player .k-menu {
 167         background: none repeat scroll 0 0 #181818;
 168         border: medium none;
 169         display: none;
 170         height: 300px;
 171         left: 0;
 172         opacity: 0.9;
 173         position: absolute;
 174         top: 0;
 175         width: 400px;
 176         z-index: 999;
 177 }
 178
 179 .k-player .k-menu-bar li a {
 180         background: url("images/ksprite.png") no-repeat scroll -51px -110px
 181                 transparent;
 182         display: block;
 183         height: 32px;
 184         margin-left: 1px;
 185         overflow: hidden;
 186         text-indent: 99999px;
 187         width: 49px;
 188 }
 189
 190 .k-menu-bar li a:hover {
 191         background-position: -1px -110px;
 192 }
 193
 194 .k-menu-bar li.k-download-btn a {
 195         background-position: -51px -203px;
 196 }
 197
 198 .k-menu-bar li.k-download-btn a:hover {
 199         background-position: -1px -203px;
 200 }
 201
 202 .k-menu-bar li.k-share-btn a {
 203         background-position: -51px -172px;
 204 }
 205
 206 .k-menu-bar li.k-share-btn a:hover {
 207         background-position: -1px -172px;
 208 }
 209
 210 .k-menu-bar li.k-credits-btn a {
 211         background-position: -51px -141px;
 212 }
 213
 214 .k-menu-bar li.k-credits-btn a:hover {
 215         background-position: -1px -141px;
 216 }
 217
 218 .k-menu-screens {
 219         width: 320px;
 220         padding: 13px 10px 15px 15px;
 221         float: left;
 222 }  /* w & h inline via jq */
 223 .k-menu-screens h2 {
 224         padding: 0 0 5px 1px;
 225         clear: both;
 226         font-size: 12px;
 227         color: #666;
 228 }
 229
 230 .k-menu-screens p {
 231         margin: 6px 0;
 232 }
 233
 234 .k-menu-screens a {;
 235
 236 }
 237
 238 .k-menu-screens a img {
 239         border: none;
 240 }
 241
 242 .k-menu-screens ul {
 243         padding: 0;
 244         margin: 6px 0 0;
 245         list-style: none outside none;
 246 }
 247
 248 .k-edit-screen {
 249         width: 370px;
 250         height: 223px;
 251         padding-top: 77px;
 252         text-align: center;
 253         background: #181818;
 254         color: #fff;
 255 }
 256
 257 .k-edit-screen div {
 258
 259 }
 260
 261 .k-edit-screen a {
 262         color: #7BB8FC;
 263 }
 264
 265 .k-edit-screen a img {
 266         border: none;
 267 }
 268
 269 .k-menu-screens {
 270         width: 320px;
 271         padding: 13px 10px 15px 15px;
 272         float: left;
 273 }  /* w & h inline via jq */
 274 .k-menu-screens h2 {
 275         padding: 0 0 5px 1px;
 276         clear: both;
 277         font-size: 12px;
 278         color: #666;
 279 }
 280
 281 .k-menu-screens p {
 282         margin: 6px 0;
 283 }
 284
 285 .k-menu-screens a {;
 286
 287 }
 288
 289 .k-menu-screens a img {
 290         border: none;
 291 }
 292
 293 .k-menu-screens ul {
 294         padding: 0;
 295         margin: 6px 0 0;
 296         list-style: none outside none;
 297 }
 298
 299 .k-menu-screens li {
 300         height: 14px;
 301         margin-bottom: 6px;
 302 }
 303
 304 .k-menu-screens li a {
 305         padding-left: 22px;
 306         background: url(images/ksprite.png) no-repeat -85px -274px;
 307         text-decoration: none;
 308 }
 309
 310 .k-menu-screens li a.active,.k-menu-screens li a:hover .active {
 311         background-position: -85px -247px;
 312 }
 313
 314 .k-menu-screens li a:hover {
 315         background-position: -85px -260px;
 316 }
 317
 318 .k-menu-screens a {
 319         color: #BBBBBB;
 320 }
 321
 322 .k-menu textarea {
 323         background: none repeat scroll 0 0 transparent;
 324         border-color: #000000 -moz-use-text-color -moz-use-text-color #000000;
 325         border-style: solid none none solid;
 326         border-width: 2px medium medium 2px;
 327         color: #CCCCCC;
 328         font: 11px arial, sans-serif;
 329         height: 15px;
 330         overflow: hidden;
 331         padding-left: 2px;
 332         width: 100%;
 333 }
 334
 335 .menu-screen.menu-share button {
 336         background: url("images/ksprite.png") no-repeat scroll 0 -81px #D4D4D4;
 337         border: 1px solid #000000;
 338         color: #000000;
 339         float: right;
 340         height: 24px;
 341         padding: 0 5px 3px;
 342         width: 84px;
 343         font-size: 1em;
 344 }
 345
 346 .k-player .menu-screen.menu-share div.ui-state-highlight {
 347         background: none repeat scroll 0 0 transparent;
 348         border-color: #554926;
 349         color: #FFE96E;
 350         float: left;
 351         padding: 2px 5px;
 352 }
 353
 354 .k-player .menu-screen.menu-share div.ui-state-highlight a {
 355         color: #FFE96E;
 356         font-weight: bold;
 357 }
 358
 359 .k-player .volume_control {
 360         margin-right: 0px;
 361         width: 16px;
 362 }
 363
 364 .k-player .volume_control span {
 365         margin-right: 0px;
 366 }
 367
 368 .k-player .volume-slider {
 369         width: 30px;
 370 }
 371
 372 .k-player .volume-slider .ui-slider-range {
 373         -moz-border-radius: 0 0 0 0;
 374         background: url("images/ksprite.png") repeat-x scroll -66px -306px
 375                 transparent;
 376         height: 17px;
 377         position: absolute;
 378 }
 379
 380 .k-player .volume-slider a.ui-slider-handle {
 381         background: none repeat scroll 0 0 transparent;
 382         border: medium none;
 383         display: block;
 384         height: 18px;
 385         margin: -3px 5px 0 -1px;
 386         position: absolute;
 387         width: 8px;
 388 }