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