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

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