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

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