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