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

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