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