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 .important_subfield_not_filled {
1538     background-color : #FFFFCC;
1539 }
1540
1541 .content_hidden {
1542     display: none;
1543     visibility: hidden; // you propably don't need to change this one
1544 }
1545
1546 // the property for the displayed tab
1547 .content_visible {
1548     display: block;
1549     visibility: visible; // you propably don't need to change this one
1550 }
1551
1552 #z3950searcht {
1553     table {
1554         border: 0;
1555         padding: 20px;
1556     }
1557 }
1558
1559 #z3950_search_targets {
1560     height: 338px;
1561     overflow-y: auto;
1562 }
1563
1564 #z3950_search_targets_acq {
1565     height: 308px;
1566     overflow-y: auto;
1567 }
1568
1569 .z3950checks {
1570     padding-left: 1em;
1571 }
1572
1573 .error {
1574     color: #CC0000;
1575 }
1576
1577 .status_ok {
1578     background-color: #90EE90;
1579 }
1580
1581 .status_warn {
1582     background-color: #FF0000;
1583 }
1584
1585 // Font Awesome icons
1586 i {
1587     &.error {
1588         color: #CC0000;
1589     }
1590
1591     &.success {
1592         color: #008000;
1593     }
1594
1595     &.warn {
1596         color: #FFA500;
1597     }
1598 }
1599
1600 .circ-setting {
1601     font-size: 85%;
1602     padding-top: .3em;
1603
1604     input {
1605         vertical-align: middle;
1606     }
1607
1608     label {
1609         font-size: inherit;
1610         font-weight: normal;
1611     }
1612 }
1613
1614 .circ-settings {
1615     background-color: #F4F8F9;
1616     border-radius: 0;
1617     border-top: 2px solid #B9D8D9;
1618     display: none;
1619     margin-left: -1em;
1620     margin-right: -1em;
1621     margin-top: 1em;
1622     padding: 1em 1em 0;
1623 }
1624
1625 #show-circ-settings {
1626     margin-top: .5em;
1627 }
1628
1629 .checkin-active-setting {
1630     background-color: #FFC;
1631     border-radius: 3px;
1632     box-shadow: 1px 1px 2px 0 rgba(102, 102, 102, .5);
1633     margin: .5em;
1634     padding: .5em;
1635 }
1636
1637 .form-control-group {
1638     white-space: nowrap;
1639 }
1640
1641
1642 .blocker {
1643     color: #990000;
1644 }
1645
1646 .inaccurate-item-statuses {
1647     color: #990000;
1648 }
1649
1650 .circmessage {
1651     li {
1652         list-style: url("../img/arrow-bullet.gif");
1653         margin-bottom: .2em;
1654     }
1655 }
1656
1657 #circ_needsconfirmation {
1658     margin: auto;
1659 }
1660
1661 .dialog {
1662     border: 1px solid #BCBCBC;
1663     border-radius: 2px;
1664     margin: 1em auto;
1665     padding: .5em;
1666     text-align: center;
1667     width: 65%;
1668
1669     a {
1670         &.approve {
1671             display: inline-block;
1672         }
1673     }
1674
1675     button,
1676     a.approve {
1677         background: #FFF none;
1678         border: 1px outset #999999;
1679         border-left-color: #666;
1680         border-top-color: #666;
1681         margin: .4em;
1682         padding: .4em;
1683         white-space: pre-line;
1684
1685         &:active {
1686             border: 1px inset #999999;
1687         }
1688
1689         &:hover {
1690             background-color: #FFC;
1691         }
1692     }
1693
1694     h2,
1695     h3,
1696     h4 {
1697         margin: auto;
1698         text-align: center;
1699     }
1700
1701     input {
1702         background-color: #FFFFFF;
1703         border: 1px solid #BCBCBC;
1704         margin: .4em;
1705         padding: .4em .4em .4em 25px;
1706
1707         &:hover {
1708             background-color: #FFC;
1709         }
1710
1711         &[type="submit"] {
1712             background: #FFF none;
1713         }
1714     }
1715
1716     li {
1717         list-style-position: inside;
1718     }
1719
1720     table {
1721         margin: .5em auto;
1722
1723         td {
1724             text-align: left;
1725         }
1726
1727         th {
1728             text-align: right;
1729         }
1730     }
1731 }
1732
1733 .alert {
1734     background: linear-gradient(to bottom, #FEF8D3 0%, #FFEC91 9%, #FFED87 89%, #F9DC00 100%);
1735     border: 1px solid #E0C726;
1736     color: inherit;
1737     text-align: center;
1738     text-shadow: none;
1739
1740     strong {
1741         color: #900;
1742     }
1743
1744     // Redefine a new style for Bootstrap's class "close" since we use that already
1745     // Use <a class="closebtn" href="#">&times;</a>
1746     .closebtn {
1747         line-height: 20px;
1748         position: relative;
1749         right: -21px;
1750         top: -2px;
1751     }
1752 }
1753
1754 .approve,
1755 .success {
1756     i {
1757         &.fa {
1758             color: #008000;
1759         }
1760     }
1761 }
1762
1763 .deny {
1764     i {
1765         &.fa {
1766             color: #CC0000;
1767         }
1768     }
1769 }
1770
1771 .new {
1772     i {
1773         &.fa {
1774             color: #425FAF;
1775         }
1776     }
1777 }
1778
1779 .warning {
1780     i {
1781         &.fa-exclamation-triangle {
1782             color: #FFD700;
1783             text-shadow: 0 -1px 0 rgba( 0, 0, 0, .3);
1784         }
1785     }
1786 }
1787
1788 .accesskey {
1789     text-decoration: underline;
1790 }
1791
1792 .missing {
1793     background-color: #FFFFCC;
1794 }
1795
1796 .term {
1797     background-color: #FFC;
1798     color: #990000;
1799 }
1800
1801 // style for shelving location in catalogsearch
1802 .shelvingloc {
1803     font-style: italic;
1804 }
1805
1806 #menu {
1807     border-right: 1px solid #B9D8D9;
1808     margin-right: .5em;
1809     padding-bottom: 2em;
1810     padding-top: 1em;
1811
1812     li {
1813         a {
1814             background: linear-gradient(to bottom, #E8F0F6 0%, #E8F0F6 96%, #C1C1C1 100%);
1815             border: 1px solid #B9D8D9;
1816             border-bottom-left-radius: 5px;
1817             border-top-left-radius: 5px;
1818             display: block;
1819             font-size: 111%;
1820             margin: .5em 0;
1821             margin-right: -1px;
1822             padding: .4em .3em;
1823             text-decoration: none;
1824
1825             &:hover {
1826                 background: linear-gradient(to bottom, #FAFAFA 0%, #FFFFFF 96%, #E6E6E6 97%, #CCCCCC 99%, #C1C1C1 100%);
1827                 border-bottom: 1px solid #85CA11;
1828                 border-left: 1px solid #85CA11;
1829                 border-top: 1px solid #85CA11;
1830             }
1831         }
1832
1833         &.active {
1834             a {
1835                 background-color: #FFFFFF;
1836                 background-image: none;
1837                 border-bottom: 1px solid #85CA11;
1838                 border-left: 1px solid #85CA11;
1839                 border-right: 0;
1840                 border-top: 1px solid #85CA11;
1841                 color: #000000;
1842                 font-weight: bold;
1843
1844                 &:hover {
1845                     background-color: #FFFFFF;
1846                     color: #538200;
1847                 }
1848             }
1849         }
1850     }
1851
1852     ul {
1853         li {
1854             list-style-type: none;
1855         }
1856     }
1857 }
1858
1859
1860 #logo {
1861     background: transparent url("../img/koha-logo-medium.png") no-repeat scroll 0%;
1862     margin: .75em .3em .75em .7em;
1863
1864     a {
1865         border: 0;
1866         cursor: pointer;
1867         display: block;
1868         height: 0 !important;
1869         margin: 0;
1870         overflow: hidden;
1871         padding: 44px 0 0;
1872         text-decoration: none;
1873         width: 180px;
1874     }
1875 }
1876
1877 #closewindow {
1878     margin-top: 2em;
1879     text-align: center;
1880
1881     a {
1882         font-weight: bold;
1883     }
1884 }
1885
1886 .barcode {
1887     font-size: 200%;
1888     vertical-align: middle;
1889 }
1890
1891 li {
1892     &.email {
1893         overflow: hidden;
1894         text-overflow: ellipsis;
1895         white-space: nowrap;
1896     }
1897 }
1898
1899 .patronbriefinfo {
1900     li {
1901         &.email {
1902             font-size: 87%;
1903             padding: 0 10px 0 0;
1904             width: 90%;
1905         }
1906     }
1907 }
1908
1909 .empty {
1910     color: #CCC;
1911 }
1912
1913 .address {
1914     font-size: 110%;
1915
1916     li {
1917         list-style-type: none;
1918     }
1919 }
1920
1921 .title {
1922     font-size: 105%;
1923     font-weight: bold;
1924 }
1925
1926 .hold {
1927     float: right;
1928     font-size: 90%;
1929     margin: 0;
1930 }
1931
1932 .thumbnail {
1933     display: block;
1934     margin: auto;
1935 }
1936
1937 .thumbnails {
1938     li {
1939         display: inline-block;
1940         list-style-type: none;
1941         margin: 4px;
1942     }
1943
1944     .remove {
1945         border-top: 1px solid #EEE;
1946         display: block;
1947         font-size: 90%;
1948         margin: 4px -4px 2px -4px;
1949         padding-top: .5em;
1950         text-align: center;
1951     }
1952
1953     & + p {
1954         border-top: 1px solid #eee;
1955         margin-top: 1em;
1956         padding-top: 1em;
1957     }
1958 }
1959
1960 #searchresults {
1961     ul {
1962         li {
1963             clear: left;
1964             font-size: 90%;
1965             list-style: url("../img/item-bullet.gif");
1966             padding: .2em 0;
1967
1968             img {
1969                 float: left;
1970                 margin: 3px 5px 3px -5px;
1971             }
1972         }
1973     }
1974
1975     span {
1976         &.status {
1977             clear: left;
1978             color: #900;
1979             display: block;
1980         }
1981
1982         &.unavailable {
1983             clear: left;
1984             display: block;
1985         }
1986     }
1987
1988     table {
1989         td {
1990             vertical-align: top;
1991         }
1992     }
1993
1994     &.unavailability {
1995         strong {
1996             display: block;
1997         }
1998     }
1999 }
2000
2001 #searchheader {
2002     background-color: #E6F0F2;
2003     border: 1px solid #B9D8D9;
2004     border-radius: 5px 5px 0 0;
2005     font-size: 80%;
2006     margin: 0 0 .5em -1px;
2007     padding: .4em 0 .4em 1em;
2008
2009     &.floating {
2010         border-radius: 0;
2011         margin-top: 0;
2012     }
2013
2014     .btn-group {
2015         > .btn {
2016             &:first-child {
2017                 margin-left: .7em;
2018             }
2019         }
2020     }
2021
2022     form {
2023         float: right;
2024         padding: 5px 5px 3px 0;
2025
2026         &.fz3950 {
2027             float: right;
2028             font-size: 125%;
2029             padding: 0 0 0 5em;
2030         }
2031
2032         &.fz3950bigrpad {
2033             float: right;
2034             font-size: 125%;
2035             padding: 5px 25em 0 0;
2036         }
2037     }
2038 }
2039
2040 #search-facets {
2041     border: 1px solid #B9D8D9;
2042     border-radius: 5px 5px 0 0;
2043
2044     h4 {
2045         background-color: #E6F0F2;
2046         border-bottom: 1px solid #B9D8D9;
2047         border-radius: 5px 5px 0 0;
2048         font-size: 90%;
2049         margin: 0;
2050         padding: .4em .2em;
2051         text-align: center;
2052     }
2053
2054     ul {
2055         margin: 0;
2056         padding: .3em;
2057
2058         li {
2059             font-weight: bold;
2060             list-style-type: none;
2061         }
2062     }
2063
2064     li {
2065         li {
2066             font-size: 85%;
2067             font-weight: normal;
2068             margin-bottom: 2px;
2069             padding: .1em .2em;
2070         }
2071
2072         &.showmore {
2073             font-weight: bold;
2074             text-indent: 1em;
2075         }
2076     }
2077 }
2078
2079 .facet-count {
2080     display: inline-block;
2081 }
2082
2083 #bookcoverimg {
2084     text-align: center;
2085 }
2086
2087 .custom_cover_image {
2088     img {
2089         max-width: 140px;
2090     }
2091 }
2092
2093 .searchhighlightblob {
2094     font-size: 75%;
2095     font-style: italic;
2096 }
2097
2098 #irregularity_summary {
2099     vertical-align: top;
2100 }
2101
2102 #CheckAll,
2103 #CheckNone,
2104 #CheckPending {
2105     font-weight: normal;
2106     margin: 0 .5em 0 0;
2107 }
2108
2109 .lost,
2110 .dmg,
2111 .wdn {
2112     color: #990000;
2113     display: block;
2114 }
2115
2116 .datedue {
2117     color: #999;
2118     display: block;
2119     font-style: italic;
2120 }
2121
2122 .waitinghere,
2123 .credit {
2124     color: #669900;
2125 }
2126
2127 #mainuserblock {
2128     border: 1px solid #E8E8E8;
2129     margin-top: .5em;
2130     padding: .5em;
2131 }
2132
2133 .labeledmarc-table {
2134     border: 0;
2135 }
2136
2137 .labeledmarc-label {
2138     border: 0;
2139     color: #000000;
2140     font-size: 11pt;
2141     font-style: italic;
2142     padding: 5;
2143 }
2144
2145 .labeledmarc-value {
2146     border: 0;
2147     color: #000;
2148     font-size: 10pt;
2149     padding: 5;
2150 }
2151
2152 #marcPreview {
2153     table {
2154         border: 0;
2155         font-family: $font-monospace;
2156         font-size: 95%;
2157         margin: .7em 0 0;
2158     }
2159
2160     tbody {
2161         tr {
2162             &:nth-child(2n+1) {
2163                 td {
2164                     background-color: #FFFFFF;
2165                 }
2166             }
2167         }
2168     }
2169
2170     td {
2171         border: 0;
2172         padding: 2px;
2173         vertical-align: top;
2174     }
2175
2176     th {
2177         background-color: #FFFFFF;
2178         border: 0;
2179         padding: 2px;
2180         text-align: left;
2181         vertical-align: top;
2182         white-space: nowrap;
2183     }
2184
2185     &.modal-dialog {
2186         width: 80%;
2187     }
2188 }
2189
2190 .modal-dialog {
2191     .dialog {
2192         border-radius: 0;
2193         border-width: 1px 0 0 0;
2194         margin: 15px -15px -15px -15px;
2195         padding: 15px;
2196         text-align: left;
2197         width: unset;
2198
2199         h3 {
2200             margin: unset;
2201             text-align: left;
2202         }
2203
2204         &.alert {
2205             background: #FFFADE none;
2206             border-color: #E0C726;
2207
2208             .problem {
2209                 background-color: transparent;
2210             }
2211         }
2212
2213         &.message {
2214             background: #E8EDF6 none;
2215             border-color: #A4BEDD;
2216
2217             .problem {
2218                 background-color: transparent;
2219             }
2220         }
2221     }
2222
2223     &.modal-wide {
2224         width: 80%;
2225     }
2226 }
2227
2228 #cartDetails {
2229     background-color: #FFFFFF;
2230     border: 1px solid #739ACF;
2231     box-shadow: 1px 1px 3px 0 #666;
2232     color: #000;
2233     display: none;
2234     margin: 0;
2235     padding: 10px;
2236     text-align: center;
2237     width: 180px;
2238     z-index: 50;
2239 }
2240
2241 #cartmenulink {
2242     padding-left: 15px;
2243
2244     i.fa.fa-shopping-cart {
2245         padding-right: 7px;
2246     }
2247 }
2248
2249 #basketcount {
2250     span {
2251         display: inline;
2252         font-size: 90%;
2253         font-weight: normal;
2254         padding: 0;
2255     }
2256 }
2257
2258 #moremenu {
2259     display: none;
2260 }
2261
2262 .results_summary {
2263     color: #707070;
2264     display: block;
2265     font-size: 85%;
2266     padding: 0 0 .5em;
2267
2268     a {
2269         font-weight: normal;
2270     }
2271
2272     .label {
2273         color: #202020;
2274     }
2275 }
2276
2277 .child_fund_amount {
2278     font-style: italic;
2279 }
2280
2281 .number_box {
2282     font-size: 105%;
2283     line-height: 200%;
2284
2285     a,
2286     span {
2287         background-color: #E4ECF5;
2288         border: 1px solid #A4BEDD;
2289         border-radius: 4px;
2290         font-weight: bold;
2291         padding: .1em .4em;
2292         text-decoration: none;
2293
2294         &:hover {
2295             background-color: #EBEFF7;
2296         }
2297     }
2298 }
2299
2300 .container {
2301     border: 1px solid #EEE;
2302     margin: 1em 0;
2303     padding: 1em;
2304 }
2305
2306 .import_export {
2307     position: relative;
2308
2309     .export_ok {
2310         background: #E3E3E3 none;
2311         border: 0;
2312         cursor: pointer;
2313         margin-left: 20px;
2314         padding: 10px;
2315     }
2316
2317     .import_export_options {
2318         background: #FFFFFF;
2319         border: 1px solid #CDCDCD;
2320         left: 60px;
2321         padding: 10px;
2322         position: absolute;
2323         top: 0;
2324         width: 300px;
2325         z-index: 1;
2326     }
2327 }
2328
2329 .import_export_options {
2330     background: #E3E3E3 none;
2331     border: 0;
2332     cursor: pointer;
2333     margin-left: 20px;
2334     padding: 10px;
2335
2336     fieldset {
2337         &.rows {
2338             li {
2339                 label {
2340                     width: 16em;
2341                 }
2342             }
2343         }
2344     }
2345
2346     .importing {
2347         background: none;
2348         padding: inherit;
2349     }
2350 }
2351
2352 .form_import {
2353     fieldset {
2354         &.rows {
2355             li {
2356                 label {
2357                     width: auto;
2358                 }
2359             }
2360         }
2361     }
2362
2363     .input_import {
2364         border: 1px solid #BCBCBC;
2365     }
2366 }
2367
2368 .importing {
2369     position: relative;
2370
2371     .importing_msg {
2372         padding-bottom: 10px;
2373         padding-left: 10px;
2374     }
2375 }
2376
2377
2378 .field_hint {
2379     color: #808080;
2380     font-style: italic;
2381     padding-left: 1em;
2382 }
2383
2384 .m880 {
2385     display: block;
2386     float: right;
2387     padding-left: 20px;
2388     text-align: right;
2389     width: 50%;
2390 }
2391
2392 .advsearch {
2393     margin: 0;
2394
2395     table {
2396         border-collapse: separate;
2397         border-spacing: 5px;
2398         border-width: 0;
2399     }
2400
2401     td {
2402         border: 1px solid #EEE;
2403         padding: .3em .4em;
2404     }
2405 }
2406
2407 #circ_circulation_issue {
2408     position: relative;
2409 }
2410
2411 #clearscreen {
2412     position: absolute;
2413     right: 0;
2414     top: 0;
2415
2416     a {
2417         background-color: #EEE;
2418         border-radius: 0 0 0 5px;
2419         color: #CCC;
2420         display: block;
2421         font-size: 160%;
2422         font-weight: bold;
2423         padding: 0 .7em .2em;
2424         text-decoration: none;
2425         text-shadow: 0 -1px 0 #666;
2426
2427         &:hover {
2428             color: #CC0000;
2429         }
2430     }
2431 }
2432
2433 #printclearscreen {
2434     position: absolute;
2435     right: 43px;
2436     top: 0;
2437
2438     a {
2439         background-color: #EEE;
2440         border-radius: 0 0 0 5px;
2441         color: #CCC;
2442         display: block;
2443         font-size: 160%;
2444         font-weight: bold;
2445         padding: 0 .7em .2em;
2446         text-decoration: none;
2447         text-shadow: 0 -1px 0 #666;
2448
2449         &:hover {
2450             color: #CC0000;
2451         }
2452     }
2453 }
2454
2455 .no-image {
2456     background-color: #FFFFFF;
2457     border: 1px solid #AAAAAA;
2458     border-radius: 3px;
2459     color: #979797;
2460     display: block;
2461     font-size: 86%;
2462     font-weight: bold;
2463     text-align: center;
2464     width: 75px;
2465 }
2466
2467 #acqui_order_supplierlist {
2468     > div {
2469         &.supplier {
2470             border: 1px solid #EEEEEE;
2471             margin: .5em;
2472             padding: 1em;
2473         }
2474
2475         > div {
2476             > .baskets {
2477                 margin-top: .5em;
2478             }
2479         }
2480
2481         > span {
2482             &.action {
2483                 margin-left: 5em;
2484             }
2485
2486             &.suppliername {
2487                 display: inline;
2488                 font-size: 1.7em;
2489                 margin-bottom: .5em;
2490             }
2491         }
2492     }
2493 }
2494
2495 #ADD-contact {
2496     margin: 0 0 8px 8px;
2497 }
2498
2499 #contact-template {
2500     display: none;
2501 }
2502
2503 // Override core jQueryUI widgets
2504 .ui-widget-content {
2505     background: #FFFFFF none;
2506     border: 1px solid #B9D8D9;
2507     color: #222222;
2508 }
2509
2510 .ui-widget-header {
2511     background: #E6F0F2 none;
2512     border: 1px solid #B9D8D9;
2513     color: #222222;
2514     font-weight: bold;
2515 }
2516
2517 .ui-state-default,
2518 .ui-widget-content .ui-state-default,
2519 .ui-widget-header .ui-state-default {
2520     background: #F4F8F9 none;
2521     border: 1px solid #B9D8D9;
2522     color: #555555;
2523     font-weight: normal;
2524 }
2525
2526 .ui-state-hover,
2527 .ui-widget-content .ui-state-hover,
2528 .ui-widget-header .ui-state-hover,
2529 .ui-state-focus,
2530 .ui-widget-content .ui-state-focus,
2531 .ui-widget-header .ui-state-focus {
2532     background: #E6F0F2 none;
2533     border: 1px solid #B9D8D9;
2534     color: #212121;
2535     font-weight: normal;
2536 }
2537
2538 .ui-state-active,
2539 .ui-widget-content .ui-state-active,
2540 .ui-widget-header .ui-state-active {
2541     background: #FFFFFF none;
2542     border: 1px solid #AAAAAA;
2543     color: #212121;
2544     font-weight: normal;
2545 }
2546
2547 .ui-state-highlight,
2548 .ui-widget-content .ui-state-highlight,
2549 .ui-widget-header .ui-state-highlight {
2550     background: #FFF4C6;
2551     border: 1px solid #FED22F;
2552     color: #363636;
2553 }
2554
2555 .ui-state-error,
2556 .ui-widget-content .ui-state-error,
2557 .ui-widget-header .ui-state-error {
2558     background: #FEF1EC;
2559     border: 1px solid #CD0A0A;
2560     color: #CD0A0A;
2561 }
2562
2563 // Override jQuery Autocomplete
2564 .ui-autocomplete {
2565     box-shadow: 2px 2px 2px rgba(0, 0, 0, .3);
2566     cursor: default;
2567     position: absolute;
2568
2569     &.ui-widget-content {
2570         .ui-state-hover {
2571             background: #E6F0F2 none;
2572             border: 1px solid #B9D8D9;
2573             color: #212121;
2574             font-weight: normal;
2575         }
2576     }
2577 }
2578
2579 .ui-autocomplete-loading {
2580     background: #FFF url("../img/spinner-small.gif") right center no-repeat;
2581 }
2582
2583 // jQuery UI standard tabs
2584 .ui-menu {
2585     li {
2586         list-style: none;
2587     }
2588 }
2589
2590 .ui-tabs-nav {
2591     .ui-tabs-active a,
2592     a:hover,
2593     a:focus,
2594     a:active,
2595     span.a {
2596         background: none repeat scroll 0 0 transparent;
2597         outline: 0 none;
2598     }
2599
2600     &.ui-widget-header {
2601         background: none;
2602         border: 0;
2603     }
2604 }
2605
2606 .ui-tabs {
2607     .ui-tabs-nav {
2608         li {
2609             background: #E6F0F2 none;
2610             border: 1px solid #B9D8D9;
2611             margin-right: .4em;
2612             top: 1px;
2613
2614             &.ui-tabs-active {
2615                 background-color: #FFFFFF;
2616                 border: 1px solid #B9D8D9;
2617                 border-bottom-width: 0;
2618
2619                 a {
2620                     color: #000;
2621                     font-weight: bold;
2622                 }
2623
2624                 &.ui-state-hover {
2625                     background: #FFF none;
2626                 }
2627             }
2628
2629             &.ui-state-default {
2630                 &.ui-state-hover {
2631                     background: #EDF4F5 none;
2632                 }
2633             }
2634         }
2635     }
2636
2637     .ui-tabs-panel {
2638         border: 1px solid #B9D8D9;
2639     }
2640
2641     &.ui-widget-content {
2642         background: transparent none;
2643         border: 0;
2644     }
2645
2646     .ui-state-default {
2647         a {
2648             color: #004D99;
2649
2650             &:link,
2651             &:visited {
2652                 color: #004D99;
2653             }
2654         }
2655     }
2656
2657     .ui-state-hover {
2658         a {
2659             color: #538200;
2660
2661             &:link,
2662             &:visited {
2663                 color: #538200;
2664             }
2665         }
2666     }
2667
2668 }
2669
2670 .ui-widget {
2671     font-family: inherit;
2672     font-size: inherit;
2673
2674     input,
2675     select,
2676     textarea,
2677     button {
2678         font-family: inherit;
2679         font-size: inherit;
2680     }
2681 }
2682
2683 .statictabs {
2684     ul {
2685         background: none repeat scroll 0 0 transparent;
2686         border: 0 none;
2687         border-bottom-left-radius: 4px;
2688         border-bottom-right-radius: 4px;
2689         border-top-left-radius: 4px;
2690         border-top-right-radius: 4px;
2691         color: #222222;
2692         font-size: 100%;
2693         font-weight: bold;
2694         line-height: 1.3;
2695         list-style: none outside none;
2696         margin: 0;
2697         outline: 0 none;
2698         padding: .2em .2em 0;
2699         text-decoration: none;
2700
2701         &::after {
2702             clear: both;
2703         }
2704
2705         &::before,
2706         &::after {
2707             content: "";
2708             display: table;
2709         }
2710
2711         li {
2712             background: none repeat scroll 0 0 #E6F0F2;
2713             border: 1px solid #B9D8D9;
2714             border-bottom: 0 none;
2715             border-top-left-radius: 4px;
2716             border-top-right-radius: 4px;
2717             color: #555555;
2718             float: left;
2719             font-weight: normal;
2720             list-style: none outside none;
2721             margin-bottom: 0;
2722             margin-right: .4em;
2723             padding: 0;
2724             position: relative;
2725             top: 1px;
2726             white-space: nowrap;
2727
2728             &.active {
2729                 background-color: #FFFFFF;
2730                 color: #212121;
2731                 font-weight: normal;
2732                 padding-bottom: 1px;
2733
2734                 a {
2735                     background: none repeat scroll 0 0 transparent;
2736                     color: #000000;
2737                     cursor: text;
2738                     font-weight: bold;
2739                     outline: 0 none;
2740                     top: 1px;
2741                 }
2742             }
2743
2744             a {
2745                 color: #004D99;
2746                 cursor: pointer;
2747                 float: left;
2748                 padding: .5em 1em;
2749                 text-decoration: none;
2750
2751                 &:hover {
2752                     background-color: #EDF4F5;
2753                     border-top-left-radius: 4px;
2754                     border-top-right-radius: 4px;
2755                     color: #538200;
2756                 }
2757             }
2758         }
2759     }
2760
2761     .tabs-container {
2762         background: none repeat scroll 0 0 transparent;
2763         border: 1px solid #B9D8D9;
2764         border-bottom-left-radius: 4px;
2765         border-bottom-right-radius: 4px;
2766         color: #222222;
2767         display: block;
2768         padding: 1em 1.4em;
2769     }
2770 }
2771
2772 .authref {
2773     font-style: normal;
2774     text-indent: 4em;
2775 }
2776
2777 .seefrom,
2778 .seealso {
2779     font-style: italic;
2780     text-indent: 2em;
2781 }
2782
2783 #authfinderops {
2784     float: right;
2785 }
2786
2787 .authorizedheading {
2788     font-weight: bold;
2789 }
2790
2791 .authres_notes,
2792 .authres_seealso,
2793 .authres_otherscript {
2794     padding-top: 3px;
2795 }
2796
2797 .authres_notes {
2798     font-style: italic;
2799 }
2800
2801
2802 .contents {
2803     width: 75%;
2804
2805     .r {
2806         display: inline;
2807     }
2808
2809     .t {
2810         display: inline;
2811         font-weight: bold;
2812
2813         &:first-child {
2814             &::before {
2815                 content: "→ ";
2816             }
2817         }
2818
2819         &::before {
2820             content: "\A→ ";
2821             white-space: pre;
2822         }
2823     }
2824 }
2825
2826 .contentblock {
2827     margin-left: 2em;
2828     position: relative;
2829 }
2830
2831 #hierarchies {
2832     a {
2833         color: #069;
2834         font-weight: normal;
2835         text-decoration: underline;
2836
2837         &:hover {
2838             color: #990033;
2839         }
2840     }
2841 }
2842
2843 #didyoumeanopac,
2844 #didyoumeanintranet {
2845     float: left;
2846     width: 260px;
2847 }
2848
2849 .pluginlist {
2850     padding-bottom: 10px;
2851 }
2852
2853 .plugin {
2854     margin: 0 1em 1em 0;
2855 }
2856
2857 .pluginname {
2858     background-color: #E6F0F2;
2859     cursor: move;
2860     margin: .3em;
2861     padding-bottom: 4px;
2862     padding-left: .2em;
2863
2864     .ui-icon {
2865         float: right;
2866     }
2867 }
2868
2869 .plugindesc {
2870     padding: .4em;
2871 }
2872
2873 .ui-sortable-placeholder {
2874     border: 1px dotted #000;
2875     height: 80px;
2876     visibility: visible;
2877
2878     * {
2879         visibility: hidden;
2880     }
2881 }
2882
2883 // jQuery UI Datepicker
2884 .ui-datepicker {
2885     box-shadow: 1px 1px 3px 0 #666;
2886
2887     table {
2888         border: 0;
2889         border-collapse: collapse;
2890         font-size: .9em;
2891         margin: 0 0 .4em;
2892         width: 100%;
2893     }
2894
2895     th {
2896         background: transparent none;
2897         border: 0;
2898         font-weight: bold;
2899         padding: .7em .3em;
2900         text-align: center;
2901     }
2902 }
2903
2904 .ui-datepicker-trigger {
2905     margin: 0 0 3px -2em;
2906     vertical-align: middle;
2907 }
2908
2909 // css for timepicker
2910 .ui-timepicker-div {
2911     dl {
2912         text-align: left;
2913
2914         dd {
2915             margin: 0 10px 10px 65px;
2916         }
2917
2918         dt {
2919             height: 25px;
2920             margin-bottom: -25px;
2921         }
2922
2923         td {
2924             font-size: 90%;
2925         }
2926     }
2927
2928     .ui-widget-header {
2929         margin-bottom: 8px;
2930     }
2931 }
2932
2933 .ui-tpicker-grid-label {
2934     background: none;
2935     border: 0;
2936     margin: 0;
2937     padding: 0;
2938 }
2939
2940 .ui_tpicker_second,
2941 .ui_tpicker_millisec,
2942 .ui_tpicker_microsec {
2943     display: none;
2944 }
2945
2946 // jQuery UI Accordion
2947 .ui-accordion-header,
2948 .ui-widget-content .ui-accordion-header {
2949     font-size: 110%;
2950     font-weight: bold;
2951 }
2952
2953 video {
2954     width: 480px;
2955 }
2956
2957 // Bootstrap overrides
2958
2959 .dropdown-header {
2960     border-top: 1px solid #EEE;
2961     color: #000;
2962     font-weight: bold;
2963     margin-top: 5px;
2964     padding-left: 10px;
2965
2966     &:first-child {
2967         border-top: 0;
2968     }
2969 }
2970
2971 nav {
2972     background: #E6F0F2 none;
2973     border: 0;
2974 }
2975
2976 .navbar-collapse {
2977     background: #E6F0F2 none;
2978     box-shadow: none;
2979 }
2980
2981 .navbar-nav {
2982     li {
2983         list-style: none;
2984
2985         &.open {
2986             li {
2987                 a {
2988                     font-weight: normal;
2989                 }
2990             }
2991         }
2992
2993         a {
2994             font-weight: bold;
2995             padding-bottom: .4em;
2996             padding-top: .4em;
2997         }
2998     }
2999 }
3000
3001 .nav .open > a,
3002 .nav .open > a:hover,
3003 .nav .open > a:focus {
3004     background-color: transparent;
3005     border: 0;
3006 }
3007
3008 .nav > li > a:hover,
3009 .nav > li > a:focus {
3010     background-color: transparent;
3011     text-decoration: none;
3012 }
3013
3014 .pagination {
3015     margin:.5em .8em;
3016
3017     .active {
3018         a {
3019             background-color: #5A9EAA;
3020             border-color: #5A9EAA;
3021
3022             &:hover,
3023             &:focus {
3024                 background-color: #5A9EAA;
3025                 border-color: #5A9EAA;
3026             }
3027         }
3028
3029         span {
3030             background-color: #5A9EAA;
3031             border-color: #5A9EAA;
3032
3033             &:hover,
3034             &:focus {
3035                 background-color: #5A9EAA;
3036                 border-color: #5A9EAA;
3037             }
3038         }
3039     }
3040 }
3041
3042 button,
3043 .btn {
3044     border-color: #ADADAD #ADADAD #949494;
3045     font-family: $font-main;
3046
3047     &.btn-link {
3048         border: 0;
3049     }
3050 }
3051
3052 .btn-xs,
3053 .btn-group-xs > .btn {
3054     font-size: 10.5px;
3055     padding: 3px 5px;
3056 }
3057
3058 #toolbar {
3059     .dropdown-menu {
3060         border-top-width: 1px;
3061         font-size: 13px;
3062     }
3063
3064     &.floating {
3065         border-radius: 0;
3066         margin-top: 0;
3067     }
3068 }
3069
3070 #changelanguage {
3071     background: #FFF none;
3072     border-top: 1px solid #EEE;
3073     min-height: $language-footer-min-height;
3074
3075     .dropdown-menu {
3076         > li {
3077             > a,
3078             > span {
3079                 padding: 5px 15px;
3080             }
3081         }
3082     }
3083
3084     .navbar-text {
3085         margin: 0;
3086
3087         span {
3088             display: block;
3089             line-height: 20px;
3090         }
3091     }
3092
3093     .navbar-nav {
3094         li {
3095             a {
3096                 line-height: 20px;
3097             }
3098         }
3099     }
3100 }
3101
3102 .loggedout {
3103     color: #004D99;
3104     font-weight: bold;
3105     padding: .4em .2em;
3106 }
3107
3108 .navbar-fixed-bottom {
3109     .navbar-inner {
3110         min-height: 0;
3111         padding: .4em 0;
3112     }
3113
3114     .nav > li {
3115         border-right: 1px solid #CCC;
3116
3117         > a {
3118             font-weight: normal;
3119         }
3120
3121         &:last-child {
3122             border-right: 0;
3123         }
3124
3125         &.navbar-text {
3126             line-height: normal;
3127             padding: .4em .7em;
3128         }
3129     }
3130 }
3131
3132 .tooltip {
3133     &.bottom {
3134         .tooltip-arrow {
3135             border-bottom-color: #EEE;
3136         }
3137
3138         .tooltip-inner {
3139             background-color: #FFFFFF;
3140             border: 1px solid rgba(0, 0, 0, .2);
3141             box-shadow: 0 5px 10px rgba(0, 0, 0, .2);
3142             color: #000;
3143             font-size: 120%;
3144             padding: 1em;
3145         }
3146     }
3147 }
3148
3149 .separator {
3150     color: #666;
3151     padding: 0 .2em;
3152 }
3153
3154 .close {
3155     filter: none;
3156     float: none;
3157     font-size: inherit;
3158     font-weight: normal;
3159     line-height: 1.5;
3160     opacity: inherit;
3161     position: inherit;
3162     right: auto;
3163     text-shadow: none;
3164     top: auto;
3165
3166     &:hover {
3167         color: inherit;
3168         filter: inherit;
3169         font-size: inherit;
3170         opacity: inherit;
3171     }
3172 }
3173
3174
3175 label {
3176     .radio &,
3177     .checkbox & {
3178         margin-left: 20px;
3179         padding-left: 0;
3180     }
3181 }
3182
3183 .radio {
3184     input {
3185         &[type="radio"] {
3186             margin-left: 0;
3187             position: relative;
3188         }
3189     }
3190 }
3191
3192 .checkbox {
3193     input {
3194         &[type="checkbox"] {
3195             margin-left: 0;
3196             position: relative;
3197         }
3198     }
3199 }
3200
3201 .modal-header {
3202     .closebtn {
3203         margin-top: 4px;
3204     }
3205 }
3206
3207 .closebtn {
3208     color: #000;
3209     filter: alpha(opacity = 20);
3210     float: right;
3211     font-size: 21px;
3212     font-weight: bold;
3213     line-height: 1;
3214     opacity: .2;
3215     text-shadow: 0 1px 0 #FFFFFF;
3216
3217     &:hover,
3218     &:focus {
3219         color: #000;
3220         cursor: pointer;
3221         filter: alpha(opacity = 50);
3222         opacity: .5;
3223         text-decoration: none;
3224     }
3225 }
3226
3227 .modal-body {
3228     background-color: #FFF;
3229     overflow-y: auto;
3230
3231     fieldset,
3232     ol {
3233         background-color: transparent;
3234         border: 0;
3235         margin: 0;
3236         padding: 0;
3237     }
3238 }
3239
3240 .modal-content {
3241     background-color: #EDF4F6;
3242 }
3243
3244 .btn-group {
3245     label,
3246     select {
3247         font-size: 13px;
3248     }
3249 }
3250
3251 .tooltip-inner {
3252     white-space: pre-wrap;
3253 }
3254
3255 pre {
3256     background-color: transparent;
3257     border: 0;
3258     border-radius: 0;
3259     color: inherit;
3260     display: block;
3261     font-size: inherit;
3262     line-height: inherit;
3263     margin: 0;
3264     padding: 0;
3265     word-break: break-all;
3266     word-wrap: break-word;
3267 }
3268
3269 code {
3270     background-color: transparent;
3271     border-radius: 0;
3272     color: inherit;
3273     font-size: inherit;
3274     padding: 0;
3275 }
3276
3277 .pagination > li > a,
3278 .pagination > li > span {
3279     font-weight: bold;
3280 }
3281
3282 // End Bootstrap overrides
3283
3284 .waiting {
3285     cursor: wait;
3286 }
3287
3288 #jobpanel,
3289 #jobstatus,
3290 #jobfailed {
3291     display: none;
3292 }
3293
3294 #jobstatus {
3295     margin: .4em;
3296 }
3297
3298 #jobprogress {
3299     background: url("../img/progress.png") -300px 0 no-repeat;
3300     border: 1px solid #666;
3301     display: inline-block;
3302     height: 10px;
3303     width: 200px;
3304  }
3305
3306 .progress_panel {
3307     border: 2px solid #EEE;
3308     border-radius: 5px;
3309     clear: both;
3310     font-size: 120%;
3311     margin: 1em 0;
3312     padding: 1em;
3313 }
3314
3315 progress {
3316     width: 50%;
3317 }
3318
3319 #selections {
3320     white-space: normal;
3321     width: 100%;
3322
3323     input {
3324         margin: 0 2px;
3325         vertical-align: middle;
3326     }
3327
3328     span {
3329         background-color: #EBF3FF;
3330         border-radius: 5px;
3331         font-size: 75%;
3332         line-height: 240%;
3333         margin: 3px;
3334         padding: 3px;
3335         white-space: nowrap;
3336
3337         &.selected {
3338             background-color: #CCE0FC;
3339         }
3340     }
3341 }
3342
3343 #changepasswordf {
3344     input {
3345         &[type="text"],
3346         &[type="password"] {
3347             font-family: $font-monospace;
3348             font-size: 140%;
3349             padding: .3em;
3350         }
3351     }
3352 }
3353
3354 // Class to be added to toolbar when it starts being fixed at the top of the screen
3355
3356 .floating {
3357     box-shadow: 0 3px 2px 0 rgba(0, 0, 0, .5);
3358     z-index: 100;
3359 }
3360
3361 .inline {
3362     display: inline;
3363 }
3364
3365 .nowrap {
3366     white-space: nowrap;
3367 }
3368
3369 .tag_editor {
3370     background: transparent url("../img/edit-tag.png") top left no-repeat;
3371     display: block;
3372     float: left;
3373     height: 16px;
3374     margin: 4px;
3375     overflow: hidden;
3376     text-indent: 100%;
3377     white-space: nowrap;
3378     width: 16px;
3379 }
3380
3381 .browse-controls {
3382     margin-left: 1.1em;
3383     margin-right: .5em;
3384     padding-bottom: 1em;
3385     padding-top: 1em;
3386 }
3387
3388 #browse-return-to-results {
3389     background-color: #E8F0F6;
3390     border: 1px solid #B9D8D9;
3391     border-bottom-width: 0;
3392     border-top-left-radius: 5px;
3393     border-top-right-radius: 5px;
3394     display: block;
3395     padding: .5em;
3396     text-align: center;
3397 }
3398
3399 .browse-button {
3400     background-color: #FFF;
3401     border: 1px solid #B9D8D9;
3402     color: #004D99;
3403     display: block;
3404     overflow: hidden;
3405     padding: .4em .6em;
3406     text-align: center;
3407     white-space: nowrap;
3408     width: 100%;
3409
3410     &:hover {
3411         background: #FAFAFA;
3412     }
3413 }
3414
3415 span {
3416     &.browse-button {
3417         background: #FAFAFA;
3418         color: #222;
3419     }
3420
3421     &.circ-hlt {
3422         color: #CC0000;
3423         font-weight: bold;
3424     }
3425
3426     &.expired {
3427         color: #990000;
3428         font-style: italic;
3429     }
3430
3431     &.name {
3432         font-style: italic;
3433         font-weight: bold;
3434     }
3435
3436     &.required {
3437         color: #C00;
3438         font-style: italic;
3439         margin-left: .5em;
3440     }
3441
3442     &.important {
3443         color: #EAC117;
3444         font-style: italic;
3445         margin-left: .5em;
3446     }
3447
3448     &[class*=" label-"] {
3449         color: #FFF;
3450         display: inline;
3451         font-size: 75%;
3452         font-weight: normal;
3453         padding: .2em .6em .3em;
3454     }
3455 }
3456
3457
3458 .result-biblio-itemtype {
3459     float: right;
3460     font-size: 85%;
3461     margin: .5em;
3462     padding: .5em;
3463     text-align: center;
3464
3465     img {
3466         display: block;
3467         margin: auto;
3468         margin-bottom: 2px;
3469     }
3470 }
3471
3472 #browse-previous {
3473     border-bottom-width: 0;
3474 }
3475
3476 #browse-next {
3477     border-bottom-right-radius: 5px;
3478     border-bottom-left-radius: 5px;
3479 }
3480
3481 .loading-overlay {
3482     background-color: #FFFFFF;
3483     cursor: wait;
3484     height: 100%;
3485     left: 0;
3486     opacity: .7;
3487     position: fixed;
3488     top: 0;
3489     width: 100%;
3490     z-index: 1000;
3491
3492     div {
3493         background: transparent url("../img/loading.gif") top left no-repeat;
3494         font-size: 175%;
3495         font-weight: bold;
3496         height: 2em;
3497         left: 50%;
3498         margin: -1em 0 0 -2.5em;
3499         padding-left: 50px;
3500         position: absolute;
3501         top: 50%;
3502         width: 15em;
3503     }
3504 }
3505
3506 #merge_invoices {
3507     display: none;
3508     margin: 1em auto;
3509 }
3510
3511 #merge {
3512     margin: .5em 0 0;
3513 }
3514
3515 #merge_table {
3516     tr {
3517         &.active {
3518             td {
3519                 background-color: #FFFFCC;
3520             }
3521         }
3522     }
3523 }
3524
3525 input.renew {
3526     margin-right: 1em;
3527 }
3528
3529 .renewals {
3530     display: block;
3531     font-size: .8em;
3532     padding: .5em;
3533 }
3534
3535 .dialog input#renewonholdduedate {
3536     padding: 2px;
3537 }
3538
3539 .date-select {
3540     label {
3541         display: inline-block;
3542         width: 40%;
3543     }
3544 }
3545
3546 #newonholdduedate {
3547     display: none;
3548 }
3549
3550 #transport-types {
3551     padding-top: .5px;
3552 }
3553
3554 #i18nMenu {
3555     .navbar-text {
3556         .currentlanguage {
3557             color: #000;
3558             font-weight: bold;
3559         }
3560     }
3561
3562     a {
3563         &.currentlanguage {
3564             &:link,
3565             &:visited {
3566                 font-weight: bold;
3567             }
3568         }
3569
3570         .sublanguage-selected {
3571             color: #000;
3572             font-weight: bold;
3573         }
3574     }
3575 }
3576
3577 .onsite_checkout-select {
3578     label,
3579     #circ_circulation_issue & {
3580         font-size: inherit;
3581         font-weight: normal;
3582     }
3583 }
3584
3585 .onsite_checkout {
3586     color: #CC0000;
3587 }
3588
3589 .onsite-checkout-only {
3590     background-color: rgba(255, 242, 206, .5);
3591     border: 1px solid #FFF2CE;
3592     border-radius: 4px;
3593 }
3594
3595 .branchgriditem {
3596     background-color: #FFFFFF;
3597     border: 1px solid #B9D8D9;
3598     border-radius: 3px;
3599     display: table-cell;
3600     float: left;
3601     margin: 3px;
3602     padding: .3em;
3603 }
3604
3605 .branchgridrow {
3606     display: table-row;
3607 }
3608
3609 .branchselector {
3610     display: table;
3611 }
3612
3613 .hq-author {
3614     font-weight: bold;
3615 }
3616
3617 #cn_browser_table_wrapper > #cn_browser_table {
3618     margin: auto;
3619     width: 90%;
3620 }
3621
3622 #new_rule {
3623     background-color: #F4F8F9;
3624     border: 2px solid #B9D8D9;
3625     border-radius: 5px;
3626     display: none;
3627     margin: .3em;
3628     padding: .3em;
3629 }
3630
3631
3632 .blocks {
3633     margin-bottom: .3em;
3634 }
3635
3636 .remove_rule {
3637     font-size: 80%;
3638     padding-left: .7em;
3639 }
3640
3641 .underline {
3642     text-decoration: underline;
3643 }
3644
3645 .overline {
3646     text-decoration: overline;
3647 }
3648
3649 .order-control {
3650     padding-right: 5px;
3651 }
3652
3653 #borrower_message {
3654     margin-top: 10px;
3655 }
3656
3657 .form-group {
3658     margin-bottom: 10px;
3659
3660     label {
3661         font-weight: bold;
3662     }
3663 }
3664
3665
3666 .form-message {
3667     background-color: #FFF;
3668     border: 1px solid #A4BEDD;
3669     border-radius: 5px;
3670     margin: 1em;
3671     padding: .5em;
3672 }
3673
3674 .modal-textarea {
3675     width: 98%;
3676 }
3677
3678 #pat_member {
3679     #patron_list_dialog,
3680     #searchresults {
3681         display: none;
3682     }
3683 }
3684
3685 #patron_search {
3686     #filters {
3687         display: none;
3688     }
3689 }
3690
3691 #fixedlengthbuilderaction {
3692     border: 3px solid #E6F0F2;
3693     left: 80%;
3694     padding: 5px;
3695     position: relative;
3696     top: -80px;
3697     width: 12%;
3698 }
3699
3700 #interlibraryloans {
3701     #dataPreviewLabel {
3702         margin: .3em 0;
3703     }
3704
3705     .bg-info {
3706         overflow: auto;
3707         position: relative;
3708     }
3709
3710     .format {
3711         h4 {
3712             margin-bottom: 20px;
3713         }
3714
3715         h5 {
3716             margin-top: 20px;
3717         }
3718
3719         input {
3720             margin: 10px 0;
3721         }
3722
3723         li {
3724             list-style: none;
3725         }
3726     }
3727
3728     #add-new-fields {
3729         margin: 1em;
3730     }
3731
3732     #column-toggle,
3733     #reset-toggle {
3734         font-weight: 700;
3735         line-height: 1.5em;
3736         margin: 15px 0;
3737     }
3738
3739     #freeform-fields {
3740         .custom-name {
3741             margin-right: 1em;
3742             text-align: right;
3743             width: 9em;
3744         }
3745
3746         .delete-new-field {
3747             margin-left: 1em;
3748         }
3749     }
3750
3751     #search-summary {
3752         position: absolute;
3753         top: 50%;
3754         transform: translateY(-50%);
3755     }
3756 }
3757
3758 .ill-view-panel {
3759     margin-top: 15px;
3760
3761     .notesopac {
3762         display: inline-block;
3763     }
3764 }
3765
3766 #illfilter_dateplaced_start,
3767 #illfilter_datemodified_start,
3768 #illfilter_dateplaced_end,
3769 #illfilter_datemodified_end {
3770     width: 80%;
3771 }
3772
3773 #requestattributes {
3774     font-family: monospace;
3775     line-height: 1.3em;
3776 }
3777
3778 #ill-requests {
3779     width: 100% !important;
3780 }
3781
3782 .ar-title, .hq-title {
3783     .biblio-title {
3784         font-weight: bold;
3785     }
3786 }
3787
3788 #stockrotation {
3789     h3 {
3790         margin: 30px 0 10px 0;
3791     }
3792     .dialog {
3793         h3 {
3794             margin: 10px 0;
3795         }
3796         margin-bottom: 20px;
3797     }
3798     .highlight_stage {
3799         font-weight: bold;
3800     }
3801 }
3802
3803 #catalog_stockrotation .highlight_stage {
3804     font-weight: bold;
3805 }
3806
3807 #stockrotation {
3808     #rota_form {
3809         textarea {
3810             width: 300px;
3811             height: 100px;
3812         }
3813         #name {
3814             width: 300px;
3815         }
3816         fieldset {
3817             width: auto;
3818         }
3819     }
3820     #stage_form fieldset, #add_rota_item_form fieldset {
3821         width: auto;
3822     }
3823     .dialog.alert {
3824         ul {
3825             margin: 20px 0;
3826         }
3827         li {
3828             list-style-type: none;
3829         }
3830     }
3831 }
3832
3833 #catalog_stockrotation {
3834     .item_select_rota {
3835         vertical-align: middle;
3836     }
3837     h1 {
3838         margin-bottom: 20px;
3839     }
3840 }
3841
3842 #stockrotation td.actions, #catalog_stockrotation td.actions {
3843     vertical-align: middle;
3844 }
3845
3846 #stockrotation .stage, #catalog_stockrotation .stage {
3847     display: inline-block;
3848     padding: 5px 7px;
3849     margin: 3px 0 3px 0;
3850     border-radius: 5px;
3851     background-color: rgba(0, 0, 0, 0.1);
3852 }
3853
3854 #stage_list_headings {
3855     font-weight: bold;
3856     span {
3857         padding: 3px;
3858     }
3859 }
3860
3861 #manage_stages {
3862     ul {
3863         padding-left: 0;
3864     }
3865     li {
3866         list-style: none;
3867         margin-bottom: 5px;
3868         span {
3869             padding: 6px 3px;
3870         }
3871     }
3872     .stagename {
3873         width: 15em;
3874         display: inline-block;
3875     }
3876     .stageduration {
3877         width: 10em;
3878         display: inline-block;
3879     }
3880     .stageactions {
3881         display: inline-block;
3882     }
3883     li:nth-child(odd) {
3884         background-color: #F3F3F3;
3885     }
3886     .drag_handle {
3887         margin-right: 6px;
3888         cursor: move;
3889     }
3890     .drag_placeholder {
3891         height: 2em;
3892         border: 1px dotted #aaa;
3893     }
3894     h3 {
3895         display: inline-block;
3896     }
3897     #ajax_status {
3898         display: inline-block;
3899         border: 1px solid #bcbcbc;
3900         border-radius: 5px;
3901         padding: 5px;
3902         margin-left: 10px;
3903         background: #f3f3f3;
3904     }
3905     #manage_stages_help {
3906         margin: 20px 0;
3907     }
3908 }
3909
3910 #payForm {
3911     fieldset {
3912         &.rows {
3913             padding-left: 1em;
3914             padding-right: 2em;
3915         }
3916     }
3917 }
3918
3919 #helper {
3920     span {
3921         display: none;
3922     }
3923 }
3924
3925 #logged-in-info-full {
3926     display: none;
3927 }
3928
3929 .loggedin-menu-label {
3930     color: #777;
3931     font-size: 12px;
3932     line-height: 1.42857143;
3933     padding: 4px 12px;
3934     white-space: nowrap;
3935
3936     span {
3937         color: #000;
3938         font-weight: bold;
3939     }
3940
3941     &.divider {
3942         padding: 0;
3943     }
3944 }
3945
3946 .lastborrower {
3947     background-color: #E6F0F2;
3948     border: 1px solid #95C6D0;
3949     box-shadow: 1px 1px 1px 0 #999;
3950     color: #CC0000;
3951     margin: .4em 0;
3952     padding: .3em .5em .3em .5em;
3953 }
3954
3955 #lastborrower-ref {
3956     border-radius: 5px 0px 0px 5px;
3957     float: left;
3958 }
3959
3960 #lastborrower-remove {
3961     border-radius: 0px 5px 5px 0px;
3962     cursor: pointer;
3963     float: right;
3964 }
3965
3966 #lastborrower-window {
3967     display: none;
3968     position: absolute;
3969     right: 5px;
3970     top: 0px;
3971 }
3972
3973 /* ==== MODULE LINKS - Start ==== */
3974 .buttons-list {
3975     // List containing the module links
3976     margin-bottom: 30px;
3977     padding: 0;
3978
3979     li {
3980         // Standard attributes for the list elements
3981         list-style-type: none;
3982
3983         a {
3984             &.circ-button {
3985                 // Class used for each module link
3986                 background-color: #F4F8F9;
3987                 background-position: 5px 3px;
3988                 background-repeat: no-repeat;
3989                 border: 2px solid #B9D8D9;
3990                 border-radius: 6px;
3991                 box-sizing: content-box;
3992                 color: #000000;
3993                 display: block;
3994                 font-size: 110%;
3995                 font-weight: bold;
3996                 margin: .5em 0;
3997                 max-width: 260px;
3998                 padding: 8px;
3999                 text-decoration: none;
4000
4001                 &:hover {
4002                     // Class used for each module link hover state
4003                     border-color: #538200;
4004                     color: #538200;
4005                 }
4006             }
4007         }
4008     }
4009 }
4010
4011 .about h2 {
4012     border-bottom: 1px solid #B9D8D9;
4013     padding: .5em .2em;
4014     margin:  .5em 0;
4015 }
4016
4017 .columns-3 {
4018     columns: 3 auto;
4019     column-gap: 2.5em;
4020 }
4021
4022 .columns-4 {
4023     columns: 4 auto;
4024     column-gap: 2em;
4025 }
4026
4027 // ==== MODULE LINKS - End ====
4028
4029 #catalog-search-link {
4030     border-right: 1px solid lighten( #E6F0F2, 15% );
4031     padding-right: .3em;
4032 }
4033
4034 #catalog-search-dropdown {
4035     padding: 0;
4036
4037     & > a {
4038         border-left: 1px solid darken( #B4D2D8, 5% );
4039         margin-right: .6em;
4040         padding: .4em .6em;
4041
4042         &:hover,
4043         &.catalog-search-dropdown-hover {
4044             background-color: darken( #E6F0F2, 5% );
4045             border-left: 1px solid darken( #B4D2D8, 15% );
4046         }
4047     }
4048 }
4049
4050 .adlibris-cover {
4051     max-height: 120px;
4052 }
4053
4054 .adlibris-cover-big {
4055     max-height: 200px;
4056 }
4057
4058 #tools_holidays {
4059     .radio,
4060     .checkbox {
4061         label {
4062             margin-left: 0;
4063         }
4064     }
4065 }
4066
4067 /* Permissions */
4068
4069 #permissionstree {
4070     display: inline-block;
4071
4072     label {
4073         cursor: pointer;
4074
4075         &:hover {
4076             color: #004d99;
4077         }
4078     }
4079 }
4080
4081 .main_permission {
4082     font-size: 110%;
4083     font-weight: bold;
4084 }
4085
4086 .permissioncode {
4087     color: #666;
4088     font-style: italic;
4089 }
4090
4091 .permission-highlight {
4092     background-color: #FFC !important;
4093 }
4094
4095 .togglechildren_on,
4096 .togglechildren_off {
4097     float: right;
4098 }
4099
4100 .togglechildren_off,
4101 .children {
4102     display: none;
4103 }
4104
4105 .open {
4106     .togglechildren_off {
4107         display: inline;
4108     }
4109
4110     .togglechildren_on {
4111         display: none;
4112     }
4113 }
4114
4115 .parent {
4116     border: 1px solid #DDD;
4117     border-bottom-width: 0;
4118     padding: 5px;
4119
4120     &:last-child {
4121         border-bottom-width: 1px;
4122     }
4123
4124     &:nth-child(odd) {
4125         background-color: #F8F8F8;
4126     }
4127 }
4128
4129
4130 .superlibrarian-hint {
4131     color: #000;
4132     padding: .2em 0;
4133     text-indent: 2em;
4134 }
4135
4136 .child-flags {
4137     background-color: #FFF;
4138     border: 1px solid #DDD;
4139     border-bottom-width: 0;
4140     margin: 0 5px 0 20px;
4141     padding: 5px;
4142
4143     &:first-child {
4144         margin-top: 10px;
4145     }
4146
4147     &:last-child {
4148         border-bottom-width: 1px;
4149     }
4150
4151     &:nth-child(odd) {
4152         background-color: #EEE;
4153     }
4154 }
4155
4156 .header-menu-link {
4157     display: none;
4158     font-weight: bold;
4159     padding: .4em .6em;
4160 }
4161
4162 #user-menu {
4163     position: absolute;
4164     right: 5px;
4165     top: 0;
4166 }
4167
4168 div#makechart ol li {
4169     list-style: none;
4170 }
4171
4172 @media (min-width: 200px) {
4173
4174 }
4175
4176 @media (max-width: 767px) {
4177     .header-menu-link {
4178         display: inline-block;
4179     }
4180
4181     #catalog-search-link {
4182         display: none;
4183         padding: 0;
4184     }
4185
4186     #cartmenulink {
4187         background: transparent none;
4188         padding-left: 1.5em;
4189     }
4190
4191     #changelanguage {
4192         li {
4193             float: left;
4194
4195             li {
4196                 float: none;
4197             }
4198         }
4199
4200         .open {
4201             .dropdown-menu {
4202                 background-color: #FFF;
4203                 border: 1px solid #ccc;
4204                 position: absolute;
4205             }
4206         }
4207     }
4208
4209     #header {
4210         background-color: #FFF;
4211         border: 1px solid #CCC;
4212         margin-bottom: 1em;
4213
4214         a {
4215             font-weight: normal;
4216             padding-left: 1.5em;
4217
4218             &:hover {
4219                 background-color: #0070A9;
4220                 color: #FFF;
4221             }
4222         }
4223
4224         ul {
4225             border: 0;
4226             box-shadow: unset;
4227             float: none;
4228             left: auto;
4229             position: relative;
4230             right: auto;
4231
4232             &.dropdown-menu {
4233                 display: block;
4234             }
4235         }
4236
4237         .dropdown-menu {
4238             li {
4239                 a {
4240                     color: #004D99;
4241
4242                     &:hover {
4243                         color: #FFF;
4244                     }
4245                 }
4246             }
4247         }
4248
4249         .dropdown-toggle {
4250             display: none;
4251         }
4252     }
4253
4254     h1#logo {
4255         float: none;
4256         margin: auto;
4257     }
4258
4259     #marcPreview {
4260         margin: 0;
4261         width: auto;
4262     }
4263
4264     .navbar-fixed-bottom .nav > li {
4265         border-right: 0;
4266     }
4267
4268     #user-menu {
4269         .open {
4270             .dropdown-menu {
4271                 background-color: #FFF;
4272                 border: 1px solid #ccc;
4273                 position: absolute;
4274             }
4275         }
4276
4277         li {
4278             float: left;
4279
4280             li {
4281                 float: none;
4282             }
4283         }
4284     }
4285 }
4286
4287 @media (max-width: 768px) {
4288     .navbar-nav {
4289         li {
4290
4291             a {
4292                 padding: .4em .6em;
4293             }
4294         }
4295     }
4296 }
4297
4298 @media only screen and ( max-width: 768px ) {
4299     .browse-button {
4300         display: inline-block;
4301         width: 50%;
4302     }
4303
4304     #browse-previous {
4305         border-bottom-left-radius: 5px;
4306         border-bottom-width: 1px;
4307         border-right-width: 0;
4308     }
4309
4310     #browse-next {
4311         border-bottom-left-radius: 0;
4312         border-bottom-right-radius: 5px;
4313     }
4314 }
4315
4316 @media (min-width: 800px) {
4317
4318
4319
4320     #helper {
4321         i {
4322             display: none;
4323         }
4324
4325         span {
4326             display: inline;
4327         }
4328     }
4329
4330     #logged-in-info-full {
4331         display: inline;
4332     }
4333
4334     #logged-in-info-brief {
4335         display: none;
4336     }
4337
4338     .loggedin-menu-label {
4339         display: none;
4340     }
4341 }
4342
4343 @media only screen and ( min-width: 1200px ) {
4344     .browse-button {
4345         display: inline-block;
4346         width: 50%;
4347     }
4348
4349     #browse-previous {
4350         border-bottom-left-radius: 5px;
4351         border-bottom-width: 1px;
4352         border-right-width: 0;
4353     }
4354
4355     #browse-next {
4356         border-bottom-left-radius: 0;
4357         border-bottom-right-radius: 5px;
4358     }
4359 }