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