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