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