Open-ILS/src/templates/opac/css/style.css.tt2

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