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                         color : #909090;
  18                         border: 0px solid #ddd;
  19                         border-bottom-width: 1px;
  20                         background: #f0f0f0;
  21
  22                         div.postDate {
  23                                 text-align : right;
  24                                 float : right;
  25                         }
  26
  27                         div {
  28                                 padding-bottom : 3px;
  29                         }
  30
  31                         span.author {
  32                                 color : @default-text;
  33                                 font-size : 11px;
  34                                 font-weight : normal;
  35                         }
  36                 }
  37
  38                 div.postTitle {
  39                         overflow : hidden;
  40                         font-size : 15px;
  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
 337         .hl.active {
 338                 background : @color-accent ! important;
 339         }
 340
 341         .hl.active,
 342         .hl.Selected {
 343                 color : white;
 344                 background : desaturate(@color-accent, 50%);
 345
 346                 a,
 347                 .hlFeed a,
 348                 .hlContent a.title,
 349                 span {
 350                         color : white;
 351                 }
 352         }
 353
 354         .hl.Grayed {
 355                 color : #909090;
 356         }
 357
 358         div.filterTestHolder {
 359                 height : 300px;
 360                 overflow : auto;
 361                 border-color : #ddd;
 362                 border-style : solid;
 363                 margin : 0px 0px 5px 0px;
 364                 border-width : 1px;
 365         }
 366
 367         #content-insert blockquote,
 368         #headlines-frame blockquote,
 369         .dijitContentPane blockquote {
 370                 margin : 5px 0px 5px 0px;
 371                 color : @default-text;
 372                 padding-left : 10px;
 373                 border: 0px solid #ccc;
 374                 border-left-width: 4px;
 375         }
 376
 377         #content-insert code,
 378         #headlines-frame code,
 379         .dijitContentPane code {
 380                 color : #009900;
 381                 font-family : monospace;
 382                 font-size : 12px;
 383         }
 384
 385         #content-insert pre,
 386         #headlines-frame pre,
 387         .dijitContentPane pre {
 388                 margin: 5px 0px 5px 0px;
 389                 padding: 10px;
 390                 color: @default-text;
 391                 font-family: monospace;
 392                 font-size: 12px;
 393                 border: 0px solid #ccc;
 394                 background: #f5f5f5;
 395                 display: block;
 396                 max-width: 98%;
 397                 overflow: auto;
 398         }
 399
 400         .alert {
 401                 padding: 8px 35px 8px 14px;
 402                 margin-bottom: 10px;
 403                 text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
 404                 background-color: #fcf8e3;
 405                 border: 1px solid #fbeed5;
 406                 border-radius: 4px;
 407         }
 408
 409         .alert,
 410         .alert h4 {
 411                 color: #c09853;
 412         }
 413
 414         .alert h4 {
 415                 margin: 0;
 416         }
 417
 418         .alert .close {
 419                 position: relative;
 420                 top: -2px;
 421                 right: -21px;
 422                 line-height: 20px;
 423                 cursor : pointer;
 424         }
 425
 426         .alert-success {
 427                 color: #468847;
 428                 background-color: #dff0d8;
 429                 border-color: #d6e9c6;
 430         }
 431
 432         .alert-success h4 {
 433                 color: #468847;
 434         }
 435
 436         .alert-danger,
 437         .alert-error {
 438                 color: #b94a48;
 439                 background-color: #f2dede;
 440                 border-color: #eed3d7;
 441         }
 442
 443         .alert-danger h4,
 444         .alert-error h4 {
 445                 color: #b94a48;
 446         }
 447
 448         .alert-info {
 449                 color: #3a87ad;
 450                 background-color: #d9edf7;
 451                 border-color: #bce8f1;
 452         }
 453
 454         .alert-info h4 {
 455                 color: #3a87ad;
 456         }
 457
 458         ul.nomarks {
 459                 list-style-type : none;
 460                 margin : 0px;
 461                 padding : 10px;
 462         }
 463
 464         div.prefHelp {
 465                 color : @default-text;
 466                 padding : 5px;
 467         }
 468
 469         .insensitive {
 470                 color : @default-text;
 471         }
 472
 473         .small {
 474                 font-size : 11px;
 475         }
 476
 477         #main-toolbar {
 478
 479                 > * {
 480                         white-space : nowrap;
 481                         display : table-cell;
 482                         color : #999;
 483                         overflow : hidden;
 484                 }
 485
 486                 > *,
 487                 table *,
 488                 .actionChooser * {
 489                         text-rendering: optimizelegibility;
 490                         font-family : @fonts-ui;
 491                         font-size : 12px;
 492
 493                 }
 494
 495                 #headlines-toolbar {
 496                         padding-right : 4px;
 497                         width : 100%;
 498
 499                         span.holder {
 500                                 display : table;
 501                                 width : 100%;
 502                         }
 503
 504                         span.holder > * {
 505                                 display : table-cell;
 506                         }
 507
 508                         .main {
 509                                 text-align : right;
 510                         }
 511
 512                         .main,
 513                         .r {
 514                                 line-height : 24px;
 515                         }
 516
 517                         span.r img {
 518                                 margin-right : 4px;
 519                                 position : relative;
 520                                 top : 3px;
 521                         }
 522
 523                         span.r .error a {
 524                                 color : red;
 525                         }
 526
 527                 }
 528
 529                 #selected_prompt {
 530                         font-style : italic;
 531                         text-align : right;
 532                         margin-right : 4px;
 533                 }
 534
 535                 @media (max-width: 992px) {
 536                         #selected_prompt {
 537                                 display : none;
 538                         }
 539                 }
 540         }
 541
 542
 543         span.contentPreview {
 544                 color : #999;
 545                 font-weight : normal;
 546                 font-size : 12px;
 547                 padding-left : 4px;
 548         }
 549
 550         span.hlLabelRef {
 551                 background-color : #fff7d5;
 552                 font-size : 8px;
 553                 color : #063064;
 554                 font-weight : normal;
 555                 margin-left : 2px;
 556                 padding : 1px 4px 1px 4px;
 557                 display : inline-block;
 558                 vertical-align : middle;
 559                 white-space: nowrap;
 560                 border-radius : 4px;
 561         }
 562
 563         img.markedPic, img.pubPic {
 564                 cursor : pointer;
 565                 vertical-align : middle;
 566                 opacity : 0.5;
 567                 transition : opacity 0.25s;
 568         }
 569
 570         img.markedPic:hover, img.pubPic:hover {
 571                 opacity : 1;
 572         }
 573
 574         img[src*='pub_set.png'], img[src*='mark_set.png'] {
 575                 opacity : 1;
 576         }
 577
 578         div.tagCloudContainer {
 579                 border : 1px solid #ddd;
 580                 margin : 5px 0px 5px 0px;
 581                 padding : 5px;
 582                 text-align : center;
 583         }
 584
 585         div.errorExplained {
 586                 border : 1px solid #ddd;
 587                 margin : 5px 0px 5px 0px;
 588                 padding : 5px;
 589         }
 590
 591         ul.feedErrorsList {
 592                 max-height : 300px;
 593                 overflow : auto;
 594                 list-style-type : none;
 595                 border : 1px solid #ddd;
 596                 margin : 0px 0px 5px 0px;
 597                 padding : 5px;
 598
 599                 em {
 600                         color : @default-text;
 601                 }
 602         }
 603
 604
 605         ul.browseFeedList {
 606                 height : 300px;
 607                 overflow : auto;
 608                 border-width : 0px 1px 1px 1px;
 609                 border-color : #ddd;
 610                 border-style : solid;
 611                 margin : 0px 0px 5px 0px;
 612                 background-color : white;
 613                 list-style-type : none;
 614                 padding : 0px;
 615
 616                 li {
 617                         margin : 0px;
 618                         padding : 2px 4px 2px 4px;
 619                 }
 620         }
 621
 622
 623         .browseFeedList span.subscribers {
 624                 color : #808080;
 625         }
 626
 627         ul.compact {
 628                 list-style-type : none;
 629                 margin : 0px;
 630                 padding : 0px;
 631
 632                 li {
 633                         margin : 0px;
 634                         padding : 0px;
 635                 }
 636         }
 637
 638         .noborder {
 639                 border-width : 0px;
 640         }
 641
 642         #overlay {
 643                 background : white;
 644                 left : 0;
 645                 top : 0;
 646                 height : 100%;
 647                 width : 100%;
 648                 z-index : 100;
 649                 position : absolute;
 650         }
 651
 652         #overlay_inner {
 653                 font-weight : bold;
 654                 margin : 1em;
 655         }
 656
 657         form {
 658                 margin : 0px;
 659                 padding : 0px;
 660         }
 661
 662         div.loadingPrompt {
 663                 padding : 1em;
 664                 text-align : center;
 665                 font-weight : bold;
 666         }
 667
 668         div.whiteBox {
 669                 margin-left : 1px;
 670                 text-align : center;
 671                 padding : 1em 1em 0px 1em;
 672                 font-size : 11px;
 673                 border: 0px solid #ddd;
 674                 border-bottom-width: 1px;
 675         }
 676
 677         div.autocomplete {
 678                 position : absolute;
 679                 width : 250px;
 680                 background-color : white;
 681                 border :1px solid #778899;
 682                 margin : 0px;
 683                 padding : 0px;
 684
 685                 ul {
 686                         list-style-type : none;
 687                         margin : 0px;
 688                         padding : 0px;
 689                 }
 690
 691                 ul li.selected {
 692                         background-color : #fff7d5;
 693                 }
 694
 695                 ul li {
 696                         list-style-type : none;
 697                         display : block;
 698                         margin : 0;
 699                         padding : 2px;
 700                         height : 32px;
 701                         cursor : pointer;
 702                 }
 703         }
 704
 705
 706         div#headlines-frame.wide .hlTitle {
 707                 max-width : none;
 708                 overflow : visible;
 709                 white-space : normal;
 710         }
 711
 712         div#headlines-frame.wide .hl .hlFeed {
 713                 display : none;
 714         }
 715
 716         img.hlScorePic {
 717                 vertical-align : middle;
 718                 width : 16px;
 719                 height : 16px;
 720         }
 721
 722         div.dlgSec {
 723                 font-size : 12px;
 724                 color : @default-text;
 725                 font-weight : bold;
 726                 clear : both;
 727                 height : 20px;
 728         }
 729
 730         div.dlgSecCont {
 731                 position : relative;
 732                 left : 150px;
 733                 top : -20px;
 734                 float : left;
 735                 font-size : 12px;
 736                 font-weight : normal;
 737
 738                 > * {
 739                         position : relative;
 740                         top : -2px;
 741                 }
 742         }
 743
 744         div.dlgSecCont hr, div.dlgSecSimple hr {
 745                 height : 0px;
 746                 line-height : 0px;
 747                 border : 0px solid transparent;
 748                 margin : 2px;
 749         }
 750
 751         div.dlgButtons {
 752                 text-align : right;
 753                 clear : both;
 754         }
 755
 756         span.labelColorIndicator {
 757                 height : 16px;
 758                 width : 16px;
 759                 border-radius : 4px;
 760                 line-height : 14px;
 761                 vertical-align : middle;
 762                 font-size : 9px;
 763                 display : inline-block;
 764                 border : 1px solid #ccc;
 765                 background-color : #fff7d5;
 766                 color : #063064;
 767                 text-align : center;
 768         }
 769
 770         div#cmdline {
 771                 position : absolute;
 772                 left : 5px;
 773                 bottom : 5px;
 774                 font-size : 11px;
 775                 color : @default-text;
 776                 font-weight : bold;
 777                 background-color : white;
 778                 border : 1px solid @color-accent;
 779                 padding : 3px 5px 3px 5px;
 780                 z-index : 5;
 781         }
 782
 783         #feed_browser_spinner {
 784                 vertical-align : middle;
 785                 height : 18px;
 786                 width : 18px;
 787         }
 788
 789         div.fatalError {
 790                 margin-bottom : 10px;
 791
 792                 button {
 793                         margin-top : 5px;
 794                 }
 795
 796                 textarea {
 797                         width : 565px;
 798                         height : 200px;
 799                 }
 800         }
 801
 802         #header-wrap {
 803                 border-width : 0px;
 804                 margin : 0px;
 805                 padding : 0px;
 806         }
 807
 808         #content-wrap {
 809                 padding : 0px;
 810                 border-width : 0px;
 811                 margin : 0px;
 812         }
 813
 814         #feeds-holder {
 815                 padding : 0px;
 816                 border: 0px solid #ddd;
 817                 overflow : hidden;
 818                 background : #f5f5f5;
 819                 box-shadow : inset -1px 0px 2px -1px rgba(0,0,0,0.1);
 820                 -webkit-overflow-scrolling : touch;
 821
 822                 #feedTree .dijitTreeRow .dijitTreeLabel.Unread {
 823                         font-weight : bold;
 824                 }
 825
 826                 #feedTree .dijitTreeRow.Error .dijitTreeLabel {
 827                         color : red;
 828                 }
 829
 830                 #feedTree.dijitTree .dijitTreeNode .dijitTreeRowSelected {
 831                         box-shadow : -1px 0px 2px -1px rgba(0,0,0,0.1);
 832                         border-right-color : white;
 833                 }
 834
 835                 #feedTree.dijitTree .dijitTreeContainer {
 836                         max-width : 100%;
 837                 }
 838
 839                 #feedTree.dijitTree .dijitTreeRow {
 840                         overflow: hidden;
 841                         text-overflow: ellipsis;
 842                 }
 843
 844                 #feedTree.dijitTree .dijitTreeNode .dijitTreeRow {
 845                         padding : 4px 0px 4px;
 846                         border-width : 1px;
 847                         color : #333;
 848                 }
 849
 850                 #feedTree.dijitTree img.tinyFeedIcon {
 851                         position : relative;
 852                         top : -2px;
 853                 }
 854
 855                 #feedTree {
 856                         height : 100%;
 857                         overflow-x : hidden;
 858                         text-rendering: optimizelegibility;
 859                         font-family : @fonts-ui;
 860
 861                         .counterNode.aux {
 862                                 background : #f0f0f0;
 863                                 color : #999;
 864                                 border-color : #f0f0f0;
 865                         }
 866
 867                         .counterNode {
 868                                 font-weight : bold;
 869                                 display : inline-block;
 870                                 font-size : 9px;
 871                                 text-align : center;
 872                                 border : 1px solid lighten(@color-accent, 5%);;
 873                                 color : white;
 874                                 background : lighten(@color-accent, 5%);
 875                                 border-radius : 4px;
 876                                 vertical-align : middle;
 877                                 float : right;
 878                                 position : relative;
 879                                 line-height : 14px;
 880                                 margin-right : 8px;
 881                                 margin-top : 2px;
 882                                 min-width : 23px;
 883                                 height : 14px;
 884                         }
 885
 886                         .dijitTreeNode .loadingExpando {
 887                                 left : -3px;
 888                                 height : 22px;
 889                                 position : relative;
 890                                 top : -3px;
 891                         }
 892
 893                 }
 894         }
 895
 896         #headlines-wrap-inner {
 897                 padding : 0px;
 898                 margin : 0px;
 899                 border-width : 0px;
 900         }
 901
 902         #headlines-frame {
 903                 padding : 0px;
 904                 border: 0px #ddd;
 905                 margin-top : 0px;
 906                 -webkit-overflow-scrolling : touch;
 907                 -webkit-transform: translateZ(0);
 908                 -webkit-backface-visibility: hidden;
 909         }
 910
 911         #headlines-toolbar_splitter, #toolbar_splitter {
 912                 display : none;
 913         }
 914
 915         #content-insert_splitter {
 916                 background : #f0f0f0;
 917                 border-color: #ddd;
 918                 border-top-width : 1px;
 919                 border-style : solid;
 920         }
 921
 922         #toolbar {
 923                 padding : 0px;
 924                 margin : 0px;
 925                 border-width : 0px;
 926                 white-space: nowrap;
 927                 font-size : 12px;
 928         }
 929
 930         #main-toolbar {
 931                 background : white;
 932                 border: 0px solid #ddd;
 933                 border-bottom-width: 1px;
 934                 padding-left : 4px;
 935                 height : 26px;
 936
 937         }
 938
 939         #header {
 940                 border-width : 0px;
 941                 text-align : right;
 942                 color : @default-text;
 943                 padding : 5px 5px 0px 0px;
 944                 margin : 0px;
 945                 position : absolute;
 946                 right : 0px;
 947                 top : 0px;
 948                 z-index : 5;
 949         }
 950
 951         #footer {
 952                 text-align : center;
 953                 color : @default-text;
 954                 padding : 4px 4px 8px 4px;
 955                 border-width : 0px;
 956         }
 957
 958         #content-insert {
 959                 padding : 0px;
 960                 border-color : #ddd;
 961                 border-width : 0px;
 962                 line-height: 1.5;
 963                 overflow : auto;
 964                 -webkit-overflow-scrolling : touch;
 965         }
 966
 967         img.feedIcon, img.tinyFeedIcon {
 968                 width : 16px;
 969                 height : 16px;
 970                 line-height : 16px;
 971                 vertical-align : middle;
 972                 display : inline-block;
 973         }
 974
 975         .player {
 976                 display : inline-block;
 977                 color : @default-text;
 978                 font-size : 11px;
 979                 font-family : sans-serif;
 980                 border : 1px solid @default-text;
 981                 padding : 0px 4px 0px 4px;
 982                 margin : 0px 2px 0px 2px;
 983                 width : 50px;
 984                 text-align : center;
 985                 background : white;
 986         }
 987
 988         .player.playing {
 989                 color : #00c000;
 990                 border-color : #00c000;
 991         }
 992
 993         .player:hover {
 994                 background : #f0f0f0;
 995                 cursor : pointer;
 996         }
 997
 998         #headlines-spacer {
 999                 height : 100%;
1000                 margin-left : 1px;
1001                 text-align : center;
1002                 color : @default-text;
1003                 font-size : 11px;
1004                 font-style : italic;
1005
1006                 a, span {
1007                         color : @default-text;
1008                         padding : 10px;
1009                         display : block;
1010                 }
1011
1012                 a:hover {
1013                         color : @color-accent;
1014                 }
1015         }
1016
1017         ul#filterDlg_Matches, ul#filterDlg_Actions {
1018                 max-height : 100px;
1019                 overflow : auto;
1020                 list-style-type : none;
1021                 border-style : solid;
1022                 border-color : #ddd;
1023                 border-width : 0px 1px 1px 1px;
1024                 background-color : white;
1025                 margin : 0px 0px 5px 0px;
1026                 padding : 0px;
1027         }
1028
1029         ul#filterDlg_Matches li, ul#filterDlg_Actions li {
1030                 cursor : pointer;
1031                 padding : 0px 0px 0px 5px;
1032         }
1033
1034         ul.helpKbList {
1035                 max-height : 300px;
1036                 overflow : auto;
1037                 list-style-type : none;
1038                 border : 1px solid #ddd;
1039                 margin : 0px 0px 5px 0px;
1040                 padding : 5px;
1041
1042                 span.hksequence {
1043                         width : 6em;
1044                         margin-left : 20px;
1045                         color : @color-accent;
1046                         font-weight : bold;
1047                         display : inline-block;
1048                 }
1049
1050                 h2 {
1051                         margin-top : 0px;
1052                 }
1053         }
1054
1055         span.collapseBtn {
1056                 cursor : pointer;
1057
1058                 img {
1059                         vertical-align : middle;
1060                 }
1061         }
1062
1063         select.attachments {
1064                 display : block;
1065                 margin-top : 10px;
1066                 max-width : 120px;
1067         }
1068
1069         #selected_prompt {
1070                 margin-right : 25px;
1071                 vertical-align  : middle;
1072         }
1073
1074         #filterDlg_feeds select {
1075                 height : 150px;
1076                 width : 410px;
1077         }
1078
1079         ul#filterDlg_Matches li div.dijitCheckBox, ul#filterDlg_Actions li div.dijitCheckBox {
1080                 margin-right : 5px;
1081         }
1082
1083         span.highlight {
1084                 background-color : #ffff00;
1085                 color : #cc90cc;
1086         }
1087
1088         div.enclosure_title {
1089
1090         }
1091
1092         #headlines-frame .dijitCheckBox {
1093                 border-width : 0px;
1094                 opacity : 0.5;
1095         }
1096
1097         #headlines-frame .dijitCheckBoxHover,
1098         #headlines-frame .dijitCheckBoxChecked {
1099                 opacity : 1;
1100         }
1101
1102         #feedTree .dijitTreeRow img.dijitTreeExpandoLeaf {
1103                 width : 16px;
1104                 height : 16px;
1105                 vertical-align : middle;
1106                 position : relative;
1107         }
1108
1109         .dijitDropDownButton.attachments .dijitButtonText {
1110                 font-size : 12px;
1111         }
1112
1113         .dijitDropDownButton.attachments {
1114                 display : inline-block;
1115         }
1116
1117         #editTagsDlg{
1118                 overflow: visible;
1119         }
1120
1121         #feedEditDlg img.feedIcon {
1122                 border : 1px solid #ccc;
1123                 padding : 5px;
1124                 margin : 5px;
1125                 max-width : 20px;
1126                 max-height : 20px;
1127                 height : auto;
1128                 width : auto;
1129         }
1130 }
1131
1132 body.ttrss_login {
1133         padding : 2em;
1134         font-size : 14px;
1135
1136         fieldset {
1137                 margin-left : auto;
1138                 margin-right : auto;
1139                 display : block;
1140                 width : 400px;
1141                 border-width : 0px;
1142         }
1143
1144         label {
1145                 width : 120px;
1146                 margin-right : 20px;
1147                 display : inline-block;
1148                 text-align : right;
1149                 color : gray;
1150         }
1151
1152         div.header {
1153                 border: 0px solid @color-accent;
1154                 border-bottom-width: 1px;
1155                 margin-bottom : 1em;
1156                 padding-bottom : 5px;
1157         }
1158
1159         div.footer {
1160                 margin-top : 1em;
1161                 padding-top : 5px;
1162                 border: 0px solid @color-accent;
1163                 border-top-width: 1px;
1164                 text-align : center;
1165                 color : gray;
1166                 font-size : 12px;
1167         }
1168
1169         a.forgotpass {
1170                 text-align : right;
1171                 font-size : 11px;
1172                 display : inline-block;
1173         }
1174
1175         a {
1176                 color: @color-accent;
1177                 text-decoration: none;
1178         }
1179
1180         a:hover,
1181         a:focus {
1182                 color: @color-accent;
1183                 text-decoration: underline;
1184         }
1185
1186         div.footer a {
1187                 color : gray;
1188         }
1189
1190         div.footer a:hover {
1191                 color : @color-accent;
1192         }
1193
1194         div.row {
1195                 padding : 0px 0px 5px 0px;
1196         }
1197
1198         div.row-error {
1199                 color : red;
1200                 text-align : center;
1201                 padding : 0px 0px 5px 0px;
1202         }
1203 }
1204
1205 ::selection {
1206         background : @color-accent;
1207         color : white;
1208 }