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