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