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