player/css/player.css

   1 .eidogo-player-auto {
   2     text-indent: -9999px;
   3     font-size: 0;
   4 }
   5 .eidogo-player {
   6         width: 750px;
   7         position: relative;
   8     background: #222;
   9         padding: 5px;
  10     font-family: arial, helvetica, sans-serif;
  11     font-size: 11px;
  12         text-indent: 0;
  13         line-height: normal;
  14         font-weight: normal;
  15         color: #000;
  16         text-align: left;
  17 }
  18 .eidogo-player ul, .eidogo-player ol, .eidogo-player dl, .eidogo-player dd, .eidogo-player dt {
  19         margin: 0;
  20         padding: 0;
  21         list-style: none;
  22 }
  23 .eidogo-player input, .eidogo-player select {
  24     background: #fff;
  25     color: #000;
  26 }
  27 .eidogo-player .shade {
  28     position: absolute;
  29     top: 0;
  30     left: 0;
  31     width: 100%;
  32     height: 100%;
  33     background: #000;
  34     z-index: 9998;
  35     opacity: 0.55;
  36     filter: alpha(opacity=55);
  37     display: none;
  38 }
  39 .eidogo-player .controls-container {
  40         width: 325px;
  41         float: right;
  42         position: relative;
  43         padding: 5px 0 0 0;
  44     background: #466;
  45     color: #8aa;
  46     -webkit-user-select: none;
  47 }
  48 .eidogo-player .controls {
  49         height: 30px;
  50         text-indent: -9999px;
  51         font-size: 0;
  52         padding-left: 2px;
  53         -webkit-user-select: none;
  54 }
  55 .eidogo-player .controls .control {
  56         margin: 5px 0 5px 3px;
  57         user-select: none;
  58         -khtml-user-select: none;
  59         -webkit-user-select: none;
  60         -moz-user-select: none;
  61         cursor: default;
  62         width: 44px;
  63         height: 19px;
  64         float: left;
  65         padding: 0;
  66         background: url(../images/buttons.gif) no-repeat top left;
  67 }
  68 .eidogo-player .controls .back {
  69     background-position: 0 -30px;
  70 }
  71 .eidogo-player .controls .back-on {
  72     background-position: 0 -79px;
  73         cursor: pointer;
  74 }
  75 .eidogo-player .controls .forward {
  76     background-position: 0 -226px;
  77 }
  78 .eidogo-player .controls .forward-on {
  79     background-position: 0 -275px;
  80         cursor: pointer;
  81 }
  82 .eidogo-player .controls .first {
  83     background-position: 0 -128px;
  84 }
  85 .eidogo-player .controls .first-on {
  86     background-position: 0 -177px;
  87         cursor: pointer;
  88 }
  89 .eidogo-player .controls .last {
  90     background-position: 0 -324px;
  91 }
  92 .eidogo-player .controls .last-on {
  93     background-position: 0 -373px;
  94         cursor: pointer;
  95 }
  96 .eidogo-player .controls .pass {
  97         float: right;
  98     background-position: 0 -422px;
  99         margin-right: 5px;
 100         cursor: pointer;
 101 }
 102 .eidogo-player .controls .pass-on {
 103     background-position: 0 -471px;
 104         cursor: pointer;
 105 }
 106 .eidogo-player .move-number {
 107         position: absolute;
 108         top: 12px;
 109         left: 210px;
 110         color: #8aa;
 111 }
 112 .eidogo-player .permalink {
 113       text-decoration: underline;
 114       cursor: pointer;
 115 }
 116 .eidogo-player .nav-slider {
 117         clear: both;
 118         position: relative;
 119         height: 10px;
 120         width: 315px;
 121         margin: 0px 5px 5px 5px;
 122         border-top: 1px solid #122;
 123         background: #244;
 124 }
 125 .eidogo-player .nav-slider-thumb {
 126     position: absolute;
 127         width: 9px;
 128         height: 9px;
 129         background: #d11;
 130     border-bottom: 1px solid #800;
 131     border-right: 1px solid #800;
 132         cursor: pointer;
 133 }
 134 .eidogo-player .variations-container {
 135         width: 290px;
 136     min-height: 20px;
 137         padding: 10px 5px 0px 5px;
 138 }
 139 .eidogo-player .variations-label {
 140         float: left;
 141         padding: 0 5px 0 0;
 142         cursor: default;
 143 }
 144 .eidogo-player .variation-nav {
 145         float: left;
 146     background: #799;
 147     color: #b00;
 148         font-weight: bold;
 149         margin: 1px;
 150         position: relative;
 151         top: -3px;
 152         padding: 2px 5px 1px 5px;
 153         width: auto;
 154         height: 14px;
 155         cursor: pointer;
 156         user-select: none;
 157         -khtml-user-select: none;
 158         -moz-user-select: none;
 159 }
 160 .eidogo-player .variation-nav.none {
 161         font-weight: normal;
 162         width: auto;
 163     padding-right: 5px;
 164         color: #244;
 165         background: #688;
 166         cursor: default;
 167 }
 168 .eidogo-player .controls-stop {
 169     display: none;
 170 }
 171 .eidogo-player .tools-container {
 172     float: right;
 173     clear: right;
 174     background: #744;
 175     width: 315px;
 176     padding: 5px 5px 5px 5px;
 177     margin: 5px 0 0 0;
 178 }
 179 .eidogo-player .tools-label {
 180     float: left;
 181     padding: 5px 5px 0 0;
 182     color: #a88;
 183     cursor: default;
 184 }
 185 .eidogo-player .search-button, .eidogo-player .score-est-button {
 186     margin: 0 0 0 5px;
 187     color: #800;
 188     font-size: 11px;
 189     background: #b88;
 190     border: 1px solid #b88;
 191     cursor: pointer;
 192     font-weight: bold;
 193     display: none;
 194 }
 195 .eidogo-player .search-region {
 196     position: absolute;
 197     top: 0px;
 198     left: 0px;
 199     width: 133px;
 200     height: 133px;
 201     background-color: #80f;
 202     opacity: 0.30;
 203     filter: alpha(opacity=30);
 204     z-index: 9999;
 205     display: none;
 206 }
 207 .eidogo-player .tools-select, .eidogo-player .search-algo {
 208     font-size: 11px;
 209 }
 210 .eidogo-player .search-algo {
 211     margin: 0 0 0 4px;
 212     display: none;
 213 }
 214 .eidogo-player .comment-pass, .eidogo-player .comment-resign {
 215         color: #800;
 216         font-weight: bold;
 217         margin: 0 0 10px 0;
 218 }
 219 .eidogo-player .comment-status {
 220         color: #000;
 221         font-weight: bold;
 222         margin: 0 0 10px 0;
 223 }
 224 .eidogo-player .comment-info {
 225     color: #443;
 226     font-weight: bold;
 227     margin: 0 0 10px 0;
 228     padding: 5px;
 229     background: #aa9;
 230 }
 231 .eidogo-player .comment-info dl {
 232     padding-top: 5px;
 233     font-weight: normal;
 234 }
 235 .eidogo-player .comment-info dt {
 236     float: left;
 237     clear: left;
 238     width: 70px;
 239     padding: 0 0 3px 0;
 240 }
 241 .eidogo-player .comment-info dd {
 242     margin: 0 0 0 75px;
 243     padding: 0 0 3px 0;
 244 }
 245 .eidogo-player .comments {
 246         clear: right;
 247         float: right;
 248         width: 302px;
 249         height: 243px;
 250         font-size: 11px;
 251         margin: 5px 0 0 0;
 252         padding: 15px 10px 40px 10px;
 253         overflow: auto;
 254     background: #bba;
 255     border-left: 3px solid #998;
 256     border-top: 2px solid #998;
 257 }
 258 .eidogo-player .comments-edit {
 259     display: none;
 260     z-index: 9999;
 261 }
 262 .eidogo-player .comments-edit-ta {
 263     clear: right;
 264     float: right;
 265     width: 312px;
 266     height: 213px;
 267     font-size: 11px;
 268     font-family: arial, helvetica, sans-serif;
 269     padding: 15px 0px 40px 10px;
 270     margin: 0 5px 0 0;
 271     background: #eee;
 272     border-left: 3px solid #ccc;
 273     border-top: 2px solid #ccc;
 274     border-right: none;
 275     border-bottom: 1px solid #999;
 276 }
 277 .eidogo-player .comments-edit-done {
 278     clear: right;
 279     float: right;
 280     width: 311px;
 281     height: 16px;
 282     margin: 0 5px 0 0;
 283     padding: 5px;
 284     text-align: center;
 285     background: #ccc url(../images/done_bg.png) repeat-x;
 286     color: #222;
 287     border: 2px solid #999;
 288     border-top: 2px solid #fff;
 289     border-left: 2px solid #fff;
 290     cursor: pointer;
 291     font-weight: bold;
 292     font-size: 12px;
 293 }
 294 .eidogo-player .comments a {
 295     color: #008;
 296 }
 297 .eidogo-player .search-container {
 298         clear: right;
 299         float: right;
 300         width: 302px;
 301         height: 243px;
 302         font-size: 11px;
 303         margin: 5px 0 0 0;
 304         padding: 15px 10px 40px 10px;
 305         overflow: auto;
 306     background: #bbe;
 307     border-left: 3px solid #778;
 308     border-top: 2px solid #778;
 309     display: none;
 310 }
 311 .eidogo-player .search-container .search-count {
 312     font-size: 11px;
 313     padding: 0 0 5px 0;
 314     margin: 0 0 10px 0;
 315     border-bottom: 1px solid #778;
 316 }
 317 .eidogo-player .search-container .search-close {
 318     float: right;
 319     padding: 4px 7px;
 320     background: #aad;
 321     color: #008;
 322     cursor: pointer;
 323     margin-top: -10px;
 324     font-weight: bold;
 325 }
 326 .eidogo-player .search-container .search-count span {
 327     font-weight: bold;
 328 }
 329 .eidogo-player .search-container .search-result {
 330     display: block;
 331     text-decoration: none;
 332     color: #008;
 333     cursor: pointer;
 334 }
 335 .eidogo-player .search-container div.search-result {
 336     cursor: default;
 337     color: #000;
 338 }
 339 .eidogo-player .search-container a.search-result.odd {
 340     background: #aad;
 341 }
 342 .eidogo-player .search-container a.search-result:hover {
 343     color: #fff;
 344     background-color: #77c;
 345 }
 346 .eidogo-player .search-container .search-result span {
 347     display: inline;
 348     float: left;
 349     padding: 5px;
 350 }
 351 .eidogo-player .search-container .search-result .id, .eidogo-player .search-container .search-result .mv {
 352     display: none;
 353 }
 354 .eidogo-player .search-container .search-result .pw {
 355     width: 70px;
 356 }
 357 .eidogo-player .search-container .search-result .pb {
 358     width: 70px;
 359 }
 360 .eidogo-player .search-container .search-result .re {
 361     width: 30px;
 362 }
 363 .eidogo-player .search-container .search-result .dt {
 364     width: 60px;
 365 }
 366 .eidogo-player .search-container .search-result .clear {
 367     clear: both;
 368     font-size: 1px;
 369 }
 370 .eidogo-player .board-container {
 371     float: left;
 372         width: 421px;
 373         height: 421px;
 374     background: #654;
 375         user-select: none;
 376         -khtml-user-select: none;
 377         -moz-user-select: none;
 378 }
 379 .eidogo-player .board-container.shrunk, .eidogo-player .board-container.shrunk .board-gutter {
 380     width: auto;
 381     height: auto;
 382     padding: 0px !important;
 383     margin: 0px !important;
 384     background: none;
 385 }
 386 .eidogo-player .board-gutter {
 387     width: 371px;
 388         height: 371px;
 389         padding: 25px;
 390         background: #654;
 391         user-select: none;
 392         -khtml-user-select: none;
 393         -moz-user-select: none;
 394 }
 395 .eidogo-player .board-gutter.with-coords {
 396     background: #654 url(../images/board-bg-coords.png) no-repeat 5px 5px;
 397 }
 398 .eidogo-player .board.size9 {
 399         position: absolute;
 400         width: 181px;
 401         height: 181px;
 402         background: #888 url(../images/board-9.gif);
 403         margin: 90px 90px;
 404 }
 405 .eidogo-player .board.size13 {
 406         position: absolute;
 407         width: 257px;
 408         height: 257px;
 409         background: #888 url(../images/board-13.gif);
 410         margin: 57px 57px;
 411 }
 412 .eidogo-player .board.size19 {
 413         position: absolute;
 414         width: 371px;
 415         height: 371px;
 416         background: #E8C473 url(../images/board-19.gif);
 417 }
 418 .eidogo-player .board .point {
 419         position: absolute;
 420         width: 19px;
 421         height: 19px;
 422         z-index: 1;
 423 }
 424 .eidogo-player .board .point.stone.black {
 425         background: url(../images/b.png);
 426 }
 427 .eidogo-player .board .point.stone.white {
 428         background: url(../images/w.png);
 429 }
 430 .eidogo-player .board .point.marker {
 431         z-index: 2;
 432         width: 19px;
 433         height: 19px;
 434         background: url(../images/markers.gif) no-repeat top left;
 435 }
 436 .eidogo-player .board .point.marker.label {
 437         color: #f00;
 438         font-size: 12px;
 439         font-weight: bold;
 440         padding: 3px 0 0 5px;
 441         width: 14px;
 442         height: 16px;
 443         cursor: default;
 444         user-select: none;
 445         -khtml-user-select: none;
 446         -moz-user-select: none;
 447         background: none;
 448 }
 449 .eidogo-player .board .point.marker.variation {
 450         color: #831;
 451         background: #ee974c;
 452         font-size: 12px;
 453         font-weight: bold;
 454         margin: 1px;
 455         padding: 2px 5px 1px 5px;
 456         width: auto;
 457         height: 14px;
 458         cursor: pointer;
 459         user-select: none;
 460         -khtml-user-select: none;
 461         -moz-user-select: none;
 462         z-index: 3;
 463 }
 464 .eidogo-player .board .point.marker.current {
 465         background-position: 0 -79px;
 466 }
 467 .eidogo-player .board .point.marker.triangle {
 468         background-position: 0 -324px;
 469 }
 470 .eidogo-player .board .point.marker.square {
 471         background-position: 0 -177px;
 472 }
 473 .eidogo-player .board .point.marker.circle {
 474         background-position: 0 -30px;
 475 }
 476 .eidogo-player .board .point.marker.ex {
 477         background-position: 0 -128px;
 478 }
 479 .eidogo-player .board .point.marker.territory-white {
 480     background-position: 0 -275px;
 481 }
 482 .eidogo-player .board .point.marker.territory-black {
 483     background-position: 0 -226px;
 484 }
 485 .eidogo-player .board .point.marker.dim {
 486         background-image: url(../images/dim.png);
 487 }
 488 .eidogo-player .board-hover-move {
 489     position: absolute;
 490     width: 19px;
 491     height: 19px;
 492     z-index: 1;
 493     margin: -8px 0 0 -8px;
 494     opacity: 0.4;
 495     filter: alpha(opacity=40);
 496     display: none;
 497 }
 498 .eidogo-player .board-hover-move-b {
 499     background-image: url(../images/b.png);
 500 }
 501 .eidogo-player .board-hover-move-w {
 502     background-image: url(../images/w.png);
 503 }
 504 .eidogo-player .info {
 505     display: none;
 506     float: left;
 507         width: 421px;
 508         margin: 5px 0 0 0;
 509         padding: 5px 0 0 0;
 510         background: #333;
 511     color: #fff;
 512         font-size: 10px;
 513 }
 514 .eidogo-player .info .players {
 515         width: 401px;
 516         margin: 0px 10px;
 517         height: 50px;
 518         display: none;
 519 }
 520 .eidogo-player .info .players .player {
 521         width: 199px;
 522         float: left;
 523         padding-top: 5px;
 524         padding-right: 1px;
 525 }
 526 .eidogo-player .info .players .player.white .name {
 527         border-top: 1px solid #999;
 528     height: 11px;
 529         padding: 4px 3px 3px 20px;
 530         background: #555 url(../images/markers.gif) no-repeat top left;
 531     background-position: 0 -275px;
 532 }
 533 .eidogo-player .info .players .player.black .name {
 534         border-top: 1px solid #999;
 535     height: 11px;
 536         padding: 4px 3px 3px 20px;
 537         background: #555 url(../images/markers.gif) no-repeat top left;
 538     background-position: 0 -226px;
 539 }
 540 .eidogo-player .info .players .player .captures {
 541     float: left;
 542     width: 40%;
 543         padding: 3px 3px 5px 5px;
 544         color: #777;
 545         background: #222;
 546         font-size: 9px;
 547         margin: 0 0 10px 0;
 548 }
 549 .eidogo-player .info .players .player .captures span {
 550         color: #fff;
 551         padding-left: 2px;
 552 }
 553 .eidogo-player .info .players .player .time {
 554         padding: 3px 3px 5px 5px;
 555         color: #777;
 556         background: #222;
 557         font-size: 9px;
 558         margin: 0 0 10px 0;
 559 }
 560 .eidogo-player .info .players .player .time span {
 561         color: #fff;
 562         padding-left: 2px;
 563 }
 564 .eidogo-player .info .game dl {
 565         clear: both;
 566         padding: 5px 5px 10px 10px;
 567 }
 568 .eidogo-player .info .game dt {
 569         clear: left;
 570         width: 70px;
 571         float: left;
 572         padding: 0 0 3px 0;
 573 }
 574 .eidogo-player .info .game dd {
 575         padding: 0 0 3px 0;
 576         margin: 0 0 0 85px;
 577 }
 578 .eidogo-player .info a {
 579     color: #fff;
 580 }
 581 .eidogo-player .preferences {
 582         clear: right;
 583         float: right;
 584         width: 302px;
 585         font-size: 11px;
 586         margin: 15px 0 0 20px;
 587         overflow: auto;
 588     background: #222;
 589     color: #888;
 590     display: none;
 591 }
 592 .eidogo-player .options {
 593     display: none;
 594 }
 595 .eidogo-player .options a {
 596     float: left;
 597     display: block;
 598     width: 147px;
 599     padding: 7px 5px 7px 5px;
 600     margin: 5px 0 20px 5px;
 601     background: #181818;
 602     border: 1px solid #282828;
 603     text-align: center;
 604     color: #fff;
 605 }
 606 .eidogo-loading {
 607         position: absolute;
 608         width: 150px;
 609         height: 40px;
 610         top: 62px;
 611         left: 730px;
 612         padding: 0px 0 0 0px;
 613         color: #777;
 614         z-index: 9999;
 615     background: url(../images/loading.gif) no-repeat;
 616     text-indent: -9999px;
 617 }
 618 .eidogo-error {
 619         position: absolute;
 620         top: 130px;
 621         left: 150px;
 622         width: 350px;
 623         background: #933;
 624         border-right: 2px solid #622;
 625         border-bottom: 2px solid #622;
 626         margin: 20px auto 20px auto;
 627         padding: 20px;
 628         color: #fff;
 629         z-index: 9999;
 630 }
 631 .eidogo-player .footer {
 632     clear: both;
 633 }
 634 /****************************************************************************
 635  *  Compact Theme
 636 ****************************************************************************/
 637 .eidogo-player.theme-compact {
 638     width: 421px;
 639     padding: 0;
 640     background: #555;
 641     border: 1px solid #555;
 642 }
 643 .eidogo-player.theme-compact .board.size19 {
 644     background-image: url(../images/board-19-simple.gif) !important;
 645 }
 646 .eidogo-player.theme-compact .controls-container {
 647     width: 421px;
 648     border-top: 1px solid #244;
 649     padding-top: 0;
 650 }
 651 .eidogo-player.theme-compact .move-number {
 652     top: 9px;
 653 }
 654 .eidogo-player.theme-compact .nav-slider {
 655     width: 411px;
 656 }
 657 .eidogo-player.theme-compact .variations-container {
 658     display: none;
 659 }
 660 .eidogo-player.theme-compact .tools-container {
 661     border-top: 1px solid #333;
 662     width: 411px;
 663     background: #644;
 664     margin: 0;
 665 }
 666 .eidogo-player.theme-compact .comments {
 667     margin: 0;
 668     width: 401px;
 669     height: 50px;
 670     padding: 5px 10px;
 671     border: none;
 672     background: #ccb;
 673     border-top: 3px solid #aa9;
 674     overflow: auto;
 675     float: none;
 676 }
 677 .eidogo-player.theme-compact .comment-info {
 678     background: #bba;
 679 }
 680 .eidogo-player.theme-compact .comments-edit-ta {
 681     margin: 0 !important;
 682     width: 411px;
 683     height: 50px;
 684     padding: 5px 0 5px 10px;
 685     border: none;
 686     background: #eee;
 687     border-top: 3px solid #ddd;
 688     overflow: auto;
 689     float: none;
 690     font-size: 11px;
 691     font-family: arial, helvetica, sans-serif;
 692     border-bottom: 1px solid #999;
 693 }
 694 .eidogo-player.theme-compact .comments-edit-done {
 695     float: none;
 696     width: 411px;
 697     height: 16px;
 698     margin: 0 !important;
 699     padding: 5px;
 700     text-align: center;
 701     background: #ccc url(../images/done_bg.png) repeat-x;
 702     color: #222;
 703     border: 1px solid #555;
 704     border-top: 1px solid #fff !important;
 705     position: relative;
 706     left: -1px;
 707     cursor: pointer;
 708     font-weight: bold;
 709     font-size: 12px;
 710 }
 711 .eidogo-player.theme-compact .info {
 712     width: 421px;
 713     padding: 0;
 714     margin: 0;
 715 }
 716 .eidogo-player.theme-compact .info .players {
 717     padding: 0 !important;
 718     margin: 0 auto;
 719     width: 422px !important;
 720     height: auto;
 721 }
 722 .eidogo-player.theme-compact .info .player {
 723     padding-top: 0 !important;
 724     width: 210px !important;
 725 }
 726 .eidogo-player.theme-compact .info .player .captures, .eidogo-player.theme-compact .info .player .time {
 727     margin: 0 !important;
 728 }
 729 .eidogo-player.theme-compact .info .player .name {
 730     border-top: 1px solid #222 !important;
 731 }
 732 .eidogo-player.theme-compact .options {
 733     background: #333;
 734     border-top: 1px solid #555;
 735 }
 736 .eidogo-player.theme-compact .options-stop {
 737     clear: right;
 738 }
 739 .eidogo-player.theme-compact .options a {
 740     float: right;
 741     margin: 0;
 742     padding: 2px;
 743     border: none;
 744     color: #aaa;
 745     text-decoration: none;
 746     background: #444;
 747 }
 748 .eidogo-loading.theme-compact {
 749     background: none;
 750     width: 0;
 751     height: 0;
 752 }
 753 /****************************************************************************
 754  *  Problem Theme
 755 ****************************************************************************/
 756 .eidogo-player.theme-problem, .eidogo-player.theme-problem .board-container {
 757     padding: 0;
 758     margin: 0;
 759     border: none;
 760     float: none;
 761 }
 762 .eidogo-player.theme-problem {
 763     width: 150px;
 764     height: auto;
 765     padding: 1px;
 766     background: #666;
 767 }
 768 .eidogo-player.theme-problem .board-container {
 769     width: auto;
 770     height: auto;
 771     min-height: 50px;
 772     background: #555;
 773 }
 774 .eidogo-player.theme-problem .board.size19 {
 775     background-image: url(../images/board-19-simple.gif) !important;
 776 }
 777 .eidogo-player.theme-problem .controls-container {
 778     float: none;
 779     width: auto;
 780     background: #333;
 781     padding: 0;
 782 }
 783 .eidogo-player.theme-problem .controls {
 784     height: 19px;
 785     padding: 0;
 786 }
 787 .eidogo-player.theme-problem .control {
 788     margin: 0;
 789 }
 790 .eidogo-player.theme-problem .comments {
 791     float: none;
 792     margin: 0;
 793     background: #ccc;
 794     border: none;
 795     padding: 5px;
 796     width: auto;
 797     height: 35px;
 798 }
 799 .eidogo-player.theme-problem .controls .forward,
 800 .eidogo-player.theme-problem .controls .last, .eidogo-player.theme-problem .controls .pass,
 801 .eidogo-player.theme-problem .variations-container, .eidogo-player.theme-problem .nav-slider,
 802 .eidogo-player.theme-problem .move-number,  .eidogo-loading.theme-problem {
 803     display: none;
 804 }