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 %]
   5
   6 body {
   7     margin:0;
   8     font-family: Arial, Helvetica, sans-serif;
   9     font-size: [% css_fonts.size_base %];
  10     background: [% css_colors.primary %];
  11 }
  12
  13 button, input {
  14     font-family: Arial, Helvetica, sans-serif;
  15     font-size: [% css_fonts.size_base %];
  16 }
  17
  18 img {
  19     border: none;
  20 }
  21
  22 #topnav_logo {
  23     margin: 2em 0;
  24 }
  25
  26 #homesearch_main_logo {
  27     padding-top: 60px;
  28     margin: auto;
  29     width: 50%;
  30 }
  31
  32 a {
  33     color: [% css_colors.primary %];
  34 }
  35
  36 #search-wrapper input[type=text] {
  37     margin:0;
  38     padding:0;
  39 }
  40
  41 #search-wrapper select, .results_header_lbl select {
  42     border:1px solid [% css_colors.border_standard %];
  43     margin:0;
  44     padding:0;
  45     width: 12em;
  46 }
  47
  48 .searchbar {
  49     font-weight: bold;
  50     padding-top: 10px;
  51     margin-left: 1em;
  52 }
  53
  54 /*
  55 #search-wrapper select {
  56     border:0px solid [% css_colors.border_dark %];
  57     filter:alpha(opacity=0);
  58     -moz-opacity:0;
  59     -khtml-opacity:0;
  60     opacity:0;
  61     padding:0;
  62     margin:0;
  63     height:18px;
  64 }
  65 */
  66 h1 {
  67     margin:0;
  68     margin-bottom: 5px;
  69     font-size: [% css_fonts.size_biggest %];
  70     font-weight:normal;
  71 }
  72
  73 h2 {
  74     font-size: [% css_fonts.size_bigger %];
  75     font-weight:bold;
  76 }
  77
  78 h2.graphic880 {
  79     font-size: [% css_fonts.size_bigger %];
  80     font-weight:normal;
  81 }
  82
  83 .hide_me, .hidden {
  84     display: none;
  85     visibility: hidden;
  86 }
  87
  88 div.select-box-wrapper {
  89     position:absolute;
  90     padding-top:2px;
  91     padding-left:3px;
  92     overflow:hidden;
  93     text-align:left;
  94 }
  95
  96 #dash_wrapper {
  97     margin-left: 0.5em;
  98 }
  99
 100 #dash_wrapper div {
 101     background: [% css_colors.primary %];
 102     border-radius: 5px;
 103     padding: 0em 1em;
 104 }
 105
 106 .dash_divider {
 107     margin: 1em;
 108     color: [% css_colors.primary_fade %];
 109     display:inline-block;
 110 }
 111
 112 #dashboard {
 113     margin-top: 1em;
 114     height: 3em;
 115 }
 116
 117 #dashboard span.dash-align a {
 118     font-weight: bold;
 119     text-decoration: none;
 120 }
 121
 122 #dash_user {
 123     font-weight: bold;
 124 }
 125
 126 #logout_link { left: 1px; }
 127
 128 #dash_checked { color: [% css_colors.text_attention %]; }
 129 #dash_holds { color: [% css_colors.text_attention %]; }
 130 #dash_pickup { color: [% css_colors.text_goodnews %]; }
 131 #dash_fines { color: [% css_colors.text_badnews %]; }
 132 #header-wrap {
 133     background: linear-gradient([% css_colors.primary %], [% css_colors.primary_fade %]);
 134     background: -moz-linear-gradient([% css_colors.primary %], [% css_colors.primary_fade %]);
 135     background: -o-linear-gradient([% css_colors.primary %], [% css_colors.primary_fade %]);
 136     background: -webkit-linear-gradient([% css_colors.primary %], [% css_colors.primary_fade %]);
 137     background-color: [% css_colors.primary_fade %];
 138 }
 139 #header {
 140     color: [% css_colors.background %];
 141     margin-left: 1em;
 142     margin-right: 1em;
 143     font-size: [% css_fonts.size_small %];
 144 }
 145
 146 #header a {
 147     color: [% css_colors.background %];
 148 }
 149
 150 #header a:hover {
 151     color: [% css_colors.text_invert %];
 152     text-decoration: none;
 153 }
 154
 155 #header-links {
 156     color: [% css_colors.text_invert %];
 157     font-size: [% css_fonts.size_small %];
 158     font-weight: bold;
 159     position: relative;
 160     top:4px;
 161
 162 }
 163
 164 #header-links a {
 165     color: [% css_colors.text_invert %];
 166     display: block;
 167     float:left;
 168     margin-right:22px;
 169     text-decoration: none;
 170 }
 171
 172 #header-links a:hover {
 173     color: [% css_colors.text_invert %];
 174     text-shadow: 0 0 0.2em [% css_colors.primary %], 0 0 0.2em [% css_colors.primary %];
 175     text-decoration: none;
 176 }
 177
 178 #header #header-links2 {
 179     position:relative;
 180     top:-8px;
 181     color: [% css_colors.text_invert %];
 182     padding-bottom: 15px;
 183 }
 184
 185 #header #header-links2 a {
 186     color: [% css_colors.text_invert %];
 187 }
 188
 189 #header #header-links2 a:hover {
 190     text-decoration: underline;
 191 }
 192
 193 #your-acct-login {
 194     padding-top:2em;
 195 }
 196
 197 #gold-links {
 198     margin-left: 1em;
 199     padding-left:0px;
 200 }
 201
 202 #gold-links-home {
 203     margin:auto;
 204     padding-left:0px;
 205 }
 206
 207 #gold-links-holder {
 208     height: 24px;
 209     background: [% css_colors.background_invert %];
 210 }
 211
 212 #util-bar {
 213     margin-left: 1em;
 214     padding-left:0px;
 215     height:0px;
 216 }
 217
 218 #search-wrapper {
 219     border-bottom: 1px solid [% css_colors.border_standard %];
 220     padding-bottom: 5px;
 221     background: [% css_colors.background %];
 222 }
 223
 224 #search-wrapper #breadcrumb {
 225     margin-top:0px;
 226     font-size: [% css_fonts.size_smaller %];
 227     float:left;
 228 }
 229
 230 #search-wrapper #search-within {
 231     margin-top:10px;
 232     float:right;
 233     position:relative;
 234     left:-173px;
 235 }
 236
 237 #search-wrapper #breadcrumb a {
 238     color: [% css_colors.text %];
 239 }
 240
 241 #search-wrapper #search_frm label {
 242     font-size: [% css_fonts.size_smaller %];
 243 }
 244
 245 #search-wrapper #search-box {
 246     margin-left: 1em;
 247     padding-left: 0px;
 248     padding-top: 10px;
 249     padding-bottom: 10px;
 250 }
 251
 252 #adv_search_tabs, #acct_tabs, #acct_fines_tabs, #acct_checked_tabs, #acct_holds_tabs, #acct_prefs_tabs, #results_header_inner{
 253     margin-left: 2px;
 254     overflow: auto;
 255 }
 256
 257 #adv_search_tabs a, #acct_tabs a, #acct_fines_tabs a, #acct_checked_tabs a, #acct_holds_tabs a, #acct_prefs_tabs a {
 258     float: left;
 259     text-align: center;
 260     vertical-align: middle;
 261     display: block;
 262     margin: 10px 7px 0px 0px;
 263     padding: 10px 0px 10px 0px;
 264     -moz-border-radius: 10px 10px 0px 0px;
 265     border-radius: 10px 10px 0px 0px;
 266     font-weight: bold;
 267     color: [% css_colors.text_invert %];
 268     background: [% css_colors.control %];
 269     font-weight: bold;
 270     text-decoration: none;
 271 }
 272
 273 #adv_search_tabs a, #acct_tabs a, #acct_fines_tabs a {
 274     padding: 1em 1em 0.5em;
 275 }
 276
 277 #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 {
 278     background: [% css_colors.primary %];
 279     color: [% css_colors.text_invert %];
 280     text-decoration: none;
 281 }
 282
 283 #adv_search_filters {
 284     position: relative;
 285 }
 286 #adv_search_rows {
 287     border-bottom: none;
 288 }
 289 #adv_filter_block {
 290     padding: 15px;
 291     float: left;
 292     clear: both;
 293 }
 294 #adv_filter_block_item {
 295     float: left;
 296     padding: 5px;
 297 }
 298
 299 #adv_special_block {
 300     float: left;
 301     padding: 5px;
 302     margin-top: 5px;
 303 }
 304
 305 #adv_search_submit {
 306     position: relative;
 307     margin-left: 10px;
 308
 309 }
 310
 311 .checkbox_col {
 312     width: 1%;
 313     padding-left: 10px !important;
 314 }
 315
 316 #adv_search.on, #num_search.on, #expert_search.on {
 317     color: [% css_colors.accent_darker %];
 318     background: [% css_colors.background %];
 319     text-decoration: none;
 320 }
 321
 322 #adv_search_tabs a.acct-tab-on, #acct_tabs a.acct-tab-on, #acct_fines_tabs a.acct-tab-on {
 323     color: [% css_colors.accent_darker %];
 324     background: [% css_colors.background %];
 325     text-decoration: none;
 326 }
 327
 328 .acct-tab-off {
 329     background: [% css_colors.control %];
 330 }
 331
 332 #acct_checked_tabs a, #acct_holds_tabs a, #acct_prefs_tabs a {
 333     margin-top: 0px;
 334     font-size: [% css_fonts.size_smaller %];
 335     color: [% css_colors.accent_darker %];
 336     padding: 10px 10px 10px 10px;
 337 }
 338
 339 #acct_checked_tabs div.selected a, #acct_holds_tabs div.selected a, #acct_prefs_tabs div.selected a {
 340     background: [% css_colors.accent_lightest %];
 341     color: [% css_colors.accent_darker %];
 342 }
 343
 344 #acct_checked_tabs, #acct_holds_tabs, #acct_prefs_tabs {
 345     padding-bottom: 12px;
 346     color: [% css_colors.accent_medium %];
 347 }
 348
 349 #acct_select, #acct_prefs_select {
 350      display: none;
 351 }
 352
 353 .rdetail_header {
 354     padding: 5px 7px 6px 0px;
 355     margin-left: 1em;
 356     border-bottom: 1px dotted [% css_colors.accent_light %];
 357 }
 358
 359 .rdetail_results a {
 360     color:[% css_colors.primary_fade %];
 361     font-weight:bold;
 362     font-size: [% css_fonts.size_bigger %];
 363 }
 364
 365 .rdetail_result_count {
 366     color: [% css_colors.text %];
 367     font-weight: normal;
 368     padding-left: 1em;
 369     display: inline-block;
 370 }
 371
 372 .rdetail_result_nav {
 373     font-weight:normal;
 374     padding-left: 1em;
 375     display: inline-block;
 376 }
 377
 378 #rdetail_details_table {
 379     margin-top: 15px;
 380 }
 381
 382 #rdetail_image { border: none; }
 383 #rdetail_image_cell {
 384     padding-top: 3px;
 385     padding-right: 10px;
 386 }
 387
 388 h2.rdetail_uris {
 389     margin-top: 1em;
 390 }
 391 div.rdetail_uris {
 392     padding: 0.5em 1em 0.5em 1em;
 393     background-color: [% css_colors.accent_lighter2 %];
 394 }
 395 div.rdetail_uris ul li {
 396     position: relative;
 397     left: 1em;
 398 }
 399
 400 div.rdetail_show_copies {
 401     margin-top: 1em;
 402 }
 403
 404 div#rdetail_actions_div {
 405     float: right;
 406     background: [% css_colors.background %];
 407 }
 408
 409 span#rdetail_copy_counts {
 410     display: inline-block;
 411     border-right: thin;
 412     vertical-align: top;
 413     margin-right: 1em;
 414     padding-right: 1em;
 415 }
 416
 417 span#rdetail_hold_counts {
 418     display: inline-block;
 419     vertical-align: top;
 420 }
 421 span#rdetail_hold_counts p {
 422     padding-left: 2em;
 423 }
 424
 425 #rdetail_image_div {
 426     float: left;
 427     margin-right: 1em;
 428 }
 429
 430 .rdetail_aux_utils {
 431     border-left:1px dotted [% css_colors.accent_light %];
 432     padding-left: 17px;
 433     padding-bottom: 6px;
 434     padding-right: 70px;
 435 }
 436
 437 div.place_hold {
 438     border-bottom: 1px dotted [% css_colors.accent_light %];
 439     padding-top: 10px;
 440 }
 441
 442 div.toggle_list { padding-top: 6px; }
 443
 444 div.format_icon {
 445     float: right;
 446     margin-right: 17px;
 447 }
 448
 449 .result_util {
 450     border-bottom: 1px dotted [% css_colors.accent_light %];
 451     padding-top: 6px;
 452 }
 453
 454 .results_aux_utils {
 455     display: table-cell;
 456 }
 457
 458 .result_util {
 459     padding-left: 1em;
 460 }
 461
 462 .results_reviews {
 463     top: -5px;
 464 }
 465
 466 #rdetail_copies {
 467     padding-top: 1.5em;
 468 }
 469
 470 #rdetails_status td {
 471     padding: 7px 0px 3px 13px;
 472     white-space: nowrap;
 473 }
 474
 475 #rdetails_status td[headers=copy_header_library],
 476 #rdetails_status td[headers=copy_header_shelfloc] {
 477     white-space: normal;
 478 }
 479
 480 #rdetails_status thead th {
 481     background-color: [% css_colors.accent_lighter2 %];
 482     padding: 13px 0px 13px 13px;
 483     font-size: [% css_fonts.size_smaller %];
 484     font-weight: bold;
 485     text-align: left;
 486 }
 487
 488 #rdetails_status tbody td {
 489     padding-left: 13px;
 490     text-align: left;
 491 }
 492 #rdetails_status tbody td.copy_note {
 493     color: [% css_colors.primary %];
 494     text-wrap:normal;
 495     white-space:pre-wrap !important;
 496     word-wrap:normal;
 497 }
 498
 499 .rdetail_extras {
 500     background: [% css_colors.primary_fade %];
 501     border: 1px solid [% css_colors.primary %];
 502     padding-top:1px;
 503     clear:both;
 504 }
 505
 506 #rdetail_extras_div {
 507     margin: 1em 0;
 508 }
 509
 510 .rdetail_extras_hr {
 511     height: 1px;
 512     background: [% css_colors.accent_light %];
 513     margin-left: 1px;
 514     margin-right: 1px;
 515 }
 516
 517 .rdetail_extras_link {
 518     padding: 6px 12px;
 519     font-size: [% css_fonts.size_smaller %];
 520     font-weight: bold;
 521 }
 522
 523 .rdetail_extras_lbl {
 524     color: [% css_colors.text_invert %];
 525     text-decoration: none;
 526 }
 527
 528 ##rdetail_extras_expand, #rdetail_extras_collapse, #rdetail_locs_collapse {
 529     margin-left: 13px;
 530 }
 531
 532 #rdetail_locs_expand, #rdetail_locs_collapse {
 533     padding-bottom:3px;
 534     margin-top:15px;
 535     margin-left:13px;
 536 }
 537
 538 #rdetail_anotes_div .biography {
 539     margin:0;
 540 }
 541
 542 .almost-content-wrapper {
 543     background: [% css_colors.background %];
 544 }
 545
 546 #content-wrapper {
 547     background: [% css_colors.background %];
 548     min-height: 260px;
 549     border-bottom: 1px solid [% css_colors.border_dark %];
 550 }
 551
 552 .content-wrapper-record-page { top: -15px; position: relative; }
 553
 554 #main-content-home {
 555     padding-left: 17px;
 556     margin-left: 1em;
 557 }
 558 #main-content {
 559     padding-left: 0px;
 560     margin: 0 1em;
 561     clear: both;
 562 }
 563
 564 #main-content-after-bar {
 565     margin-left: 1em;
 566     padding-left: 4px;
 567 }
 568
 569 #results-side-bar { float: left; width: 174px; margin-right: 5px; background: [% css_colors.background %]; }
 570
 571 #main-content .login_boxes {
 572     border: 1px solid [% css_colors.accent_lighter %];
 573     background: linear-gradient(bottom, [% css_colors.accent_ultralight %] 15%, [% css_colors.accent_lightest %] 55%, [% css_colors.accent_ultralight %] 85%);
 574     background: -moz-linear-gradient(bottom, [% css_colors.accent_ultralight %] 15%, [% css_colors.accent_lightest %] 55%, [% css_colors.accent_ultralight %] 85%);
 575     background: -ms-linear-gradient(bottom, [% css_colors.accent_ultralight %] 15%, [% css_colors.accent_lightest %] 55%, [% css_colors.accent_ultralight %] 85%);
 576     background: -o-linear-gradient(bottom, [% css_colors.accent_ultralight %] 15%, [% css_colors.accent_lightest %] 55%, [% css_colors.accent_ultralight %] 85%);
 577     background: -webkit-linear-gradient(bottom, [% css_colors.accent_ultralight %] 15%, [% css_colors.accent_lightest %] 55%, [% css_colors.accent_ultralight %] 85%);
 578
 579     color: [% css_colors.accent_darker %];
 580 }
 581
 582 #main-content .login_boxes h1 {
 583     font-weight: normal;
 584     font-size: [% css_fonts.size_biggest %];
 585     margin:0;
 586 }
 587
 588 #main-content .left_brain {
 589     padding-left:28px;
 590     padding-top:25px;
 591 }
 592
 593 #main-content .left_brain input[type=text], #main-content .left_brain input[type=password] {
 594     width:167px;
 595     margin:0;
 596     padding:0;
 597     background: [% css_colors.background %];
 598     font-size: [% css_fonts.size_bigger %];
 599     color: [% css_colors.text %];
 600 }
 601
 602 #main-content .left_brain .input_bg {
 603     padding:10px 10px 0px 13px;
 604     width:167px;
 605     height:29px;
 606 }
 607
 608 .login-help-box {
 609     float: left;
 610     width: 200px;
 611     text-align: center;
 612     margin-left: 2em;
 613 }
 614
 615 .login-help-button {
 616     font-size: [% css_fonts.size_biggest %];
 617     padding: 1.5em;
 618 }
 619
 620 #login-failed-message {
 621     font-size: [% css_fonts.size_bigger %];
 622     font-weight: bold;
 623     color: [% css_colors.text_alert %];
 624     padding-top: 1em;
 625 }
 626
 627 #holds_temp_parent td {
 628     border-bottom:1px solid [% css_colors.border_standard %];
 629 }
 630
 631 #holds_temp_parent input, #holds_temp_parent select {
 632     margin:0;
 633 }
 634
 635 #holds_temp_parent tr td div {
 636     margin-top: 10px;
 637     margin-bottom: 10px;
 638 }
 639
 640 #holds_temp_parent tr td div.format_icon {
 641     margin-top: 6px;
 642     margin-bottom: 6px;
 643     float: none;
 644 }
 645
 646 #results_header_bar {
 647     background: [% css_colors.accent_medium %];
 648     border-top:1px solid [% css_colors.accent_mediumdark %];
 649     border-bottom:1px solid [% css_colors.accent_mediumdark %];
 650 }
 651
 652 .results_header_lbl {
 653     font-weight: bold;
 654     float: left;
 655     color: [% css_colors.text %];
 656     /* this border is not visible, but it keeps these labels the same size
 657     as the buttons */
 658     border: 1px solid [% css_colors.accent_medium %];
 659     background: [% css_colors.accent_medium %];
 660     margin: 0.5em 0.3em;
 661     padding: 0.3em;
 662 }
 663 /* we need a negative margin on the select to allow the containing <label>
 664 to determine the actual size of the element.  By doing this, we can increase
 665 the odds that the buttons and the select will be the same size, and therefore
 666 collapse correctly when the window width decreases */
 667 .results_header_lbl select {
 668     margin: -0.5em 0;
 669 }
 670
 671 #limit_to_available {
 672     vertical-align: middle;
 673 }
 674
 675 .results_header_sel {
 676     /* width: 88px; */
 677     float:left;
 678     margin:0;
 679 }
 680
 681 .results_header_nav1 {
 682     padding: 5px 7px 6px 0px;
 683     border-bottom: 1px dotted [% css_colors.accent_light %];
 684 }
 685
 686 .results_header_nav1 .h1 {
 687     font-size: [% css_fonts.size_bigger %];
 688     font-weight:bold;
 689     color:[% css_colors.primary_fade %];
 690 }
 691
 692 #result_table_div {
 693     margin-top: 1em;
 694 }
 695
 696 tr.result_table_row > td.results_row_count,
 697 tr.result_table_row > td.result_table_pic_header,
 698 tr.result_table_row > td.result_table_title_cell {
 699     vertical-align: top;
 700 }
 701
 702 .result_metadata {
 703     float: left;
 704     width: 30em;
 705     padding-right: 2em;
 706 }
 707
 708 tr.result_table_row:nth-child(n+2) > td {
 709     border-top: 1px solid [% css_colors.accent_lighter2 %];
 710 }
 711
 712 tr.result_table_row > td.result_table_pic_header {
 713     white-space: nowrap;
 714     width: 78px;
 715     padding-left: 1em;
 716 }
 717
 718 .result_number {
 719     padding-left: 1em;
 720     white-space: nowrap;
 721 }
 722
 723 .result_count_number {
 724    font-weight: bold;
 725 }
 726
 727 .result_table_subtable {
 728     width: 100%;
 729     padding-top: 1em;
 730 }
 731
 732 div.result_table_utils_cont {
 733     text-align:left;
 734     float: left;
 735 }
 736
 737 .icon_text {
 738 }
 739
 740 #myopac_summary_div p {
 741     margin:0;
 742     margin-bottom: 10px;
 743 }
 744
 745 #acct_sum_checked_table td {
 746     padding-bottom:5px;
 747 }
 748
 749 .zero_search_hits_main { float:left; width:300px; margin-top: 2ex; }
 750 .zero_search_hits_saved { float:left; width:200px; margin-top: 2ex; margin-right: 2em; }
 751
 752 #zero_search_hits p {
 753     margin-top:0;
 754 }
 755
 756 #zero_hits_term {
 757     font-weight: bold;
 758 }
 759
 760 #zero_search_hits #spell_check_link {
 761 }
 762
 763 #zero_search_hits #zero_hits_suggestions {
 764 }
 765
 766 #lowhits_help {
 767     float: right;
 768     width: 353px;
 769     background: [% css_colors.accent_light %];
 770     padding: 10px;
 771     margin-top: 7px;
 772 }
 773
 774 .results_info_table td {
 775     padding-right: 10px;
 776 }
 777
 778 #myopac_holds_main_table {
 779     border-collapse: collapse;
 780 }
 781
 782 #myopac_holds_main_table td {
 783     border: 1px solid [% css_colors.border_dark %];
 784
 785 }
 786
 787 #myopac_prefs_div .data_grid {
 788     border-collapse:collapse;
 789 }
 790
 791 #myopac_prefs_div .data_grid td {
 792     background:[% css_colors.accent_ultralight %];
 793     border-bottom:3px solid [% css_colors.background %];
 794     padding:6px 0px 7px 17px;
 795 }
 796
 797 .header_middle {
 798     height:22px;
 799     font-size: [% css_fonts.size_bigger %];
 800     font-weight:bold;
 801     color:[% css_colors.primary_fade %];
 802     padding: 0px 7px 0px 0px;
 803     border-bottom: 1px dotted [% css_colors.accent_light %];
 804     clear: both;
 805 }
 806
 807 .header_middle a {
 808     font-weight: normal;
 809 }
 810
 811 #acct_sum_block {
 812      float:left;
 813      clear:left;
 814 }
 815
 816 .acct_sum_table {
 817     border-collapse: collapse;
 818     background: [% css_colors.accent_ultralight %];
 819 }
 820
 821 .acct_sum_table tr {
 822     border-bottom: 2px solid white;
 823 }
 824
 825 .acct_sum_table td {
 826     padding: 1em;
 827 }
 828
 829 .acct_sum_table a {
 830     text-transform: none;
 831     position:relative;
 832     top:-1px;
 833 }
 834
 835 .acct_sum_table .view_link {
 836     font-weight: normal;
 837 }
 838
 839 table.acct_notes {
 840     border-collapse: collapse;
 841     margin: -1em 0 0.5em 0;
 842 }
 843
 844 table.acct_notes * {
 845     border: solid thin;
 846     padding: 0.5em;
 847 }
 848
 849 table.acct_notes th {
 850     font-weight: bold;
 851 }
 852
 853 #myopac_sum_fines {
 854     float:right;
 855     padding: 15px 0px 0px 23px;
 856     background: [% css_colors.accent_ultralight %];
 857     width: 177px;
 858     height: 166px;
 859 }
 860
 861 #myopac_sum_fines_placehold { float: right; width: 177px; height: 166px; }
 862
 863 .acct_holds_temp td {
 864     text-align: left;
 865 }
 866
 867 #acct_checked_tabs .align, #acct_holds_tabs .align, #acct_prefs_tabs .align {
 868     float:left;
 869     /*padding-left:10px;*/
 870 }
 871
 872 #acct_checked_main_header, #acct_holds_main_header, #acct_checked_hist_header, #acct_list_header, #acct_list_header_anon, #temp_list_holds {
 873     border-collapse: collapse;
 874 }
 875
 876 .hold_notes {
 877     text-transform: none;
 878     font-weight: normal;
 879 }
 880
 881 .hold_note_title { font-weight: bold; }
 882
 883 #acct_checked_main_header td, #acct_holds_main_header td, #acct_checked_hist_header td, #acct_list_header td, #acct_list_header_anon td, #temp_list_holds td {
 884     background: [% css_colors.accent_lighter2 %];
 885     padding: 10px;
 886 }
 887
 888 #acct_checked_main_header th, #acct_holds_main_header th, #acct_checked_hist_header th, #acct_list_header th, #acct_list_header_anon th, #temp_list_holds th {
 889     text-align: left;
 890     padding: 0px 10px 0px 10px;
 891 }
 892
 893 #acct_list_header select, #acct_list_header_anon select {
 894     font-weight:normal;
 895     text-transform:none;
 896 }
 897
 898 .search_catalog_lbl {
 899     font-size: [% css_fonts.size_bigger %];
 900 }
 901 .adv_search_catalog_lbl {
 902     font-size: [% css_fonts.size_bigger %];
 903 }
 904
 905 .browse_the_catalog_lbl {
 906     font-size: [% css_fonts.size_bigger %];
 907 }
 908
 909 .lbl1 {
 910     font-size: [% css_fonts.size_bigger %];
 911     font-weight:bold;
 912 }
 913
 914 .lbl2 {
 915     font-size: [% css_fonts.size_smaller %];
 916     font-weight:normal;
 917     position:relative;
 918     top:3px;
 919     max-width:300px;
 920 }
 921
 922 #myopac_tabs, #adv_search_parent, #fines_payments_wrapper {
 923     background: [% css_colors.primary_fade %];
 924     padding-top:5px;
 925     margin-bottom:20px;
 926 }
 927
 928 #fines_payments_wrapper {
 929     padding-left: 5px;
 930     padding-right: 5px;
 931 }
 932
 933 .myopac_payments_table th { text-align: left; }
 934 .myopac_payments_table thead th { border-bottom: 1px dashed [% css_colors.accent_darker %]; }
 935 .myopac_payments_table thead th:first-child { width: 8em; }
 936 .myopac_payments_table tbody tr:nth-child(odd) { background-color: [% css_colors.accent_lighter %]; }
 937 .myopac_payments_table form { display: inline; }
 938 .myopac_payments_table input[type="submit"] { padding: 1px; }
 939
 940 .payment-error {
 941     font-weight: bold; color: [% css_colors.text_alert %];
 942     padding: 10px; border: 1px solid [% css_colors.accent_medium_dark %];
 943 }
 944
 945 .payment-processing {
 946     font-weight: bold;
 947     color: [% css_colors.text_greatnews %];
 948     font-size: [% css_fonts.size_bigger %];
 949     padding: 10px; border: 1px solid [% css_colors.accent_medium_dark %];
 950     text-align: center;
 951 }
 952 #adv_search_input { width: 100%; }
 953 #adv_search_parent {
 954     margin-bottom:0px;
 955 }
 956 #search-submit-spinner {
 957     height: 16px;
 958     width: 16px;
 959 }
 960 div.adv_search_available {
 961     margin-top: 1em;
 962 }
 963 #myopac_loading {
 964     width:100%;
 965     text-align:center;
 966     padding-top:20px;
 967     font-size: [% css_fonts.size_bigger %];
 968     font-weight:bold;
 969 }
 970
 971 .chili_link {
 972     width:100px !important;
 973     text-align: center !important;
 974 }
 975
 976 .chili_review div.chili_link div {
 977     margin: auto;
 978 }
 979
 980 [%- IF we_want_to_turn_on_facet_styling.defined; %]
 981 /* some facet styling */
 982 .facetClassContainer { margin: 2px; border: 1px solid [% css_colors.accent_light %]; }
 983 .facetClassLabelContainer { border: 1px solid [% css_colors.accent_light %]; }
 984 .facetClassLabel { font-weight: bold; text-align: center; }
 985 .facetFieldContainer {  }
 986 .facetFieldLabel { padding-left: 2px; margin-top: 5px; margin-bottom: 5px; font-weight: bold; text-align: left; }
 987 .extraFacetFieldsWrapper { }
 988 .toggleExtraFacetFieldsButton { float: right; margin: 0px; padding: 0px; }
 989 .facetFieldLineCount {
 990     display: inline-block;
 991     border-right: 1px solid [% css_colors.accent_light %];
 992     color: [% css_colors.accent_mediumdark %];
 993     width: 3em;
 994     margin-right: 3px
 995 }
 996 .facetField { border-top: 1px solid [% css_colors.accent_light %]; }
 997 .facetFields { padding-left: 5px; }
 998 .facetFieldLineValue { overflow: hidden; text-overflow: ellipsis; }
 999 [%- END -%]
1000
1001 div#facet_sidebar {
1002     float: left;
1003     margin-right: 1em;
1004 }
1005
1006 .facet_box_temp {
1007     padding-bottom:3px;
1008 }
1009
1010 .facet_box_temp .header {
1011     height: 2.3em;
1012     background:[% css_colors.primary %];
1013     -moz-border-top-left-radius: 5px;
1014     border-top-left-radius: 5px;
1015     -moz-border-top-right-radius: 5px;
1016     border-top-right-radius: 5px;
1017     font-weight:bold;
1018     color:[% css_colors.text_invert %];
1019     padding-top:4px;
1020 }
1021
1022 .facet_box_temp .header .title {
1023     float:left;
1024     padding-top:6px;
1025     padding-left:12px;
1026 }
1027
1028 .facet_box_temp .header a.button {
1029     float:right;
1030     padding-top:6px;
1031     padding-right:6px;
1032     color:[% css_colors.text_invert %];
1033 }
1034
1035 .facet_box_wrapper .box_wrapper .box {
1036     border-top:1px solid [% css_colors.border_standard %];
1037     border-left:1px solid [% css_colors.border_standard %];
1038     border-right:1px solid [% css_colors.border_standard %];
1039     padding: 0 0.5em;
1040     width: 14em;
1041     overflow: hidden;
1042 }
1043
1044 .facet_template {
1045     box-sizing: border-box;
1046     -moz-box-sizing: border-box;
1047     display: table;
1048     margin: 0.5em 0;
1049     width: 100%;
1050 }
1051
1052 .facet_template div {
1053     display: table-cell;
1054     padding: 2px;
1055 }
1056
1057 .facet_template .count {
1058     text-align: right;
1059     color: [% css_colors.accent_mediumdark %];
1060 }
1061
1062 .facet_template_selected {
1063     background-color: [% css_colors.accent_lighter2 %];
1064     border: 1px solid [% css_colors.accent_medium %];
1065 }
1066
1067 #footer-wrap {
1068     background: linear-gradient([% css_colors.primary_fade %], [% css_colors.primary %]);
1069     background: -moz-linear-gradient([% css_colors.primary_fade %], [% css_colors.primary %]);
1070     background: -o-linear-gradient([% css_colors.primary_fade %], [% css_colors.primary %]);
1071     background: -webkit-linear-gradient([% css_colors.primary_fade %], [% css_colors.primary %]);
1072     background-color: [% css_colors.primary %];
1073 }
1074
1075 #footer {
1076     padding-top:5px;
1077     padding-bottom: 10px;
1078     margin-left: 1em;
1079     font-size: [% css_fonts.size_small %];
1080 }
1081
1082 #footer a {
1083     color: [% css_colors.text_invert %];
1084     text-decoration: none;
1085     text-shadow: 0 0 0.2em [% css_colors.primary %], 0 0 0.2em [% css_colors.primary %];
1086 }
1087
1088 #copyright_text, #footer_logo {
1089     color: [% css_colors.text_invert %];
1090 }
1091
1092 .color_4 {
1093     font-weight: bold;
1094 }
1095
1096 .advanced_div { padding-top: 15px; }
1097 #adv_global_search { width: 100%; }
1098 #adv_global_search select { width: 13em; }
1099 #adv_global_addrow td { padding-top: 7px; }
1100 #adv_global_input_table { width: 100%; }
1101 #adv_global_input_table select { width: 7em; }
1102 .adv_adv_link {
1103     font-size: [% css_fonts.size_smaller %];
1104     color: [% css_colors.text_alert %];
1105 }
1106 #acct_prefs_header { float: left; }
1107 .search_page_nav_link {
1108     cursor: pointer;
1109     padding-left: 1em;
1110 }
1111 #opac.result.sort { width: 160px; }
1112 .renew-summary { font-size: [% css_fonts.size_bigger %]; font-style: italic; margin: 0.5ex 0; }
1113 .failure-text { margin-left: 4em; font-style: italic; color: [% css_colors.text_alert %]; }
1114 .refine-controls { font-size: [% css_fonts.size_bigger %]; padding: 0.5ex 0; }
1115 #adv_search_refine input[type=text] { border: 1px inset [% css_colors.accent_light %] !important; }
1116 #adv_search_refine select { border: 1px inset [% css_colors.accent_light %] !important; }
1117 #adv_search_refine {
1118     padding-left: 5em; background-color: [% css_colors.accent_lighter2 %]; margin: 2ex 0;
1119 }
1120 .row-remover { position: relative; top: 1px; vertical-align: middle; }
1121 .subtle-button {
1122     background-color: [% css_colors.background %];
1123     color: [% css_colors.primary %]; text-decoration: none;
1124     padding: 0; border: 0; margin: 0;
1125     vertical-align: middle;
1126 }
1127 .subtle-button:hover { text-decoration: underline; cursor: pointer; }
1128 .no-dec:hover { text-decoration: none; }
1129 .pending-addr td { background-color: [% css_colors.background_alert %] !important; border: 0 !important; }
1130
1131 #account-update-email table { text-align: center; padding: 20px; margin-top: 18px; border-collapse: collapse; }
1132 #account-update-email table td { padding: 5px 15px 5px 15px; border-bottom: 1px solid [% css_colors.accent_lighter %]; text-align: left;}
1133 #account-update-email-error { font-size: [% css_fonts.size_biggest %]; padding: 10px; border:1px solid [% css_colors.border_standard %];}
1134 a.dash-link:hover { text-decoration: underline !important; }
1135 #list_create_table td { vertical-align: middle; padding: 0 8px; }
1136 #list_create_table {
1137     background-color: [% css_colors.accent_light %];
1138     padding-bottom: 4px;
1139     margin-bottom: 10px;
1140     border-bottom: 1px dotted [% css_colors.accent_medium %];
1141 }
1142 .list-create-table-buttons input[type=image] { margin-top: 2px; }
1143 .result_table_format_cell { padding: 0px 10px; text-align: center; }
1144 .results_row_count { font-weight: bold; }
1145 #hold_editor h1 { font-size: [% css_fonts.size_bigger %]; font-weight: bold; }
1146 #hold_editor h2 { font-size: [% css_fonts.size_big %]; font-weight: normal; text-indent: 2em; font-style: italic; }
1147 #hold_editor h1, #hold_editor h2 { margin: 2px 0; }
1148 #hold_editor_table { background-color: [% css_colors.accent_lighter %]; padding: 0.5em; }
1149 #hold_editor_table th { text-align: right; padding-right: 1em; }
1150 #hold_editor_table td { padding: 0.25em 0; }
1151 .fmt-note { vertical-align: middle; padding-left: 1em !important; }
1152 .hold-editor-controls { text-align: center; padding-top: 1em !important; }
1153 .hold-editor-controls a { padding-left: 2em; }
1154
1155 .text-right { text-align: right; }
1156 .text-right-top { text-align: right; vertical-align: top; }
1157 .rdetail-author-div { padding-bottom: 10px; }
1158
1159 .invisible { visibility: hidden; }
1160 .rdetail-extras-summary { margin: 10px; }
1161 .staff-hold { background-color: [% css_colors.accent_lightest %]; }
1162 .expert-search tbody tr th { text-align: right; padding-left: 2em; }
1163 .expert-search-row { padding-top: 10px; }
1164 #adv_expert_row label { font-weight: bold; }
1165
1166 .bookshelf thead tr td {
1167     border-bottom: 1px dashed [% css_colors.accent_dark %];
1168     padding-bottom: 1ex;
1169 }
1170 .cn_browse_item { padding: 2ex; }
1171 .results-paginator-list { padding-left: 1em; }
1172 .results-paginator-selected { color: [% css_colors.text_alert %]; }
1173 .inactive-hold { background: [% css_colors.accent_lightest %]; }
1174
1175 #hold-items-list td { padding: 5px; margin-bottom: 20px; }
1176 .hold-items-list-title { font-size: [% css_fonts.size_bigger %]; }
1177 .hold-items-list-problem { color: [% css_colors.text_alert %]; }
1178
1179 .big-strong {font-weight: bold; font-size: [% css_fonts.size_bigger %]; }
1180
1181 .results_header_btns, .results_header_sel {
1182     float:left;
1183 }
1184
1185 /*
1186  * .various_containers a = shortcut to putting .opac-button on every 'a' with
1187  *     the tradeoff of increased stylesheet complexity (TODO: rethink?)
1188  */
1189
1190 .opac-multiline-button > a,
1191 .opac-button, .results_header_btns a, #simple-detail-view-links a, .dash_account_buttons a {
1192     color: [% css_colors.button_text %];
1193     font-weight: bold;
1194     text-decoration: none;
1195     cursor: pointer !important;
1196     -moz-border-radius: 5px;
1197     border-radius: 5px;
1198     border: 1px solid [% css_colors.primary %];
1199     background:  [% css_colors.primary_fade %];
1200     margin: 0.5em;
1201     padding: 0.3em;
1202     display: inline-block;
1203 }
1204
1205 .opac-multiline-button > a:hover,
1206 .opac-button:hover, .results_header_btns a:hover, #simple-detail-view-links a:hover, #dash_wrapper a.opac-button:hover {
1207     background: [% css_colors.primary %];
1208 }
1209
1210 .opac-button:disabled {
1211     color: [% css_colors.accent_medium %];
1212     cursor: pointer !important;
1213     border: 1px solid [% css_colors.accent_light %];
1214     background-color: [% css_colors.accent_lighter %];
1215 }
1216
1217 /* Firefox adds its own special space to inputs; this gets us closer */
1218 button.opac-button::-moz-focus-inner, input.opac-button::-moz-focus-inner {
1219     padding: 0;
1220     border: 0;
1221 }
1222
1223 .opac-button-header, #dash_wrapper .opac-button {
1224     background: [% css_colors.control %];
1225     box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15);
1226     font-size: [% css_fonts.size_base %];
1227 }
1228 a.opac-button-header:hover, #dash_wrapper a.opac-button:hover {
1229     border-color: [% css_colors.control %];
1230 }
1231
1232 .opac-multiline-button > a {
1233     display: inline-block;
1234 }
1235
1236 #myopac_checked_div {
1237     padding: 0px;
1238 }
1239
1240 .rdetail-mfhd-head {
1241     margin-top: 5px;
1242     padding-top: 5px;
1243     background-color: [% css_colors.table_heading %];
1244 }
1245
1246 .rdetail-mfhd-type {
1247     padding-left: 1em;
1248 }
1249
1250 .rdetail-mfhd-bottom {
1251     border-bottom: thin solid [% css_colors.border_dark %];
1252     width: 100%;
1253 }
1254
1255 #rdetail_record_details {
1256     clear: both;
1257     margin-top: 1em;
1258 }
1259
1260 .rdetail_content {
1261     margin-left: 1.5em;
1262     padding-left: 1.5em;
1263 }
1264
1265 .rdetail_content_type, .rdetail_subject_type {
1266     vertical-align: top;
1267     font-weight: bold;
1268 }
1269
1270 .bookbag-item-row td { vertical-align: top; }
1271
1272 .error { color: [% css_colors.text_alert %]; font-weight: bold; }
1273 .success {
1274     color: [% css_colors.text_greatnews %];
1275     font-weight: bold;
1276 }
1277
1278 .rdetail_related_subjects {
1279     margin-top: 1.5em;
1280 }
1281
1282 .rdetail_related_series {
1283     margin-top: 1.5em;
1284 }
1285
1286 #rdetail_openurl {
1287     margin-top: 1em;
1288 }
1289
1290 .rdetail_openurl_entry {
1291     margin-left: 1em;
1292     padding-left: 1em;
1293 }
1294 .bookbag-controls-holder { width: 100%; }
1295 .bookbag-controls-holder:nth-child(odd) { background-color: [% css_colors.accent_lighter2 %]; }
1296 .bookbag-controls-holder:nth-child(even) { background-color: [% css_colors.accent_lightest %]; }
1297 .bookbag-controls-holder .most {
1298     padding-left: 0;
1299     margin-right: 5em;
1300 }
1301 h2.bookbag-name { margin-bottom: 0em; padding-bottom: 0em; }
1302 .bookbag-share .fixed { min-width: 4em; }
1303 .bookbag-specific { margin-left: 1em; }
1304 .bookbag-specific div.sort { float: left; width: 45%; text-align: left; }
1305 .bookbag-specific div.meta { float: right; width: 54%; text-align: right; }
1306 #bbag-name-desc-form tr th { vertical-align: middle; }
1307 #bbag-name-desc-form .saver { vertical-align: middle; text-align: center; }
1308 .bookbag-description {
1309     padding-top: 0em;
1310     font-style: italic;
1311     max-width: 40em;
1312 }
1313 #bbag-edit-description { width: 20em; }
1314 #bbag-edit-name { width: 20em; }
1315 textarea { font-family: sans-serif; }
1316 table.bookbag-specific {
1317     border-right: 1px solid [% css_colors.accent_dark %];
1318     border-bottom: 1px solid [% css_colors.accent_medium %];
1319     margin-bottom: 2ex;
1320 }
1321 .bookbag-share {
1322     float: left;
1323     padding: 5px 0;
1324 }
1325 .bookbag-controls {
1326     float: left;
1327     padding: 5px 0px 0px 10px;
1328 }
1329
1330 .bookbag-specific td.list_checkbox {
1331     padding-left: 10px !important;
1332 }
1333 .bookbag-specific td.list_entry {
1334     min-width: 10em;
1335     padding-left: 5px !important;
1336 }
1337 .bookbag-specific td.list_actions {
1338     white-space: nowrap !important;
1339 }
1340 .bookbag-paginator-selected { color: [% css_colors.text_alert %]; }
1341
1342 .list_is_empty {
1343     padding: 8px 0px 6px 0px;
1344     width: 100%;
1345     border: 0;
1346     font-size: [% css_fonts.size_bigger %];
1347     text-align: center;
1348     font-style: italic;
1349 }
1350 .save-notes { padding-bottom: 1.5ex; }
1351
1352 .nonbreaking-wrapper {
1353     display: inline-block;
1354 }
1355
1356 /* Moved from semiauto.css */
1357 .adv_global_input_container {
1358     border-bottom: none;
1359     clear: both;
1360 }
1361 .opac-auto-013 {
1362     border-bottom: none;
1363     *height: 0px;
1364 }
1365 .adv_global_filter_sort {
1366     border: none;
1367     width: 100%;
1368 }
1369 .clear-both { clear: both; }
1370 .common-no-pad {
1371     clear: both;
1372     height: 0px;
1373     margin: 0px;
1374     padding: 0px;
1375 }
1376 .common-full-pad {
1377     clear: both;
1378     height: 15px;
1379 }
1380 .alert { color: [% css_colors.text_alert %]; }
1381 .float-left { float: left; }
1382 .float-right { float: right; }
1383
1384 .saved-searches-header { width: 100%; font-weight: bold; font-size: [% css_fonts.size_bigger %]; }
1385 .saved-searches-header .button { float: right; width: 28px; }
1386 .saved-searches-header .text { float: left; padding-right: 1em; margin: 0.5ex 0;}
1387 .saved-searches-header {font-weight: bold; font-size: [% css_fonts.size_bigger %]; }
1388 .saved-searches { border-bottom: 1px solid [% css_colors.accent_medium %]; padding-right: 1em; }
1389 #staff-saved-search { /* wraps .saved-searches-header and .saved-searches on the record page */
1390     border-right: 1px solid [% css_colors.accent_darker %];
1391 }
1392 .result_item_circulated {
1393     padding-top: 4px;
1394 }
1395
1396 .result_item_circulated span {
1397     position: relative;
1398     top:-3px;
1399     left:3px;
1400 }
1401
1402 #search-only-bookbag-container { margin: 2ex 0; font-weight: bold; }
1403 #result-bookbag-heading { text-align: center; margin: 2ex; }
1404
1405 .result-bookbag-name { font-size: [% css_fonts.size_bigger %]; font-weight: bold; }
1406 .result-bookbag-description { font-size: [% css_fonts.size_bigger %]; font-style: italic; }
1407 .result-bookbag-item-note { font-style: italic; }
1408 .lowhits-bookbag-name { font-weight: bold; }
1409 .oils_AS { font-weight: bold; color: [% css_colors.text_match %]; }
1410 .oils_AS_match_term { text-align: left; color: [% css_colors.text %]; }
1411 .oils_AS_match_field {
1412     font-size: [% css_fonts.size_smallest %]; padding: 0.65em 0;
1413     text-align: right; color: [% css_colors.accent_medium %];
1414 }
1415 table.result_holdings_table {
1416     margin-top: 1em;
1417     margin-bottom: 1em;
1418 }
1419 table.result_holdings_table thead tr {
1420     background: [% css_colors.table_heading %];
1421 }
1422 table.result_holdings_table thead tr th {
1423     font-weight: bold;
1424 }
1425 span.preflib {
1426     margin: 0 2em 0 2em;
1427 }
1428 a.preflib_change {
1429   vertical-align: super;
1430   font-size: [% css_fonts.size_smaller %];
1431   line-height: normal;
1432   text-decoration: none;
1433 }
1434 .rdetail-holding-group { margin-left: 1.5em; }
1435 .rdetail-holding-group span { margin-left: 1.5em; }
1436 .rdetail-holding-group .paging { margin-left: 1.5em; }
1437 #rdetail_deleted_exp {
1438     font-weight: bold;
1439     padding: 1em;
1440     margin: 1em;
1441     border: thick solid [% css_colors.border_alert %];
1442 }
1443
1444 #ac_tab_wrapper { width : 100%; }
1445 .ac_tab { float: left; padding-right: 10px; font-size: [% css_fonts.size_big %]; padding: 5px; border: 1px solid [% css_colors.primary_offset %]; }
1446 .ac_tab_selected { background-color: [% css_colors.primary_offset %]; }
1447 .ac_tab_selected a { color: [% css_colors.text_invert %]; }
1448 #ac_content { clear: both; width: 100%; margin-top: 10px; }
1449
1450 /* Popmenu styles used for making css menus. */
1451 .popmenu {
1452     margin: 0;
1453     padding: 0;
1454 }
1455 .popmenu li {
1456     list-style: none;
1457 }
1458 .popmenu li a {
1459     display: block;
1460     padding: 3px 5px;
1461 }
1462 .popmenu li ul {
1463     display: none;
1464     width: 10em; /* Width to help Opera out */
1465     background-color: [% css_colors.primary %];
1466 }
1467 .popmenu li:hover ul {
1468     display: block;
1469     position: absolute;
1470     margin: 0;
1471     padding: 0;
1472     border-color: [% css_colors.border_dark %];
1473     border-width: 1px;
1474     border-style: solid;
1475 }
1476 .popmenu li:hover li {
1477     float: none;
1478 }
1479 .popmenu li:hover li a {
1480     background-color: [% css_colors.primary %];
1481     color: [% css_colors.accent_ultralight %];
1482 }
1483 .popmenu li li a:hover {
1484     background-color: [% css_colors.accent_ultralight %];
1485     color: [% css_colors.primary %];
1486 }
1487 /* Styles for the temporary list entry. */
1488 .popmenu li:hover li[class~="temporary"] a {
1489     background-color: [% css_colors.primary %];
1490     color: [% css_colors.accent_ultralight %];
1491 }
1492 .popmenu li li[class~="temporary"] a:hover {
1493     background-color: [% css_colors.accent_ultralight %];
1494     color: [% css_colors.primary %];
1495 }
1496 /* Styles for the default list entry. */
1497 .popmenu li:hover li[class~="default"] a {
1498     background-color: [% css_colors.primary %];
1499     color: [% css_colors.accent_ultralight %];
1500 }
1501 .popmenu li li[class~="default"] a:hover {
1502     background-color: [% css_colors.accent_ultralight %];
1503     color: [% css_colors.primary %];
1504 }
1505 /* Styles for the new list entry. */
1506 .popmenu li:hover li[class~="new"] a {
1507     background-color: [% css_colors.primary %];
1508     color: [% css_colors.accent_ultralight %];
1509 }
1510 .popmenu li li[class~="new"] a:hover {
1511     background-color: [% css_colors.accent_ultralight %];
1512     color: [% css_colors.primary %];
1513 }
1514 /* Style to add a divider on the menu. */
1515 .popmenu li li[class~="divider"] {
1516     border-bottom-width: 1px;
1517     border-bottom-color: [% css_colors.border_dark %];
1518     border-bottom-style: solid;
1519 }
1520
1521 #locale_picker_form {
1522     float: right;
1523     padding: 0.5em;
1524     margin-top: 2em;
1525     border-right: thin [% css_colors.control %] solid;
1526 }
1527
1528 #locale_picker_form * {
1529     margin: 0;
1530     padding: 0;
1531     vertical-align: middle;
1532 }
1533
1534 #patron_usr_barcode_not_found {
1535     font-weight: bold; color: [% css_colors.text_alert %];
1536 }
1537
1538 .record_title {
1539     font-weight: bold;
1540 }
1541
1542 .record_author {
1543     font-style: italic;
1544 }
1545
1546 .password_message {
1547     padding-top: 1em;
1548     padding-bottom: 0.5em;
1549         font-style: italic;
1550 }
1551
1552 #maintenance_message {
1553     padding: 5px;
1554     width: 100%;
1555     background-color: [% css_colors.text_alert %];
1556     color: [% css_colors.text_invert %];
1557     text-align: center;
1558 }
1559
1560 #search-box > span {
1561     margin: 0 1em;
1562 }
1563 .browse-error {
1564     font-weight: bold;
1565     font-color: #c00;
1566 }
1567 .browse-result-sources, .browse-result-authority-bib-links {
1568     margin-left: 1em;
1569 }
1570 .browse-result-best-match {
1571     font-weight: bold;
1572 }
1573 .browse-pager {
1574     margin: 2ex 0;
1575 }
1576 .browse-result-list {
1577     padding-bottom: 0.5ex;
1578 }
1579 .browse-shortcuts {
1580     font-size: [% css_fonts.size_bigger %];
1581 }
1582 .browse-result-authority-field-name {
1583     font-style: italic;
1584     margin-right: 1em;
1585 }
1586 .browse-leading-article-warning {
1587     font-style: italic;
1588     font-size: [% css_fonts.size_big %];
1589 }
1590 .browse-public-general-note {
1591     font-size: [% css_fonts.size_big %];
1592 }
1593 .browse-public-general-note-label { }
1594 .browse-public-general-note-institution {
1595     font-style: normal;
1596     font-weight: bold;
1597 }
1598 .browse-public-general-note-body {
1599     font-style: italic;
1600 }
1601
1602 .bib_peer_type {
1603     font-weight: bold;
1604 }
1605
1606 #main-content-register {
1607     margin-left: 40px;
1608     font-size: [% css_fonts.size_bigger %];
1609 }
1610
1611 #main-content-register table {
1612     padding: 20px;
1613     margin-top: 18px;
1614     border-collapse: collapse;
1615 }
1616
1617 #main-content-register td {
1618     text-align: left;
1619 }
1620
1621 #main-content-register td:not(:first-child) {
1622     padding-left: 20px;
1623 }
1624
1625 .patron-reg-invalid {
1626     font-weight: bold;
1627     color: red;
1628     padding-right: 10px;
1629 }
1630
1631 .result_footer_nav1 {
1632     clear: both;
1633 }
1634
1635 .small_view_only, #refine_hits, #return_to_hits {
1636     display: none;
1637 }
1638
1639 .rdetail_authors_div {
1640     margin-bottom: 1em;
1641 }
1642
1643 #search_query_label, #search_qtype_label, #search_itype_label, #search_locg_label {
1644     white-space: nowrap;
1645     display: inline-block;
1646 }
1647
1648 .result_table_title_cell {
1649     padding-top: 4px;
1650     padding-bottom: 4px;
1651 }
1652
1653 .record_title {
1654     font-size: [% css_fonts.size_bigger %];
1655 }
1656
1657 @media only screen and (max-width: 800px) {
1658     .facet_sidebar_hidden, .result_block_hidden {
1659         display: none;
1660     }
1661     .facet_sidebar_visible, .result_block_visible {
1662         display: inline ! important;
1663     }
1664     #acct_select, #acct_prefs_select {
1665         display: inline-block;
1666     }
1667 #acct_tabs, #acct_prefs_tabs {
1668          display:none;
1669      }
1670 }
1671
1672 @media only screen and (max-width: 600px) {
1673     input, select {
1674         font-size: [% css_fonts.size_big %];
1675     }
1676     span .nav_arrow_fix {
1677         display: none;
1678     }
1679     #header {
1680         padding: 0px;
1681         margin: 0px;
1682     }
1683     #homesearch_main_logo img {
1684         width:75%;
1685     }
1686     #format_selector {
1687         display:none;
1688     }
1689     #your-acct-login {
1690         padding: 0px;
1691         padding-top: 5px;
1692     }
1693     #your-acct-login a {
1694         margin: 0px;
1695         padding: 5px;
1696     }
1697     #topnav_logo {
1698         margin: 0;
1699     }
1700     #topnav_logo img {
1701         width: 200px;
1702     }
1703     #locale_picker_form {
1704         display: none;
1705     }
1706     #gold-links-holder {
1707         display: none;
1708     }
1709     #simple-detail-view-links {
1710         display: none;
1711     }
1712     #acct_tabs a, #acct_fines_tabs a {
1713        padding: 2px 4px 3px 4px;
1714        -moz-border-radius: 6px 6px 0px 0px;
1715        border-radius: 6px 6px 0px 0px;
1716        font-size: [% css_fonts.size_base %];
1717        margin: 0px 5px 0px 0px;
1718     }
1719
1720     #dash_wrapper div {
1721         background: transparent;
1722         padding: 0px;
1723     }
1724     #dash_wrapper {
1725         position: static;
1726         top: auto;
1727     }
1728     #dash_wrapper .opac-button {
1729         top: 0px;
1730     }
1731     .small_view_only {
1732         display: inline !important;
1733     }
1734     #dash_identity a {
1735         float:left;
1736     }
1737     #dashboard {
1738         display: none;
1739     }
1740     #holds_box form blockquote {
1741         margin-left: 10px;
1742         margin-right: 2px;
1743     }
1744     #holds_box form blockquote select {
1745         width: 100%;
1746     }
1747     #myopac_sum_fines_placehold {
1748         display:none;
1749     }
1750     #myopac_sum_fines {
1751         display: none;
1752     }
1753     .results_header_lbl {
1754         display: none;
1755     }
1756     .results_header_nav1 span.h1 {
1757         display: none;
1758     }
1759     .preflib {
1760         display: none;
1761     }
1762     .start_end_links_span {
1763         display: block;
1764     }
1765     .invisible {
1766         display: none;
1767     }
1768     .result_table_pic_header {
1769         padding-left: 0px !important;
1770         padding-right: 5px;
1771         width: 0px !important;
1772         margin: 0px;
1773     }
1774     .result_table_pic {
1775         width: 55px;
1776         padding: 0px;
1777         margin: 0px;
1778     }
1779     tr[name=results_isbn_tr], tr[name=results_phys_desc_tr], tr[name=results_pub_tr] strong, .result_count {
1780          display: none;
1781     }
1782     tr.result_table_title_cell[name=bib_cn_list] .result_holdings_table th:nth-child(4),
1783     tr.result_table_title_cell[name=bib_cn_list] .result_holdings_table td:nth-child(4) {
1784         display:none;
1785     }
1786     .results_info_table td {
1787         padding: 0px;
1788     }
1789     #results_header_bar {
1790         background-color: inherit;
1791     }
1792     .results_header_btns a {
1793         margin: 0.3em;
1794     }
1795     #main-content {
1796         margin: 0 1px;
1797     }
1798     #rdetails_status thead {
1799         display: none;
1800     }
1801     #rdetails_status tr {
1802         display: block;
1803         margin-top: 3px;
1804     }
1805     #rdetails_status td {
1806         display: block;
1807         padding: 1px;
1808     }
1809     .copy_details_row {
1810         background-color: [% css_colors.accent_lightest %];
1811     }
1812     .copy_details_offers_row {
1813         background-color: [% css_colors.accent_lightest %];
1814     }
1815     select#pickup_lib.search-wrapper-locg {
1816         width: 100%;
1817     }
1818     #search-wrapper #search-box {
1819         width: 85%;
1820         padding-top: 5px;
1821     }
1822     #main-content-home {
1823         padding: 0px;
1824         margin: 0px;
1825     }
1826     /* Make use of full width in mobile mode */
1827     .facet_box_wrapper .box_wrapper .box,
1828     .facet_template .facet,
1829     .facet_box_temp {
1830         width: inherit;
1831     }
1832     .facet_template .count {
1833         padding-left: 1em;
1834     }
1835     #facet_sidebar {
1836         margin-top: 0.5em;
1837     }
1838     #adv_search_parent {
1839         font-size: [% css_fonts.size_smaller %];
1840     }
1841     #adv_search_filters {
1842         position: relative;
1843         width: 300px;
1844     }
1845     #format_actions {
1846         float: left;
1847     }
1848     .rdetail_aux_utils {
1849         padding: 0px;
1850         border: none;
1851     }
1852     .result_metadata {
1853         width: inherit;
1854     }
1855     div#rdetail_actions_div {
1856         float: none;
1857     }
1858     h2.rdetail_uris {
1859         clear: both;
1860     }
1861     .search_catalog_lbl {
1862         margin-left: 0;
1863         white-space: nowrap;
1864     }
1865     .adv_search_catalog_lbl {
1866         margin-top: 0;
1867         white-space: nowrap;
1868     }
1869     .browse_the_catalog_lbl {
1870         white-space: nowrap;
1871     }
1872     .mobile_hide {
1873         display: none;
1874     }
1875     #dash_user {
1876         display: block;
1877         padding: 0.5em;
1878     }
1879     .dash_divider {
1880         display: none;
1881     }
1882     .dash_account_buttons {
1883         display: block;
1884     }
1885     .searchbar { line-height: 1.5em; }
1886     #browse-controls { line-height: 1.5em; }
1887     #search_query_label, #search_qtype_label, #search_itype_label, #search_locg_label {
1888         display: block;
1889     }
1890     .bookshelf td {
1891         display: block;
1892         width: 100%;
1893     }
1894     .bookshelf table thead tr {
1895         display: block;
1896     }
1897     #lowhits_help { width: inherit; }
1898     #adv_search_tabs a{
1899         font-size: [% css_fonts.size_small %];
1900         margin: 2px 2px 0px 2px;
1901         padding: 2px 2px 5px 2px;
1902         -moz-border-radius: 10px 0px 0px 0px;
1903         border-radius: 7px 7px 0px 0px;
1904     }
1905     #adv_global_tbody td {
1906         border-bottom: thin solid [% css_colors.accent_light %];
1907     }
1908     #adv_global_addrow td {
1909         border-bottom: none;
1910     }
1911         /* Force table to not be like tables anymore */
1912         table#acct_checked_main_header thead tr th {
1913                 display: block;
1914         }
1915         table#acct_checked_main_header tbody tr td {
1916                 display: block;
1917         }
1918
1919         /* Hide table headers (but not display: none;, for accessibility) */
1920         thead tr {
1921                 position: absolute;
1922                 top: -9999px;
1923                 left: -9999px;
1924         }
1925
1926         table#acct_checked_main_header tr { border: 1px solid #ddd; }
1927
1928         table#acct_checked_main_header td {
1929                 /* Behave  like a "row" */
1930                 border: none;
1931                 border-bottom: 1px solid #eee;
1932                 position: relative;
1933                 padding-left: 40%;
1934         }
1935
1936         table#acct_checked_main_header td:before {
1937                 /* Now like a table header */
1938                 position: absolute;
1939                 /* Top/left values mimic padding */
1940                 left: 2px;
1941                 width: 40%;
1942                 padding-right: 10px;
1943                 white-space: nowrap;
1944         }
1945
1946         table#acct_checked_main_header td:nth-of-type(1) { border-top: 5px solid #aaa; padding-top: 15px; background-color: #fff;}
1947         table#acct_checked_main_header td:nth-of-type(2):before { content: "[% l('Title / Author') %]";}
1948         table#acct_checked_main_header td:nth-of-type(3):before { content: "[% l('Renewals Left') %]"; }
1949         table#acct_checked_main_header td:nth-of-type(4):before { content: "[% l('Due Date') %]"; }
1950         table#acct_checked_main_header td:nth-of-type(5):before { content: "[% l('Barcode') %]"; }
1951         table#acct_checked_main_header td:nth-of-type(6):before { content: "[% l('Call number') %]"; }
1952
1953         table#acct_holds_main_header thead tr th {
1954                 display: block;
1955         }
1956         table#acct_holds_main_header tbody tr td {
1957                 display: block;
1958         }
1959
1960         table#acct_holds_main_header td {
1961                 /* Behave  like a "row" */
1962                 border: none;
1963                 border-bottom: 1px solid #eee;
1964                 position: relative;
1965                 padding-left: 40%;
1966         }
1967
1968
1969         table#acct_holds_main_header td:before {
1970                 /* Now like a table header */
1971                 position: absolute;
1972                 /* Top/left values mimic padding */
1973                 left: 2px;
1974                 width: 40%;
1975                 padding-right: 10px;
1976                 white-space: nowrap;
1977         }
1978
1979         table#acct_holds_main_header td:nth-of-type(1) { border-top: 5px solid #aaa; padding-top: 15px; background-color: #fff;}
1980         table#acct_holds_main_header td:nth-of-type(2):before { content: "[% l('Title') %]";}
1981         table#acct_holds_main_header td:nth-of-type(3):before { content: "[% l('Author') %]"; }
1982         table#acct_holds_main_header td:nth-of-type(4):before { content: "[% l('Format') %]"; }
1983         table#acct_holds_main_header td:nth-of-type(5):before { content: "[% l('Pickup Location') %]"; }
1984         table#acct_holds_main_header td:nth-of-type(6):before { content: "[% l('Activate') %]"; }
1985         table#acct_holds_main_header td:nth-of-type(7):before { content: "[% l('Cancel on') %]"; }
1986         table#acct_holds_main_header td:nth-of-type(8):before { content: "[% l('Active') %]"; }
1987         table#acct_holds_main_header td:nth-of-type(9):before { content: "[% l('Status') %]"; }
1988         table#acct_holds_main_header td.hold_notes:before { content: "[% l('Notes') %]"; }
1989 }