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

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