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