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