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