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