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

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