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