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