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

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