]> git.evergreen-ils.org Git - working/Evergreen.git/blob - Open-ILS/src/templates/opac/css/style.css.tt2
LP#1670425: Moving display of advanced search limiters on search results page
[working/Evergreen.git] / Open-ILS / src / templates / opac / css / style.css.tt2
1 [%-
2     PROCESS "opac/parts/css/colors.tt2";
3     PROCESS "opac/parts/css/fonts.tt2";
4 %]
5
6 body {
7     margin:0;
8     font-family: Arial, Helvetica, sans-serif;
9     font-size: [% css_fonts.size_base %];
10     background: [% css_colors.primary %];
11 }
12
13 button, input {
14     font-family: Arial, Helvetica, sans-serif;
15     font-size: [% css_fonts.size_base %];
16 }
17
18 img {
19     border: none;
20 }
21
22 #topnav_logo {
23     margin: 2em 0;
24 }
25
26 #homesearch_main_logo {
27     padding-top: 60px;
28     margin: auto;
29     width: 50%;
30 }
31
32 a {
33     color: [% css_colors.primary %];
34 }
35
36 #search-wrapper input[type=text] {
37     margin:0;
38     padding:0;
39 }
40
41 #search-wrapper select, .results_header_lbl select {
42     border:1px solid [% css_colors.border_standard %];
43     margin:0;
44     padding:0;
45     width: 12em;
46 }
47
48 .searchbar {
49     font-weight: bold;
50     padding-top: 10px;
51     margin-left: 1em;
52 }
53
54 .refine_search {
55     padding-bottom: 7px;
56     margin-left: 1em;
57 }
58
59 /*
60 #search-wrapper select {
61     border:0px solid [% css_colors.border_dark %];
62     filter:alpha(opacity=0);
63     -moz-opacity:0;
64     -khtml-opacity:0;
65     opacity:0;
66     padding:0;
67     margin:0;
68     height:18px;
69 }
70 */
71 h1 {
72     margin:0;
73     margin-bottom: 5px;
74     font-size: [% css_fonts.size_biggest %];
75     font-weight:normal;
76 }
77
78 h2 {
79     font-size: [% css_fonts.size_bigger %];
80     font-weight:bold;
81 }
82
83 h2.graphic880 {
84     font-size: [% css_fonts.size_bigger %];
85     font-weight:normal;
86 }
87
88 .hide_me, .hidden {
89     display: none;
90     visibility: hidden;
91 }
92
93 div.select-box-wrapper {
94     position:absolute;
95     padding-top:2px;
96     padding-left:3px;
97     overflow:hidden;
98     text-align:left;
99 }
100
101 #dash_wrapper {
102     margin-left: 0.5em;
103 }
104
105 #dash_wrapper div {
106     background: [% css_colors.primary %];
107     border-radius: 5px;
108     padding: 0em 1em;
109 }
110
111 .dash_divider {
112     margin: 1em;
113     color: [% css_colors.primary_fade %];
114     display:inline-block;
115 }
116
117 #dashboard, #dashboard_e {
118     margin-top: 1em;
119     height: 3em;
120 }
121
122 #dashboard span.dash-align a, #dashboard_e span.dash-align a {
123     font-weight: bold;
124     text-decoration: none;
125 }
126
127 #dash_user {
128     font-weight: bold;
129 }
130
131 #logout_link { left: 1px; }
132
133 #dash_checked, #dash_e_checked { color: [% css_colors.text_attention %]; }
134 #dash_holds, #dash_e_holds { color: [% css_colors.text_attention %]; }
135 #dash_pickup, #dash_e_pickup { color: [% css_colors.text_goodnews %]; }
136
137 /*  
138 #dash_fines { color: [% css_colors.text_badnews %]; }
139 the color contrast between "text_badnews" and "primary"
140 is too low for WCAG compliance.  Use "text_attention" 
141 for now until a better color is picked - if needed.
142 */
143 #dash_fines { color: [% css_colors.text_attention %]; }
144
145 #dash_wrapper #dash_user_message_button_container {
146     display: inline;
147     padding: 0;
148 }
149 #dash_wrapper #unread_message_count_floater {
150     position: absolute;
151     background-color: [% css_colors.text_alert %];
152     padding-left: 0.2em;
153     padding-right: 0.2em;
154     display: inline-block;
155     font-size: 95%;
156     border-radius: 0;
157     z-index: 2;
158     margin-top: 0.2em;
159     margin-left: -1.5em;
160 }
161
162 #header-wrap {
163     background: linear-gradient([% css_colors.primary %], [% css_colors.primary_fade %]);
164     background: -moz-linear-gradient([% css_colors.primary %], [% css_colors.primary_fade %]);
165     background: -o-linear-gradient([% css_colors.primary %], [% css_colors.primary_fade %]);
166     background: -webkit-linear-gradient([% css_colors.primary %], [% css_colors.primary_fade %]);
167     background-color: [% css_colors.primary_fade %];
168 }
169 #header {
170     color: [% css_colors.background %];
171     margin-left: 1em;
172     margin-right: 1em;
173     font-size: [% css_fonts.size_small %];
174 }
175
176 #header a {
177     color: [% css_colors.background %];
178 }
179
180 #header a:hover {
181     color: [% css_colors.text_invert %];
182     text-decoration: none;
183 }
184
185 #header-links {
186     color: [% css_colors.text_invert %];
187     font-size: [% css_fonts.size_small %];
188     font-weight: bold;
189     position: relative;
190     top:4px;
191     
192 }
193
194 #header-links a {
195     color: [% css_colors.text_invert %];
196     display: block;
197     float:left;
198     margin-right:22px;
199     text-decoration: none;
200 }
201
202 #header-links a:hover {
203     color: [% css_colors.text_invert %];
204     text-shadow: 0 0 0.2em [% css_colors.primary %], 0 0 0.2em [% css_colors.primary %];
205     text-decoration: none;
206 }
207
208 #header #header-links2 {
209     position:relative;
210     top:-8px;
211     color: [% css_colors.text_invert %];
212     padding-bottom: 15px;
213 }
214
215 #header #header-links2 a {
216     color: [% css_colors.text_invert %];
217 }
218
219 #header #header-links2 a:hover {
220     text-decoration: underline;
221 }
222
223 #your-acct-login {
224     padding-top:2em;
225 }
226
227 #gold-links {
228     margin-left: 1em;
229     padding-left:0px;
230 }
231
232 #gold-links-home {
233     margin:auto;
234     padding-left:0px;
235 }
236
237 #gold-links-holder {
238     height: 24px;
239     background: [% css_colors.background_invert %];
240 }
241
242 #util-bar {
243     margin-left: 1em;
244     padding-left:0px;
245     height:0px;
246 }
247
248 #search-wrapper {
249     border-bottom: 1px solid [% css_colors.border_standard %];
250     padding-bottom: 5px;
251     background: [% css_colors.background %];
252 }
253
254 #search-wrapper #breadcrumb {
255     margin-top:0px;
256     font-size: [% css_fonts.size_smaller %];
257     float:left;
258 }
259
260 #search-wrapper #search-within {
261     margin-top:10px;
262     float:right;
263     position:relative;
264     left:-173px;
265 }
266
267 #search-wrapper #breadcrumb a {
268     color: [% css_colors.text %];
269 }
270
271 #search-wrapper #search_frm label {
272     font-size: [% css_fonts.size_smaller %];
273 }
274
275 #search-wrapper #search-box {
276     margin-left: 1em;
277     padding-left: 0px;
278     padding-top: 10px;
279     padding-bottom: 10px;
280 }
281
282 #adv_search_tabs, #acct_tabs, #acct_fines_tabs, #acct_checked_tabs, #acct_holds_tabs, #acct_prefs_tabs, #results_header_inner{
283     margin-left: 2px;
284     overflow: auto;
285 }
286
287 #adv_search_tabs a, #acct_tabs a, #acct_fines_tabs a, #acct_checked_tabs a, #acct_holds_tabs a, #acct_prefs_tabs a {
288     float: left;
289     text-align: center;
290     vertical-align: middle;
291     display: block;
292     margin: 10px 7px 0px 0px;
293     padding: 10px 0px 10px 0px;
294     -moz-border-radius: 10px 10px 0px 0px; 
295     border-radius: 10px 10px 0px 0px;
296     font-weight: bold;
297     color: [% css_colors.text_invert %];
298     background: [% css_colors.control %];
299     font-weight: bold;
300     text-decoration: none;
301 }
302
303 #adv_search_tabs a, #acct_tabs a, #acct_fines_tabs a {
304     padding: 1em 1em 0.5em;
305 }
306
307 #adv_search_tabs a:hover, #acct_tabs a:hover, #acct_fines_tabs a:hover, #acct_checked_tabs a:hover, #acct_holds_tabs a:hover, #acct_prefs_tabs a:hover {
308     background: [% css_colors.primary %]; 
309     color: [% css_colors.text_invert %];
310     text-decoration: none;
311 }
312
313 #adv_search_filters {
314     position: relative;
315 }
316 #adv_search_rows {
317     border-bottom: none;
318 }
319 .adv_filter_block {
320     padding: 15px;
321     float: left;
322     clear: both;
323 }
324 .adv_filter_block_item {
325     float: left;
326     padding: 5px;
327 }
328
329 #adv_special_block {
330     float: left;
331     padding: 5px;
332     margin-top: 5px;
333 }
334
335 #adv_search_submit {
336     position: relative;
337     margin-left: 10px;
338
339 }
340
341 .checkbox_col {
342     width: 1%;
343     padding-left: 10px !important;
344 }
345
346 #adv_search.on, #num_search.on, #expert_search.on {
347     color: [% css_colors.accent_darker %];
348     background: [% css_colors.background %];
349     text-decoration: none;
350 }
351
352 #adv_search_tabs a.acct-tab-on, #acct_tabs a.acct-tab-on, #acct_fines_tabs a.acct-tab-on {
353     color: [% css_colors.accent_darker %];
354     background: [% css_colors.background %];
355     text-decoration: none;
356 }
357
358 .acct-tab-off {
359     background: [% css_colors.control %];
360 }
361
362 #acct_checked_tabs a, #acct_holds_tabs a, #acct_prefs_tabs a {
363     margin-top: 0px;
364     font-size: [% css_fonts.size_smaller %];
365     color: [% css_colors.accent_darker %];
366     padding: 10px 10px 10px 10px;
367 }
368
369 #acct_checked_tabs div.selected a, #acct_holds_tabs div.selected a, #acct_prefs_tabs div.selected a {
370     background: [% css_colors.accent_lightest %];
371     color: [% css_colors.accent_darker %];
372 }
373
374 #acct_checked_tabs, #acct_holds_tabs, #acct_prefs_tabs {
375     padding-bottom: 12px;
376     color: [% css_colors.accent_medium %];
377 }
378
379 #acct_select, #acct_prefs_select {
380      display: none;
381 }
382
383 #mobile_acct_search_links {
384       background: [% css_colors.primary_fade %];
385 }
386
387 .rdetail_header {
388     padding: 5px 7px 6px 0px;
389     margin-left: 1em;
390     border-bottom: 1px dotted [% css_colors.accent_light %];
391 }
392
393 .rdetail_results a {
394     color:[% css_colors.primary_fade %];
395     font-weight:bold;
396     font-size: [% css_fonts.size_bigger %];
397 }
398
399 .rdetail_result_count {
400     color: [% css_colors.text %];
401     font-weight: normal;
402     padding-left: 1em;
403     display: inline-block;
404 }
405
406 .rdetail_result_nav {
407     font-weight:normal;
408     padding-left: 1em;
409     display: inline-block;
410 }
411
412 #rdetail_details_table {
413     margin-top: 15px;
414 }
415
416 #rdetail_image { border: none; }
417 #rdetail_image_cell {
418     padding-top: 3px;
419     padding-right: 10px;
420 }
421
422 h2.rdetail_uris {
423     margin-top: 1em;
424 }
425 div.rdetail_uris {
426     padding: 0.5em 1em 0.5em 1em;
427     background-color: [% css_colors.accent_lighter2 %];
428 }
429 div.rdetail_uris ul li {
430     position: relative;
431     left: 1em;
432 }
433
434 div.rdetail_show_copies {
435     margin-top: 1em;
436 }
437
438 div#rdetail_actions_div {
439     float: right;
440     background: [% css_colors.background %];
441 }
442
443 span#rdetail_copy_counts {
444     display: inline-block;
445     border-right: thin;
446     vertical-align: top;
447     margin-right: 1em;
448     padding-right: 1em;
449 }
450
451 span#rdetail_hold_counts {
452     display: inline-block;
453     vertical-align: top;
454 }
455 span#rdetail_hold_counts p {
456     padding-left: 2em;
457 }
458
459 #rdetail_image_div {
460     float: left;
461     margin-right: 1em;
462 }
463
464 .rdetail_aux_utils {
465     border-left:1px dotted [% css_colors.accent_light %];
466     padding-left: 17px;
467     padding-bottom: 6px;
468     padding-right: 70px;
469 }
470
471 div.place_hold {
472     border-bottom: 1px dotted [% css_colors.accent_light %];
473     padding-top: 10px;
474 }
475
476 div.toggle_list { padding-top: 6px; }
477
478 div.share_record {
479     padding-top: 6px;
480     border-top: 1px dotted [% css_colors.accent_light %];
481 }
482
483 div.format_icon {
484     float: right;
485     margin-right: 17px;
486 }
487
488 #metarecord_population {
489     overflow: hidden;
490     width: 40%;
491     padding-bottom: 10px;
492 }
493
494 .metarecord_population_span_link {
495     line-height: 20px;
496 }
497
498 .metarecord_population_format {
499     border-right: thin;
500     display: inline-block;
501     margin-right: 1em;
502     padding-right: 1em;
503     vertical-align: top;
504 }
505
506 .metarecord_population_item_lang {
507     display: inline-block;
508     vertical-align: top;
509 }
510
511 .metarecord_population_all {
512     padding-top:10px;
513 }
514
515 .result_util {
516     border-bottom: 1px dotted [% css_colors.accent_light %];
517     padding-top: 6px;
518 }
519
520 .results_aux_utils {
521     display: table-cell;
522 }
523
524 .result_util {
525     padding-left: 1em;
526 }
527
528 .results_reviews {
529     top: -5px;
530 }
531
532 #rdetail_copies {
533     padding-top: 1.5em;
534 }
535
536 #rdetails_status td {
537     padding: 7px 0px 3px 13px;
538     white-space: nowrap;
539 }
540
541 #rdetails_status td[headers=copy_header_library], 
542 #rdetails_status td[headers=copy_header_shelfloc] {
543     white-space: normal;
544 }
545
546 #rdetails_status thead th {
547     background-color: [% css_colors.accent_lighter2 %];
548     padding: 13px 0px 13px 13px;
549     font-size: [% css_fonts.size_smaller %];
550     font-weight: bold;
551     text-align: left;
552 }
553
554 #rdetails_status tbody td {
555     padding-left: 13px;
556     text-align: left;
557 }
558 #rdetails_status tbody td.copy_note {
559     color: [% css_colors.primary %];
560     text-wrap:normal;
561     white-space:pre-wrap !important;
562     word-wrap:normal;
563 }
564
565 .rdetail_extras {
566     background: [% css_colors.primary_fade %];
567     border: 1px solid [% css_colors.primary %];
568     padding-top:1px;
569     clear:both;
570 }
571
572 #rdetail_extras_div {
573     margin: 1em 0;
574 }
575
576 .rdetail_extras_hr {
577     height: 1px;
578     background: [% css_colors.accent_light %];
579     margin-left: 1px;
580     margin-right: 1px;
581 }
582
583 .rdetail_extras_link {
584     padding: 6px 12px;
585     font-size: [% css_fonts.size_smaller %];
586     font-weight: bold;
587 }
588
589 .rdetail_extras_lbl {
590     color: [% css_colors.text_invert %];
591     text-decoration: none;
592 }
593
594 ##rdetail_extras_expand, #rdetail_extras_collapse, #rdetail_locs_collapse {
595     margin-left: 13px;
596 }
597
598 #rdetail_locs_expand, #rdetail_locs_collapse {
599     padding-bottom:3px;
600     margin-top:15px;
601     margin-left:13px;
602 }
603
604 #rdetail_anotes_div .biography {
605     margin:0;
606 }
607
608 .almost-content-wrapper {
609     background: [% css_colors.background %];
610 }
611
612 #content-wrapper {
613     background: [% css_colors.background %];
614     min-height: 260px;
615     border-bottom: 1px solid [% css_colors.border_dark %];
616 }
617
618 .content-wrapper-record-page { top: -15px; position: relative; }
619
620 #main-content-home {
621     padding-left: 17px;
622     margin-left: 1em;
623 }
624 #main-content {
625     padding-left: 0px;
626     margin: 0 1em;
627     clear: both;
628 }
629
630 #main-content-after-bar {
631     margin-left: 1em;
632     padding-left: 4px;
633 }
634
635 #results-side-bar { float: left; width: 174px; margin-right: 5px; background: [% css_colors.background %]; }
636
637 #main-content .login_boxes {
638     border: 1px solid [% css_colors.accent_lighter %];
639     background: linear-gradient(bottom, [% css_colors.accent_ultralight %] 15%, [% css_colors.accent_lightest %] 55%, [% css_colors.accent_ultralight %] 85%);
640     background: -moz-linear-gradient(bottom, [% css_colors.accent_ultralight %] 15%, [% css_colors.accent_lightest %] 55%, [% css_colors.accent_ultralight %] 85%);
641     background: -ms-linear-gradient(bottom, [% css_colors.accent_ultralight %] 15%, [% css_colors.accent_lightest %] 55%, [% css_colors.accent_ultralight %] 85%);
642     background: -o-linear-gradient(bottom, [% css_colors.accent_ultralight %] 15%, [% css_colors.accent_lightest %] 55%, [% css_colors.accent_ultralight %] 85%);
643     background: -webkit-linear-gradient(bottom, [% css_colors.accent_ultralight %] 15%, [% css_colors.accent_lightest %] 55%, [% css_colors.accent_ultralight %] 85%);
644
645     color: [% css_colors.accent_darker %];
646 }
647
648 #main-content .login_boxes h1 {
649     font-weight: normal;
650     font-size: [% css_fonts.size_biggest %];
651     margin:0;
652 }
653
654 #main-content .left_brain {
655     padding-left:28px;
656     padding-top:25px;
657 }
658
659 #main-content .left_brain input[type=text], #main-content .left_brain input[type=password] {
660     width:167px;
661     margin:0;
662     padding:0;
663     background: [% css_colors.background %];
664     font-size: [% css_fonts.size_bigger %];
665     color: [% css_colors.text %];
666 }
667
668 #main-content .left_brain .input_bg {
669     padding:10px 10px 0px 13px;
670     width:167px;
671     height:29px;
672 }
673
674 .login-help-box {
675     float: left;
676     width: 200px;
677     text-align: center;
678     margin-left: 2em;
679 }
680
681 .login-help-button {
682     font-size: [% css_fonts.size_biggest %];
683     padding: 1.5em;
684 }
685
686 #login-failed-message {
687     font-size: [% css_fonts.size_bigger %];
688     font-weight: bold;
689     color: [% css_colors.text_alert %];
690     padding-top: 1em;
691 }
692
693 #holds_temp_parent td {
694     border-bottom:1px solid [% css_colors.border_standard %];
695 }
696
697 #holds_temp_parent input, #holds_temp_parent select {
698     margin:0;
699 }
700
701 #holds_temp_parent tr td div {
702     margin-top: 10px;
703     margin-bottom: 10px;
704 }
705
706 #holds_temp_parent tr td div.format_icon {
707     margin-top: 6px;
708     margin-bottom: 6px;
709     float: none;
710 }
711
712 #results_header_bar {
713     background: [% css_colors.accent_medium %];
714     border-top:1px solid [% css_colors.accent_mediumdark %];
715     border-bottom:1px solid [% css_colors.accent_mediumdark %];
716 }
717
718 .results_header_lbl {
719     font-weight: bold;
720     float: left;
721     color: [% css_colors.text %];
722     /* this border is not visible, but it keeps these labels the same size
723     as the buttons */
724     border: 1px solid [% css_colors.accent_medium %];
725     background: [% css_colors.accent_medium %];
726     margin: 0.5em 0.3em;
727     padding: 0.3em;
728 }
729 /* we need a negative margin on the select to allow the containing <label>
730 to determine the actual size of the element.  By doing this, we can increase
731 the odds that the buttons and the select will be the same size, and therefore
732 collapse correctly when the window width decreases */
733 .results_header_lbl select {
734     margin: -0.5em 0;
735 }
736
737 #limit_to_available {
738     vertical-align: middle;
739 }
740
741 .results_header_sel {
742     /* width: 88px; */
743     float:left;
744     margin:0;
745 }
746
747 .results_header_nav1 {
748     padding: 5px 7px 6px 0px;
749     border-bottom: 1px dotted [% css_colors.accent_light %];
750 }
751
752 .results_header_nav1 .h1 {
753     font-size: [% css_fonts.size_bigger %];
754     font-weight:bold;
755     color:[% css_colors.primary_fade %];
756 }
757
758 .table_no_border_space {
759   border-spacing: 0px;
760 }
761 .table_no_cell_pad td {
762   padding: 0px;
763 }
764 .table_no_border {
765   border-collapse: collapse;
766 }
767
768 #result_table_table {
769   margin-top:10px;
770 }
771
772 #result_table_div {
773     margin-top: 1em;
774 }
775
776 tr.result_table_row > td.results_row_count,
777 tr.result_table_row > td.result_table_pic_header,
778 tr.result_table_row > td.result_table_title_cell {
779     vertical-align: top;
780 }
781
782 .result_metadata {
783     float: left;
784     width: 30em;
785     padding-right: 2em;
786 }
787
788 tr.result_table_row:nth-child(n+2) > td {
789     border-top: 1px solid [% css_colors.accent_lighter2 %];
790 }
791
792 tr.result_table_row > td.result_table_pic_header {
793     white-space: nowrap;
794     width: 78px;
795     padding-left: 1em;
796 }
797
798 .result_number {
799     padding-left: 1em;
800     white-space: nowrap;
801 }
802
803 .result_count_number {
804    font-weight: bold;
805 }
806
807 .result_table_subtable {
808     width: 100%;
809     padding-top: 1em;
810 }
811
812 div.result_table_utils_cont {
813     text-align:left;
814     float: left;
815 }
816
817 .icon_text {
818 }
819
820 #myopac_summary_div p {
821     margin:0;
822     margin-bottom: 10px;
823 }
824
825 #acct_sum_checked_table td {
826     padding-bottom:5px;
827 }
828
829 .zero_search_hits_main { float:left; width:300px; margin-top: 2ex; }
830 .zero_search_hits_saved { float:left; width:200px; margin-top: 2ex; margin-right: 2em; }
831
832 #zero_search_hits p {
833     margin-top:0;
834 }
835
836 #zero_hits_term {
837     font-weight: bold;
838 }
839
840 #zero_search_hits #spell_check_link {
841 }
842
843 #zero_search_hits #zero_hits_suggestions {
844 }
845
846 #lowhits_help {
847     float: right;
848     width: 353px;
849     background: [% css_colors.accent_light %];
850     padding: 10px;
851     margin-top: 7px;
852 }
853
854 .results_info_table td {
855     padding-right: 10px;
856 }
857
858 #myopac_holds_main_table {
859     border-collapse: collapse;
860 }
861
862 #myopac_holds_main_table td {
863     border: 1px solid [% css_colors.border_dark %];
864     
865 }
866
867 .myopac-hold-available {
868     color: [% css_colors.text_greatnews %];
869     font-weight: bold;
870 }
871
872 .myopac-hold-suspended {
873     color: [% css_colors.text_badnews %];
874     font-weight: bold;
875 }
876
877 #myopac_prefs_div .data_grid {
878     border-collapse:collapse;
879 }
880
881 #myopac_prefs_div .data_grid td {
882     background:[% css_colors.accent_ultralight %];
883     border-bottom:3px solid [% css_colors.background %];
884     padding:6px 0px 7px 17px;
885 }
886
887 .header_middle {
888     height:22px;
889     font-size: [% css_fonts.size_bigger %];
890     font-weight:bold;
891     color:[% css_colors.primary_fade %];
892     padding: 0px 7px 0px 0px;
893     border-bottom: 1px dotted [% css_colors.accent_light %];
894     clear: both;
895 }
896
897 .header_middle a {
898     font-weight: normal;
899 }
900
901 #acct_sum_block {
902      float:left;
903      clear:left;
904 }
905
906 .acct_sum_table {
907     border-collapse: collapse;
908     background: [% css_colors.accent_ultralight %];
909 }
910
911 .acct_sum_table tr {
912     border-bottom: 2px solid white;
913 }
914
915 .acct_sum_table td {
916     padding: 1em;
917 }
918
919 .acct_sum_table a {
920     text-transform: none;
921     position:relative;
922     top:-1px;
923 }
924
925 .acct_sum_table .view_link {
926     font-weight: normal;
927 }
928
929 #myopac_sum_fines {
930     float:right;
931     padding: 15px 0px 0px 23px;
932     background: [% css_colors.accent_ultralight %];
933     width: 177px;
934     height: 166px;
935 }
936
937 #myopac_sum_fines_placehold { float: right; width: 177px; height: 166px; }
938
939 .acct_holds_temp td {
940     text-align: left;
941 }
942
943 #acct_checked_tabs .align, #acct_holds_tabs .align, #acct_prefs_tabs .align {
944     float:left;
945     /*padding-left:10px;*/
946 }
947
948 #acct_checked_main_header, #acct_holds_main_header, #acct_checked_hist_header, #acct_holds_hist_header, #acct_list_header, #acct_list_header_anon, #temp_list_holds, #acct_messages_main_header, #ebook_circs_main_table, #ebook_holds_main_table {
949     border-collapse: collapse;
950 }
951
952 .hold_notes {
953     text-transform: none;
954     font-weight: normal;
955 }
956
957 .hold_note_title { font-weight: bold; }
958
959 #acct_checked_main_header td, #acct_holds_main_header td, #acct_checked_hist_header td, #acct_holds_hist_header td, #acct_list_header td, #acct_list_header_anon td, #temp_list_holds td, #acct_messages_main_header, #ebook_circs_main_table td, #ebook_holds_main_table td {
960     background: [% css_colors.accent_lighter2 %];
961     padding: 10px;
962 }
963
964 #acct_checked_main_header th, #acct_holds_main_header th, #acct_checked_hist_header th, acct_holds_hist_header th, #acct_list_header th, #acct_list_header_anon th, #temp_list_holds th, #acct_messages_main_header, #ebook_circs_main_table th, #ebook_holds_main_table th {
965     text-align: left;
966     padding: 0px 10px 0px 10px;
967 }
968
969 #acct_list_header select, #acct_list_header_anon select {
970     font-weight:normal;
971     text-transform:none;
972 }
973
974 .search_catalog_lbl {
975     font-size: [% css_fonts.size_bigger %];
976 }
977 .adv_search_catalog_lbl {
978     font-size: [% css_fonts.size_bigger %];
979 }
980
981 .browse_the_catalog_lbl {
982     font-size: [% css_fonts.size_bigger %];
983 }
984
985 .lbl1 {
986     font-size: [% css_fonts.size_bigger %];
987     font-weight:bold;
988 }
989
990 .lbl2 {
991     font-size: [% css_fonts.size_smaller %];
992     font-weight:normal;
993     position:relative;
994     top:3px;
995     max-width:300px;
996 }
997
998 #myopac_tabs, #adv_search_parent, #fines_payments_wrapper {
999     background: [% css_colors.primary_fade %];
1000     padding-top:5px;
1001     margin-bottom:20px;
1002 }
1003
1004 #fines_payments_wrapper {
1005     padding-left: 5px; 
1006     padding-right: 5px;
1007 }
1008
1009 .myopac_payments_table th { text-align: left; }
1010 .myopac_payments_table thead th { border-bottom: 1px dashed [% css_colors.accent_darker %]; }
1011 .myopac_payments_table thead th:first-child { width: 8em; }
1012 .myopac_payments_table tbody tr:nth-child(odd) { background-color: [% css_colors.accent_lighter %]; }
1013 .myopac_payments_table form { display: inline; }
1014 .myopac_payments_table input[type="submit"] { padding: 1px; }
1015
1016 .payment-error {
1017     font-weight: bold; color: [% css_colors.text_alert %];
1018     padding: 10px; border: 1px solid [% css_colors.accent_medium_dark %];
1019 }
1020
1021 .payment-processing {
1022     font-weight: bold;
1023     color: [% css_colors.text_greatnews %];
1024     font-size: [% css_fonts.size_bigger %];
1025     padding: 10px; border: 1px solid [% css_colors.accent_medium_dark %];
1026     text-align: center;
1027 }
1028 #adv_search_input { width: 100%; }
1029 #adv_search_parent {
1030     margin-bottom:0px;
1031 }
1032 #search-submit-spinner {
1033     height: 16px;
1034     width: 16px;
1035 }
1036 div.adv_search_available {
1037     margin-top: 1em;
1038 }
1039
1040 #myopac_loading {
1041     width:100%;
1042     text-align:center;
1043     padding-top:20px;
1044     font-size: [% css_fonts.size_bigger %];
1045     font-weight:bold;
1046 }
1047
1048 .chili_link {
1049     width:100px !important;
1050     text-align: center !important;
1051 }
1052
1053 .chili_review div.chili_link div {
1054     margin: auto;
1055 }
1056
1057 /* styling for advanced search filters that display with searchbar */
1058
1059 #adv_filter_results_block h4 { display: inline; }
1060
1061 #adv_filter_results_block {
1062     margin-top: 10px;
1063     margin-bottom: 16px;
1064 }
1065
1066 .adv_filter_results_block_label {
1067     font-weight:bold;
1068     padding: 4px 6px 4px 12px;
1069 }
1070
1071 .adv_filter_results_group {
1072     font-size: 12px;
1073     display: inline-block;
1074     background:  [% css_colors.accent_lighter2 %];
1075     border-style: solid;
1076     border-color: [% css_colors.accent_medium %];
1077     border-width: 1px;
1078     border-radius: 4px;
1079     padding: 2px 4px 2px 4px;
1080     margin-right:6px;
1081 }
1082
1083 .remove_filter {
1084    font-size: 16px;
1085    margin-left: 3px;
1086  }
1087
1088 a.remove_filter {
1089     text-decoration: none;
1090     color: [% css_colors.accent_dark %];
1091 }
1092
1093 [%- IF we_want_to_turn_on_facet_styling.defined; %]
1094 /* some facet styling */
1095 .facetClassContainer { margin: 2px; border: 1px solid [% css_colors.accent_light %]; }
1096 .facetClassLabelContainer { border: 1px solid [% css_colors.accent_light %]; }
1097 .facetClassLabel { font-weight: bold; text-align: center; }
1098 .facetFieldContainer {  }
1099 .facetFieldLabel { padding-left: 2px; margin-top: 5px; margin-bottom: 5px; font-weight: bold; text-align: left; }
1100 .extraFacetFieldsWrapper { }
1101 .toggleExtraFacetFieldsButton { float: right; margin: 0px; padding: 0px; }
1102 .facetFieldLineCount {
1103     display: inline-block;
1104     border-right: 1px solid [% css_colors.accent_light %];
1105     color: [% css_colors.accent_mediumdark %];
1106     width: 3em;
1107     margin-right: 3px
1108 }
1109 .facetField { border-top: 1px solid [% css_colors.accent_light %]; }
1110 .facetFields { padding-left: 5px; }
1111 .facetFieldLineValue { overflow: hidden; text-overflow: ellipsis; }
1112 [%- END -%]
1113
1114 div#facet_sidebar {
1115     float: left;
1116     margin-right: 1em;
1117 }
1118
1119 .facet_box_temp {
1120     padding-bottom:3px;
1121 }
1122
1123 .facet_box_temp .header {
1124     height: 2.3em;
1125     background:[% css_colors.primary %];
1126     -moz-border-top-left-radius: 5px;
1127     border-top-left-radius: 5px;
1128     -moz-border-top-right-radius: 5px;
1129     border-top-right-radius: 5px;
1130     font-weight:bold;
1131     color:[% css_colors.text_invert %];
1132     padding-top:4px;
1133 }
1134
1135 .facet_box_temp.filter_box_temp .header {
1136     background: [% css_colors.background_invert %] !important;
1137 }
1138
1139 .filter_box_label {
1140     color: [% css_colors.background_invert %];
1141     font-weight:bold;
1142     padding-top:4px;
1143     padding-bottom:4px;
1144     padding-left:12px;
1145 }
1146
1147 .facet_box_temp .header .title {
1148     float:left;
1149     padding-top:6px;
1150     padding-left:12px;
1151 }
1152
1153 /* in this context, where h4 is primarily for structure, 
1154    avoid the normal large font and margin for h4's */
1155 .facet_box_temp h4 {
1156     font-size : 100%; 
1157     margin: 0px;
1158 }
1159
1160 .facet_box_temp .header a.button {
1161     float:right;
1162     padding-top:6px;
1163     padding-right:6px;
1164     color:[% css_colors.text_invert %];
1165 }
1166
1167 .facet_box_wrapper .box_wrapper .box {
1168     border-top:1px solid [% css_colors.border_standard %];
1169     border-left:1px solid [% css_colors.border_standard %];
1170     border-right:1px solid [% css_colors.border_standard %];
1171     padding: 0 0.5em;
1172     width: 14em;
1173     overflow: hidden;
1174 }
1175
1176 .filter_box_wrapper {
1177     margin-bottom: 3px;
1178     padding: 2px;
1179     border: 1px solid [% css_colors.background_invert %];
1180     -moz-border-radius: 3px;
1181     border-radius: 3px;
1182     font-weight:bold;
1183     padding-top:4px;
1184 }
1185
1186 .facet_template {
1187     box-sizing: border-box;
1188     -moz-box-sizing: border-box;
1189     display: table;
1190     margin: 0.5em 0;
1191     width: 100%;
1192 }
1193
1194 .facet_template div {
1195     display: table-cell;
1196     padding: 2px;
1197 }
1198
1199 .facet_template.filter_template div {
1200     padding: 0px !important;
1201 }
1202
1203 .facet_template .count {
1204     text-align: right;
1205     color: [% css_colors.accent_mediumdark %];
1206 }
1207
1208 .facet_template_selected {
1209     background-color: [% css_colors.accent_lighter2 %];
1210     border: 1px solid [% css_colors.accent_medium %];
1211 }
1212
1213 #footer-wrap {
1214     background: linear-gradient([% css_colors.primary_fade %], [% css_colors.primary %]);
1215     background: -moz-linear-gradient([% css_colors.primary_fade %], [% css_colors.primary %]);
1216     background: -o-linear-gradient([% css_colors.primary_fade %], [% css_colors.primary %]);
1217     background: -webkit-linear-gradient([% css_colors.primary_fade %], [% css_colors.primary %]);
1218     background-color: [% css_colors.primary %];
1219 }
1220
1221 #footer {
1222     padding-top:5px;
1223     padding-bottom: 10px;
1224     margin-left: 1em;
1225     font-size: [% css_fonts.size_small %];
1226 }
1227
1228 #footer a {
1229     color: [% css_colors.text_invert %];
1230     text-decoration: none;
1231     text-shadow: 0 0 0.2em [% css_colors.primary %], 0 0 0.2em [% css_colors.primary %];
1232 }
1233
1234 #copyright_text, #footer_logo {
1235     color: [% css_colors.text_invert %];
1236 }
1237
1238 .color_4 {
1239     font-weight: bold;
1240 }
1241
1242 .advanced_div { padding-top: 15px; }
1243 #adv_global_search { width: 100%; }
1244 #adv_global_search select { width: 13em; }
1245 #adv_global_addrow td { padding-top: 7px; }
1246 #adv_global_input_table { width: 100%; }
1247 #adv_global_input_table select { width: 7em; }
1248 .adv_adv_link {
1249     font-size: [% css_fonts.size_smaller %];
1250     color: [% css_colors.text_alert %];
1251 }
1252 #acct_prefs_header { float: left; }
1253 .search_page_nav_link {
1254     cursor: pointer;
1255     padding-left: 1em;
1256 }
1257 #opac.result.sort { width: 160px; }
1258 .renew-summary, .message-update-summary { font-size: [% css_fonts.size_bigger %]; font-style: italic; margin: 0.5ex 0; }
1259 .failure-text { margin-left: 4em; font-style: italic; color: [% css_colors.text_alert %]; }
1260 .refine-controls { font-size: [% css_fonts.size_bigger %]; padding: 0.5ex 0; }
1261 #adv_search_refine input[type=text] { border: 1px inset [% css_colors.accent_light %] !important; }
1262 #adv_search_refine select { border: 1px inset [% css_colors.accent_light %] !important; }
1263 #adv_search_refine {
1264     padding-left: 5em; background-color: [% css_colors.accent_lighter2 %]; margin: 2ex 0;
1265 }
1266 .row-remover { position: relative; top: 1px; vertical-align: middle; }
1267 .subtle-button {
1268     background-color: [% css_colors.background %];
1269     color: [% css_colors.primary %]; text-decoration: none;
1270     padding: 0; border: 0; margin: 0;
1271     vertical-align: middle;
1272 }
1273 .subtle-button:hover { text-decoration: underline; cursor: pointer; }
1274 .no-dec:hover { text-decoration: none; }
1275 .pending-addr td { background-color: [% css_colors.background_alert %] !important; border: 0 !important; }
1276
1277 #account-update-email table { text-align: center; padding: 20px; margin-top: 18px; border-collapse: collapse; }
1278 #account-update-email table td { padding: 5px 15px 5px 15px; border-bottom: 1px solid [% css_colors.accent_lighter %]; text-align: left;}
1279 #account-update-email-error { font-size: [% css_fonts.size_biggest %]; padding: 10px; border:1px solid [% css_colors.border_standard %];}
1280 a.dash-link:hover { text-decoration: underline !important; }
1281 #list_create_table td { vertical-align: middle; padding: 0 8px; }
1282 #list_create_table {
1283     background-color: [% css_colors.accent_light %];
1284     padding-bottom: 4px;
1285     margin-bottom: 10px;
1286     border-bottom: 1px dotted [% css_colors.accent_medium %];
1287 }
1288 .list-create-table-buttons input[type=image] { margin-top: 2px; }
1289 .result_table_format_cell { padding: 0px 10px; text-align: center; }
1290 .results_row_count { font-weight: bold; }
1291 #hold_editor h1 { font-size: [% css_fonts.size_bigger %]; font-weight: bold; }
1292 #hold_editor h2 { font-size: [% css_fonts.size_big %]; font-weight: normal; text-indent: 2em; font-style: italic; }
1293 #hold_editor h1, #hold_editor h2 { margin: 2px 0; }
1294 #hold_editor_table { background-color: [% css_colors.accent_lighter %]; padding: 0.5em; }
1295 #hold_editor_table th { text-align: right; padding-right: 1em; }
1296 #hold_editor_table td { padding: 0.25em 0; }
1297 .fmt-note { vertical-align: middle; padding-left: 1em !important; }
1298 .hold-editor-controls { text-align: center; padding-top: 1em !important; }
1299 .hold-editor-controls a { padding-left: 2em; }
1300
1301 .text-right { text-align: right; }
1302 .text-right-top { text-align: right; vertical-align: top; }
1303 .rdetail-author-div {
1304     padding-bottom: 10px;
1305     display: inline-block;
1306 }
1307
1308 .invisible { visibility: hidden; }
1309 .rdetail-extras-summary { margin: 10px; }
1310 .staff-hold { background-color: [% css_colors.accent_lightest %]; }
1311 .expert-search tbody tr th { text-align: right; padding-left: 2em; }
1312 .expert-search-row { padding-top: 10px; }
1313 #adv_expert_row label { font-weight: bold; }
1314
1315 .bookshelf tr.browse_border td {
1316     border-bottom: 1px dashed [% css_colors.accent_dark %];
1317     font-size: 1px;
1318     height: 1px;
1319     padding-bottom: 1ex;
1320 }
1321 .cn_browse_item { padding: 2ex; }
1322 .results-paginator-list { padding-left: 1em; }
1323 .results-paginator-selected { color: [% css_colors.text_alert %]; }
1324 .inactive-hold { background: [% css_colors.accent_lightest %]; }
1325 .unread-patron-message { font-weight: bold; }
1326
1327 #hold-items-list td { padding: 5px; margin-bottom: 20px; }
1328 .hold-items-list-title { 
1329   font-size: [% css_fonts.size_bigger %];
1330   margin-bottom: 20px;
1331 }
1332 .hold-items-list-problem { color: [% css_colors.text_alert %]; }
1333
1334 .hold_success_links > span { margin: 0 2em; }
1335
1336 .radio-parts-selection { 
1337    width: 75%;
1338    margin-bottom: 20px;
1339 }
1340
1341 .parts-radio-option { 
1342   display: inline-block;
1343   width:15em;
1344 }
1345
1346 .mr_holds_no_formats { 
1347   padding: 5px;
1348   margin-left: 25px;
1349   font-size: 110%;
1350   font-weight: bold;
1351   color: [% css_colors.text_invert %]; 
1352   background: [% css_colors.primary %];
1353 }
1354  
1355 .holds_item_row_separator td {
1356   border-top: 2px dashed [% css_colors.accent_medium %];
1357 }
1358
1359 .big-strong {font-weight: bold; font-size: [% css_fonts.size_bigger %]; }
1360
1361 .results_header_btns, .results_header_sel {
1362     float:left;
1363 }
1364
1365 /*
1366  * .various_containers a = shortcut to putting .opac-button on every 'a' with
1367  *     the tradeoff of increased stylesheet complexity (TODO: rethink?)
1368  */
1369
1370 .opac-multiline-button > a,
1371 .opac-button, .results_header_btns a, #simple-detail-view-links a, .dash_account_buttons a {
1372     color: [% css_colors.button_text %];
1373     font-weight: bold; 
1374     text-decoration: none;
1375     cursor: pointer !important;
1376     -moz-border-radius: 5px;
1377     border-radius: 5px;
1378     border: 1px solid [% css_colors.primary %];
1379     background:  [% css_colors.primary_fade %];
1380     margin: 0.5em;
1381     padding: 0.3em;
1382     display: inline-block;
1383 }
1384
1385 .opac-multiline-button > a:hover,
1386 .opac-button:hover, .results_header_btns a:hover, #simple-detail-view-links a:hover, #dash_wrapper a.opac-button:hover {
1387     background: [% css_colors.primary %];
1388 }
1389
1390 .opac-button:disabled {
1391     color: [% css_colors.accent_medium %];
1392     cursor: pointer !important;
1393     border: 1px solid [% css_colors.accent_light %];
1394     background-color: [% css_colors.accent_lighter %];
1395 }
1396
1397 /* Firefox adds its own special space to inputs; this gets us closer */
1398 button.opac-button::-moz-focus-inner, input.opac-button::-moz-focus-inner {
1399     padding: 0;
1400     border: 0;
1401 }
1402
1403 .opac-button-header, #dash_wrapper .opac-button {
1404     background: [% css_colors.control %];
1405     box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15);
1406     font-size: [% css_fonts.size_base %];
1407 }
1408 a.opac-button-header:hover, #dash_wrapper a.opac-button:hover {
1409     border-color: [% css_colors.control %];
1410 }
1411
1412 .opac-multiline-button > a {
1413     display: inline-block;
1414 }
1415
1416 #myopac_checked_div {
1417     padding: 0px;
1418 }
1419
1420 .rdetail-mfhd-head {
1421     margin-top: 5px;
1422     padding-top: 5px;
1423     background-color: [% css_colors.table_heading %];
1424 }
1425
1426 .rdetail-mfhd-type {
1427     padding-left: 1em;
1428 }
1429
1430 .rdetail-mfhd-bottom {
1431     border-bottom: thin solid [% css_colors.border_dark %];
1432     width: 100%;
1433 }
1434
1435 #rdetail_record_details {
1436     clear: both;
1437     margin-top: 1em;
1438 }
1439
1440 .rdetail_content {
1441     margin-left: 1.5em;
1442     padding-left: 1.5em;
1443 }
1444
1445 .rdetail_content_type, .rdetail_subject_type {
1446     vertical-align: top;
1447     font-weight: bold;
1448 }
1449
1450 .bookbag-item-row td { vertical-align: top; }
1451
1452 .error { color: [% css_colors.text_alert %]; font-weight: bold; }
1453 .success {
1454     color: [% css_colors.text_greatnews %];
1455     font-weight: bold;
1456 }
1457
1458 .rdetail_related_subjects {
1459     margin-top: 1.5em;
1460 }
1461
1462 .rdetail_related_series {
1463     margin-top: 1.5em;
1464 }
1465
1466 #rdetail_openurl {
1467     margin-top: 1em;
1468 }
1469
1470 .rdetail_openurl_entry {
1471     margin-left: 1em;
1472     padding-left: 1em;
1473 }
1474 .bookbag-controls-holder { width: 100%; }
1475 .bookbag-controls-holder:nth-child(odd) { background-color: [% css_colors.accent_lighter2 %]; }
1476 .bookbag-controls-holder:nth-child(even) { background-color: [% css_colors.accent_lightest %]; }
1477 .bookbag-controls-holder .most {
1478     padding-left: 0;
1479     margin-right: 5em;
1480 }
1481 h2.bookbag-name { margin-bottom: 0em; padding-bottom: 0em; }
1482 .bookbag-share .fixed { min-width: 4em; }
1483 .bookbag-specific { margin-left: 1em; }
1484 .bookbag-specific div.sort { float: left; width: 45%; text-align: left; }
1485 .bookbag-specific div.meta { float: right; width: 54%; text-align: right; }
1486 #bbag-name-desc-form tr th { vertical-align: middle; }
1487 #bbag-name-desc-form .saver { vertical-align: middle; text-align: center; }
1488 .bookbag-description {
1489     padding-top: 0em;
1490     font-style: italic;
1491     max-width: 40em;
1492 }
1493 #bbag-edit-description { width: 20em; }
1494 #bbag-edit-name { width: 20em; }
1495 textarea { font-family: sans-serif; }
1496 table.bookbag-specific {
1497     border-right: 1px solid [% css_colors.accent_dark %];
1498     border-bottom: 1px solid [% css_colors.accent_medium %];
1499     margin-bottom: 2ex;
1500 }
1501 .bookbag-share {
1502     float: left;
1503     padding: 5px 0;
1504 }
1505 .bookbag-controls {
1506     float: left;
1507     padding: 5px 0px 0px 10px;
1508 }
1509
1510 .bookbag-specific td.list_checkbox {
1511     padding-left: 10px !important;
1512 }
1513 .bookbag-specific td.list_entry {
1514     min-width: 10em;
1515     padding-left: 5px !important;
1516 }
1517 .bookbag-specific td.list_actions {
1518     white-space: nowrap !important;
1519 }
1520 .bookbag-paginator-selected { color: [% css_colors.text_alert %]; }
1521
1522 .list_is_empty {
1523     padding: 8px 0px 6px 0px;
1524     width: 100%;
1525     border: 0;
1526     font-size: [% css_fonts.size_bigger %];
1527     text-align: center;
1528     font-style: italic;
1529 }
1530 .save-notes { padding-bottom: 1.5ex; }
1531
1532 .nonbreaking-wrapper {
1533     display: inline-block;
1534 }
1535
1536 /* Moved from semiauto.css */
1537 .adv_global_input_container {
1538     border-bottom: none;
1539     clear: both;
1540 }
1541 .opac-auto-013 {
1542     border-bottom: none;
1543     *height: 0px;
1544 }
1545 .adv_global_filter_sort {
1546     border: none;
1547     width: 100%;
1548 }
1549 .clear-both { clear: both; }
1550 .common-no-pad {
1551     clear: both;
1552     height: 0px;
1553     margin: 0px;
1554     padding: 0px;
1555 }
1556 .common-full-pad {
1557     clear: both;
1558     height: 15px;
1559 }
1560 .alert { color: [% css_colors.text_alert %]; }
1561 .float-left { float: left; }
1562 .float-right { float: right; }
1563
1564 .saved-searches-header { width: 100%; font-weight: bold; font-size: [% css_fonts.size_bigger %]; }
1565 .saved-searches-header .button { float: right; width: 28px; }
1566 .saved-searches-header .text { float: left; padding-right: 1em; margin: 0.5ex 0;}
1567 .saved-searches-header {font-weight: bold; font-size: [% css_fonts.size_bigger %]; }
1568 .saved-searches { border-bottom: 1px solid [% css_colors.accent_medium %]; padding-right: 1em; }
1569 #staff-saved-search { /* wraps .saved-searches-header and .saved-searches on the record page */
1570     border-right: 1px solid [% css_colors.accent_darker %];
1571 }
1572 .result_item_circulated {
1573     padding-top: 4px;
1574 }
1575
1576 .result_item_circulated span {
1577     position: relative;
1578     top:-3px;
1579     left:3px;
1580 }
1581
1582 #search-only-bookbag-container { margin: 2ex 0; font-weight: bold; }
1583 #result-bookbag-heading { text-align: center; margin: 2ex; }
1584
1585 .result-bookbag-name { font-size: [% css_fonts.size_bigger %]; font-weight: bold; }
1586 .result-bookbag-description { font-size: [% css_fonts.size_bigger %]; font-style: italic; }
1587 .result-bookbag-item-note { font-style: italic; }
1588 .lowhits-bookbag-name { font-weight: bold; }
1589 .oils_AS { font-weight: bold; color: [% css_colors.text_match %]; }
1590 .oils_AS_match_term { text-align: left; color: [% css_colors.text %]; }
1591 .oils_AS_match_field {
1592     font-size: [% css_fonts.size_smallest %]; padding: 0.65em 0;
1593     text-align: right; color: [% css_colors.accent_medium %];
1594 }
1595 table.result_holdings_table {
1596     margin-top: 1em;
1597     margin-bottom: 1em;
1598 }
1599 table.result_holdings_table thead tr {
1600     background: [% css_colors.table_heading %];
1601 }
1602 table.result_holdings_table thead tr th {
1603     font-weight: bold;
1604 }
1605 span.preflib {
1606     margin: 0 2em 0 2em;
1607 }
1608 a.preflib_change {
1609   vertical-align: super;
1610   font-size: [% css_fonts.size_smaller %];
1611   line-height: normal;
1612   text-decoration: none;
1613 }
1614 .rdetail-holding-group { margin-left: 1.5em; }
1615 .rdetail-holding-group span { margin-left: 1.5em; }
1616 .rdetail-holding-group .paging { margin-left: 1.5em; }
1617 #rdetail_deleted_exp {
1618     font-weight: bold;
1619     padding: 1em;
1620     margin: 1em;
1621     border: thick solid [% css_colors.border_alert %];
1622 }
1623
1624 #ac_tab_wrapper { width : 100%; }
1625 .ac_tab { float: left; padding-right: 10px; font-size: [% css_fonts.size_big %]; padding: 5px; border: 1px solid [% css_colors.primary_offset %]; }
1626 .ac_tab_selected { background-color: [% css_colors.primary_offset %]; }
1627 .ac_tab_selected a { color: [% css_colors.text_invert %]; }
1628 #ac_content { clear: both; width: 100%; margin-top: 10px; }
1629
1630 /* Popmenu styles used for making css menus. */
1631 .popmenu {
1632     margin: 0;
1633     padding: 0;
1634 }
1635 .popmenu li {
1636     list-style: none;
1637 }
1638 .popmenu li a {
1639     display: block;
1640     padding: 3px 5px;
1641 }
1642 .popmenu li ul {
1643     display: none; 
1644     width: 10em; /* Width to help Opera out */
1645     background-color: [% css_colors.primary %];
1646 }
1647 .popmenu li:hover ul {
1648     display: block;
1649     position: absolute;
1650     margin: 0;
1651     padding: 0;
1652     border-color: [% css_colors.border_dark %];
1653     border-width: 1px;
1654     border-style: solid;
1655 }
1656 .popmenu li:hover li {
1657     float: none;
1658 }
1659 .popmenu li:hover li a {
1660     background-color: [% css_colors.primary %]; 
1661     color: [% css_colors.accent_ultralight %];
1662 }
1663 .popmenu li li a:hover {
1664     background-color: [% css_colors.accent_ultralight %]; 
1665     color: [% css_colors.primary %];
1666 }
1667 /* Styles for the temporary list entry. */
1668 .popmenu li:hover li[class~="temporary"] a {
1669     background-color: [% css_colors.primary %]; 
1670     color: [% css_colors.accent_ultralight %];
1671 }
1672 .popmenu li li[class~="temporary"] a:hover {
1673     background-color: [% css_colors.accent_ultralight %]; 
1674     color: [% css_colors.primary %];
1675 }
1676 /* Styles for the default list entry. */
1677 .popmenu li:hover li[class~="default"] a {
1678     background-color: [% css_colors.primary %]; 
1679     color: [% css_colors.accent_ultralight %];
1680 }
1681 .popmenu li li[class~="default"] a:hover {
1682     background-color: [% css_colors.accent_ultralight %]; 
1683     color: [% css_colors.primary %];
1684 }
1685 /* Styles for the new list entry. */
1686 .popmenu li:hover li[class~="new"] a {
1687     background-color: [% css_colors.primary %]; 
1688     color: [% css_colors.accent_ultralight %];
1689 }
1690 .popmenu li li[class~="new"] a:hover {
1691     background-color: [% css_colors.accent_ultralight %]; 
1692     color: [% css_colors.primary %];
1693 }
1694 /* Style to add a divider on the menu. */
1695 .popmenu li li[class~="divider"] {
1696     border-bottom-width: 1px;
1697     border-bottom-color: [% css_colors.border_dark %];
1698     border-bottom-style: solid;
1699 }
1700     
1701 #locale_picker_form {
1702     float: right;
1703     padding: 0.5em;
1704     margin-top: 2em;
1705     border-right: thin [% css_colors.control %] solid;
1706 }
1707
1708 #locale_picker_form * {
1709     margin: 0;
1710     padding: 0;
1711     vertical-align: middle;
1712 }
1713
1714 #patron_usr_barcode_not_found {
1715     font-weight: bold; color: [% css_colors.text_alert %];
1716 }
1717
1718 .record_title {
1719     font-weight: bold;
1720 }
1721
1722 .record_author {
1723     font-style: italic;
1724 }
1725
1726 .password_message {
1727     padding-top: 1em;
1728     padding-bottom: 0.5em;
1729         font-style: italic;
1730 }
1731
1732 #maintenance_message {
1733     padding: 5px;
1734     width: 100%;
1735     background-color: [% css_colors.text_alert %];
1736     color: [% css_colors.text_invert %];
1737     text-align: center;
1738 }
1739
1740 #search-box > span {
1741     margin: 0 1em;
1742 }
1743 .browse-error {
1744     font-weight: bold;
1745     font-color: #c00;
1746 }
1747 .browse-result-sources, .browse-result-authority-bib-links {
1748     margin-left: 1em;
1749 }
1750 .browse-result-best-match {
1751     font-weight: bold;
1752 }
1753 .browse-pager {
1754     margin: 2ex 0;
1755 }
1756 .browse-result-list {
1757     padding-bottom: 0.5ex;
1758 }
1759 .browse-shortcuts {
1760     font-size: [% css_fonts.size_bigger %];
1761 }
1762 .browse-result-authority-field-name {
1763     font-style: italic;
1764     margin-right: 1em;
1765 }
1766 .browse-leading-article-warning {
1767     font-style: italic;
1768     font-size: [% css_fonts.size_big %];
1769 }
1770 .browse-public-general-note {
1771     font-size: [% css_fonts.size_big %];
1772 }
1773 .browse-public-general-note-label { }
1774 .browse-public-general-note-institution {
1775     font-style: normal;
1776     font-weight: bold;
1777 }
1778 .browse-public-general-note-body {
1779     font-style: italic;
1780 }
1781
1782 .bib_peer_type {
1783     font-weight: bold;
1784 }
1785
1786 #main-content-register {
1787     margin-left: 40px;
1788     font-size: [% css_fonts.size_bigger %];
1789 }
1790
1791 #main-content-register table { 
1792     padding: 20px; 
1793     margin-top: 18px; 
1794     border-collapse: collapse;
1795 }
1796
1797 #main-content-register td {
1798     text-align: left;
1799 }
1800
1801 #main-content-register td:not(:first-child) {
1802     padding-left: 20px;
1803 }
1804
1805 .patron-reg-invalid {
1806     font-weight: bold;
1807     color: red;
1808     padding-right: 10px;
1809 }
1810
1811 .result_footer_nav1 {
1812     clear: both;
1813 }
1814
1815 .small_view_only, #filter_hits, #refine_hits, #return_to_hits {
1816     display: none;
1817 }
1818
1819 .rdetail_authors_div {
1820     margin-bottom: 1em;
1821 }
1822
1823 #search_query_label, #search_qtype_label, #search_itype_label, #search_locg_label {
1824     white-space: nowrap;
1825     display: inline-block;
1826 }
1827
1828 .result_table_title_cell {
1829     padding-top: 4px;
1830     padding-bottom: 4px;
1831 }
1832
1833 .record_title {
1834     font-size: [% css_fonts.size_bigger %];
1835 }
1836
1837 /* styling for sms text call number */
1838 .sms_text pre {
1839     font-family: Arial, Helvetica, sans-serif;
1840     font-size: [% css_fonts.size_medium %];
1841     background: [% css_colors.accent_lightest %];
1842     padding: .5%;
1843     /* Allow text to wrap */
1844     white-space: pre-wrap;       /* css-3 */
1845     white-space: -moz-pre-wrap;  /* Mozilla, since 1999 */
1846     white-space: -pre-wrap;      /* Opera 4-6 */
1847     white-space: -o-pre-wrap;    /* Opera 7 */
1848     word-wrap: break-word;       /* Internet Explorer 5.5+ */
1849 }
1850
1851 .mobile_view {
1852    display:none;
1853 }
1854
1855 /* patron message center */
1856 #myopac_message_tbody {
1857     vertical-align: top;
1858 }
1859 .myopac_message_message {
1860     white-space: pre-wrap;
1861 }
1862
1863 @media only screen and (max-width: 800px) {
1864     .facet_sidebar_hidden, .result_block_hidden {
1865         display: none;
1866     }
1867     .facet_sidebar_visible, .result_block_visible {
1868         display: inline ! important;
1869     }
1870     #acct_select, #acct_prefs_select {
1871         display: inline-block;
1872     }
1873     #acct_tabs, #acct_prefs_tabs {
1874          display:none;
1875      }
1876     .radio-parts-selection { width: 90%; }
1877 }
1878
1879 @media only screen and (max-width: 600px) {
1880     input, select {
1881         font-size: [% css_fonts.size_big %];
1882     }
1883     span .nav_arrow_fix {
1884         display: none;
1885     }
1886     #header {
1887         padding: 0px;
1888         margin: 0px;
1889     }
1890     #homesearch_main_logo img {
1891         width:75%;
1892     }
1893     #format_selector {
1894         display:none;
1895     }
1896     #your-acct-login {
1897         padding: 0px;
1898         padding-top: 5px;
1899     }
1900     #your-acct-login a {
1901         margin: 0px;
1902         padding: 5px;
1903     }
1904     #topnav_logo {
1905         margin: 0;
1906     }
1907     #topnav_logo img {
1908         width: 200px;
1909     }
1910     #locale_picker_form {
1911         display: none;
1912     }
1913     #gold-links-holder {
1914         display: none;
1915     }
1916     #simple-detail-view-links {
1917         display: none;
1918     }
1919     #acct_tabs a, #acct_fines_tabs a {
1920        padding: 2px 4px 3px 4px;
1921        -moz-border-radius: 6px 6px 0px 0px;
1922        border-radius: 6px 6px 0px 0px;
1923        font-size: [% css_fonts.size_base %];
1924        margin: 0px 5px 0px 0px;
1925     }
1926
1927     #dash_wrapper div {
1928         background: transparent;
1929         padding: 0px;
1930     }
1931     #dash_wrapper {
1932         position: static;
1933         top: auto;
1934     }
1935     #dash_wrapper .opac-button {
1936         top: 0px;
1937     }
1938     .small_view_only, #filter_hits {
1939         display: inline !important;
1940     }
1941     #dash_identity a {
1942         float:left;
1943     }
1944     #dashboard {
1945         display: none;
1946     }
1947     #holds_box form blockquote {
1948         margin-left: 10px;
1949         margin-right: 2px;
1950     }
1951     #holds_box form blockquote select {
1952         width: 100%;
1953     }
1954     #myopac_sum_fines_placehold {
1955         display:none;
1956     }
1957     #myopac_sum_fines {
1958         display: none;
1959     }
1960     .results_header_lbl {
1961         display: none;
1962     }
1963     .results_header_nav1 span.h1 {
1964         display: none;
1965     }
1966     .preflib {
1967         display: none;
1968     }
1969     .start_end_links_span {
1970         display: block;
1971     }
1972     .invisible {
1973         display: none;
1974     }
1975     .result_table_pic_header {
1976         padding-left: 0px !important;
1977         padding-right: 5px;
1978         width: 0px !important;
1979         margin: 0px;
1980     }
1981     .result_table_pic {
1982         width: 55px;
1983         padding: 0px;
1984         margin: 0px;
1985     }
1986     tr[name=results_isbn_tr], tr[name=results_phys_desc_tr], tr[name=results_pub_tr] strong, .result_count {
1987          display: none;
1988     }
1989     tr.result_table_title_cell[name=bib_cn_list] .result_holdings_table th:nth-child(4),
1990     tr.result_table_title_cell[name=bib_cn_list] .result_holdings_table td:nth-child(4) {
1991         display:none;
1992     }
1993     .results_info_table td {
1994         padding: 0px;
1995     }
1996     #results_header_bar {
1997         background-color: inherit;
1998     }
1999     .results_header_btns a {
2000         margin: 0.3em;
2001     }
2002     #main-content {
2003         margin: 0 1px;
2004     }
2005     #rdetails_status thead {
2006         display: none;
2007     }
2008     #rdetails_status tr {
2009         display: block;
2010         margin-top: 3px;
2011     }
2012     #rdetails_status td {
2013         display: block;
2014         padding: 1px;
2015     }
2016     .copy_details_row {
2017         background-color: [% css_colors.accent_lightest %];
2018     }
2019     .copy_details_offers_row {
2020         background-color: [% css_colors.accent_lightest %];
2021     }
2022     select#pickup_lib.search-wrapper-locg {
2023         width: 100%;
2024     }
2025     #search-wrapper #search-box {
2026         width: 85%;
2027         padding-top: 5px;
2028     }
2029     #main-content-home {
2030         padding: 0px;
2031         margin: 0px;
2032     }
2033     /* Make use of full width in mobile mode */
2034     .facet_box_wrapper .box_wrapper .box,
2035     .facet_template .facet,
2036     .facet_box_temp {
2037         width: inherit;
2038     }
2039     .facet_template .count {
2040         padding-left: 1em;
2041     }
2042     #facet_sidebar {
2043         margin-top: 0.5em;
2044     }
2045     #adv_search_parent {
2046         font-size: [% css_fonts.size_smaller %];
2047     }
2048     #adv_search_filters {                                                                                                                             
2049         position: relative;                                                                                                                           
2050         width: 300px;
2051     }
2052     #format_actions {
2053         float: left;
2054     }
2055     .rdetail_aux_utils {
2056         padding: 0px;
2057         border: none;
2058     }
2059     .result_metadata {
2060         width: inherit;
2061     }
2062     div#rdetail_actions_div {
2063         float: none;
2064     }
2065     h2.rdetail_uris {
2066         clear: both;
2067     }
2068     #metarecord_population {
2069         overflow: hidden;
2070         width: 100%;
2071     }
2072     .metarecord_population_span_link {
2073     }
2074     .metarecord_population_item_lang {
2075         float: none;
2076     }
2077     .search_catalog_lbl {
2078         margin-left: 0;
2079         white-space: nowrap;
2080     }
2081     .adv_search_catalog_lbl { 
2082         margin-top: 0;
2083         white-space: nowrap;
2084     }
2085     .browse_the_catalog_lbl {
2086         white-space: nowrap;
2087     }
2088     .mobile_hide {
2089         display: none;
2090     } 
2091     #dash_user {
2092         display: block;
2093         padding: 0.5em;
2094     }
2095     .dash_divider {
2096         display: none;
2097     }
2098     .dash_account_buttons {
2099         display: block;
2100     } 
2101     .searchbar { line-height: 1.5em; }
2102     #browse-controls { line-height: 1.5em; }
2103     #search_query_label, #search_qtype_label, #search_itype_label, #search_locg_label {
2104         display: block;
2105     }
2106     .bookshelf td {
2107         display: block;
2108         width: 100%;
2109     }
2110     .bookshelf table thead tr {
2111         display: block;
2112     }
2113     #lowhits_help { width: inherit; }
2114     #adv_search_tabs a{                                                                                                                           
2115         font-size: [% css_fonts.size_small %];
2116         margin: 2px 2px 0px 2px;
2117         padding: 2px 2px 5px 2px; 
2118         -moz-border-radius: 10px 0px 0px 0px;
2119         border-radius: 7px 7px 0px 0px;                                                                                                           
2120     }
2121     #adv_global_tbody td {
2122         border-bottom: thin solid [% css_colors.accent_light %];
2123     }
2124     #adv_global_addrow td {
2125         border-bottom: none;
2126     }
2127         /* Force table to not be like tables anymore */
2128         table#acct_checked_main_header thead tr th, table#acct_holds_main_header thead tr th, table#acct_checked_hist_header thead tr th, #acct_holds_hist_header thead tr th, #ebook_circs_main_table thead tr th, #ebook_holds_main_table thead tr th {
2129                 display: block;
2130         }
2131         table#acct_checked_main_header tbody tr td, table#acct_holds_main_header tbody tr td, table#acct_checked_hist_header tbody tr td, #acct_holds_hist_header tbody tr td, #ebook_circs_main_table thead tr td, #ebook_holds_main_table thead tr td {
2132                 display: block;
2133         }
2134
2135         /* Hide table headers (but not display: none;, for accessibility) */
2136         thead tr {
2137                 position: absolute;
2138                 top: -9999px;
2139                 left: -9999px;
2140         }
2141
2142         table#acct_checked_main_header, table#acct_holds_main_header, table#acct_checked_hist_header, #acct_holds_hist_header {
2143                 width: 90%;
2144         }
2145
2146         table#acct_checked_main_header tr, table#acct_holds_main_header tr, table#acct_checked_hist_header tr { border: 1px solid #ddd; }
2147
2148         /* Holds history gets large white border to mimic header cell on other
2149            account screens that provide visual cue for next title */
2150
2151         table#acct_holds_hist_header tr { border-top: 25px solid #fff; }
2152
2153
2154         table#acct_checked_main_header td, table#acct_holds_main_header td, table#acct_checked_hist_header td, #acct_holds_hist_header td {
2155                 /* Behave  like a "row" */
2156                 border: none;
2157                 border-bottom: 1px solid #eee;
2158                 position: relative;
2159                 padding-left: 40%;
2160         }
2161
2162          table#acct_checked_main_header td:before, table#acct_holds_main_header td:before, table#acct_checked_hist_header td:before, #acct_holds_hist_header td_before {
2163                 /* Now like a table header */
2164                 position: absolute;
2165                 /* Top/left values mimic padding */
2166                 top: 2px;
2167                 left: 2px;
2168                 width: 40%;
2169                 padding-right: 10px;
2170                 white-space: nowrap;
2171         }
2172
2173         table#acct_checked_main_header td:nth-of-type(1) { border-top: 5px solid #aaa; padding-top: 15px; background-color: #fff;}
2174         table#acct_checked_main_header td:nth-of-type(2):before { content: "[% l('Title') %]";}
2175         table#acct_checked_main_header td:nth-of-type(3):before { content: "[% l('Author') %]"; }
2176         table#acct_checked_main_header td:nth-of-type(4):before { content: "[% l('Renewals Left') %]"; }
2177         table#acct_checked_main_header td:nth-of-type(5):before { content: "[% l('Due Date') %]"; }
2178         table#acct_checked_main_header td:nth-of-type(6):before { content: "[% l('Barcode') %]"; }
2179         table#acct_checked_main_header td:nth-of-type(7):before { content: "[% l('Call number') %]"; }
2180
2181      table#acct_checked_hist_header td:nth-of-type(1) { border-top: 5px solid #aaa; padding-top: 15px; background-color: #fff;}
2182         table#acct_checked_hist_header td:nth-of-type(2):before { content: "[% l('Title') %]";}
2183         table#acct_checked_hist_header td:nth-of-type(3):before { content: "[% l('Author') %]"; }
2184         table#acct_checked_hist_header td:nth-of-type(4):before { content: "[% l('Checkout Date') %]"; }
2185         table#acct_checked_hist_header td:nth-of-type(5):before { content: "[% l('Due Date') %]"; }
2186         table#acct_checked_hist_header td:nth-of-type(6):before { content: "[% l('Date Returned') %]"; }
2187         table#acct_checked_hist_header td:nth-of-type(7):before { content: "[% l('Barcode') %]"; }
2188         table#acct_checked_hist_header td:nth-of-type(8):before { content: "[% l('Call number') %]"; }
2189
2190         table#acct_holds_main_header td:nth-of-type(1) { border-top: 5px solid #aaa; padding-top: 15px; background-color: #fff;}
2191         table#acct_holds_main_header td:nth-of-type(2):before { content: "[% l('Title') %]";}
2192         table#acct_holds_main_header td:nth-of-type(3):before { content: "[% l('Author') %]"; }
2193         table#acct_holds_main_header td:nth-of-type(4):before { content: "[% l('Format') %]"; }
2194         table#acct_holds_main_header td:nth-of-type(5):before { content: "[% l('Pickup Location') %]"; }
2195         table#acct_holds_main_header td:nth-of-type(6):before { content: "[% l('Cancel on') %]"; }
2196         table#acct_holds_main_header td:nth-of-type(7):before { content: "[% l('Status') %]"; }
2197         table#acct_holds_main_header td.hold_notes:before { content: "[% l('Notes') %]"; }
2198
2199         table#acct_holds_hist_header td:nth-of-type(1):before { content: "[% l('Title') %]";}
2200         table#acct_holds_hist_header td:nth-of-type(2):before { content: "[% l('Author') %]"; }
2201         table#acct_holds_hist_header td:nth-of-type(3):before { content: "[% l('Format') %]"; }
2202         table#acct_holds_hist_header td:nth-of-type(4):before { content: "[% l('Pickup Location') %]"; }
2203         table#acct_holds_hist_header td:nth-of-type(8):before { content: "[% l('Status') %]"; }
2204
2205
2206        /*Want to see these in mobile ONLY */
2207        .mobile_view{
2208           display:block;
2209        }
2210
2211        .mobile_search_lbl_clr{
2212           color:[% css_colors.mobile_header_text %];
2213        }
2214 }
2215
2216
2217 /* 
2218 For text which is visible only to screen readers.
2219 Borrowed from http://getbootstrap.com/css/#helper-classes-screen-readers 
2220 See also http://webaim.org/techniques/css/invisiblecontent/
2221 */
2222 .sr-only {                                                                     
2223     position: absolute;                                                          
2224     width: 1px;                                                                  
2225     height: 1px;                                                                 
2226     padding: 0;                                                                  
2227     margin: -1px;                                                                
2228     overflow: hidden;                                                            
2229     clip: rect(0, 0, 0, 0);                                                      
2230     border: 0;                                                                   
2231 }
2232
2233 /* Make added rows in Expert Search have bold labels like the initial row */
2234 label[for*=expert_]
2235 {
2236     font-weight: bold;
2237 }  
2238
2239 .sort_deemphasize {
2240     font-weight: lighter;
2241     font-size: 70%;
2242 }
2243
2244 #results-page-depth-hint {
2245     text-align: center;
2246     font-style: italic;
2247 }
2248
2249 #clear-history-confirm {
2250   font-weight: bold;
2251   color: [% css_colors.text_badnews %]; 
2252   padding: 10px;
2253 }
2254
2255 /*Inline rules from other templates files*/
2256
2257 .td-left{text-align:left; width:100%;}
2258 .td-search-left{text-align:left;}
2259 #myopac_summary_div{padding:0px;}
2260 .div-left{float: left;} 
2261 .td-right{text-align:right;}
2262 .login-form-left{float: left; padding-bottom: 10px; margin-right: 40px;}
2263 .hold-div{padding-left: 10px; padding-bottom: 15px;}
2264 .hold-span{font-weight: bold;}
2265 .padding-left-6{padding-left: 6px;}
2266 .padding-left-10{padding-left:10px;}
2267 .padding-left-5{padding-left: 5px;}
2268
2269 /* Rules from metarecord_hold_filters.tt2 */
2270
2271 .metarecord_filters{
2272       padding: 5px;
2273       margin-top: 5px;
2274       border-bottom: 1px solid #333;
2275       border-top: 1px solid #333; }
2276 .metarecord_filter_container{float : left;margin-right: 10px;}
2277 .metarecord_filter_container select{padding: 2px;width: 13em; /* consistent w/ adv search selectors */}
2278 .metarecord_filter_header{padding-bottom: 5px;}