koha-tmpl/opac-tmpl/prog/en/css/opac.css

   1 @import url("../../en/lib/yui/reset-fonts-grids.css");
   2
   3 a {
   4         font-weight : bold;
   5 }
   6
   7 a, a:visited {
   8         color : #006699;
   9 }
  10
  11 a:hover {
  12         color : #990033;
  13 }
  14
  15 body {
  16         background-color : white;
  17         text-align : left;
  18 }
  19
  20 caption {
  21         font-size : 140%;
  22         text-align : left;
  23         font-weight : bold;
  24 }
  25
  26 fieldset {
  27         border : 2px solid #EEEEEE;
  28         margin : 1em 1em 1em 0;
  29         padding : 1em;
  30 }
  31
  32 fieldset.rows {
  33 border-width : 1px;
  34 border-bottom : 1px solid black;
  35 float : left;
  36 font-size : 90%;
  37 clear : left;
  38 margin: .9em 0 0 0;
  39 padding: 0;
  40 width: 100%;
  41 }
  42
  43 fieldset.rows legend {
  44         margin-left: 1em;
  45         font-weight: bold;
  46         font-size : 110%;
  47 }
  48
  49 fieldset.rows label, fieldset.rows span.label {
  50         float: left;
  51         font-weight : bold;
  52         width: 9em;
  53         margin-right: 1em;
  54         text-align: right;
  55 }
  56
  57 fieldset.rows fieldset {
  58         border-width : 1px;
  59         margin : 0;
  60         padding : .3em;
  61 }
  62
  63 fieldset.rows ol {
  64 padding: 1em 1em 0 1em;
  65 list-style-type: none;
  66 }
  67
  68 fieldset.rows li {
  69 float : left;
  70 clear : left;
  71 padding-bottom: 1em;
  72 list-style-type: none;
  73 width: 100%;
  74 }
  75
  76 fieldset.rows.left li {
  77         padding-bottom : .4em;
  78 }
  79
  80 fieldset.rows li.radio {
  81         padding-left: 9em;
  82         width : auto;
  83 }
  84
  85 fieldset.rows li.radio label {
  86         float : none;
  87         width : auto;
  88         margin : 0 0 0 1em;
  89 }
  90
  91 fieldset.rows ol.radio label {
  92         width : auto;
  93         float : none;
  94         margin-right : 0;
  95 }
  96
  97 fieldset.rows ol.radio label.radio {
  98         float : left;
  99         width : 12em;
 100         margin-right : 1em;
 101 }
 102
 103 fieldset.rows table {
 104         clear : both;
 105         margin-left : 1em;
 106 }
 107
 108 fieldset.rows td label {
 109         float : none;
 110         font-weight : normal;
 111         width : auto;
 112 }
 113
 114 fieldset.action {
 115         clear : both;
 116         float : none;
 117         border : none;
 118         margin : 0;
 119         padding : 1em 0 .3em 0;
 120         width : auto;
 121 }
 122
 123 form {
 124         display : inline;
 125         margin : 0;
 126         padding : 0;
 127 }
 128
 129 h1 {
 130         font-size : 138.5%;
 131 }
 132
 133 h1#libraryname {
 134         font-weight : normal;
 135         margin : .2em 0 .2em .5em;
 136 }
 137
 138 h1#libraryname a {
 139         text-decoration : none;
 140         color : #000066;
 141 }
 142
 143 h1#libraryname a:hover {
 144         color : #000066;
 145 }
 146
 147 h1,h2,h3,h4,h5,h6 {
 148         font-weight : bold;
 149         margin : .5em 0;
 150 }
 151
 152 h2 {
 153         font-size : 131%;
 154 }
 155
 156 h2.author {
 157         text-indent : .5em;
 158 }
 159
 160 h3 {
 161         font-size : 123.1%;
 162 }
 163
 164 h4 {
 165         font-size : 116%;
 166 }
 167
 168 h5 {
 169         font-size : 108%;
 170 }
 171
 172 h6 {
 173         font-size : 100%;
 174 }
 175
 176 input[type=submit], input[type=button], input[type=reset] {
 177         background-color : #6BA037;
 178         border:1px outset #666666;
 179         color : #FFFFFF;
 180         font-size : 93%;
 181         font-weight : bold;
 182         padding : 2px;
 183 }
 184
 185 input[type=submit]:active, input[type=button], input[type=reset] {
 186         border: 1px inset #666666;
 187 }
 188
 189 p.searchresults {
 190         background-color : #EFF1DC;
 191 }
 192
 193 table {
 194         border-collapse : collapse;
 195         margin : 1em 0;
 196         border-right : 1px solid #dddddd;
 197         border-top : 1px solid #dddddd;
 198 }
 199
 200 td,th {
 201         border-left : 1px solid #dddddd;
 202         border-bottom : 1px solid #dddddd;
 203         padding : 3px 5px;
 204 }
 205
 206 th {
 207         background-color:#EFF1DC;
 208         font-weight : bold;
 209         padding : 2px 4px;
 210 }
 211
 212 th.sum {
 213         text-align: right;
 214 }
 215
 216 td.sum {
 217         background-color: #FFC;
 218         font-weight: bold;
 219 }
 220
 221 th[scope=row] {
 222         text-align : right;
 223 }
 224
 225 tr.highlight td, tr.highlight th {
 226         background-color : #F3F3F3;
 227         border : 1px solid #DDDDDD;
 228         border-right : 1px solid #DDDDDD;
 229 }
 230
 231 ul {
 232         list-style : disc;
 233         padding-left : 1em;
 234 }
 235
 236 li {
 237         list-style : disc;
 238 }
 239
 240 p.availability {
 241         font-size : 87%;
 242 }
 243
 244 .available {
 245         color : #006600;
 246 }
 247
 248 .inwait {
 249         background-color : #33CC99;
 250 }
 251
 252 /* css styles for reserves color alerts */
 253 .onloan {
 254         background-color : #FFED3D;
 255 }
 256
 257 .other {
 258         background-color : #FF0000;
 259 }
 260
 261 /* "problem" enhancement */
 262 .problem {
 263         color : white;
 264         background-color : red;
 265 }
 266
 267 .reserved {
 268         background-color : #8EBAFF;
 269 }
 270
 271 /* style for search terms in catalogsearch */
 272 .term {
 273         background-color : #ffffe0;
 274         color : #990033;
 275 }
 276
 277 a .term {
 278         text-decoration : underline;
 279 }
 280
 281 .transfered {
 282         background-color : #F9FF9A;
 283 }
 284
 285 /* action buttons */
 286 #action {
 287         margin-top : .5em;
 288 }
 289
 290 #action li {
 291         list-style : none;
 292 }
 293
 294 #action a {
 295         background-color : #F3F3F3;
 296         border : 1px solid #E8E8E8;
 297         display : block;
 298         margin : .2em;
 299         padding : .5em;
 300         text-decoration : none;
 301 }
 302
 303 /* the itemtype list in advanced search */
 304 #advsearch-itemtype table {
 305         border-collapse : separate;
 306         border-spacing : 3px;
 307         border : 0px;
 308         margin : 0px;
 309         background-color : white;
 310         border : 0px solid #D8DEB8;
 311 }
 312
 313 #advsearch-itemtype table tr td {
 314         background-color : #F8F8EB;
 315         border : 0px;
 316         margin : 0px;
 317         width : 700px;
 318 }
 319
 320 #advsearch-itemtype td {
 321         font-size : 0.8em;
 322         background-color : #F8F8EB;
 323 }
 324
 325 #auth {
 326         float : left;
 327 }
 328
 329 #facets {
 330
 331 }
 332
 333 /* the footer */
 334 #footer {
 335         margin-top : 30px;
 336         margin-left : 30%;
 337         margin-right : 20%;
 338         border-top : 1px solid #384b73;
 339         color : #384b73;
 340         font-size : 1em;
 341         text-align : center;
 342 }
 343
 344 /* facets bloc */
 345 /* the USER information block */
 346 #librarian_information {
 347         float : right;
 348         font-size : 10pt;
 349 }
 350
 351 #members {
 352         font-size : .75em;
 353         font-weight : bold;
 354         padding : 4px 0 4px 0;
 355         background-image : url(../../images/member-menu-background.gif);
 356         background-repeat : repeat-x;
 357         border-top : 1px solid #9999CC;
 358         border-bottom : 1px solid #9999CC;
 359         background-color : #AFBCCF;
 360         color : #000066;
 361 }
 362
 363 #members a {
 364         text-decoration : none;
 365 }
 366
 367 #members a.card {
 368         background-image : url(../../images/card.gif);
 369         background-position : left;
 370         background-repeat : no-repeat;
 371         display : block;
 372         padding-left : 39px;
 373 }
 374
 375 #members a.logout {
 376         font-weight : bold;
 377         padding : 0 .3em 0 .3em;
 378         text-decoration : none;
 379 }
 380
 381 #members a.logout:link, #members a.logout:visited, #members a.logout:hover, #members a.logout:active {
 382         background-image : url(../../images/member-menu-background-logout.gif);
 383         background-repeat : repeat-x;
 384         color : #000000;
 385 }
 386
 387 #members a:hover.logout {
 388         background-image : url(../../images/member-menu-background-logout-hover.gif);
 389         background-repeat : repeat-x;
 390         color : #000000;
 391 }
 392
 393 #members li {
 394         display : inline;
 395         list-style : none;
 396         margin : 0;
 397 }
 398
 399 #members ul {
 400         margin : 0;
 401         padding : 0;
 402         text-align : right;
 403 }
 404
 405 #members ul li a:link, #members ul li a:visited, #members span.members {
 406         background-image : url(../../images/member-menu-background-link.gif);
 407         background-repeat : repeat-x;
 408         border-left : 1px solid #9999CC;
 409         color : #006699;
 410 }
 411
 412 #members ul li a:link, #members ul li a:visited, #members ul li a:hover, #members ul li a:active, #members span.members {
 413         padding : 4px;
 414 }
 415
 416 #members ul li a:hover {
 417 }
 418
 419 #members ul li a:hover, #members ul li a:active {
 420         background-image : url(../../images/member-menu-background-hover.gif);
 421         background-repeat : repeat-x;
 422 }
 423
 424 #members ul li:last-child {
 425 }
 426
 427 #members ul li:last-child a {
 428         border-right : 1px solid #9999CC;
 429 }
 430
 431 #opac-main-search {
 432         background-image : url( ../../images/menu-background.gif);
 433         background-repeat : repeat-x;
 434         background-color : #6699CC;
 435         border-top : 1px solid #335599;
 436         border-bottom : 1px solid #335599;
 437         padding : .7em 0 .4em .5em;
 438         color : #FFFFCC;
 439         font-size : 108%;
 440         line-height : 116%;
 441 }
 442
 443 #opac-main-search a, #opac-main-search a, #opac-main-search a:visited {
 444         color : #FFFFCC;
 445 }
 446
 447 #opac-main-search a:hover {
 448         color : #FFFFFF;
 449 }
 450
 451 #opac-main-search form {
 452         display : inline;
 453         padding-right : 1em;
 454 }
 455
 456 #opac-main-search label {
 457         font-weight : bold;
 458 }
 459
 460 /***********************************************************/
 461 /* the user menu, for user option (and biblio detail view) */
 462 /***********************************************************/
 463
 464 .suggestion {
 465         background-color : #EEEEEB;
 466         border : 1px solid #DDDED3;
 467         margin : 10px auto;
 468         padding : 4px;
 469         width : 35%;
 470 }
 471
 472 #facets ul {
 473         margin : 0;
 474         padding : 0;
 475 }
 476
 477 #facets ul li {
 478         font-weight : bold;
 479         text-align : left;
 480         list-style : none;
 481 }
 482
 483 #facets ul ul li {
 484         border : 0;
 485         font-size : 85%;
 486         font-weight : normal;
 487         padding : 2px;
 488         text-align : left;
 489 }
 490
 491 #facets ul ul li a {
 492         font-weight : normal;
 493         text-decoration : underline;
 494 }
 495
 496 #facets h4 {
 497         font-size : 93%;
 498         padding:3px;
 499         text-align:center;
 500         background-color:#E7E7CA;
 501         line-height:1.8em;
 502         margin-left:-1px;
 503         margin-right:-1px;
 504         margin-top:-1px;
 505 }
 506
 507 #breadcrumbs {
 508         padding : .7em;
 509 }
 510
 511 strong {
 512         font-weight : bold;
 513 }
 514
 515 em {
 516         font-style : italic;
 517 }
 518
 519 #catalogue_detail_biblio p span.label {
 520         font-weight : bold;
 521 }
 522
 523 #catalogue_detail_biblio p {
 524         padding-bottom: .6em;
 525 }
 526
 527 .toptabs {
 528         margin-top : 1em;
 529 }
 530
 531 .toptabs .tabs-nav a, .toptabs .tabs-nav span.a {
 532     top: 0;
 533  }
 534
 535 .toptabs .tabs-nav li {
 536         margin-right : .5em;
 537 }
 538
 539 .toptabs .tabs-nav li a, .toptabs .tabs-nav li span.a {
 540         background-color : #F3F3F3;
 541         border-top : 1px solid #E8E8E8;
 542         border-left : 1px solid #E8E8E8;
 543         border-right : 1px solid #E8E8E8;
 544         border-bottom : 0;
 545         text-align : center;
 546         text-decoration : none;
 547 }
 548
 549 .toptabs .tabs-nav li.tabs-selected  {
 550         background-color : #FFF;
 551 }
 552
 553 .toptabs .tabs-nav li.tabs-selected a, .toptabs .tabs-nav li.tabs-selected span.a {
 554         background-color : #FFF;
 555         border-top : 1px solid #E8E8E8;
 556         border-left : 1px solid #E8E8E8;
 557         border-right : 1px solid #E8E8E8;
 558         border-bottom : 1px solid #FFF;
 559         margin-bottom : -5px;
 560         padding-bottom : 5px;
 561         text-align : center;
 562 }
 563
 564 .toptabs.numbered .tabs-nav li {
 565         min-width : 3em;
 566 }
 567
 568 .toptabs .tabs-container {
 569         border : 1px solid #E8E8E8;
 570         padding : 1em;
 571 }
 572
 573 .tabs-container {
 574     border-top: 0;
 575     padding : inherit;
 576     background: #fff; /* declare background color for container to avoid distorted fonts in IE while fading */
 577 }
 578
 579 #bookcover {
 580         float : left;
 581         margin : 0;
 582         padding : 0;
 583 }
 584
 585 #bookcover img {
 586         margin : 0 1em 1em 0;
 587 }
 588
 589 fieldset.brief {
 590         border : 1px solid #E8E8E8;
 591 }
 592
 593 fieldset.brief legend {
 594         font-weight : bold;
 595         font-size : 100%;
 596 }
 597
 598 fieldset.brief label {
 599         display : block;
 600         font-weight : bold;
 601         padding : .3em 0;
 602 }
 603
 604 fieldset.brief ol, fieldset.brief li {
 605         list-style-type : none;
 606 }
 607
 608 fieldset.brief div.hint, fieldset.rows div.hint {
 609         color : #999999;
 610         font-size : 95%;
 611         margin-bottom : .4em;
 612 }
 613
 614 #menu {
 615         margin-top: 1em;
 616 }
 617
 618 h2 span.hint {
 619         font-size: 76%;
 620         font-weight : normal;
 621 }
 622 .thumbnail {
 623         border : 0;
 624         float : left;
 625         margin : 0pt 5px 5px 0pt;
 626 }
 627 a.cancel {
 628         padding-left : 1em;
 629 }
 630
 631 #usermenu {
 632         margin-top : 1em;
 633 }
 634
 635 #toolbar ul {
 636         margin : 1em 0 0 0;
 637         padding : 0;
 638 }
 639
 640 #toolbar ul li {
 641         display : inline;
 642         list-style : none;
 643 }
 644
 645 #toolbar ul li a {
 646         border : 1px solid #afbccf;
 647         padding : .3em;
 648         text-decoration : none;
 649         margin-right : .1em;
 650 }
 651
 652 .searchresults input, .searchresults label, .searchresults select {
 653         font-size: 90%;
 654 }
 655
 656 .searchresults label {
 657         float : right;
 658         margin-top : 5px;
 659 }
 660
 661 .searchresults p {
 662         margin: 0;
 663         padding: 0;
 664         padding-top : .6em;
 665 }
 666
 667 .searchresults p img {
 668         vertical-align: middle;
 669 }
 670
 671 .searchresults table td {
 672         vertical-align: top;
 673 }
 674
 675 p.searchresults {
 676         background-color : #EFF1DC;
 677         margin-top : -5px;
 678         vertical-align : middle;
 679         padding : 3px 3px 5px 5px;
 680 }
 681
 682 .searchresults table {
 683         margin : 0;
 684 }
 685
 686 .searchresults td, .searchresults th, .searchresults table {
 687         border: 0;
 688 }
 689
 690 .searchresults tr {
 691         border-bottom : 1px solid #CCCCCC;
 692 }
 693
 694 .searchresults tr:first-child {
 695         border : 0;
 696 }
 697
 698 .searchresults table {
 699         border-top : 0px solid #CCCCCC;
 700 }
 701
 702 .searchresults a.reserve, .searchresults a.reserve:visited {
 703         background-position:left top;
 704         background-repeat:no-repeat;
 705         float:right;
 706         padding:2px 3px 2px 26px;
 707 }
 708
 709 .searchresults a.reserve {
 710         background-color:transparent;
 711         color:#006699;
 712 }
 713
 714 input.reserve, a.reserve {
 715         background-image:url(../../images/placereserve.gif);
 716 }
 717
 718 a.reserve {
 719         background-color:#006699;
 720         color:White;
 721 }
 722 .unavailable {
 723         color: #990033;
 724 }
 725
 726 #corner {
 727         float : right;
 728         line-height : 2em;
 729 }
 730
 731 #corner a.cart {
 732         background-image : url(../../images/cart-small.gif);
 733         background-position: left;
 734         background-repeat : no-repeat;
 735         padding: 0 15px;
 736         text-decoration: none;
 737 }
 738
 739 .pages {
 740         line-height : 1.8em;
 741         text-align: center;
 742 }
 743 a:link.current {
 744         background-color: transparent;
 745         color: #3366CC;
 746         font-weight: bold;
 747         padding: 1px 5px 1px 5px;
 748         text-decoration: none;
 749 }
 750 a:visited.current {
 751         background-color: transparent;
 752         color: #3366CC;
 753         font-weight: bold;
 754         padding: 1px 5px 1px 5px;
 755         text-decoration: none;
 756 }
 757
 758 a:hover.current {
 759         background-color: #CCFF00;
 760         color: #CC3333;
 761         font-weight: bold;
 762         padding: 1px 5px 1px 5px;
 763         text-decoration: none;
 764 }
 765
 766 a:active.current {
 767         background-color: #99CC00;
 768         color: #FFFF99;
 769         font-weight: bold;
 770         padding: 1px 5px 1px 5px;
 771         text-decoration: none;
 772 }
 773
 774 .current {
 775         background-color: #FFFFFF;
 776         color: #3366CC;
 777         font-weight: bold;
 778         padding: 1px 5px 1px 5px;
 779         text-decoration: none;
 780 }
 781
 782 a:link.nav {
 783         background-color: #EFF1DC;
 784         border: 1px solid #CCCC99;
 785         color: #3366CC;
 786         font-weight: bold;
 787         padding: 1px 5px 1px 5px;
 788         text-decoration: none;
 789 }
 790
 791 a:visited.nav {
 792         background-color: #EFF1DC;
 793         border: 1px solid #CCCC99;
 794         color: #3366CC;
 795         font-weight: bold;
 796         padding: 1px 5px 1px 5px;
 797         text-decoration: none;
 798 }
 799
 800 a:hover.nav {
 801         background-color: #FFFFCC;
 802         border: 1px solid #CCCC99;
 803         color: #CC3333;
 804         font-weight: bold;
 805         padding: 1px 5px 1px 5px;
 806         text-decoration: none;
 807 }
 808
 809 a:active.nav {
 810         background-color: #FFFFCC;
 811         border: 1px solid #CCCC99;
 812         color: #D25500;
 813         font-weight: bold;
 814         padding: 1px 5px 1px 5px;
 815         text-decoration: none;
 816 }
 817
 818 input.icon {
 819         background-position: left;
 820         background-repeat: no-repeat;
 821         font-size : 96%;
 822         font-weight: bold;
 823         padding: 2px 2px 2px 22px;
 824         background-color: #6699CC;
 825         border: 1px outset #666666;
 826         color: #FFFFCC;
 827 }
 828
 829 input.shelf, a.shelf {
 830         background-image: url(../../images/addtobasket.gif);
 831 }
 832
 833 input.clearall, a.clearall {
 834         background-image: url(../../images/clearbasket.gif);
 835 }
 836
 837 /* Tabs */
 838 ul.link-tabs {
 839         list-style-type: none;
 840         margin: 9px 0 -2px 5px;
 841         padding: 0;
 842 }
 843
 844 ul.link-tabs li {
 845         display: inline;
 846         padding: 0px;
 847 }
 848
 849 ul.link-tabs li a {
 850         font-weight: bold;
 851         padding: 2px 4px 2px 4px;
 852         text-decoration: none;
 853         border-top: 1px solid #DDDDDD;
 854         border-left : 1px solid #DDDDDD;
 855         border-right : 1px solid #666666;
 856 }
 857
 858 ul.link-tabs li#power_formButton a, ul.link-tabs li#proximity_formButton a {
 859         padding: 2px 4px 3px 4px;
 860 }
 861
 862 ul.link-tabs li.off a {
 863         background-color: #EEEEEB;
 864         border-bottom: 1px solid #DDDDDD;
 865 }
 866
 867 ul.link-tabs li.off a:hover {
 868         padding: 2px 3px 2px 4px;
 869         background-color: #FFFFEC;
 870         border-top: 1px solid #BEBF84;
 871         border-left : 1px solid #BEBF84;
 872         border-right : 2px solid #333333;
 873 }
 874
 875 ul.link-tabs li.on a {
 876         background-color: #FFFFFF;
 877         border-bottom: 1px solid #FFFFFF;
 878 }
 879
 880 ul.link-tabs li a.debit {
 881         background-color : #FFFF99;
 882         color : #990033;
 883 }
 884
 885 div.tab-container {
 886         border : 1px solid #DDDDDD;
 887         margin-top : 4px;
 888         padding : .7em;
 889         width : 90%;
 890 }
 891
 892 div.message {
 893         border : 1px solid #8ebaff;
 894         padding : .3em;
 895         margin : .3em;
 896         width : 50%;
 897 }
 898
 899 #catalogue_detail_biblio table, #catalogue_detail_biblio td, #catalogue_detail_biblio th {
 900         background-color : transparent;
 901         border : 0;
 902 }
 903
 904 tr.overdue td {
 905         background-color : #ffcccc;
 906         font-weight : bold;
 907 }
 908
 909 tr.highlight.overdue td {
 910         background-color : #ffaeae;
 911         font-weight : bold;
 912 }
 913
 914 td.overdue {
 915         color : #cc3333;
 916 }
 917
 918 .renewals {
 919         display:block;
 920         font-size:0.8em;
 921         padding:0.5em;
 922 }
 923
 924 h1#libraryname {
 925         border: 0;
 926         margin:0;
 927         padding:0;
 928         width:120px;
 929 }
 930 h1#libraryname {
 931         background:transparent url(../../images/koha-logo.gif) no-repeat scroll 0%;
 932         border: 0;
 933         padding:0;
 934 }
 935
 936 h1#libraryname a {
 937         border:0;
 938         cursor:pointer;
 939         display:block;
 940         height:0px !important;
 941         margin:0;
 942         overflow:hidden;
 943         padding:40px 0 0;
 944         text-decoration:none;
 945         width:120px;
 946 }
 947
 948 table#marc, table#marc td, table#marc th {
 949         border : 0;
 950 }
 951
 952 table#marc th {
 953         background-color : transparent;
 954 }
 955
 956 table#marc td:first-child {
 957         text-indent : 2em;
 958 }
 959 #masthead {
 960 float: left;
 961 width: 120px;
 962 }
 963
 964 #fluid {
 965 float: right;
 966 width: 100%;
 967 margin-left: -120px;
 968 }
 969
 970 #fluid-offset {
 971 margin-left: 119px;
 972 margin-top : .4em;
 973 }
 974
 975 #fluid-content-1 {
 976 margin : .3em -1px 0 2%;
 977 display: inline /* fix IE6 */;
 978 line-height : 40px;
 979 }
 980
 981 .clearfix:after {
 982     content: ".";
 983     display: block;
 984     height: 0;
 985     clear: both;
 986     visibility: hidden;
 987 }
 988
 989 /* Hides from IE-mac \*/
 990 * html .clearfix {height: 1%;}
 991 /* End hide from IE-mac */