css/tt-rss.less

   1 body.ttrss_main {
   2         background : white;
   3         color : black;
   4         font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
   5         font-size: 14px;
   6         overflow : hidden;
   7
   8         :focus {
   9                 outline: none;
  10         }
  11
  12         div.postReply {
  13                 padding : 0px;
  14
  15                 div.postHeader {
  16                         padding : 5px;
  17                         margin-right : 4px;
  18                         color : #909090;
  19                         border: 0px solid #ddd;
  20                         border-bottom-width: 1px;
  21
  22                         div.postDate {
  23                                 text-align : right;
  24                                 color : #909090;
  25                                 float : right;
  26                         }
  27
  28                         div {
  29                                 padding-bottom : 3px;
  30                         }
  31
  32                         span.author {
  33                                 color : @default-text;
  34                                 font-size : 11px;
  35                                 font-weight : normal;
  36                         }
  37                 }
  38
  39                 div.postTitle {
  40                         overflow : hidden;
  41                         text-overflow: ellipsis;
  42                         white-space : nowrap;
  43                         font-weight : 600;
  44                         text-rendering: optimizelegibility;
  45                         font-family : @fonts-ui-bold;
  46                 }
  47
  48                 div.postDate {
  49                         padding-left : 10px;
  50                 }
  51
  52                 div.postContent {
  53                         padding : 10px;
  54                         font-size : 16px;
  55
  56                         img,
  57                         video {
  58                                 border-width : 0px;
  59                                 max-width : 98%;
  60                                 height: auto;
  61                         }
  62
  63                         h1 {
  64                                 font-size : 16px;
  65                         }
  66
  67                         h2,
  68                         h3,
  69                         h4 {
  70                                 font-size : 15px;
  71                         }
  72
  73                         p {
  74                                 hyphens: auto;
  75                         }
  76
  77                         iframe {
  78                                 min-width : 50%;
  79                                 max-width : 98%;
  80                         }
  81                 }
  82
  83                 div.postEnclosures {
  84                         color : @default-text;
  85                 }
  86
  87                 img.tagsPic {
  88                         width : 16px;
  89                         height : 16px;
  90                         margin-left : 4px;
  91                         vertical-align : middle;
  92                 }
  93
  94                 span.author {
  95                         font-size : 12px;
  96                 }
  97         }
  98
  99         div.articleNote {
 100                 background-color : #fff7d5;
 101                 padding : 5px;
 102                 margin : 5px;
 103                 border: 1px solid #e7d796;
 104                 color : #9a8c59;
 105
 106                 div.noteEdit {
 107                         float : right;
 108                         cursor : pointer;
 109                 }
 110         }
 111
 112         h1 {
 113                 font-size : 18px;
 114                 font-weight : 600;
 115                 text-rendering: optimizelegibility;
 116                 font-family : @fonts-ui;
 117         }
 118
 119         h2 {
 120                 font-size : 16px;
 121                 font-weight : 600;
 122                 border: 0px solid @color-accent-light;
 123                 border-bottom-width: 1px;
 124                 text-rendering: optimizelegibility;
 125                 font-family : @fonts-ui;
 126         }
 127
 128         h3 {
 129                 font-size : 13px;
 130                 border: 0px solid @color-accent-light;
 131                 border-bottom-width: 1px;
 132                 font-weight : 600;
 133                 text-rendering: optimizelegibility;
 134                 font-family : @fonts-ui;
 135         }
 136
 137         h4 {
 138                 font-size : 14px;
 139                 font-weight : 600;
 140                 text-rendering: optimizelegibility;
 141                 font-family : @fonts-ui;
 142         }
 143
 144         hr {
 145                 border: 0px solid #ccc;
 146                 border-bottom-width: 1px;
 147         }
 148
 149         a {
 150                 color: @color-link;
 151                 text-decoration: none;
 152         }
 153
 154         a:hover {
 155                 color: darken(@color-link, 20%);
 156                 text-decoration: underline;
 157         }
 158
 159         #notify.visible {
 160                 transform: translate(0, -35px);
 161         }
 162
 163         #notify {
 164                 bottom : -35px;
 165                 right : 0px;
 166                 height : 20px;
 167                 left : 0px;
 168                 border-width : 1px 0px 0px 0px;
 169                 border-style : solid;
 170                 position : fixed;
 171                 font-size : 12px;
 172                 z-index : 99;
 173                 padding : 5px;
 174                 box-shadow : 0px -2px 2px rgba(0,0,0,0.1);
 175
 176                 transition: all 0.5s ease-in-out;
 177
 178                 img {
 179                         vertical-align : middle;
 180                         max-height : 14px;
 181                 }
 182
 183                 span.msg {
 184                         width : 100%;
 185                 }
 186
 187                 img.close {
 188                         cursor : pointer;
 189                 }
 190
 191                 span {
 192                         display : table-cell;
 193                         vertical-align : middle;
 194                         padding : 2px;
 195                 }
 196         }
 197
 198         .notify {
 199                 border-color : #d7c47a;
 200                 background-color : #fff7d5;
 201         }
 202
 203         .notify.notify_progress {
 204                 border-color : #d7c47a;
 205                 background-color : #fff7d5;
 206         }
 207
 208         .notify.notify_info {
 209                 border-color : @color-accent;
 210                 background-color : @color-accent-light;
 211         }
 212
 213         .notify.notify_error {
 214                 background-color : #ffcccc;
 215                 border-color : #ff0000;
 216         }
 217
 218         .hl {
 219                 border: 0px solid #ddd;
 220                 border-bottom-width: 1px;
 221                 padding : 1px;
 222
 223                 div.hlTitle {
 224                         display : table-cell;
 225                         cursor : pointer;
 226                         width : 100%;
 227                         vertical-align : middle;
 228                         overflow : hidden;
 229                         white-space : nowrap;
 230                         max-width : 500px;
 231                         text-overflow : ellipsis;
 232                         padding: 4px 6px;
 233                 }
 234
 235                 div.hlLeft {
 236                         display : table-cell;
 237                         vertical-align : middle;
 238                         white-space: nowrap;
 239                 }
 240
 241                 div.hlRight {
 242                         display : table-cell;
 243                         white-space: nowrap;
 244                         text-align : right;
 245                         vertical-align : middle;
 246                 }
 247
 248                 div.hlRight img {
 249                         max-width : 16px;
 250                         max-height : 16px;
 251                 }
 252
 253                 span.hlFeed {
 254                         display : table-cell;
 255                         vertical-align : middle;
 256                         text-align : right;
 257                 }
 258
 259                 span.hlFeed a {
 260                         border-radius : 4px;
 261                         display : inline-block;
 262                         padding : 1px 4px 1px 4px;
 263                         font-size : 11px;
 264                         font-style : italic;
 265                         font-weight : normal;
 266                         color : @default-text;
 267                         white-space : nowrap;
 268                 }
 269
 270                 span.hlFeed a:hover {
 271                         color : @color-accent;
 272                 }
 273
 274                 span.hlUpdated {
 275                         color : @default-text;
 276                         display : table-cell;
 277                         vertical-align : middle;
 278                         text-align : right;
 279                         font-size : 11px;
 280                         white-space : nowrap;
 281                         padding-left : 10px;
 282                 }
 283
 284                 span.hlUpdated div {
 285                         display : inline-block;
 286                 }
 287
 288                 div.hlLeft {
 289                         padding-left : 8px;
 290                 }
 291
 292                 div.hlLeft input {
 293                         margin-left : 4px;
 294                         margin-right : 4px;
 295                 }
 296
 297                 div.hlLeft img, div.hlRight img {
 298                         margin : 0px 4px;
 299                 }
 300
 301                 div.hlLeft img {
 302                         width : 16px;
 303                         height : 16px;
 304                 }
 305
 306                 div.hlTitle a {
 307                         font-weight : 600;
 308                         text-rendering: optimizelegibility;
 309                         font-family : @fonts-ui;
 310                         color : #777;
 311                 }
 312
 313                 a.title.high, span.hlContent.high .contentPreview {
 314                         color : #00aa00;
 315                 }
 316         }
 317
 318         .hl.Unread a.title.high, .hl.Unread span.hlContent.high .contentPreview {
 319                 color : #00dd00;
 320         }
 321
 322         .hl a.title.low, span.hlContent.low .contentPreview,
 323         .hl.Unread a.title.low, .hl.Unread span.hlContent.low .contentPreview {
 324                 color : #909090;
 325                 text-decoration : line-through;
 326         }
 327
 328         .hl.Unread div.hlTitle a {
 329                 color : black;
 330         }
 331
 332         .hl.active div.hlTitle a {
 333                 color : @color-accent;
 334                 /* text-shadow : 1px 1px 2px #fff; */
 335         }
 336         .hl.active,
 337         .hl.Selected {
 338                 color : white;
 339                 background : @color-accent ! important;
 340
 341                 a,
 342                 .hlFeed a,
 343                 .hlContent a.title,
 344                 span {
 345                         color : white;
 346                 }
 347         }
 348
 349         .hl.Grayed {
 350                 color : #909090;
 351         }
 352
 353         div.filterTestHolder {
 354                 height : 300px;
 355                 overflow : auto;
 356                 border-color : #ddd;
 357                 border-style : solid;
 358                 margin : 0px 0px 5px 0px;
 359                 border-width : 1px;
 360         }
 361
 362         #content-insert blockquote,
 363         #headlines-frame blockquote,
 364         .dijitContentPane blockquote {
 365                 margin : 5px 0px 5px 0px;
 366                 color : @default-text;
 367                 padding-left : 10px;
 368                 border: 0px solid #ccc;
 369                 border-left-width: 4px;
 370         }
 371
 372         #content-insert code,
 373         #headlines-frame code,
 374         .dijitContentPane code {
 375                 color : #009900;
 376                 font-family : monospace;
 377                 font-size : 12px;
 378         }
 379
 380         #content-insert pre,
 381         #headlines-frame pre,
 382         .dijitContentPane pre {
 383                 margin: 5px 0px 5px 0px;
 384                 padding: 10px;
 385                 color: @default-text;
 386                 font-family: monospace;
 387                 font-size: 12px;
 388                 border: 0px solid #ccc;
 389                 background: #f5f5f5;
 390                 display: block;
 391                 max-width: 98%;
 392                 overflow: auto;
 393         }
 394
 395         .alert {
 396                 padding: 8px 35px 8px 14px;
 397                 margin-bottom: 10px;
 398                 text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
 399                 background-color: #fcf8e3;
 400                 border: 1px solid #fbeed5;
 401                 border-radius: 4px;
 402         }
 403
 404         .alert,
 405         .alert h4 {
 406                 color: #c09853;
 407         }
 408
 409         .alert h4 {
 410                 margin: 0;
 411         }
 412
 413         .alert .close {
 414                 position: relative;
 415                 top: -2px;
 416                 right: -21px;
 417                 line-height: 20px;
 418                 cursor : pointer;
 419         }
 420
 421         .alert-success {
 422                 color: #468847;
 423                 background-color: #dff0d8;
 424                 border-color: #d6e9c6;
 425         }
 426
 427         .alert-success h4 {
 428                 color: #468847;
 429         }
 430
 431         .alert-danger,
 432         .alert-error {
 433                 color: #b94a48;
 434                 background-color: #f2dede;
 435                 border-color: #eed3d7;
 436         }
 437
 438         .alert-danger h4,
 439         .alert-error h4 {
 440                 color: #b94a48;
 441         }
 442
 443         .alert-info {
 444                 color: #3a87ad;
 445                 background-color: #d9edf7;
 446                 border-color: #bce8f1;
 447         }
 448
 449         .alert-info h4 {
 450                 color: #3a87ad;
 451         }
 452
 453         ul.nomarks {
 454                 list-style-type : none;
 455                 margin : 0px;
 456                 padding : 10px;
 457         }
 458
 459         div.prefHelp {
 460                 color : @default-text;
 461                 padding : 5px;
 462         }
 463
 464         .insensitive {
 465                 color : @default-text;
 466         }
 467
 468         .small {
 469                 font-size : 11px;
 470         }
 471
 472         #main-toolbar {
 473
 474                 > * {
 475                         white-space : nowrap;
 476                         display : table-cell;
 477                         color : #999;
 478                         overflow : hidden;
 479                 }
 480
 481                 > *,
 482                 table *,
 483                 .actionChooser * {
 484                         text-rendering: optimizelegibility;
 485                         font-family : @fonts-ui;
 486                         font-size : 12px;
 487
 488                 }
 489
 490                 #headlines-toolbar {
 491                         padding-right : 4px;
 492                         width : 100%;
 493
 494                         span.holder {
 495                                 display : table;
 496                                 width : 100%;
 497                         }
 498
 499                         span.holder > * {
 500                                 display : table-cell;
 501                         }
 502
 503                         .main {
 504                                 text-align : right;
 505                         }
 506
 507                         .main,
 508                         .r {
 509                                 line-height : 24px;
 510                         }
 511
 512                         span.r img {
 513                                 margin-right : 4px;
 514                                 position : relative;
 515                                 top : 3px;
 516                         }
 517
 518                         span.r .error a {
 519                                 color : red;
 520                         }
 521
 522                 }
 523
 524                 #selected_prompt {
 525                         font-style : italic;
 526                         text-align : right;
 527                         margin-right : 4px;
 528                 }
 529
 530                 @media (max-width: 992px) {
 531                         #selected_prompt {
 532                                 display : none;
 533                         }
 534                 }
 535         }
 536
 537
 538         span.contentPreview {
 539                 color : #999;
 540                 font-weight : normal;
 541                 font-size : 12px;
 542                 padding-left : 4px;
 543         }
 544
 545         span.hlLabelRef {
 546                 background-color : #fff7d5;
 547                 font-size : 8px;
 548                 color : #063064;
 549                 font-weight : normal;
 550                 margin-left : 2px;
 551                 padding : 1px 4px 1px 4px;
 552                 display : inline-block;
 553                 vertical-align : middle;
 554                 white-space: nowrap;
 555                 border-radius : 4px;
 556         }
 557
 558         img.markedPic, img.pubPic {
 559                 cursor : pointer;
 560                 vertical-align : middle;
 561                 opacity : 0.5;
 562                 transition : opacity 0.25s;
 563         }
 564
 565         img.markedPic:hover, img.pubPic:hover {
 566                 opacity : 1;
 567         }
 568
 569         img[src*='pub_set.png'], img[src*='mark_set.png'] {
 570                 opacity : 1;
 571         }
 572
 573         div.tagCloudContainer {
 574                 border : 1px solid #ddd;
 575                 margin : 5px 0px 5px 0px;
 576                 padding : 5px;
 577                 text-align : center;
 578         }
 579
 580         div.errorExplained {
 581                 border : 1px solid #ddd;
 582                 margin : 5px 0px 5px 0px;
 583                 padding : 5px;
 584         }
 585
 586         ul.feedErrorsList {
 587                 max-height : 300px;
 588                 overflow : auto;
 589                 list-style-type : none;
 590                 border : 1px solid #ddd;
 591                 margin : 0px 0px 5px 0px;
 592                 padding : 5px;
 593
 594                 em {
 595                         color : @default-text;
 596                 }
 597         }
 598
 599
 600         ul.browseFeedList {
 601                 height : 300px;
 602                 overflow : auto;
 603                 border-width : 0px 1px 1px 1px;
 604                 border-color : #ddd;
 605                 border-style : solid;
 606                 margin : 0px 0px 5px 0px;
 607                 background-color : white;
 608                 list-style-type : none;
 609                 padding : 0px;
 610
 611                 li {
 612                         margin : 0px;
 613                         padding : 2px 4px 2px 4px;
 614                 }
 615         }
 616
 617
 618         .browseFeedList span.subscribers {
 619                 color : #808080;
 620         }
 621
 622         ul.compact {
 623                 list-style-type : none;
 624                 margin : 0px;
 625                 padding : 0px;
 626
 627                 li {
 628                         margin : 0px;
 629                         padding : 0px;
 630                 }
 631         }
 632
 633         .noborder {
 634                 border-width : 0px;
 635         }
 636
 637         #overlay {
 638                 background : white;
 639                 left : 0;
 640                 top : 0;
 641                 height : 100%;
 642                 width : 100%;
 643                 z-index : 100;
 644                 position : absolute;
 645         }
 646
 647         #overlay_inner {
 648                 font-weight : bold;
 649                 margin : 1em;
 650         }
 651
 652         form {
 653                 margin : 0px;
 654                 padding : 0px;
 655         }
 656
 657         div.loadingPrompt {
 658                 padding : 1em;
 659                 text-align : center;
 660                 font-weight : bold;
 661         }
 662
 663         div.whiteBox {
 664                 margin-left : 1px;
 665                 text-align : center;
 666                 padding : 1em 1em 0px 1em;
 667                 font-size : 11px;
 668                 border: 0px solid #ddd;
 669                 border-bottom-width: 1px;
 670         }
 671
 672         div.autocomplete {
 673                 position : absolute;
 674                 width : 250px;
 675                 background-color : white;
 676                 border :1px solid #778899;
 677                 margin : 0px;
 678                 padding : 0px;
 679
 680                 ul {
 681                         list-style-type : none;
 682                         margin : 0px;
 683                         padding : 0px;
 684                 }
 685
 686                 ul li.selected {
 687                         background-color : #fff7d5;
 688                 }
 689
 690                 ul li {
 691                         list-style-type : none;
 692                         display : block;
 693                         margin : 0;
 694                         padding : 2px;
 695                         height : 32px;
 696                         cursor : pointer;
 697                 }
 698         }
 699
 700
 701         div#headlines-frame.wide .hlTitle {
 702                 max-width : none;
 703                 overflow : visible;
 704                 white-space : normal;
 705         }
 706
 707         div#headlines-frame.wide .hl .hlFeed {
 708                 display : none;
 709         }
 710
 711         img.hlScorePic {
 712                 vertical-align : middle;
 713                 width : 16px;
 714                 height : 16px;
 715         }
 716
 717         div.dlgSec {
 718                 font-size : 12px;
 719                 color : @default-text;
 720                 font-weight : bold;
 721                 clear : both;
 722                 height : 20px;
 723         }
 724
 725         div.dlgSecCont {
 726                 position : relative;
 727                 left : 150px;
 728                 top : -20px;
 729                 float : left;
 730                 font-size : 12px;
 731                 font-weight : normal;
 732
 733                 > * {
 734                         position : relative;
 735                         top : -2px;
 736                 }
 737         }
 738
 739         div.dlgSecCont hr, div.dlgSecSimple hr {
 740                 height : 0px;
 741                 line-height : 0px;
 742                 border : 0px solid transparent;
 743                 margin : 2px;
 744         }
 745
 746         div.dlgButtons {
 747                 text-align : right;
 748                 clear : both;
 749         }
 750
 751         span.labelColorIndicator {
 752                 height : 16px;
 753                 width : 16px;
 754                 border-radius : 4px;
 755                 line-height : 14px;
 756                 vertical-align : middle;
 757                 font-size : 9px;
 758                 display : inline-block;
 759                 border : 1px solid #ccc;
 760                 background-color : #fff7d5;
 761                 color : #063064;
 762                 text-align : center;
 763         }
 764
 765         div#cmdline {
 766                 position : absolute;
 767                 left : 5px;
 768                 bottom : 5px;
 769                 font-size : 11px;
 770                 color : @default-text;
 771                 font-weight : bold;
 772                 background-color : white;
 773                 border : 1px solid @color-accent;
 774                 padding : 3px 5px 3px 5px;
 775                 z-index : 5;
 776         }
 777
 778         #feed_browser_spinner {
 779                 vertical-align : middle;
 780                 height : 18px;
 781                 width : 18px;
 782         }
 783
 784         div.fatalError {
 785                 margin-bottom : 10px;
 786
 787                 button {
 788                         margin-top : 5px;
 789                 }
 790
 791                 textarea {
 792                         width : 565px;
 793                         height : 200px;
 794                 }
 795         }
 796
 797         #header-wrap {
 798                 border-width : 0px;
 799                 margin : 0px;
 800                 padding : 0px;
 801         }
 802
 803         #content-wrap {
 804                 padding : 0px;
 805                 border-width : 0px;
 806                 margin : 0px;
 807         }
 808
 809         #feeds-holder {
 810                 padding : 0px;
 811                 border: 0px solid #ddd;
 812                 overflow : hidden;
 813                 background : #f5f5f5;
 814                 box-shadow : inset -1px 0px 2px -1px rgba(0,0,0,0.1);
 815                 -webkit-overflow-scrolling : touch;
 816
 817                 #feedTree .dijitTreeRow .dijitTreeLabel.Unread {
 818                         font-weight : bold;
 819                 }
 820
 821                 #feedTree .dijitTreeRow.Error .dijitTreeLabel {
 822                         color : red;
 823                 }
 824
 825                 #feedTree.dijitTree .dijitTreeNode .dijitTreeRowSelected {
 826                         box-shadow : -1px 0px 2px -1px rgba(0,0,0,0.1);
 827                         border-right-color : white;
 828                 }
 829
 830                 #feedTree.dijitTree .dijitTreeContainer {
 831                         max-width : 100%;
 832                 }
 833
 834                 #feedTree.dijitTree .dijitTreeRow {
 835                         overflow: hidden;
 836                         text-overflow: ellipsis;
 837                 }
 838
 839                 #feedTree.dijitTree .dijitTreeNode .dijitTreeRow {
 840                         padding : 4px 0px 4px;
 841                         border-width : 1px;
 842                         color : #333;
 843                 }
 844
 845                 #feedTree.dijitTree img.tinyFeedIcon {
 846                         position : relative;
 847                         top : -2px;
 848                 }
 849
 850                 #feedTree {
 851                         height : 100%;
 852                         overflow-x : hidden;
 853                         text-rendering: optimizelegibility;
 854                         font-family : @fonts-ui;
 855
 856                         .counterNode.aux {
 857                                 background : #f0f0f0;
 858                                 color : #999;
 859                                 border-color : #f0f0f0;
 860                         }
 861
 862                         .counterNode {
 863                                 font-weight : bold;
 864                                 display : inline-block;
 865                                 font-size : 9px;
 866                                 text-align : center;
 867                                 border : 1px solid lighten(@color-accent, 5%);;
 868                                 color : white;
 869                                 background : lighten(@color-accent, 5%);
 870                                 border-radius : 4px;
 871                                 vertical-align : middle;
 872                                 float : right;
 873                                 position : relative;
 874                                 line-height : 14px;
 875                                 margin-right : 8px;
 876                                 margin-top : 2px;
 877                                 min-width : 23px;
 878                                 height : 14px;
 879                         }
 880
 881                         .dijitTreeNode .loadingExpando {
 882                                 left : -3px;
 883                                 height : 22px;
 884                                 position : relative;
 885                                 top : -3px;
 886                         }
 887
 888                 }
 889         }
 890
 891         #headlines-wrap-inner {
 892                 padding : 0px;
 893                 margin : 0px;
 894                 border-width : 0px;
 895         }
 896
 897         #headlines-frame {
 898                 padding : 0px;
 899                 border: 0px #ddd;
 900                 margin-top : 0px;
 901                 -webkit-overflow-scrolling : touch;
 902                 -webkit-transform: translateZ(0);
 903                 -webkit-backface-visibility: hidden;
 904         }
 905
 906         #headlines-toolbar_splitter, #toolbar_splitter {
 907                 display : none;
 908         }
 909
 910         #toolbar {
 911                 padding : 0px;
 912                 margin : 0px;
 913                 border-width : 0px;
 914                 white-space: nowrap;
 915                 font-size : 12px;
 916         }
 917
 918         #main-toolbar {
 919                 background : white;
 920                 border: 0px solid #ddd;
 921                 border-bottom-width: 1px;
 922                 padding-left : 4px;
 923                 height : 26px;
 924
 925         }
 926
 927         #header {
 928                 border-width : 0px;
 929                 text-align : right;
 930                 color : @default-text;
 931                 padding : 5px 5px 0px 0px;
 932                 margin : 0px;
 933                 position : absolute;
 934                 right : 0px;
 935                 top : 0px;
 936                 z-index : 5;
 937         }
 938
 939         #footer {
 940                 text-align : center;
 941                 color : @default-text;
 942                 padding : 4px 4px 8px 4px;
 943                 border-width : 0px;
 944         }
 945
 946         #content-insert {
 947                 padding : 0px;
 948                 border-color : #ddd;
 949                 border-width : 0px;
 950                 line-height: 1.5;
 951                 font-size : 15px;
 952                 overflow : auto;
 953                 -webkit-overflow-scrolling : touch;
 954         }
 955
 956         img.feedIcon, img.tinyFeedIcon {
 957                 width : 16px;
 958                 height : 16px;
 959                 line-height : 16px;
 960                 vertical-align : middle;
 961                 display : inline-block;
 962         }
 963
 964         .player {
 965                 display : inline-block;
 966                 color : @default-text;
 967                 font-size : 11px;
 968                 font-family : sans-serif;
 969                 border : 1px solid @default-text;
 970                 padding : 0px 4px 0px 4px;
 971                 margin : 0px 2px 0px 2px;
 972                 width : 50px;
 973                 text-align : center;
 974                 background : white;
 975         }
 976
 977         .player.playing {
 978                 color : #00c000;
 979                 border-color : #00c000;
 980         }
 981
 982         .player:hover {
 983                 background : #f0f0f0;
 984                 cursor : pointer;
 985         }
 986
 987         #headlines-spacer {
 988                 height : 100%;
 989                 margin-left : 1px;
 990                 text-align : center;
 991                 color : @default-text;
 992                 font-size : 11px;
 993                 font-style : italic;
 994
 995                 a, span {
 996                         color : @default-text;
 997                         padding : 10px;
 998                         display : block;
 999                 }
1000
1001                 a:hover {
1002                         color : @color-accent;
1003                 }
1004         }
1005
1006         ul#filterDlg_Matches, ul#filterDlg_Actions {
1007                 max-height : 100px;
1008                 overflow : auto;
1009                 list-style-type : none;
1010                 border-style : solid;
1011                 border-color : #ddd;
1012                 border-width : 0px 1px 1px 1px;
1013                 background-color : white;
1014                 margin : 0px 0px 5px 0px;
1015                 padding : 0px;
1016         }
1017
1018         ul#filterDlg_Matches li, ul#filterDlg_Actions li {
1019                 cursor : pointer;
1020                 padding : 0px 0px 0px 5px;
1021         }
1022
1023         ul.helpKbList {
1024                 max-height : 300px;
1025                 overflow : auto;
1026                 list-style-type : none;
1027                 border : 1px solid #ddd;
1028                 margin : 0px 0px 5px 0px;
1029                 padding : 5px;
1030
1031                 span.hksequence {
1032                         width : 6em;
1033                         margin-left : 20px;
1034                         color : @color-accent;
1035                         font-weight : bold;
1036                         display : inline-block;
1037                 }
1038
1039                 h2 {
1040                         margin-top : 0px;
1041                 }
1042         }
1043
1044         span.collapseBtn {
1045                 cursor : pointer;
1046
1047                 img {
1048                         vertical-align : middle;
1049                 }
1050         }
1051
1052         select.attachments {
1053                 display : block;
1054                 margin-top : 10px;
1055                 max-width : 120px;
1056         }
1057
1058         #selected_prompt {
1059                 margin-right : 25px;
1060                 vertical-align  : middle;
1061         }
1062
1063         #filterDlg_feeds select {
1064                 height : 150px;
1065                 width : 410px;
1066         }
1067
1068         ul#filterDlg_Matches li div.dijitCheckBox, ul#filterDlg_Actions li div.dijitCheckBox {
1069                 margin-right : 5px;
1070         }
1071
1072         span.highlight {
1073                 background-color : #ffff00;
1074                 color : #cc90cc;
1075         }
1076
1077         div.enclosure_title {
1078
1079         }
1080
1081         #headlines-frame .dijitCheckBox {
1082                 border-width : 0px;
1083                 opacity : 0.5;
1084         }
1085
1086         #headlines-frame .dijitCheckBoxHover,
1087         #headlines-frame .dijitCheckBoxChecked {
1088                 opacity : 1;
1089         }
1090
1091         #feedTree .dijitTreeRow img.dijitTreeExpandoLeaf {
1092                 width : 16px;
1093                 height : 16px;
1094                 vertical-align : middle;
1095                 position : relative;
1096         }
1097
1098         .dijitDropDownButton.attachments .dijitButtonText {
1099                 font-size : 12px;
1100         }
1101
1102         .dijitDropDownButton.attachments {
1103                 display : inline-block;
1104         }
1105
1106         #editTagsDlg{
1107                 overflow: visible;
1108         }
1109
1110         #feedEditDlg img.feedIcon {
1111                 border : 1px solid #ccc;
1112                 padding : 5px;
1113                 margin : 5px;
1114                 max-width : 20px;
1115                 max-height : 20px;
1116                 height : auto;
1117                 width : auto;
1118         }
1119 }
1120
1121 body.ttrss_login {
1122         padding : 2em;
1123         font-size : 14px;
1124
1125         fieldset {
1126                 margin-left : auto;
1127                 margin-right : auto;
1128                 display : block;
1129                 width : 400px;
1130                 border-width : 0px;
1131         }
1132
1133         label {
1134                 width : 120px;
1135                 margin-right : 20px;
1136                 display : inline-block;
1137                 text-align : right;
1138                 color : gray;
1139         }
1140
1141         div.header {
1142                 border: 0px solid @color-accent;
1143                 border-bottom-width: 1px;
1144                 margin-bottom : 1em;
1145                 padding-bottom : 5px;
1146         }
1147
1148         div.footer {
1149                 margin-top : 1em;
1150                 padding-top : 5px;
1151                 border: 0px solid @color-accent;
1152                 border-top-width: 1px;
1153                 text-align : center;
1154                 color : gray;
1155                 font-size : 12px;
1156         }
1157
1158         a.forgotpass {
1159                 text-align : right;
1160                 font-size : 11px;
1161                 display : inline-block;
1162         }
1163
1164         a {
1165                 color: @color-accent;
1166                 text-decoration: none;
1167         }
1168
1169         a:hover,
1170         a:focus {
1171                 color: @color-accent;
1172                 text-decoration: underline;
1173         }
1174
1175         div.footer a {
1176                 color : gray;
1177         }
1178
1179         div.footer a:hover {
1180                 color : @color-accent;
1181         }
1182
1183         div.row {
1184                 padding : 0px 0px 5px 0px;
1185         }
1186
1187         div.row-error {
1188                 color : red;
1189                 text-align : center;
1190                 padding : 0px 0px 5px 0px;
1191         }
1192 }
1193
1194 ::selection {
1195         background : @color-accent;
1196         color : white;
1197 }