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