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

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