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