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

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