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