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

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