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