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.dijitTree .dijitTreeNode .dijitTreeRowSelected {
 832                         box-shadow : -1px 0px 2px -1px rgba(0,0,0,0.1);
 833                         border-right-color : white;
 834                 }
 835
 836                 #feedTree.dijitTree .dijitTreeContainer {
 837                         max-width : 100%;
 838                 }
 839
 840                 #feedTree.dijitTree .dijitTreeRow {
 841                         overflow: hidden;
 842                         text-overflow: ellipsis;
 843                 }
 844
 845                 #feedTree.dijitTree .dijitTreeNode .dijitTreeRow {
 846                         padding : 4px 0px 4px;
 847                         border-width : 1px;
 848                         color : #333;
 849                 }
 850
 851                 #feedTree.dijitTree img.tinyFeedIcon {
 852                         position : relative;
 853                         top : -2px;
 854                 }
 855
 856                 #feedTree {
 857                         height : 100%;
 858                         overflow-x : hidden;
 859                         text-rendering: optimizelegibility;
 860                         font-family : @fonts-ui;
 861
 862                         .counterNode.aux {
 863                                 background : #f0f0f0;
 864                                 color : #999;
 865                                 border-color : #f0f0f0;
 866                         }
 867
 868                         .counterNode {
 869                                 font-weight : bold;
 870                                 display : inline-block;
 871                                 font-size : 9px;
 872                                 text-align : center;
 873                                 border : 1px solid lighten(@color-accent, 5%);;
 874                                 color : white;
 875                                 background : lighten(@color-accent, 5%);
 876                                 border-radius : 4px;
 877                                 vertical-align : middle;
 878                                 float : right;
 879                                 position : relative;
 880                                 line-height : 14px;
 881                                 margin-right : 8px;
 882                                 margin-top : 2px;
 883                                 min-width : 23px;
 884                                 height : 14px;
 885                         }
 886
 887                         .dijitTreeNode .loadingExpando {
 888                                 left : -3px;
 889                                 height : 22px;
 890                                 position : relative;
 891                                 top : -3px;
 892                         }
 893
 894                 }
 895         }
 896
 897         #headlines-wrap-inner {
 898                 padding : 0px;
 899                 margin : 0px;
 900                 border-width : 0px;
 901         }
 902
 903         #headlines-frame {
 904                 padding : 0px;
 905                 border: 0px #ddd;
 906                 margin-top : 0px;
 907                 -webkit-overflow-scrolling : touch;
 908                 -webkit-transform: translateZ(0);
 909                 -webkit-backface-visibility: hidden;
 910         }
 911
 912         #headlines-toolbar_splitter, #toolbar_splitter {
 913                 display : none;
 914         }
 915
 916         #content-insert_splitter.dijitSplitterH {
 917                 background : #f0f0f0;
 918                 border-color: #ddd;
 919                 border-top-width : 1px;
 920                 border-style : solid;
 921         }
 922
 923         #toolbar {
 924                 padding : 0px;
 925                 margin : 0px;
 926                 border-width : 0px;
 927                 white-space: nowrap;
 928                 font-size : 12px;
 929         }
 930
 931         #main-toolbar {
 932                 background : white;
 933                 border: 0px solid #ddd;
 934                 border-bottom-width: 1px;
 935                 padding-left : 4px;
 936                 height : 26px;
 937
 938         }
 939
 940         #header {
 941                 border-width : 0px;
 942                 text-align : right;
 943                 color : @default-text;
 944                 padding : 5px 5px 0px 0px;
 945                 margin : 0px;
 946                 position : absolute;
 947                 right : 0px;
 948                 top : 0px;
 949                 z-index : 5;
 950         }
 951
 952         #footer {
 953                 text-align : center;
 954                 color : @default-text;
 955                 padding : 4px 4px 8px 4px;
 956                 border-width : 0px;
 957         }
 958
 959         #content-insert {
 960                 padding : 0px;
 961                 border-color : #ddd;
 962                 border-width : 0px;
 963                 line-height: 1.5;
 964                 overflow : auto;
 965                 -webkit-overflow-scrolling : touch;
 966         }
 967
 968         img.feedIcon, img.tinyFeedIcon {
 969                 width : 16px;
 970                 height : 16px;
 971                 line-height : 16px;
 972                 vertical-align : middle;
 973                 display : inline-block;
 974         }
 975
 976         .player {
 977                 display : inline-block;
 978                 color : @default-text;
 979                 font-size : 11px;
 980                 font-family : sans-serif;
 981                 border : 1px solid @default-text;
 982                 padding : 0px 4px 0px 4px;
 983                 margin : 0px 2px 0px 2px;
 984                 width : 50px;
 985                 text-align : center;
 986                 background : white;
 987         }
 988
 989         .player.playing {
 990                 color : #00c000;
 991                 border-color : #00c000;
 992         }
 993
 994         .player:hover {
 995                 background : #f0f0f0;
 996                 cursor : pointer;
 997         }
 998
 999         #headlines-spacer {
1000                 height : 100%;
1001                 margin-left : 1px;
1002                 text-align : center;
1003                 color : @default-text;
1004                 font-size : 11px;
1005                 font-style : italic;
1006
1007                 a, span {
1008                         color : @default-text;
1009                         padding : 10px;
1010                         display : block;
1011                 }
1012
1013                 a:hover {
1014                         color : @color-accent;
1015                 }
1016         }
1017
1018         ul#filterDlg_Matches, ul#filterDlg_Actions {
1019                 max-height : 100px;
1020                 overflow : auto;
1021                 list-style-type : none;
1022                 border-style : solid;
1023                 border-color : #ddd;
1024                 border-width : 0px 1px 1px 1px;
1025                 background-color : white;
1026                 margin : 0px 0px 5px 0px;
1027                 padding : 0px;
1028         }
1029
1030         ul#filterDlg_Matches li, ul#filterDlg_Actions li {
1031                 cursor : pointer;
1032                 padding : 0px 0px 0px 5px;
1033         }
1034
1035         ul.helpKbList {
1036                 max-height : 300px;
1037                 overflow : auto;
1038                 list-style-type : none;
1039                 border : 1px solid #ddd;
1040                 margin : 0px 0px 5px 0px;
1041                 padding : 5px;
1042
1043                 span.hksequence {
1044                         width : 6em;
1045                         margin-left : 20px;
1046                         color : @color-accent;
1047                         font-weight : bold;
1048                         display : inline-block;
1049                 }
1050
1051                 h2 {
1052                         margin-top : 0px;
1053                 }
1054         }
1055
1056         span.collapseBtn {
1057                 cursor : pointer;
1058
1059                 img {
1060                         vertical-align : middle;
1061                 }
1062         }
1063
1064         select.attachments {
1065                 display : block;
1066                 margin-top : 10px;
1067                 max-width : 120px;
1068         }
1069
1070         #selected_prompt {
1071                 margin-right : 25px;
1072                 vertical-align  : middle;
1073         }
1074
1075         #filterDlg_feeds select {
1076                 height : 150px;
1077                 width : 410px;
1078         }
1079
1080         ul#filterDlg_Matches li div.dijitCheckBox, ul#filterDlg_Actions li div.dijitCheckBox {
1081                 margin-right : 5px;
1082         }
1083
1084         span.highlight {
1085                 background-color : #ffff00;
1086                 color : #cc90cc;
1087         }
1088
1089         div.enclosure_title {
1090
1091         }
1092
1093         #headlines-frame .dijitCheckBox {
1094                 border-width : 0px;
1095                 opacity : 0.5;
1096         }
1097
1098         #headlines-frame .dijitCheckBoxHover,
1099         #headlines-frame .dijitCheckBoxChecked {
1100                 opacity : 1;
1101         }
1102
1103         #feedTree .dijitTreeRow img.dijitTreeExpandoLeaf {
1104                 width : 16px;
1105                 height : 16px;
1106                 vertical-align : middle;
1107                 position : relative;
1108         }
1109
1110         .dijitDropDownButton.attachments .dijitButtonText {
1111                 font-size : 12px;
1112         }
1113
1114         .dijitDropDownButton.attachments {
1115                 display : inline-block;
1116         }
1117
1118         #editTagsDlg{
1119                 overflow: visible;
1120         }
1121
1122         #feedEditDlg img.feedIcon {
1123                 border : 1px solid #ccc;
1124                 padding : 5px;
1125                 margin : 5px;
1126                 max-width : 20px;
1127                 max-height : 20px;
1128                 height : auto;
1129                 width : auto;
1130         }
1131 }
1132
1133 body.ttrss_login {
1134         padding : 2em;
1135         font-size : 14px;
1136
1137         fieldset {
1138                 margin-left : auto;
1139                 margin-right : auto;
1140                 display : block;
1141                 width : 400px;
1142                 border-width : 0px;
1143         }
1144
1145         label {
1146                 width : 120px;
1147                 margin-right : 20px;
1148                 display : inline-block;
1149                 text-align : right;
1150                 color : gray;
1151         }
1152
1153         div.header {
1154                 border: 0px solid @color-accent;
1155                 border-bottom-width: 1px;
1156                 margin-bottom : 1em;
1157                 padding-bottom : 5px;
1158         }
1159
1160         div.footer {
1161                 margin-top : 1em;
1162                 padding-top : 5px;
1163                 border: 0px solid @color-accent;
1164                 border-top-width: 1px;
1165                 text-align : center;
1166                 color : gray;
1167                 font-size : 12px;
1168         }
1169
1170         a.forgotpass {
1171                 text-align : right;
1172                 font-size : 11px;
1173                 display : inline-block;
1174         }
1175
1176         a {
1177                 color: @color-accent;
1178                 text-decoration: none;
1179         }
1180
1181         a:hover,
1182         a:focus {
1183                 color: @color-accent;
1184                 text-decoration: underline;
1185         }
1186
1187         div.footer a {
1188                 color : gray;
1189         }
1190
1191         div.footer a:hover {
1192                 color : @color-accent;
1193         }
1194
1195         div.row {
1196                 padding : 0px 0px 5px 0px;
1197         }
1198
1199         div.row-error {
1200                 color : red;
1201                 text-align : center;
1202                 padding : 0px 0px 5px 0px;
1203         }
1204 }
1205
1206 ::selection {
1207         background : @color-accent;
1208         color : white;
1209 }