koha-tmpl/intranet-tmpl/prog/css/src/staff-global.scss

   1 @import url("../../lib/yui/reset-fonts-grids.css") screen;
   2
   3 $font-main: Arial, Verdana, Helvetica, sans-serif;
   4 $font-monospace: "Courier New", Courier, monospace;
   5 $language-footer-min-height: 20px;
   6
   7 @mixin default-button {
   8     background: linear-gradient(to bottom, #FFFFFF 0%, #F7F7F7 35%, #E0E0E0 100%);
   9     border: 1px outset #999999;
  10     border-left-color: #666;
  11     border-top-color: #666;
  12     color: #333333;
  13     padding: .25em;
  14 }
  15
  16 @mixin disabled-button {
  17     background: #EEE none;
  18     border: 1px solid #C0C0C0;
  19     color: #999;
  20 }
  21
  22 ::selection {
  23     background: #538200;
  24     color: #FFFFFF;
  25 }
  26
  27 a {
  28     &:link,
  29     &:visited {
  30         color: #004D99;
  31         text-decoration: none;
  32     }
  33
  34     &:hover,
  35     &:active {
  36         color: #538200;
  37         text-decoration: none;
  38     }
  39
  40     &:hover {
  41         .term {
  42             color: #FF9090;
  43         }
  44     }
  45
  46     &.btn {
  47         &:link,
  48         &:visited {
  49             color: #333333;
  50         }
  51
  52         &.btn-link {
  53             &:link,
  54             &:visited {
  55                 color: #004D99;
  56             }
  57
  58             &:hover {
  59                 color: #538200;
  60             }
  61         }
  62     }
  63
  64     &.cancel {
  65         padding-left: 1em;
  66     }
  67
  68     &.cartRemove {
  69         color: #CC3333;
  70         font-size: 90%;
  71         margin: 0;
  72         padding: 0;
  73     }
  74
  75     &.close {
  76         &:hover {
  77             color: #538200;
  78         }
  79     }
  80
  81
  82     &.csv {
  83         background-image: url("../img/famfamfam/silk/page_white_excel.png");
  84     }
  85
  86     &.dropdown-toggle {
  87         white-space: nowrap;
  88     }
  89
  90     &.incart {
  91         color: #666;
  92     }
  93
  94     &.popup {
  95         background: transparent url("../img/pop-up-link.png") center right no-repeat;
  96         padding-right: 15px;
  97     }
  98
  99     &.disabled {
 100         color: #999999;
 101     }
 102
 103     &.document {
 104         background-position: left middle;
 105         background-repeat: no-repeat;
 106         display: inline-block;
 107         min-height: 20px;
 108         padding-left: 20px;
 109     }
 110
 111     &.highlight_toggle {
 112         display: none;
 113     }
 114
 115     .localimage {
 116         img {
 117             border: 1px solid #0000CC;
 118             margin: 0 .5em;
 119             padding: .3em;
 120         }
 121     }
 122
 123     &.pdf {
 124         background-image: url("../img/famfamfam/silk/page_white_acrobat.png");
 125     }
 126
 127     &.submit {
 128         @include default-button;
 129         display: inline-block;
 130
 131         &:active {
 132             border: 1px inset #999999;
 133         }
 134
 135         &:disabled {
 136             @include disabled-button;
 137         }
 138     }
 139
 140     &.term {
 141         text-decoration: underline;
 142     }
 143
 144     &.xml {
 145         background-image: url("../img/famfamfam/silk/page_white_code.png");
 146     }
 147
 148 }
 149
 150 aside {
 151     h5 {
 152         font-size: 100%;
 153         margin: .5em 0;
 154     }
 155
 156     fieldset {
 157         &.brief {
 158             margin: 0;
 159             padding: .4em .7em;
 160
 161             fieldset {
 162                 margin: 0;
 163                 padding: .5em 0;
 164
 165                 legend {
 166                     font-size: 85%;
 167                 }
 168             }
 169
 170             li {
 171                 &.checkbox {
 172                     label {
 173                         display: inline;
 174                     }
 175                 }
 176
 177                 &.dateinsert {
 178                     label {
 179                         display: inline;
 180                     }
 181
 182                     span {
 183                         &.label {
 184                             display: inline;
 185                         }
 186                     }
 187                 }
 188
 189                 &.radio {
 190                     padding: .7em 0;
 191
 192                     input {
 193                         padding: .3em 0;
 194                     }
 195
 196                     label {
 197                         display: inline;
 198                     }
 199
 200                     span {
 201                         &.label {
 202                             display: inline;
 203                         }
 204                     }
 205                 }
 206             }
 207
 208             ol {
 209                 font-size: 85%;
 210                 margin: 0;
 211                 padding: 0;
 212             }
 213
 214             select,
 215             [type="text"] {
 216                 width: 100%;
 217             }
 218         }
 219     }
 220 }
 221
 222 button {
 223     @include default-button;
 224
 225     &:active {
 226         border: 1px inset #999999;
 227     }
 228
 229     &:disabled {
 230         @include disabled-button;
 231     }
 232
 233     &.closebtn {
 234         background: transparent;
 235         border: 0;
 236         cursor: pointer;
 237         padding: 0;
 238     }
 239 }
 240
 241 main {
 242     .yui-b {
 243         fieldset {
 244             &.brief {
 245                 [type="text"],
 246                 select {
 247                     width: auto;
 248                 }
 249             }
 250         }
 251     }
 252 }
 253
 254 table {
 255     border-collapse: collapse;
 256     border-right: 1px solid #BCBCBC;
 257     border-top: 1px solid #BCBCBC;
 258
 259     .btn-group {
 260         white-space: nowrap;
 261
 262         .btn {
 263             display: inline-block;
 264             float: none;
 265         }
 266     }
 267
 268     &.indexes {
 269         td {
 270             vertical-align: middle;
 271         }
 272     }
 273
 274     > caption {
 275         span {
 276             &.actions {
 277                 font-size: 66%;
 278                 font-weight: normal;
 279                 margin: 0 .5em 0 0;
 280             }
 281         }
 282     }
 283
 284     &.invis {
 285         border: 0;
 286
 287         tr,
 288         td {
 289             border: 0;
 290         }
 291     }
 292
 293     + table {
 294         margin-top: 1em;
 295     }
 296 }
 297
 298 td,
 299 th {
 300     border-bottom: 1px solid #BCBCBC;
 301     border-left: 1px solid #BCBCBC;
 302     padding: .2em .3em;
 303 }
 304
 305 td {
 306     background-color: #FFFFFF;
 307     vertical-align: top;
 308
 309     &.actions {
 310         white-space: nowrap;
 311     }
 312
 313     &.borderless {
 314         border: 0 none;
 315         border-collapse: separate;
 316     }
 317
 318     &.data {
 319         font-family: $font-monospace;
 320         text-align: right;
 321     }
 322
 323     &.total {
 324         text-align: right;
 325     }
 326
 327     input {
 328         &.approve {
 329             background-color: #FFC;
 330         }
 331     }
 332 }
 333
 334
 335 th {
 336     background-color: #E8E8E8;
 337     font-weight: bold;
 338     text-align: center;
 339
 340     &.data {
 341         font-family: $font-monospace;
 342         text-align: right;
 343     }
 344 }
 345
 346 body {
 347     font-family: $font-main;
 348     padding: 0 0 4em;
 349     text-align: left;
 350 }
 351
 352 br {
 353     &.clear {
 354         clear: both;
 355         line-height: 1px;
 356     }
 357 }
 358
 359 form {
 360     display: inline;
 361
 362     &.confirm {
 363         display: block;
 364         text-align: center;
 365     }
 366 }
 367
 368 h1 {
 369     font-size: 161.6%;
 370     font-weight: bold;
 371
 372     &#logo {
 373         border: 0 none;
 374         float: left;
 375         margin: .75em .3em .75em .7em;
 376         padding: 0;
 377         width: 180px;
 378     }
 379 }
 380
 381 h2 {
 382     font-size: 146.5%;
 383     font-weight: bold;
 384 }
 385
 386 h3 {
 387     font-size: 131%;
 388     font-weight: bold;
 389 }
 390
 391 h4 {
 392     font-size: 116%;
 393     font-weight: bold;
 394 }
 395
 396 h5 {
 397     font-size: 100%;
 398     font-weight: bold;
 399 }
 400
 401 h6 {
 402     font-size: 93%;
 403     font-weight: bold;
 404 }
 405
 406 h1,
 407 h2,
 408 h3,
 409 h4,
 410 h5,
 411 h6 {
 412     margin: .3em 0;
 413 }
 414
 415 hr {
 416     clear: both;
 417     margin: 1em 0;
 418 }
 419
 420 p {
 421     margin: .5em 0;
 422 }
 423
 424 strong {
 425     font-weight: bold;
 426
 427     em {
 428         font-style: italic;
 429         font-weight: bold;
 430     }
 431
 432     em & {
 433         font-style: italic;
 434         font-weight: bold;
 435     }
 436 }
 437
 438 em,
 439 cite {
 440     font-style: italic;
 441 }
 442
 443 input,
 444 textarea {
 445     line-height: normal;
 446     padding: 2px 4px;
 447
 448     &:focus {
 449         border-color: #538200;
 450         border-radius: 4px;
 451         border-style: solid;
 452     }
 453 }
 454
 455 input {
 456     &[type="checkbox"],
 457     &[type="radio"] {
 458         margin: 0;
 459         vertical-align: middle;
 460     }
 461
 462     &[type="submit"],
 463     &[type="button"] {
 464         &:active {
 465             border: 1px inset #999999;
 466         }
 467     }
 468
 469     &[type="submit"],
 470     &[type="reset"],
 471     &[type="button"] {
 472         @include default-button;
 473
 474         &:active {
 475             border: 1px inset #999999;
 476         }
 477
 478         &:disabled {
 479             @include disabled-button;
 480         }
 481     }
 482
 483     &.alert {
 484         background-color: #FFFF99;
 485         border-color: #900;
 486     }
 487
 488     &.submit {
 489         @include default-button;
 490
 491         &:active {
 492             border: 1px inset #999999;
 493         }
 494
 495         &:disabled {
 496             @include disabled-button;
 497         }
 498     }
 499
 500     &.warning {
 501         background: #FFF url("../img/famfamfam/silk/error.png") no-repeat 4px center;
 502         padding: .25em .25em .25em 25px;
 503     }
 504 }
 505
 506 label,
 507 .label {
 508     color: #000;
 509     display: inline;
 510     font-size: inherit;
 511     font-weight: normal;
 512     max-width: inherit;
 513     padding: 0;
 514     vertical-align: middle;
 515
 516     input {
 517         &[type="checkbox"],
 518         &[type="radio"],
 519         &[type="checkbox"],
 520         &[type="radio"] {
 521             margin-top: 0;
 522         }
 523     }
 524
 525     &.circ_barcode {
 526         font-size: 105%;
 527         font-weight: bold;
 528     }
 529
 530     // Permissions Labels
 531     &.permissioncode {
 532         font-style: italic;
 533
 534         &::before {
 535             content: "(";
 536         }
 537
 538         &::after {
 539             content: ")";
 540         }
 541     }
 542
 543     &.required {
 544         color: #C00;
 545     }
 546 }
 547
 548 .subfield-label {
 549     font-style: italic;
 550
 551     span {
 552         &.subfield-code {
 553             font-weight: bold;
 554         }
 555     }
 556 }
 557
 558 .members-update-table {
 559     padding-top: 10px;
 560 }
 561
 562 #navmenulist {
 563     li {
 564         border-bottom: 1px solid #EEE;
 565         list-style-image: url("../img/arrow-bullet.gif");
 566         padding: .2em 0;
 567
 568         a {
 569             text-decoration: none;
 570
 571             &.current {
 572                 font-weight: bold;
 573             }
 574         }
 575     }
 576 }
 577
 578 #doc,
 579 #doc1,
 580 #doc2,
 581 #doc3 {
 582     padding-top: 1em;
 583 }
 584
 585 .main {
 586     margin-bottom: $language-footer-min-height * 1.5;
 587     margin-top: 1em;
 588 }
 589
 590 #login_controls {
 591     padding: .4em .5em;
 592     position: absolute;
 593     right: .5em;
 594 }
 595
 596 ul {
 597     padding-left: 1.1em;
 598
 599     li {
 600         list-style-type: disc;
 601
 602         input {
 603             &.submit {
 604                 font-size: 87%;
 605                 padding: 2px;
 606             }
 607         }
 608
 609         li {
 610             list-style-type: circle;
 611         }
 612     }
 613
 614     .toolbar {
 615         padding-left: 0;
 616
 617         button {
 618             font-family: $font-main;
 619             padding-bottom: 2px;
 620         }
 621
 622         li {
 623             display: inline;
 624             list-style: none;
 625         }
 626     }
 627
 628     &.budget_hierarchy {
 629         margin-left: 0;
 630         padding-left: 0;
 631
 632         li {
 633             display: inline;
 634
 635             &::after {
 636                 content: " -> ";
 637             }
 638
 639             &:first-child {
 640                 &::after {
 641                     content: "";
 642                 }
 643             }
 644
 645             &:last-child {
 646                 &::after {
 647                     content: "";
 648                 }
 649             }
 650         }
 651     }
 652
 653     // For Font Awesome icon bullets
 654     &.fa-ul {
 655         li {
 656             list-style-type: none;
 657         }
 658     }
 659
 660     &.ui-tabs-nav {
 661         li {
 662             list-style: none;
 663         }
 664     }
 665 }
 666
 667 ol {
 668     padding-left: 1.5em;
 669
 670     li {
 671         list-style: decimal;
 672     }
 673
 674     &.bibliodetails {
 675         float: left;
 676         margin: 0 0 1em 1em;
 677
 678         li {
 679             border-bottom: 1px solid #E8E8E8;
 680             list-style-type: none;
 681             padding: .1em;
 682         }
 683
 684         span {
 685             &.label {
 686                 border-right: 1px solid #E8E8E8;
 687                 float: left;
 688                 font-weight: bold;
 689                 margin-right: 1em;
 690                 width: 12em;
 691             }
 692         }
 693     }
 694 }
 695
 696
 697 .gradient {
 698     background-image: linear-gradient(to bottom, rgb(230, 240, 242) 1%, rgb(255, 255, 255) 99%);
 699     display: inline-block;
 700     width: 100%;
 701 }
 702
 703 .cart-controls {
 704     border-top: 1px solid #E8E8E8;
 705     padding: 7px 0;
 706 }
 707
 708 #editions {
 709     table,
 710     td {
 711         border: 0;
 712     }
 713 }
 714
 715 .highlighted-row,
 716 .highlighted-row td {
 717     background-color: #FFD000 !important;
 718 }
 719
 720 tbody {
 721     tr {
 722         &:nth-child(odd) {
 723             td {
 724                 background-color: #F3F3F3;
 725                 border: 1px solid #BCBCBC;
 726                 border-right: 1px solid #BCBCBC;
 727             }
 728         }
 729     }
 730 }
 731
 732 .overdue,
 733 .debit {
 734     color: #CC0000;
 735     font-weight: bold;
 736 }
 737
 738 .strong {
 739     font-weight: bold;
 740 }
 741
 742 tr {
 743     &.clickable {
 744         cursor: pointer;
 745     }
 746
 747     &.expired {
 748         td {
 749             color: #999999;
 750         }
 751     }
 752
 753     &.highlight {
 754         td {
 755             background-color: #F6F6F6;
 756             border-color: #BCBCBC;
 757         }
 758
 759         th {
 760             &[scope="row"] {
 761                 background-color: #DDDDDD;
 762                 border-color: #BCBCBC;
 763             }
 764         }
 765
 766         table {
 767             &.invis {
 768                 td {
 769                     border: 0;
 770                 }
 771             }
 772         }
 773     }
 774
 775     &.odd {
 776         &.onissue {
 777             td {
 778                 background-color: #FFFFE1;
 779             }
 780         }
 781     }
 782
 783     &.ok {
 784         td {
 785             background-color: #FFFFCC;
 786         }
 787
 788         &:nth-child(odd) {
 789             td {
 790                 background-color: #FFFFCC;
 791             }
 792         }
 793
 794         &:nth-child(even) {
 795             td {
 796                 background-color: #FFFFCC;
 797             }
 798         }
 799     }
 800
 801     &.onissue {
 802         td {
 803             background-color: #FFFFCC;
 804         }
 805     }
 806
 807     &.reserved {
 808         td {
 809             background-color: #EEFFD4;
 810         }
 811     }
 812
 813     &.transfered {
 814         td {
 815             background-color: #E8F0F6;
 816         }
 817     }
 818
 819     &.warn {
 820         td {
 821             background-color: #FF9090;
 822         }
 823
 824         &:nth-child(odd) {
 825             td {
 826                 background-color: #FF9090;
 827             }
 828         }
 829     }
 830 }
 831
 832 .table_borrowers {
 833     tr {
 834         &:hover {
 835             td {
 836                 background-color: #FFFF99;
 837             }
 838         }
 839     }
 840 }
 841
 842 tfoot {
 843     td {
 844         background-color: #F3F3F3;
 845         font-weight: bold;
 846     }
 847 }
 848
 849 caption {
 850     color: #000;
 851     font-size: 133.9%;
 852     font-weight: bold;
 853     margin: .3em 0;
 854 }
 855
 856 .problem {
 857     background-color: #FFFFCC;
 858     color: #990000;
 859     font-weight: bold;
 860     line-height: 1.7em;
 861 }
 862
 863 fieldset {
 864     background-color: #F4F8F9;
 865     border: 2px solid #B9D8D9;
 866     border-radius: 5px;
 867     margin: 1em 1em 1em 0;
 868     padding: 1em;
 869
 870     + fieldset {
 871         &.action {
 872             padding-top: 20px;
 873         }
 874     }
 875
 876     .lastchecked {
 877         border-bottom-left-radius: 0;
 878         border-bottom-right-radius: 0;
 879         border-bottom-width: 0;
 880         margin-bottom: 0;
 881     }
 882
 883     .standard {
 884         background-color:#f4f8f9 !important;
 885     }
 886
 887     .contrast {
 888         background-color:#F3F3F3 !important;
 889     }
 890
 891     &.action {
 892         background-color: transparent;
 893         border: 0;
 894         clear: both;
 895         float: none;
 896         margin: .9em 0 0;
 897         padding: .4em;
 898         width: auto;
 899     }
 900
 901     &.brief {
 902         border: 2px solid #B9D8D9;
 903
 904         div {
 905             &.hint {
 906                 margin-bottom: .4em;
 907             }
 908         }
 909
 910         label {
 911             display: block;
 912             font-weight: bold;
 913             padding: .3em 0;
 914
 915             &.inline {
 916                 display: inline;
 917                 float: none;
 918                 margin-left: 1em;
 919                 width: auto;
 920             }
 921         }
 922
 923         li {
 924             &[aria-disabled="true"] {
 925                 color: #999;
 926             }
 927
 928             &.inline {
 929                 display: inline;
 930                 float: none;
 931                 margin-left: 1em;
 932                 width: auto;
 933             }
 934
 935             &.radio,
 936             &.checkbox {
 937                 label {
 938                     display: inline;
 939                 }
 940             }
 941         }
 942
 943         ol,
 944         li {
 945             list-style-type: none;
 946         }
 947
 948         span {
 949             .label {
 950                 display: block;
 951                 font-weight: bold;
 952                 padding: .3em 0;
 953                 text-align: left;
 954             }
 955         }
 956     }
 957
 958     &.rows {
 959         border: 2px solid #B9D8D9;
 960         border-width: 1px;
 961         clear: left;
 962         float: left;
 963         font-size: 90%;
 964         margin: .9em 0 0;
 965         padding: 0;
 966         width: 100%;
 967
 968         fieldset {
 969             background-color: transparent;
 970             border-width: 1px;
 971             margin: 1em;
 972             padding: .3em;
 973
 974             &.action {
 975                 padding: 1em;
 976             }
 977         }
 978
 979         &.inputnote {
 980             clear: left;
 981             float: left;
 982             margin: 1em 0 0 11em;
 983         }
 984
 985
 986         &.left {
 987             label {
 988                 text-align: left;
 989                 width: 8em;
 990             }
 991
 992             li {
 993                 padding-bottom: .4em;
 994             }
 995
 996             span {
 997                 label {
 998                     text-align: left;
 999                     width: 8em;
1000                 }
1001             }
1002         }
1003
1004         &.ui-accordion-content {
1005             border-top-left-radius: 0;
1006             border-top-right-radius: 0;
1007             margin: 0;
1008             padding: 0;
1009             width: auto;
1010
1011             table {
1012                 margin: 0;
1013             }
1014         }
1015
1016         &.unselected {
1017             background-color: #FFFFFF;
1018             border: 0;
1019             border-width: 0;
1020         }
1021
1022         caption {
1023             font-size: 120%;
1024         }
1025
1026         div {
1027             &.hint {
1028                 margin-bottom: .4em;
1029                 margin-left: 10.5em;
1030             }
1031         }
1032
1033         label {
1034             float: left;
1035             font-weight: bold;
1036             margin-right: 1em;
1037             text-align: right;
1038             width: 9em;
1039
1040             &.error {
1041                 float: none;
1042                 margin-left: 1em;
1043                 width: auto;
1044             }
1045
1046             &.inline {
1047                 display: inline;
1048                 float: none;
1049                 margin-left: 1em;
1050             }
1051
1052             &.yesno {
1053                 float: none;
1054                 width: auto;
1055             }
1056         }
1057
1058         legend {
1059             font-size: 110%;
1060             font-weight: bold;
1061             margin-left: 1em;
1062         }
1063
1064         li {
1065             clear: left;
1066             float: left;
1067             list-style-type: none;
1068             padding-bottom: 1em;
1069             width: 100%;
1070
1071             &[aria-disabled="true"] {
1072                 color: #999;
1073             }
1074
1075             &.radio {
1076                 padding-left: 9em;
1077                 width: auto;
1078
1079                 input + label {
1080                     margin-left: 0;
1081                     padding-left: 0;
1082                 }
1083
1084                 label {
1085                     float: none;
1086                     margin: 0 0 0 1em;
1087                     width: auto;
1088                 }
1089             }
1090
1091             input + label {
1092                 margin-left: 0;
1093                 padding-left: 0;
1094             }
1095         }
1096
1097         ol {
1098             list-style-type: none;
1099             padding: 1em 1em 0;
1100
1101             &.radio {
1102                 label {
1103                     float: none;
1104                     margin-left: 20px;
1105                     margin-right: 30px;
1106                     padding-left: 0;
1107                     vertical-align: middle;
1108                     width: auto;
1109
1110                     &.radio {
1111                         float: left;
1112                         margin-right: 1em;
1113                         margin-top: 0;
1114                         width: 9em;
1115                     }
1116                 }
1117
1118                 input {
1119                     &[type="checkbox"],
1120                     &[type="radio"] {
1121                         margin-left: -20px;
1122                     }
1123                 }
1124             }
1125         }
1126
1127         p {
1128             margin: 1em 0 1em 1em;
1129         }
1130
1131         span {
1132             &.label {
1133                 float: left;
1134                 font-weight: bold;
1135                 margin-right: 1em;
1136                 text-align: right;
1137                 width: 9em;
1138             }
1139         }
1140
1141         table {
1142             clear: both;
1143             font-size: 105%;
1144             margin: 1em 0 1em 1em;
1145
1146             &.mceListBox {
1147                 margin: 0;
1148             }
1149         }
1150
1151         td {
1152             label {
1153                 float: none;
1154                 font-weight: normal;
1155                 width: auto;
1156             }
1157         }
1158
1159         .inputnote {
1160             clear: left;
1161             float: left;
1162             margin: 1em 0 0 11em;
1163         }
1164
1165         + h3 {
1166             clear: both;
1167             padding-top: .5em;
1168         }
1169     }
1170 }
1171
1172 #multi_receiving {
1173     fieldset {
1174         &.rows {
1175             label {
1176                 width: 50%;
1177             }
1178         }
1179     }
1180 }
1181
1182 .yui-u {
1183     div {
1184         &.hint {
1185             margin-bottom: .4em;
1186         }
1187     }
1188
1189     fieldset {
1190         &.rows {
1191             div {
1192                 &.hint {
1193                     margin-left: 7.5em;
1194                 }
1195             }
1196
1197             label {
1198                 width: 10em;
1199             }
1200
1201             span {
1202                 &.label {
1203                     width: 10em;
1204                 }
1205             }
1206         }
1207     }
1208
1209     .rows {
1210         li {
1211             p {
1212                 label {
1213                     &.widelabel {
1214                         width: auto;
1215                     }
1216                 }
1217             }
1218         }
1219     }
1220 }
1221
1222 legend {
1223     background-color: #FFFFFF;
1224     border: 2px solid #B9D8D9;
1225     border-radius: 3px;
1226     font-size: 123.1%;
1227     font-weight: bold;
1228     padding: .2em .5em;
1229     width: auto;
1230 }
1231
1232 details {
1233     > summary {
1234         cursor: pointer;
1235
1236         &::before {
1237             content: "\f0da";
1238             display: inline-block;
1239             font-family: FontAwesome;
1240             width: 1em;
1241         }
1242
1243         &.checkouts-by-itemtype {
1244             li {
1245                 display: inline-block;
1246             }
1247         }
1248     }
1249 }
1250
1251 details[open] {
1252     > summary {
1253         &::before {
1254             content: "\f0d7";
1255         }
1256     }
1257 }
1258
1259
1260 #floating-save {
1261     background-color: rgba(185, 216, 217, .6);
1262     bottom: 3%;
1263     position: fixed;
1264     right: 1%;
1265     width: 150px;
1266 }
1267
1268 #breadcrumbs {
1269     background-color: #E6F0F2;
1270     clear: both;
1271     font-size: 90%;
1272     margin: 0;
1273     padding: .2em .5em .4em 10px;
1274 }
1275
1276 #header {
1277     &.navbar {
1278         margin-bottom: 0;
1279     }
1280
1281     &.navbar-default {
1282         background: #E6F0F2;
1283         border: 0;
1284         box-shadow: none;
1285     }
1286
1287     + #breadcrumbs {
1288         margin-top: 1em;
1289     }
1290
1291     > .container-fluid {
1292         padding: 0;
1293     }
1294 }
1295
1296 div {
1297     &.action {
1298         background-color: transparent;
1299         border: 0;
1300         clear: both;
1301         float: none;
1302         margin: .9em 0 0;
1303         padding: .4em;
1304         width: auto;
1305     }
1306
1307     .circmessage {
1308         margin-bottom: .3em;
1309         padding: 0 .4em .4em;
1310
1311         &:first-child {
1312             margin-top: 1em;
1313         }
1314     }
1315
1316     &.first {
1317         fieldset {
1318             margin-right: 0;
1319         }
1320     }
1321
1322     &.help {
1323         margin: .9em 0 0;
1324     }
1325
1326     &.justify {
1327         text-align: justify;
1328     }
1329
1330     &.message {
1331         background: linear-gradient(to bottom, #FFFFFF 0%, #F4F6FA 2%, #EAEEF5 23%, #E8EDF6 94%, #CDDBF2 100%);
1332         border: 1px solid #BCBCBC;
1333         text-align: center;
1334         width: 55%;
1335
1336         ul,
1337         h5 {
1338             padding-left: 25%;
1339             text-align: left;
1340         }
1341
1342         ul + h4 {
1343             margin-top: .7em;
1344         }
1345     }
1346
1347     &.note {
1348         background: linear-gradient(to bottom, #F4F6FA 0%, #E8EDF6 100%); // W3C
1349         border: 1px solid #BCBCBC;
1350         margin: .5em 0;
1351         padding: .5em;
1352
1353         i {
1354             &.fa-exclamation {
1355                 color: #CC0000;
1356                 font-style: italic;
1357                 padding: 0 .3em;
1358             }
1359         }
1360     }
1361
1362     // Tools > automatic_item_modification_by_age
1363     &.rules {
1364         display: block;
1365     }
1366
1367     &[class$="_table_controls"] {
1368         padding: .7em 0;
1369     }
1370
1371     &.results {
1372         padding: .7em 0;
1373     }
1374
1375     &.rule {
1376         background-color: #F4F8F9;
1377         border: 2px solid #B9D8D9;
1378         border-radius: 5px;
1379         margin: .3em;
1380         padding: .3em;
1381     }
1382
1383     &.lastchecked {
1384         border: 2px solid #BCDB89;
1385         border-bottom-left-radius: 5px;
1386         border-bottom-right-radius: 5px;
1387         padding: .2em 1em;
1388     }
1389
1390     &.listgroup {
1391         clear: left;
1392
1393         h4 {
1394             font-style: italic;
1395
1396             a {
1397                 font-size: 80%;
1398             }
1399         }
1400
1401         input {
1402             font-size: 80%;
1403         }
1404     }
1405
1406     &.sysprefs {
1407         h3 {
1408             margin: .2em 0 .2em .4em;
1409         }
1410
1411         dl {
1412             margin-left: 1.5em;
1413         }
1414
1415         &.hint {
1416             float: right;
1417             margin: .7em;
1418             padding: .5em;
1419             width: 25%;
1420         }
1421     }
1422
1423     &.rows {
1424         clear: left;
1425         float: left;
1426         margin: 0;
1427         padding: 0;
1428         width: 100%;
1429
1430         + div {
1431             &.rows {
1432                 margin-top: .6em;
1433             }
1434         }
1435
1436         li {
1437             border-bottom: 1px solid #EEE;
1438             clear: left;
1439             float: left;
1440             list-style-type: none;
1441             padding-bottom: .2em;
1442             padding-top: .1em;
1443             width: 100%;
1444         }
1445
1446         ol {
1447             list-style-type: none;
1448             padding: .5em 1em 0 0;
1449
1450             li {
1451                 li {
1452                     border-bottom: 0;
1453                 }
1454             }
1455         }
1456
1457         span {
1458             &.label {
1459                 float: left;
1460                 font-weight: bold;
1461                 margin-right: 1em;
1462                 padding-top: 0;
1463                 text-align: left;
1464                 width: 9em;
1465             }
1466         }
1467     }
1468
1469     &.pages {
1470         margin: .5em 0;
1471
1472         a {
1473             font-weight: bold;
1474             padding: 1px 5px;
1475             text-decoration: none;
1476
1477             &:link,
1478             &:visited {
1479                 background-color: #EEEEEE;
1480                 color: #3366CC;
1481             }
1482
1483             &:hover,
1484             &:active {
1485                 background-color: #FFC;
1486             }
1487         }
1488
1489         .current,
1490         .currentPage {
1491             background-color: #E6FCB7;
1492             color: #666;
1493             font-weight: bold;
1494             padding: 1px 5px;
1495         }
1496
1497         .inactive {
1498             background-color: #F3F3F3;
1499             color: #BCBCBC;
1500             font-weight: bold;
1501             padding: 1px 5px;
1502         }
1503     }
1504
1505     .browse {
1506         margin: .5em 0;
1507     }
1508 }
1509
1510 #header_search {
1511     background-position: .5em .5em;
1512     background-repeat: no-repeat;
1513     float: left;
1514     margin: .3em 0 .5em;
1515
1516     input {
1517         font-size: 1.3em;
1518
1519         &.submit {
1520             font-size: 1em;
1521         }
1522     }
1523
1524     div {
1525         &.residentsearch {
1526             border: 0;
1527             border-bottom: 1px solid #85CA11;
1528             padding: 0 0 .2em;
1529         }
1530     }
1531
1532     ul {
1533         &.ui-tabs-nav {
1534             margin-left: 1em;
1535             padding-top: 0;
1536
1537             li {
1538                 &.ui-state-default {
1539                     background: transparent none;
1540                     border: 0;
1541                     top: 0;
1542
1543                     a {
1544                         padding: .3em .6em;
1545                     }
1546                 }
1547
1548                 &.ui-tabs-active {
1549                     background-color: #FFFFF1;
1550                     border: 1px solid #85CA11;
1551                     border-top-width: 0;
1552                     top: -2px;
1553
1554                     a {
1555                         text-decoration: none;
1556                     }
1557                 }
1558             }
1559         }
1560     }
1561
1562     .ui-corner-top {
1563         border-radius: 0 0 4px 4px;
1564     }
1565
1566     > div,
1567     > ul {
1568         display: none;
1569
1570         > li {
1571             display: none;
1572
1573             &:first-of-type {
1574                 display: block;
1575             }
1576         }
1577
1578         &:first-of-type {
1579             display: block;
1580         }
1581     }
1582 }
1583
1584
1585 .head-searchbox {
1586     width: 30em;
1587 }
1588
1589 #reserves,
1590 #checkouts {
1591     border: 1px solid #B9D8D9;
1592     padding: 1em;
1593 }
1594
1595 .tip {
1596     color: #808080;
1597     font-size: 93%;
1598 }
1599
1600 .single-line {
1601     white-space: nowrap;
1602 }
1603
1604 .ex {
1605     font-family: $font-monospace;
1606     font-weight: bold;
1607 }
1608
1609 dt {
1610     font-weight: bold;
1611 }
1612
1613 dd {
1614     font-size: 90%;
1615     font-weight: normal;
1616     padding: .2em;
1617     text-indent: 2.5em;
1618 }
1619
1620 #toolbar,
1621 .btn-toolbar {
1622     background-color: #EDF4F6;
1623     border: 1px solid #E6F0F2;
1624     border-radius: 5px 5px 0 0;
1625     margin: 0;
1626     padding: 5px;
1627 }
1628
1629 #disabled {
1630     a {
1631         color: #999;
1632
1633         &:hover {
1634             color: #999;
1635         }
1636     }
1637 }
1638
1639 #disabled2 {
1640     a {
1641         color: #999;
1642     }
1643 }
1644
1645
1646 .patroninfo {
1647     margin-top: -.5em;
1648
1649     h5 {
1650         border-right: 1px solid #B9D8D9;
1651         margin-bottom: 0;
1652         padding-bottom: .5em;
1653         padding-left: -.5em;
1654         padding-top: .3em;
1655
1656         &:empty {
1657             border-right: 0;
1658         }
1659     }
1660
1661     ul {
1662         border: 0;
1663         border-bottom: 0;
1664         border-right: 1px solid #B9D8D9;
1665         border-top: 0;
1666         margin: 0;
1667         padding: 0;
1668
1669         li {
1670             list-style-type: none;
1671             margin: 0;
1672         }
1673     }
1674
1675     + #menu {
1676         margin-right: 0;
1677     }
1678 }
1679
1680 #patronbasics {
1681     div {
1682         background: transparent url("../img/patron-blank.min.svg") 10px 5px no-repeat;
1683         border: 1px solid #CCCCCC;
1684         height: 125px;
1685         margin: .3em 0 .3em .3em;
1686         padding: 0;
1687         width: 105px;
1688     }
1689 }
1690
1691 #patronimage {
1692     border: 1px solid #CCCCCC;
1693     margin: .3em 0 .3em .3em;
1694     max-width: 140px;
1695     padding: .2em;
1696 }
1697
1698 .patronviews {
1699     border-right: 1px solid #000;
1700     border-top: 1px solid #000;
1701     margin-bottom: .5em;
1702     padding: .5em 0;
1703 }
1704
1705 .column-tool {
1706     font-size: 80%;
1707 }
1708
1709 .hint {
1710     color: #666;
1711     font-size: 95%;
1712 }
1713
1714 .yui-b {
1715     fieldset {
1716         &.brief {
1717             padding: .4em .7em;
1718
1719             fieldset {
1720                 margin: 0 .3em;
1721                 padding: .5em;
1722
1723                 legend {
1724                     font-size: 85%;
1725                 }
1726             }
1727
1728             li {
1729
1730                 &.checkbox {
1731
1732                     input {
1733                         #tools_holidays & {
1734                             margin-left: 0;
1735                         }
1736                     }
1737
1738                     label {
1739                         display: inline;
1740
1741                         #tools_holidays & {
1742                             margin-left: 20px;
1743                         }
1744                     }
1745                 }
1746
1747                 &.dateinsert {
1748                     label {
1749                         display: inline;
1750                     }
1751
1752                     span {
1753                         &.label {
1754                             display: inline;
1755                         }
1756                     }
1757                 }
1758
1759                 &.radio {
1760                     padding: .7em 0;
1761
1762                     input {
1763                         padding: .3em 0;
1764
1765                         #tools_holidays & {
1766                             margin-left: 0;
1767                         }
1768                     }
1769
1770                     label {
1771                         display: inline;
1772
1773                         #tools_holidays & {
1774                             margin-left: 20px;
1775                         }
1776
1777                         span {
1778                             &.label {
1779                                 display: inline;
1780                             }
1781                         }
1782                     }
1783                 }
1784             }
1785
1786             ol {
1787                 font-size: 85%;
1788                 margin: 0;
1789                 padding: 0;
1790             }
1791
1792             select,
1793             [type=text] {
1794                 width: 100%;
1795             }
1796         }
1797
1798         &.rows {
1799             div {
1800                 &.hint {
1801                     margin-left: 10.5em;
1802                 }
1803             }
1804
1805             td {
1806                 label {
1807                     width: auto;
1808                 }
1809
1810                 span {
1811                     &.label {
1812                         width: auto;
1813                     }
1814                 }
1815             }
1816         }
1817     }
1818 }
1819
1820 #yui-main {
1821     .yui-b {
1822         fieldset {
1823             &.brief {
1824                 select,
1825                 [type=text] {
1826                     width: auto;
1827                 }
1828             }
1829         }
1830     }
1831 }
1832
1833 .btn-toolbar {
1834     fieldset {
1835         &.action {
1836             margin-top: 0;
1837         }
1838     }
1839
1840     .dropdown-menu {
1841         font-size: 13px;
1842     }
1843 }
1844
1845 .rows {
1846     .label {
1847         white-space: normal;
1848     }
1849 }
1850
1851 .checkedout {
1852     color: #999999;
1853     font-style: italic;
1854 }
1855
1856 .subfield_not_filled {
1857     background-color: #FFFF99;
1858 }
1859
1860 .content_hidden {
1861     display: none;
1862     visibility: hidden; // you propably don't need to change this one
1863 }
1864
1865 // the property for the displayed tab
1866 .content_visible {
1867     display: block;
1868     visibility: visible; // you propably don't need to change this one
1869 }
1870
1871 #z3950searcht {
1872     table {
1873         border: 0;
1874         padding: 20px;
1875     }
1876 }
1877
1878 #z3950_search_targets {
1879     height: 338px;
1880     overflow-y: auto;
1881 }
1882
1883 #z3950_search_targets_acq {
1884     height: 308px;
1885     overflow-y: auto;
1886 }
1887
1888 .z3950checks {
1889     padding-left: 1em;
1890 }
1891
1892 .error {
1893     color: #CC0000;
1894 }
1895
1896 .status_ok {
1897     background-color: #90EE90;
1898 }
1899
1900 .status_warn {
1901     background-color: #FF0000;
1902 }
1903
1904 // Font Awesome icons
1905 i {
1906     &.error {
1907         color: #CC0000;
1908     }
1909
1910     &.success {
1911         color: #008000;
1912     }
1913
1914     &.warn {
1915         color: #FFA500;
1916     }
1917 }
1918
1919 .checkout-setting {
1920     font-size: 85%;
1921     padding-top: .3em;
1922
1923     input {
1924         vertical-align: middle;
1925     }
1926
1927     label {
1928         font-size: inherit;
1929         font-weight: normal;
1930     }
1931 }
1932
1933 .checkout-settings {
1934     background-color: #F4F8F9;
1935     border-radius: 0;
1936     border-top: 2px solid #B9D8D9;
1937     display: none;
1938     margin-left: -1em;
1939     margin-right: -1em;
1940     margin-top: 1em;
1941     padding: 1em 1em 0;
1942 }
1943
1944 #show-checkout-settings {
1945     margin-top: .5em;
1946 }
1947
1948 .blocker {
1949     color: #990000;
1950 }
1951
1952 .inaccurate-item-statuses {
1953     color: #990000;
1954 }
1955
1956 .circmessage {
1957     li {
1958         list-style: url("../img/arrow-bullet.gif");
1959         margin-bottom: .2em;
1960     }
1961 }
1962
1963 #circ_needsconfirmation {
1964     margin: auto;
1965 }
1966
1967 .dialog {
1968     border: 1px solid #BCBCBC;
1969     border-radius: 2px;
1970     margin: 1em auto;
1971     padding: .5em;
1972     text-align: center;
1973     width: 65%;
1974
1975     a {
1976         &.approve {
1977             display: inline-block;
1978         }
1979     }
1980
1981     button,
1982     a.approve {
1983         background: #FFF none;
1984         border: 1px outset #999999;
1985         border-left-color: #666;
1986         border-top-color: #666;
1987         margin: .4em;
1988         padding: .4em;
1989         white-space: pre-line;
1990
1991         &:active {
1992             border: 1px inset #999999;
1993         }
1994
1995         &:hover {
1996             background-color: #FFC;
1997         }
1998     }
1999
2000     h2,
2001     h3,
2002     h4 {
2003         margin: auto;
2004         text-align: center;
2005     }
2006
2007     input {
2008         background-color: #FFFFFF;
2009         border: 1px solid #BCBCBC;
2010         margin: .4em;
2011         padding: .4em .4em .4em 25px;
2012
2013         &:hover {
2014             background-color: #FFC;
2015         }
2016
2017         &[type="submit"] {
2018             background: #FFF none;
2019         }
2020     }
2021
2022     li {
2023         list-style-position: inside;
2024     }
2025
2026     table {
2027         margin: .5em auto;
2028
2029         td {
2030             text-align: left;
2031         }
2032
2033         th {
2034             text-align: right;
2035         }
2036     }
2037 }
2038
2039 .alert {
2040     background: linear-gradient(to bottom, #FEF8D3 0%, #FFEC91 9%, #FFED87 89%, #F9DC00 100%);
2041     border: 1px solid #E0C726;
2042     color: inherit;
2043     text-align: center;
2044     text-shadow: none;
2045
2046     strong {
2047         color: #900;
2048     }
2049
2050     // Redefine a new style for Bootstrap's class "close" since we use that already
2051     // Use <a class="closebtn" href="#">&times;</a>
2052     .closebtn {
2053         line-height: 20px;
2054         position: relative;
2055         right: -21px;
2056         top: -2px;
2057     }
2058 }
2059
2060 .approve,
2061 .success {
2062     i {
2063         &.fa {
2064             color: #008000;
2065         }
2066     }
2067 }
2068
2069 .deny {
2070     i {
2071         &.fa {
2072             color: #CC0000;
2073         }
2074     }
2075 }
2076
2077 .new {
2078     i {
2079         &.fa {
2080             color: #425FAF;
2081         }
2082     }
2083 }
2084
2085 .accesskey {
2086     text-decoration: underline;
2087 }
2088
2089 .missing {
2090     background-color: #FFFFCC;
2091 }
2092
2093 .term {
2094     background-color: #FFC;
2095     color: #990000;
2096 }
2097
2098 // style for shelving location in catalogsearch
2099 .shelvingloc {
2100     display: block;
2101     font-style: italic;
2102 }
2103
2104 #menu {
2105     border-right: 1px solid #B9D8D9;
2106     margin-right: .5em;
2107     padding-bottom: 2em;
2108     padding-top: 1em;
2109
2110     li {
2111         a {
2112             background: linear-gradient(to bottom, #E8F0F6 0%, #E8F0F6 96%, #C1C1C1 100%);
2113             border: 1px solid #B9D8D9;
2114             border-bottom-left-radius: 5px;
2115             border-top-left-radius: 5px;
2116             display: block;
2117             font-size: 111%;
2118             margin: .5em 0;
2119             margin-right: -1px;
2120             padding: .4em .3em;
2121             text-decoration: none;
2122
2123             &:hover {
2124                 background: linear-gradient(to bottom, #FAFAFA 0%, #FFFFFF 96%, #E6E6E6 97%, #CCCCCC 99%, #C1C1C1 100%);
2125                 border-bottom: 1px solid #85CA11;
2126                 border-left: 1px solid #85CA11;
2127                 border-top: 1px solid #85CA11;
2128             }
2129         }
2130
2131         &.active {
2132             a {
2133                 background-color: #FFFFFF;
2134                 background-image: none;
2135                 border-bottom: 1px solid #85CA11;
2136                 border-left: 1px solid #85CA11;
2137                 border-right: 0;
2138                 border-top: 1px solid #85CA11;
2139                 color: #000000;
2140                 font-weight: bold;
2141
2142                 &:hover {
2143                     background-color: #FFFFFF;
2144                     color: #538200;
2145                 }
2146             }
2147         }
2148     }
2149
2150     ul {
2151         li {
2152             list-style-type: none;
2153         }
2154     }
2155 }
2156
2157
2158 #logo {
2159     background: transparent url("../img/koha-logo-medium.png") no-repeat scroll 0%;
2160     margin: .75em .3em .75em .7em;
2161
2162     a {
2163         border: 0;
2164         cursor: pointer;
2165         display: block;
2166         height: 0 !important;
2167         margin: 0;
2168         overflow: hidden;
2169         padding: 44px 0 0;
2170         text-decoration: none;
2171         width: 180px;
2172     }
2173 }
2174
2175 #closewindow {
2176     margin-top: 2em;
2177     text-align: center;
2178
2179     a {
2180         font-weight: bold;
2181     }
2182 }
2183
2184 .barcode {
2185     font-size: 200%;
2186     vertical-align: middle;
2187 }
2188
2189 li {
2190     &.email {
2191         overflow: hidden;
2192         text-overflow: ellipsis;
2193         white-space: nowrap;
2194     }
2195 }
2196
2197 .patronbriefinfo {
2198     li {
2199         &.email {
2200             font-size: 87%;
2201             padding: 0 10px 0 0;
2202             width: 90%;
2203         }
2204     }
2205 }
2206
2207 .empty {
2208     color: #CCC;
2209 }
2210
2211 .address {
2212     font-size: 110%;
2213
2214     li {
2215         list-style-type: none;
2216     }
2217 }
2218
2219 .title {
2220     font-size: 105%;
2221     font-weight: bold;
2222 }
2223
2224 .hold {
2225     float: right;
2226     font-size: 90%;
2227     margin: 0;
2228 }
2229
2230 .thumbnail {
2231     display: block;
2232     margin: auto;
2233
2234     > li {
2235         list-style-type: none;
2236     }
2237 }
2238
2239 #searchresults {
2240     ul {
2241         li {
2242             clear: left;
2243             font-size: 90%;
2244             list-style: url("../img/item-bullet.gif");
2245             padding: .2em 0;
2246
2247             img {
2248                 float: left;
2249                 margin: 3px 5px 3px -5px;
2250             }
2251         }
2252
2253         span {
2254             &.status {
2255                 clear: left;
2256                 color: #900;
2257                 display: block;
2258             }
2259
2260             &.unavailable {
2261                 clear: left;
2262                 display: block;
2263             }
2264         }
2265
2266         table {
2267             td {
2268                 vertical-align: top;
2269             }
2270         }
2271     }
2272
2273     &.unavailability {
2274         strong {
2275             display: block;
2276         }
2277     }
2278 }
2279
2280 #searchheader {
2281     background-color: #E6F0F2;
2282     border: 1px solid #B9D8D9;
2283     border-radius: 5px 5px 0 0;
2284     font-size: 80%;
2285     margin: 0 0 .5em -1px;
2286     padding: .4em 0 .4em 1em;
2287
2288     &.floating {
2289         border-radius: 0;
2290         margin-top: 0;
2291     }
2292
2293     .btn-group {
2294         > .btn {
2295             &:first-child {
2296                 margin-left: .7em;
2297             }
2298         }
2299     }
2300
2301     form {
2302         float: right;
2303         padding: 5px 5px 3px 0;
2304
2305         &.fz3950 {
2306             float: right;
2307             font-size: 125%;
2308             padding: 0 0 0 5em;
2309         }
2310
2311         &.fz3950bigrpad {
2312             float: right;
2313             font-size: 125%;
2314             padding: 5px 25em 0 0;
2315         }
2316     }
2317 }
2318
2319 #search-facets {
2320     border: 1px solid #B9D8D9;
2321     border-radius: 5px 5px 0 0;
2322
2323     h4 {
2324         background-color: #E6F0F2;
2325         border-bottom: 1px solid #B9D8D9;
2326         border-radius: 5px 5px 0 0;
2327         font-size: 90%;
2328         margin: 0;
2329         padding: .4em .2em;
2330         text-align: center;
2331     }
2332
2333     ul {
2334         margin: 0;
2335         padding: .3em;
2336
2337         li {
2338             font-weight: bold;
2339             list-style-type: none;
2340         }
2341     }
2342
2343     li {
2344         li {
2345             font-size: 85%;
2346             font-weight: normal;
2347             margin-bottom: 2px;
2348             padding: .1em .2em;
2349         }
2350
2351         &.showmore {
2352             font-weight: bold;
2353             text-indent: 1em;
2354         }
2355     }
2356 }
2357
2358 .facet-count {
2359     display: inline-block;
2360 }
2361
2362 #bookcoverimg {
2363     text-align: center;
2364 }
2365
2366 .searchhighlightblob {
2367     font-size: 75%;
2368     font-style: italic;
2369 }
2370
2371 #displayexample {
2372     background-color: #CCCCCC;
2373     margin-bottom: 10px;
2374     padding: 5px;
2375 }
2376
2377 #irregularity_summary {
2378     vertical-align: top;
2379 }
2380
2381 #toplevelmenu {
2382     padding: 0;
2383 }
2384
2385 #CheckAll,
2386 #CheckNone,
2387 #CheckPending {
2388     font-weight: normal;
2389     margin: 0 .5em 0 0;
2390 }
2391
2392 .lost,
2393 .dmg,
2394 .wdn {
2395     color: #990000;
2396     display: block;
2397 }
2398
2399 .datedue {
2400     color: #999;
2401     display: block;
2402     font-style: italic;
2403 }
2404
2405 .waitinghere,
2406 .credit {
2407     color: #669900;
2408 }
2409
2410 #mainuserblock {
2411     border: 1px solid #E8E8E8;
2412     margin-top: .5em;
2413     padding: .5em;
2414 }
2415
2416 .labeledmarc-table {
2417     border: 0;
2418 }
2419
2420 .labeledmarc-label {
2421     border: 0;
2422     color: #000000;
2423     font-size: 11pt;
2424     font-style: italic;
2425     padding: 5;
2426 }
2427
2428 .labeledmarc-value {
2429     border: 0;
2430     color: #000;
2431     font-size: 10pt;
2432     padding: 5;
2433 }
2434
2435 #marcPreview {
2436     table {
2437         border: 0;
2438         font-family: $font-monospace;
2439         font-size: 95%;
2440         margin: .7em 0 0;
2441     }
2442
2443     tbody {
2444         tr {
2445             &:nth-child(2n+1) {
2446                 td {
2447                     background-color: #FFFFFF;
2448                 }
2449             }
2450         }
2451     }
2452
2453     td {
2454         border: 0;
2455         padding: 2px;
2456         vertical-align: top;
2457     }
2458
2459     th {
2460         background-color: #FFFFFF;
2461         border: 0;
2462         padding: 2px;
2463         text-align: left;
2464         vertical-align: top;
2465         white-space: nowrap;
2466     }
2467
2468     &.modal-dialog {
2469         width: 80%;
2470     }
2471 }
2472
2473 .modal-dialog {
2474     &.modal-wide {
2475         width: 80%;
2476     }
2477 }
2478
2479 @media (max-width: 767px) {
2480     #marcPreview {
2481         margin: 0;
2482         width: auto;
2483     }
2484 }
2485
2486 #cartDetails {
2487     background-color: #FFFFFF;
2488     border: 1px solid #739ACF;
2489     box-shadow: 1px 1px 3px 0 #666;
2490     color: #000;
2491     display: none;
2492     margin: 0;
2493     padding: 10px;
2494     text-align: center;
2495     width: 180px;
2496     z-index: 50;
2497 }
2498
2499 #cartmenulink {
2500     background: transparent url("../img/cart-small.gif") left center no-repeat;
2501     padding-left: 15px;
2502 }
2503
2504 #basketcount {
2505     span {
2506         display: inline;
2507         font-size: 90%;
2508         font-weight: normal;
2509         padding: 0;
2510     }
2511 }
2512
2513 #moremenu {
2514     display: none;
2515 }
2516
2517 .results_summary {
2518     color: #707070;
2519     display: block;
2520     font-size: 85%;
2521     padding: 0 0 .5em;
2522
2523     a {
2524         font-weight: normal;
2525     }
2526
2527     .label {
2528         color: #202020;
2529     }
2530 }
2531
2532 .child_fund_amount {
2533     font-style: italic;
2534 }
2535
2536 .number_box {
2537     font-size: 105%;
2538     line-height: 200%;
2539
2540     a,
2541     span {
2542         background-color: #E4ECF5;
2543         border: 1px solid #A4BEDD;
2544         border-radius: 4px;
2545         font-weight: bold;
2546         padding: .1em .4em;
2547         text-decoration: none;
2548
2549         &:hover {
2550             background-color: #EBEFF7;
2551         }
2552     }
2553 }
2554
2555 .container {
2556     border: 1px solid #EEE;
2557     margin: 1em 0;
2558     padding: 1em;
2559 }
2560
2561 .import_export {
2562     position: relative;
2563
2564     .export_ok {
2565         background: #E3E3E3 none;
2566         border: 0;
2567         cursor: pointer;
2568         margin-left: 20px;
2569         padding: 10px;
2570     }
2571
2572     .import_export_options {
2573         background: #FFFFFF;
2574         border: 1px solid #CDCDCD;
2575         left: 60px;
2576         padding: 10px;
2577         position: absolute;
2578         top: 0;
2579         width: 300px;
2580         z-index: 1;
2581     }
2582 }
2583
2584 .import_export_options {
2585     background: #E3E3E3 none;
2586     border: 0;
2587     cursor: pointer;
2588     margin-left: 20px;
2589     padding: 10px;
2590
2591     fieldset {
2592         &.rows {
2593             li {
2594                 label {
2595                     width: 16em;
2596                 }
2597             }
2598         }
2599     }
2600
2601     .importing {
2602         background: none;
2603         padding: inherit;
2604     }
2605 }
2606
2607 .form_import {
2608     fieldset {
2609         &.rows {
2610             li {
2611                 label {
2612                     width: auto;
2613                 }
2614             }
2615         }
2616     }
2617
2618     .input_import {
2619         border: 1px solid #BCBCBC;
2620     }
2621 }
2622
2623 .importing {
2624     position: relative;
2625
2626     .importing_msg {
2627         padding-bottom: 10px;
2628         padding-left: 10px;
2629     }
2630 }
2631
2632
2633 .field_hint {
2634     color: #808080;
2635     font-style: italic;
2636     padding-left: 1em;
2637 }
2638
2639 .m880 {
2640     display: block;
2641     float: right;
2642     padding-left: 20px;
2643     text-align: right;
2644     width: 50%;
2645 }
2646
2647 .advsearch {
2648     margin: 0;
2649
2650     table {
2651         border-collapse: separate;
2652         border-spacing: 5px;
2653         border-width: 0;
2654     }
2655
2656     td {
2657         border: 1px solid #EEE;
2658         padding: .3em .4em;
2659     }
2660 }
2661
2662 #circ_circulation_issue {
2663     position: relative;
2664 }
2665
2666 #clearscreen {
2667     position: absolute;
2668     right: 0;
2669     top: 0;
2670
2671     a {
2672         background-color: #EEE;
2673         border-radius: 0 0 0 5px;
2674         color: #CCC;
2675         display: block;
2676         font-size: 160%;
2677         font-weight: bold;
2678         padding: 0 .7em .2em;
2679         text-decoration: none;
2680         text-shadow: 0 -1px 0 #666;
2681
2682         &:hover {
2683             color: #CC0000;
2684         }
2685     }
2686 }
2687
2688 .pager {
2689     background-color: #E8E8E8;
2690     border: 1px solid #BCBCBC;
2691     border-radius: 5px;
2692     display: inline-block;
2693     font-size: 85%;
2694     margin: .4em 0;
2695     padding: .3em .5em;
2696
2697     img {
2698         vertical-align: middle;
2699
2700         &.last {
2701             padding-right: 5px;
2702         }
2703     }
2704
2705     input {
2706         &.pagedisplay {
2707             background-color: transparent;
2708             border: 0;
2709             font-weight: bold;
2710             text-align: center;
2711         }
2712     }
2713
2714     p {
2715         margin: 0;
2716     }
2717 }
2718
2719 .no-image {
2720     background-color: #FFFFFF;
2721     border: 1px solid #AAAAAA;
2722     border-radius: 3px;
2723     color: #979797;
2724     display: block;
2725     font-size: 86%;
2726     font-weight: bold;
2727     text-align: center;
2728     width: 75px;
2729 }
2730
2731 #acqui_order_supplierlist {
2732     > div {
2733         &.supplier {
2734             border: 1px solid #EEEEEE;
2735             margin: .5em;
2736             padding: 1em;
2737         }
2738
2739         > div {
2740             > .baskets {
2741                 margin-top: .5em;
2742             }
2743         }
2744
2745         > span {
2746             &.action {
2747                 margin-left: 5em;
2748             }
2749
2750             &.suppliername {
2751                 display: inline;
2752                 font-size: 1.7em;
2753                 margin-bottom: .5em;
2754             }
2755         }
2756     }
2757 }
2758
2759 .supplier-contact-details {
2760     float: left;
2761 }
2762
2763 #ADD-contact {
2764     margin: 0 0 8px 8px;
2765 }
2766
2767 #contact-template {
2768     display: none;
2769 }
2770
2771 // Override core jQueryUI widgets
2772 .ui-widget-content {
2773     background: #FFFFFF none;
2774     border: 1px solid #B9D8D9;
2775     color: #222222;
2776 }
2777
2778 .ui-widget-header {
2779     background: #E6F0F2 none;
2780     border: 1px solid #B9D8D9;
2781     color: #222222;
2782     font-weight: bold;
2783 }
2784
2785 .ui-state-default,
2786 .ui-widget-content .ui-state-default,
2787 .ui-widget-header .ui-state-default {
2788     background: #F4F8F9 none;
2789     border: 1px solid #B9D8D9;
2790     color: #555555;
2791     font-weight: normal;
2792 }
2793
2794 .ui-state-hover,
2795 .ui-widget-content .ui-state-hover,
2796 .ui-widget-header .ui-state-hover,
2797 .ui-state-focus,
2798 .ui-widget-content .ui-state-focus,
2799 .ui-widget-header .ui-state-focus {
2800     background: #E6F0F2 none;
2801     border: 1px solid #B9D8D9;
2802     color: #212121;
2803     font-weight: normal;
2804 }
2805
2806 .ui-state-active,
2807 .ui-widget-content .ui-state-active,
2808 .ui-widget-header .ui-state-active {
2809     background: #FFFFFF none;
2810     border: 1px solid #AAAAAA;
2811     color: #212121;
2812     font-weight: normal;
2813 }
2814
2815 .ui-state-highlight,
2816 .ui-widget-content .ui-state-highlight,
2817 .ui-widget-header .ui-state-highlight {
2818     background: #FFF4C6;
2819     border: 1px solid #FED22F;
2820     color: #363636;
2821 }
2822
2823 .ui-state-error,
2824 .ui-widget-content .ui-state-error,
2825 .ui-widget-header .ui-state-error {
2826     background: #FEF1EC;
2827     border: 1px solid #CD0A0A;
2828     color: #CD0A0A;
2829 }
2830
2831 // Override jQuery Autocomplete
2832 .ui-autocomplete {
2833     box-shadow: 2px 2px 2px rgba(0, 0, 0, .3);
2834     cursor: default;
2835     position: absolute;
2836
2837     &.ui-widget-content {
2838         .ui-state-hover {
2839             background: #E6F0F2 none;
2840             border: 1px solid #B9D8D9;
2841             color: #212121;
2842             font-weight: normal;
2843         }
2844     }
2845 }
2846
2847 .ui-autocomplete-loading {
2848     background: #FFF url("../img/spinner-small.gif") right center no-repeat;
2849 }
2850
2851 // jQuery UI standard tabs
2852 .ui-menu {
2853     li {
2854         list-style: none;
2855     }
2856 }
2857
2858 .ui-tabs-nav {
2859     .ui-tabs-active a,
2860     a:hover,
2861     a:focus,
2862     a:active,
2863     span.a {
2864         background: none repeat scroll 0 0 transparent;
2865         outline: 0 none;
2866     }
2867
2868     &.ui-widget-header {
2869         background: none;
2870         border: 0;
2871     }
2872 }
2873
2874 .ui-tabs {
2875     .ui-tabs-nav {
2876         li {
2877             background: #E6F0F2 none;
2878             border: 1px solid #B9D8D9;
2879             margin-right: .4em;
2880             top: 1px;
2881
2882             &.ui-tabs-active {
2883                 background-color: #FFFFFF;
2884                 border: 1px solid #B9D8D9;
2885                 border-bottom-width: 0;
2886
2887                 a {
2888                     color: #000;
2889                     font-weight: bold;
2890                 }
2891
2892                 &.ui-state-hover {
2893                     background: #FFF none;
2894                 }
2895             }
2896
2897             &.ui-state-default {
2898                 &.ui-state-hover {
2899                     background: #EDF4F5 none;
2900                 }
2901             }
2902         }
2903     }
2904
2905     .ui-tabs-panel {
2906         border: 1px solid #B9D8D9;
2907     }
2908
2909     &.ui-widget-content {
2910         background: transparent none;
2911         border: 0;
2912     }
2913
2914     .ui-state-default {
2915         a {
2916             color: #004D99;
2917
2918             &:link,
2919             &:visited {
2920                 color: #004D99;
2921             }
2922         }
2923     }
2924
2925     .ui-state-hover {
2926         a {
2927             color: #538200;
2928
2929             &:link,
2930             &:visited {
2931                 color: #538200;
2932             }
2933         }
2934     }
2935
2936 }
2937
2938 .ui-widget {
2939     font-family: inherit;
2940     font-size: inherit;
2941
2942     input,
2943     select,
2944     textarea,
2945     button {
2946         font-family: inherit;
2947         font-size: inherit;
2948     }
2949 }
2950
2951 .statictabs {
2952     ul {
2953         background: none repeat scroll 0 0 transparent;
2954         border: 0 none;
2955         border-bottom-left-radius: 4px;
2956         border-bottom-right-radius: 4px;
2957         border-top-left-radius: 4px;
2958         border-top-right-radius: 4px;
2959         color: #222222;
2960         font-size: 100%;
2961         font-weight: bold;
2962         line-height: 1.3;
2963         list-style: none outside none;
2964         margin: 0;
2965         outline: 0 none;
2966         padding: .2em .2em 0;
2967         text-decoration: none;
2968
2969         &::after {
2970             clear: both;
2971         }
2972
2973         &::before,
2974         &::after {
2975             content: "";
2976             display: table;
2977         }
2978
2979         li {
2980             background: none repeat scroll 0 0 #E6F0F2;
2981             border: 1px solid #B9D8D9;
2982             border-bottom: 0 none;
2983             border-top-left-radius: 4px;
2984             border-top-right-radius: 4px;
2985             color: #555555;
2986             float: left;
2987             font-weight: normal;
2988             list-style: none outside none;
2989             margin-bottom: 0;
2990             margin-right: .4em;
2991             padding: 0;
2992             position: relative;
2993             top: 1px;
2994             white-space: nowrap;
2995
2996             &.active {
2997                 background-color: #FFFFFF;
2998                 color: #212121;
2999                 font-weight: normal;
3000                 padding-bottom: 1px;
3001
3002                 a {
3003                     background: none repeat scroll 0 0 transparent;
3004                     color: #000000;
3005                     cursor: text;
3006                     font-weight: bold;
3007                     outline: 0 none;
3008                     top: 1px;
3009                 }
3010             }
3011
3012             a {
3013                 color: #004D99;
3014                 cursor: pointer;
3015                 float: left;
3016                 padding: .5em 1em;
3017                 text-decoration: none;
3018
3019                 &:hover {
3020                     background-color: #EDF4F5;
3021                     border-top-left-radius: 4px;
3022                     border-top-right-radius: 4px;
3023                     color: #538200;
3024                 }
3025             }
3026         }
3027     }
3028
3029     .tabs-container {
3030         background: none repeat scroll 0 0 transparent;
3031         border: 1px solid #B9D8D9;
3032         border-bottom-left-radius: 4px;
3033         border-bottom-right-radius: 4px;
3034         color: #222222;
3035         display: block;
3036         padding: 1em 1.4em;
3037     }
3038 }
3039
3040 .authref {
3041     font-style: normal;
3042     text-indent: 4em;
3043 }
3044
3045 .seefrom,
3046 .seealso {
3047     font-style: italic;
3048     text-indent: 2em;
3049 }
3050
3051 #authfinderops {
3052     float: right;
3053 }
3054
3055 .authorizedheading {
3056     font-weight: bold;
3057 }
3058
3059 .authres_notes,
3060 .authres_seealso,
3061 .authres_otherscript {
3062     padding-top: 3px;
3063 }
3064
3065 .authres_notes {
3066     font-style: italic;
3067 }
3068
3069
3070 .contents {
3071     width: 75%;
3072
3073     .r {
3074         display: inline;
3075     }
3076
3077     .t {
3078         display: inline;
3079         font-weight: bold;
3080
3081         &:first-child {
3082             &::before {
3083                 content: "→ ";
3084             }
3085         }
3086
3087         &::before {
3088             content: "\A→ ";
3089             white-space: pre;
3090         }
3091     }
3092 }
3093
3094 .contentblock {
3095     margin-left: 2em;
3096     position: relative;
3097 }
3098
3099 #hierarchies {
3100     a {
3101         color: #069;
3102         font-weight: normal;
3103         text-decoration: underline;
3104
3105         &:hover {
3106             color: #990033;
3107         }
3108     }
3109 }
3110
3111 #didyoumeanopac,
3112 #didyoumeanintranet {
3113     float: left;
3114     width: 260px;
3115 }
3116
3117 .pluginlist {
3118     padding-bottom: 10px;
3119 }
3120
3121 .plugin {
3122     margin: 0 1em 1em 0;
3123 }
3124
3125 .pluginname {
3126     background-color: #E6F0F2;
3127     cursor: move;
3128     margin: .3em;
3129     padding-bottom: 4px;
3130     padding-left: .2em;
3131
3132     .ui-icon {
3133         float: right;
3134     }
3135 }
3136
3137 .plugindesc {
3138     padding: .4em;
3139 }
3140
3141 .ui-sortable-placeholder {
3142     border: 1px dotted #000;
3143     height: 80px;
3144     visibility: visible;
3145
3146     * {
3147         visibility: hidden;
3148     }
3149 }
3150
3151 // jQuery UI Datepicker
3152 .ui-datepicker {
3153     box-shadow: 1px 1px 3px 0 #666;
3154
3155     table {
3156         border: 0;
3157         border-collapse: collapse;
3158         font-size: .9em;
3159         margin: 0 0 .4em;
3160         width: 100%;
3161     }
3162
3163     th {
3164         background: transparent none;
3165         border: 0;
3166         font-weight: bold;
3167         padding: .7em .3em;
3168         text-align: center;
3169     }
3170 }
3171
3172 .ui-datepicker-trigger {
3173     margin: 0 3px;
3174     vertical-align: middle;
3175 }
3176
3177 // css for timepicker
3178 .ui-timepicker-div {
3179     dl {
3180         text-align: left;
3181
3182         dd {
3183             margin: 0 10px 10px 65px;
3184         }
3185
3186         dt {
3187             height: 25px;
3188             margin-bottom: -25px;
3189         }
3190
3191         td {
3192             font-size: 90%;
3193         }
3194     }
3195
3196     .ui-widget-header {
3197         margin-bottom: 8px;
3198     }
3199 }
3200
3201 .ui-tpicker-grid-label {
3202     background: none;
3203     border: 0;
3204     margin: 0;
3205     padding: 0;
3206 }
3207
3208 .ui_tpicker_second,
3209 .ui_tpicker_millisec,
3210 .ui_tpicker_microsec {
3211     display: none;
3212 }
3213
3214 // jQuery UI Accordion
3215 .ui-accordion-header,
3216 .ui-widget-content .ui-accordion-header {
3217     font-size: 110%;
3218     font-weight: bold;
3219 }
3220
3221 video {
3222     width: 480px;
3223 }
3224
3225 // Bootstrap overrides
3226 button,
3227 .btn {
3228     border-color: #ADADAD #ADADAD #949494;
3229     font-family: $font-main;
3230
3231     &.btn-link {
3232         border: 0;
3233     }
3234 }
3235
3236 .btn-xs,
3237 .btn-group-xs > .btn {
3238     font-size: 10.5px;
3239     padding: 3px 5px;
3240 }
3241
3242 #toolbar {
3243     .dropdown-menu {
3244         border-top-width: 1px;
3245         font-size: 13px;
3246     }
3247
3248     &.floating {
3249         border-radius: 0;
3250         margin-top: 0;
3251     }
3252 }
3253
3254 .dropdown-menu {
3255     border-color: rgba(0, 0, 0, .2);
3256     border-top: 0;
3257     font-size: 12px;
3258
3259     li {
3260         list-style: none outside none;
3261
3262         > a,
3263         &.nav-header {
3264             padding: 4px 20px;
3265             cursor: pointer;
3266
3267             &:hover,
3268             &:focus {
3269                 background-image: linear-gradient(to bottom, #0088CC, #0077B3);
3270                 background-repeat: repeat-x;
3271                 color: #FFFFFF;
3272                 text-decoration: none;
3273             }
3274         }
3275     }
3276 }
3277
3278 .navbar {
3279     color: #333;
3280     min-height: 20px;
3281
3282     .nav {
3283         > li {
3284             list-style: none outside none;
3285             padding: 0 .6em;
3286
3287             > a {
3288                 color: #004D99;
3289                 font-weight: bold;
3290                 padding: .4em .2em;
3291
3292                 &:focus,
3293                 &:hover {
3294                     color: #538200;
3295                 }
3296             }
3297         }
3298
3299         li {
3300             .dropdown {
3301                 &.open > .dropdown-toggle:focus,
3302                 &.active > .dropdown-toggle:focus,
3303                 &.open.active > .dropdown-toggle:focus {
3304                     background: #E6F0F2 none;
3305                     box-shadow: none;
3306                 }
3307             }
3308         }
3309     }
3310
3311
3312 }
3313
3314 #changelanguage {
3315     min-height: $language-footer-min-height;
3316
3317     .dropdown-menu {
3318         > li {
3319             > a,
3320             > span {
3321                 padding: 5px 15px;
3322             }
3323         }
3324     }
3325
3326     .navbar-text {
3327         margin: 0;
3328
3329         span {
3330             display: block;
3331             line-height: 20px;
3332         }
3333     }
3334 }
3335
3336 .loggedout {
3337     color: #004D99;
3338     font-weight: bold;
3339     padding: .4em .2em;
3340 }
3341
3342 .navbar-static-top {
3343     .navbar-inner {
3344         background: #E6F0F2 none;
3345         border: 0;
3346         box-shadow: none;
3347         min-height: 0;
3348         padding-left: 0;
3349     }
3350 }
3351
3352 .navbar-fixed-bottom {
3353     .navbar-inner {
3354         min-height: 0;
3355         padding: .4em 0;
3356     }
3357
3358     .nav > li {
3359         border-right: 1px solid #CCC;
3360
3361         > a {
3362             font-weight: normal;
3363         }
3364
3365         &:last-child {
3366             border-right: 0;
3367         }
3368
3369         &.navbar-text {
3370             line-height: normal;
3371             padding: .4em .7em;
3372         }
3373     }
3374 }
3375
3376 .tooltip {
3377     &.bottom {
3378         .tooltip-arrow {
3379             border-bottom-color: #EEE;
3380         }
3381
3382         .tooltip-inner {
3383             background-color: #FFFFFF;
3384             border: 1px solid rgba(0, 0, 0, .2);
3385             box-shadow: 0 5px 10px rgba(0, 0, 0, .2);
3386             color: #000;
3387             font-size: 120%;
3388             padding: 1em;
3389         }
3390     }
3391 }
3392
3393 .separator {
3394     color: #666;
3395     padding: 0 .2em;
3396 }
3397
3398 .close {
3399     filter: none;
3400     float: none;
3401     font-size: inherit;
3402     font-weight: normal;
3403     line-height: 1.5;
3404     opacity: inherit;
3405     position: inherit;
3406     right: auto;
3407     text-shadow: none;
3408     top: auto;
3409
3410     &:hover {
3411         color: inherit;
3412         filter: inherit;
3413         font-size: inherit;
3414         opacity: inherit;
3415     }
3416 }
3417
3418
3419 label {
3420     .radio &,
3421     .checkbox & {
3422         margin-left: 20px;
3423         padding-left: 0;
3424     }
3425 }
3426
3427 .radio {
3428     input {
3429         &[type="radio"] {
3430             margin-left: 0;
3431             position: relative;
3432         }
3433     }
3434 }
3435
3436 .checkbox {
3437     input {
3438         &[type="checkbox"] {
3439             margin-left: 0;
3440             position: relative;
3441         }
3442     }
3443 }
3444
3445 .modal-header {
3446     .closebtn {
3447         margin-top: 4px;
3448     }
3449 }
3450
3451 .closebtn {
3452     color: #000;
3453     filter: alpha(opacity = 20);
3454     float: right;
3455     font-size: 21px;
3456     font-weight: bold;
3457     line-height: 1;
3458     opacity: .2;
3459     text-shadow: 0 1px 0 #FFFFFF;
3460
3461     &:hover,
3462     &:focus {
3463         color: #000;
3464         cursor: pointer;
3465         filter: alpha(opacity = 50);
3466         opacity: .5;
3467         text-decoration: none;
3468     }
3469 }
3470
3471 .modal-body {
3472     background-color: #FFF;
3473     overflow-y: auto;
3474 }
3475
3476 .modal-content {
3477     background-color: #EDF4F6;
3478 }
3479
3480 .btn-group {
3481     label,
3482     select {
3483         font-size: 13px;
3484     }
3485 }
3486
3487 .tooltip-inner {
3488     white-space: pre-wrap;
3489 }
3490
3491 pre {
3492     background-color: transparent;
3493     border: 0;
3494     border-radius: 0;
3495     color: inherit;
3496     display: block;
3497     font-size: inherit;
3498     line-height: inherit;
3499     margin: 0;
3500     padding: 0;
3501     word-break: break-all;
3502     word-wrap: break-word;
3503 }
3504
3505 code {
3506     background-color: transparent;
3507     border-radius: 0;
3508     color: inherit;
3509     font-size: inherit;
3510     padding: 0;
3511 }
3512
3513 .pagination > li > a,
3514 .pagination > li > span {
3515     font-weight: bold;
3516 }
3517
3518 // End Bootstrap overrides
3519
3520 .waiting {
3521     cursor: wait;
3522 }
3523
3524 #jobpanel,
3525 #jobstatus,
3526 #jobfailed {
3527     display: none;
3528 }
3529
3530 #jobstatus {
3531     margin: .4em;
3532 }
3533
3534 #jobprogress {
3535     background: url("../img/progress.png") -300px 0 no-repeat;
3536     border: 1px solid #666;
3537     display: inline-block;
3538     height: 10px;
3539     width: 200px;
3540  }
3541
3542 .progress_panel {
3543     border: 2px solid #EEE;
3544     border-radius: 5px;
3545     clear: both;
3546     font-size: 120%;
3547     margin: 1em 0;
3548     padding: 1em;
3549 }
3550
3551 progress {
3552     width: 50%;
3553 }
3554
3555 #selections {
3556     white-space: normal;
3557     width: 100%;
3558
3559     input {
3560         margin: 0 2px;
3561         vertical-align: middle;
3562     }
3563
3564     span {
3565         background-color: #EBF3FF;
3566         border-radius: 5px;
3567         font-size: 75%;
3568         line-height: 240%;
3569         margin: 3px;
3570         padding: 3px;
3571         white-space: nowrap;
3572
3573         &.selected {
3574             background-color: #CCE0FC;
3575         }
3576     }
3577 }
3578
3579 #changepasswordf {
3580     input {
3581         &[type="text"],
3582         &[type="password"] {
3583             font-family: $font-monospace;
3584             font-size: 140%;
3585             padding: .3em;
3586         }
3587     }
3588 }
3589
3590 // Class to be added to toolbar when it starts being fixed at the top of the screen
3591
3592 .floating {
3593     box-shadow: 0 3px 2px 0 rgba(0, 0, 0, .5);
3594 }
3595
3596 .inline {
3597     display: inline;
3598 }
3599
3600 .nowrap {
3601     white-space: nowrap;
3602 }
3603
3604 .tag_editor {
3605     background: transparent url("../img/edit-tag.png") top left no-repeat;
3606     display: block;
3607     float: left;
3608     height: 16px;
3609     margin: 4px;
3610     overflow: hidden;
3611     text-indent: 100%;
3612     white-space: nowrap;
3613     width: 16px;
3614 }
3615
3616 .browse-controls {
3617     margin-left: 1.1em;
3618     margin-right: .5em;
3619     padding-bottom: 1em;
3620     padding-top: 1em;
3621 }
3622
3623 #browse-return-to-results {
3624     border-top-left-radius: 3px;
3625     border-top-right-radius: 3px;
3626     display: block;
3627     text-align: center;
3628 }
3629
3630 .browse-button {
3631     color: #004D99;
3632     display: inline-block;
3633     padding: .4em .6em;
3634
3635     &:hover {
3636         background: #FAFAFA;
3637     }
3638 }
3639
3640 span {
3641     &.browse-button {
3642         background: #FAFAFA;
3643         color: #222;
3644     }
3645
3646     &.circ-hlt {
3647         color: #CC0000;
3648         font-weight: bold;
3649     }
3650
3651     &.expired {
3652         color: #990000;
3653         font-style: italic;
3654     }
3655
3656     &.name {
3657         font-style: italic;
3658         font-weight: bold;
3659     }
3660
3661     &.permissiondesc {
3662         font-weight: normal;
3663     }
3664
3665     &.required {
3666         color: #C00;
3667         font-style: italic;
3668         margin-left: .5em;
3669     }
3670 }
3671
3672
3673 .result-biblio-itemtype {
3674     float: right;
3675     font-size: 85%;
3676     margin: .5em;
3677     padding: .5em;
3678     text-align: center;
3679
3680     img {
3681         display: block;
3682         margin: auto;
3683         margin-bottom: 2px;
3684     }
3685 }
3686
3687 .browse-label,
3688 .browse-prev-next {
3689     border: 1px solid #B9D8D9;
3690 }
3691
3692 .browse-label {
3693     background-color: #E8F0F6;
3694     border-top-left-radius: 5px;
3695     border-top-right-radius: 5px;
3696 }
3697
3698 .browse-prev-next {
3699     border-bottom-left-radius: 5px;
3700     border-bottom-right-radius: 5px;
3701     border-top-width: 0;
3702 }
3703
3704 #browse-previous {
3705     border-bottom-left-radius: 5px;
3706     border-right: 1px solid #B9D8D9;
3707     padding-right: 1em;
3708 }
3709
3710 #browse-next {
3711     border-bottom-right-radius: 5px;
3712     border-top-width: 0;
3713     float: right;
3714     padding-right: 1em;
3715 }
3716
3717 .loading-overlay {
3718     background-color: #FFFFFF;
3719     cursor: wait;
3720     height: 100%;
3721     left: 0;
3722     opacity: .7;
3723     position: fixed;
3724     top: 0;
3725     width: 100%;
3726     z-index: 1000;
3727
3728     div {
3729         background: transparent url("../img/loading.gif") top left no-repeat;
3730         font-size: 175%;
3731         font-weight: bold;
3732         height: 2em;
3733         left: 50%;
3734         margin: -1em 0 0 -2.5em;
3735         padding-left: 50px;
3736         position: absolute;
3737         top: 50%;
3738         width: 15em;
3739     }
3740 }
3741
3742 #merge_invoices {
3743     display: none;
3744     margin: 1em auto;
3745 }
3746
3747 #merge {
3748     margin: .5em 0 0;
3749 }
3750
3751 #merge_table {
3752     tr {
3753         &.active {
3754             td {
3755                 background-color: #FFFFCC;
3756             }
3757         }
3758     }
3759 }
3760
3761 .renewals {
3762     display: block;
3763     font-size: .8em;
3764     padding: .5em;
3765 }
3766
3767 #transport-types {
3768     padding-top: .5px;
3769 }
3770
3771 #i18nMenu {
3772     .navbar-text {
3773         .currentlanguage {
3774             color: #000;
3775             font-weight: bold;
3776         }
3777     }
3778
3779     a {
3780         &.currentlanguage {
3781             &:link,
3782             &:visited {
3783                 font-weight: bold;
3784             }
3785         }
3786
3787         .sublanguage-selected {
3788             color: #000;
3789             font-weight: bold;
3790         }
3791     }
3792 }
3793
3794 .onsite_checkout-select {
3795     label,
3796     #circ_circulation_issue & {
3797         font-size: inherit;
3798         font-weight: normal;
3799     }
3800 }
3801
3802 .onsite_checkout {
3803     color: #CC0000;
3804 }
3805
3806 .onsite-checkout-only {
3807     background-color: rgba(255, 242, 206, .5);
3808     border: 1px solid #FFF2CE;
3809     border-radius: 4px;
3810 }
3811
3812 .branchgriditem {
3813     background-color: #FFFFFF;
3814     border: 1px solid #B9D8D9;
3815     border-radius: 3px;
3816     display: table-cell;
3817     float: left;
3818     margin: 3px;
3819     padding: .3em;
3820 }
3821
3822 .branchgridrow {
3823     display: table-row;
3824 }
3825
3826 .branchselector {
3827     display: table;
3828 }
3829
3830 .hq-author {
3831     font-weight: bold;
3832 }
3833
3834 #cn_browser_table_wrapper > #cn_browser_table {
3835     margin: auto;
3836     width: 90%;
3837 }
3838
3839 #new_rule {
3840     background-color: #F4F8F9;
3841     border: 2px solid #B9D8D9;
3842     border-radius: 5px;
3843     display: none;
3844     margin: .3em;
3845     padding: .3em;
3846 }
3847
3848
3849 .blocks {
3850     margin-bottom: .3em;
3851 }
3852
3853 .remove_rule {
3854     font-size: 80%;
3855     padding-left: .7em;
3856 }
3857
3858 .underline {
3859     text-decoration: underline;
3860 }
3861
3862 .overline {
3863     text-decoration: overline;
3864 }
3865
3866 .order-control {
3867     padding-right: 5px;
3868 }
3869
3870 #borrower_message {
3871     margin-top: 10px;
3872 }
3873
3874 .form-group {
3875     margin-bottom: 10px;
3876
3877     label {
3878         font-weight: bold;
3879     }
3880 }
3881
3882 .modal-textarea {
3883     width: 98%;
3884 }
3885
3886 #pat_member {
3887     #patron_list_dialog,
3888     #searchresults {
3889         display: none;
3890     }
3891 }
3892
3893 #patron_search {
3894     #filters {
3895         display: none;
3896     }
3897 }
3898
3899 #fixedlengthbuilderaction {
3900     border: 3px solid #E6F0F2;
3901     left: 80%;
3902     padding: 5px;
3903     position: relative;
3904     top: -80px;
3905     width: 12%;
3906 }
3907
3908 .navbar-default {
3909     .navbar-nav {
3910         > .open {
3911             > a {
3912                 &:hover,
3913                 &:focus {
3914                     background: #E6F0F2 none;
3915                     box-shadow: none;
3916                 }
3917             }
3918         }
3919     }
3920
3921     &.navbar-fixed-bottom {
3922         .navbar-nav {
3923             > .open {
3924                 > a {
3925                     &:hover,
3926                     &:focus {
3927                         background: transparent none;
3928                         box-shadow: none;
3929                     }
3930                 }
3931             }
3932         }
3933     }
3934 }
3935
3936 #interlibraryloans {
3937     #dataPreviewLabel {
3938         margin: .3em 0;
3939     }
3940
3941     h1 {
3942         margin: 1em 0;
3943     }
3944
3945     h2 {
3946         margin-bottom: 20px;
3947     }
3948
3949     h3 {
3950         margin-top: 20px;
3951
3952     }
3953
3954     .bg-info {
3955         overflow: auto;
3956         position: relative;
3957     }
3958
3959     .format {
3960         h4 {
3961             margin-bottom: 20px;
3962         }
3963
3964         h5 {
3965             margin-top: 20px;
3966         }
3967
3968         input {
3969             margin: 10px 0;
3970         }
3971
3972         li {
3973             list-style: none;
3974         }
3975     }
3976
3977     #add-new-fields {
3978         margin: 1em;
3979     }
3980
3981     #column-toggle,
3982     #reset-toggle {
3983         font-weight: 700;
3984         line-height: 1.5em;
3985         margin: 15px 0;
3986     }
3987
3988     #freeform-fields {
3989         .custom-name {
3990             margin-right: 1em;
3991             text-align: right;
3992             width: 9em;
3993         }
3994
3995         .delete-new-field {
3996             margin-left: 1em;
3997         }
3998     }
3999
4000     #search-summary {
4001         position: absolute;
4002         top: 50%;
4003         transform: translateY(-50%);
4004     }
4005 }
4006
4007 #ill-view-panel {
4008     margin-top: 15px;
4009
4010     h3 {
4011         margin-bottom: 10px;
4012     }
4013
4014     h4 {
4015         margin-bottom: 20px;
4016     }
4017
4018     .notesopac {
4019         display: inline-block;
4020     }
4021
4022     .rows {
4023         div {
4024             height: 1em;
4025             margin-bottom: 1em;
4026         }
4027     }
4028
4029 }
4030
4031 #requestattributes {
4032     font-family: monospace;
4033     line-height: 1.3em;
4034 }
4035
4036 #ill-requests {
4037     width: 100% !important;
4038 }
4039
4040 #stockrotation {
4041     h3 {
4042         margin: 30px 0 10px 0;
4043     }
4044     .dialog {
4045         h3 {
4046             margin: 10px 0;
4047         }
4048         margin-bottom: 20px;
4049     }
4050     .highlight_stage {
4051         font-weight: bold;
4052     }
4053 }
4054
4055 #catalog_stockrotation .highlight_stage {
4056     font-weight: bold;
4057 }
4058
4059 #stockrotation {
4060     #rota_form {
4061         textarea {
4062             width: 300px;
4063             height: 100px;
4064         }
4065         #name {
4066             width: 300px;
4067         }
4068         fieldset {
4069             width: auto;
4070         }
4071     }
4072     #stage_form fieldset, #add_rota_item_form fieldset {
4073         width: auto;
4074     }
4075     .dialog.alert {
4076         ul {
4077             margin: 20px 0;
4078         }
4079         li {
4080             list-style-type: none;
4081         }
4082     }
4083 }
4084
4085 #catalog_stockrotation {
4086     .item_select_rota {
4087         vertical-align: middle;
4088     }
4089     h1 {
4090         margin-bottom: 20px;
4091     }
4092 }
4093
4094 #stockrotation td.actions, #catalog_stockrotation td.actions {
4095     vertical-align: middle;
4096 }
4097
4098 #stockrotation .stage, #catalog_stockrotation .stage {
4099     display: inline-block;
4100     padding: 5px 7px;
4101     margin: 3px 0 3px 0;
4102     border-radius: 5px;
4103     background-color: rgba(0, 0, 0, 0.1);
4104 }
4105
4106 #stage_list_headings {
4107     font-weight: bold;
4108     span {
4109         padding: 3px;
4110     }
4111 }
4112
4113 #manage_stages {
4114     ul {
4115         padding-left: 0;
4116     }
4117     li {
4118         list-style: none;
4119         margin-bottom: 5px;
4120         span {
4121             padding: 6px 3px;
4122         }
4123     }
4124     .stagename {
4125         width: 15em;
4126         display: inline-block;
4127     }
4128     .stageduration {
4129         width: 10em;
4130         display: inline-block;
4131     }
4132     .stageactions {
4133         display: inline-block;
4134     }
4135     li:nth-child(odd) {
4136         background-color: #F3F3F3;
4137     }
4138     .drag_handle {
4139         margin-right: 6px;
4140         cursor: move;
4141     }
4142     .drag_placeholder {
4143         height: 2em;
4144         border: 1px dotted #aaa;
4145     }
4146     h3 {
4147         display: inline-block;
4148     }
4149     #ajax_status {
4150         display: inline-block;
4151         border: 1px solid #bcbcbc;
4152         border-radius: 5px;
4153         padding: 5px;
4154         margin-left: 10px;
4155         background: #f3f3f3;
4156     }
4157     #manage_stages_help {
4158         margin: 20px 0;
4159     }
4160 }
4161
4162 #helper {
4163     span {
4164         display: none;
4165     }
4166 }
4167
4168 #logged-in-info-full {
4169     display: none;
4170 }
4171
4172 .loggedin-menu-label {
4173     color: #777;
4174     font-size: 12px;
4175     line-height: 1.42857143;
4176     padding: 4px 12px;
4177     white-space: nowrap;
4178
4179     span {
4180         color: #000;
4181         font-weight: bold;
4182     }
4183
4184     &.divider {
4185         padding: 0;
4186     }
4187 }
4188
4189 .lastborrower {
4190     background-color: #E6F0F2;
4191     border: 1px solid #95C6D0;
4192     box-shadow: 1px 1px 1px 0 #999;
4193     color: #CC0000;
4194     margin: .4em 0;
4195     padding: .3em .5em .3em .5em;
4196 }
4197
4198 #lastborrower-ref {
4199     border-radius: 5px 0px 0px 5px;
4200     float: left;
4201 }
4202
4203 #lastborrower-remove {
4204     border-radius: 0px 5px 5px 0px;
4205     cursor: pointer;
4206     float: right;
4207 }
4208
4209 #lastborrower-window {
4210     display: none;
4211     position: absolute;
4212     right: 5px;
4213     top: 100px;
4214 }
4215
4216 /* ==== MODULE LINKS - Start ==== */
4217 .buttons-list {
4218     // List containing the module links
4219     margin-bottom: 30px;
4220     padding: 0;
4221
4222     li {
4223         // Standard attributes for the list elements
4224         list-style-type: none;
4225
4226         a {
4227             &.circ-button {
4228                 // Class used for each module link
4229                 background-color: #F4F8F9;
4230                 background-position: 5px 3px;
4231                 background-repeat: no-repeat;
4232                 border: 2px solid #B9D8D9;
4233                 border-radius: 6px;
4234                 box-sizing: content-box;
4235                 color: #000000;
4236                 display: block;
4237                 font-size: 110%;
4238                 font-weight: bold;
4239                 margin: .5em 0;
4240                 max-width: 260px;
4241                 padding: 8px;
4242                 text-decoration: none;
4243
4244                 &:hover {
4245                     // Class used for each module link hover state
4246                     border-color: #538200;
4247                     color: #538200;
4248                 }
4249             }
4250         }
4251     }
4252 }
4253
4254 .about h2 {
4255     border-bottom: 1px solid #B9D8D9;
4256     padding: .5em .2em;
4257     margin:  .5em 0;
4258 }
4259
4260 .columns-3 {
4261     columns: 3 auto;
4262     column-gap: 2.5em;
4263 }
4264
4265 .columns-4 {
4266     columns: 4 auto;
4267     column-gap: 2em;
4268 }
4269
4270 // ==== MODULE LINKS - End ====
4271
4272 #catalog-search-link {
4273     border-right: 1px solid lighten( #E6F0F2, 15% );
4274     padding-right: .3em;
4275 }
4276
4277 #catalog-search-dropdown {
4278     padding: 0;
4279
4280     & > a {
4281         border-left: 1px solid darken( #B4D2D8, 5% );
4282         margin-right: .6em;
4283         padding: .4em .6em;
4284
4285         &:hover,
4286         &.catalog-search-dropdown-hover {
4287             background-color: darken( #E6F0F2, 5% );
4288             border-left: 1px solid darken( #B4D2D8, 15% );
4289         }
4290     }
4291 }
4292
4293 .adlibris-cover {
4294     max-height: 120px;
4295 }
4296
4297 .adlibris-cover-big {
4298     max-height: 200px;
4299 }
4300
4301 #tools_holidays {
4302     .radio,
4303     .checkbox {
4304         label {
4305             margin-left: 0;
4306         }
4307     }
4308 }
4309
4310 @media (min-width: 200px) {
4311     .navbar-nav > li {
4312         float: left;
4313     }
4314
4315     .navbar-right {
4316         float: right !important;
4317         margin-right: -15px;
4318     }
4319
4320     .navbar-nav {
4321         float: left;
4322         margin: 0;
4323
4324         .open {
4325             .dropdown-menu {
4326                 background-color: #FFF;
4327                 border: 1px solid rgba(0, 0, 0, .15);
4328                 box-shadow: 0 6px 12px rgba(0, 0, 0, .175);
4329                 float: left;
4330                 position: absolute;
4331                 width: auto;
4332
4333                 &.dropdown-menu-left {
4334                     left: auto;
4335                     right: 0;
4336                 }
4337
4338                 &.dropdown-menu-right {
4339                     right: auto;
4340                 }
4341             }
4342         }
4343     }
4344
4345     .navbar-default {
4346         .navbar-nav {
4347             .open {
4348                 .dropdown-menu {
4349                     > li {
4350                         > a {
4351                             &:hover,
4352                             &:focus {
4353                                 background-color: #0081C2;
4354                                 background-image: linear-gradient(to bottom, #0088CC, #0077B3);
4355                                 background-repeat: repeat-x;
4356                                 color: #FFFFFF;
4357                                 text-decoration: none;
4358                             }
4359                         }
4360                     }
4361                 }
4362             }
4363         }
4364     }
4365 }
4366
4367 @media (min-width: 800px) {
4368     #helper {
4369         i {
4370             display: none;
4371         }
4372
4373         span {
4374             display: inline;
4375         }
4376     }
4377
4378     #logged-in-info-full {
4379         display: inline;
4380     }
4381
4382     #logged-in-info-brief {
4383         display: none;
4384     }
4385
4386     .loggedin-menu-label {
4387         display: none;
4388     }
4389 }
4390
4391 div#makechart ol li {
4392     list-style: none;
4393 }