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

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