1/** 2 * webtrees: online genealogy 3 * Copyright (C) 2019 webtrees development team 4 * This program is free software: you can redistribute it and/or modify 5 * it under the terms of the GNU General Public License as published by 6 * the Free Software Foundation, either version 3 of the License, or 7 * (at your option) any later version. 8 * This program is distributed in the hope that it will be useful, 9 * but WITHOUT ANY WARRANTY; without even the implied warranty of 10 * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the 11 * GNU General Public License for more details. 12 * You should have received a copy of the GNU General Public License 13 * along with this program. If not, see <http://www.gnu.org/licenses/>. 14 */ 15 16/* The webtrees theme */ 17@import "_base.css"; 18@import "_block-charts.css"; 19@import "_charts.css"; 20@import "_list-branches.css"; 21@import "_list-individuals.css"; 22@import "_list-media.css"; 23@import "_list-notes.css"; 24@import "_list-places.css"; 25@import "_list-repositories.css"; 26@import "_list-sources.css"; 27@import "_mime-type-icons.css"; 28@import "_on-screen-keyboard.css"; 29@import "_tab-relatives.css"; 30 31/* Colors for chart boxes, etc. */ 32:root { 33 --sex-f-fg: #ff2080; 34 --sex-m-fg: #81a9cb; 35 --sex-u-fg: #81a9cb; 36 --sex-f-bg: #e9daf1; 37 --sex-m-bg: #edf7fd; 38 --sex-u-bg: #ffffff; 39 --chart-line: solid gray thin; 40 --chart-line-radius: 1rem; 41} 42 43/* Override Bootstrap formatting */ 44.btn-link { 45 padding-left: 0.25rem; 46 padding-right: 0.25rem; 47} 48 49.table-given-name { 50 overflow-x: hidden; 51} 52 53.container-fluid { 54 padding-left: 5px; 55 padding-right: 5px; 56} 57 58table { 59 border-collapse: separate; 60} 61 62/* 63 * Pages have the following high-level structure: 64 * 65 * wt-global wt-theme-<THEME> wt-route-<ROUTE> 66 * +---wt-header-wrapper 67 * | +---wt-header-container 68 * | +---wt-header-content 69 * | +---wt-accessibility-links 70 * | +---wt-site-logo 71 * | +---wt-site-title 72 * | +---wt-header-search 73 * | | +---wt-header-search-form 74 * | | +---wt-header-search-field 75 * | | +---wt-header-search-button 76 * | +---wt-secondary-navigation 77 * | | +---wt-user-menu 78 * | +---wt-primary-navigation 79 * | +---wt-genealogy-menu 80 * +---wt-main-wrapper 81 * | +---wt-main-container 82 * | +---wt-main-content 83 * | +---wt-messages 84 * | +---wt-page-title 85 * | +---wt-page-options wt-page-options-xxxxx 86 * | +---wt-page-content 87 * +---wt-footers 88 * +---wt-footer wt-footer-contact 89 * +---wt-footer wt-footer-cookies 90 * +---wt-footer wt-footer-page-views 91 * +---wt-footer wt-footer-powered-by 92 */ 93 94.wt-global { 95 color: #555; 96} 97 98.wt-header-wrapper { 99} 100 101.wt-header-container { 102} 103 104.wt-header-content { 105} 106 107.wt-accessibility-links { 108} 109 110.wt-site-logo { 111 order: 1; 112 flex: 0 0 272px; 113} 114 115.wt-site-logo:after { 116 height: 50px; 117 width: 242px; 118 content: url(webtrees/images/webtrees.png); 119} 120 121.wt-site-title { 122 order: 3; 123 flex: 0 0 calc(100% - 15rem); 124 font-size: 1.5rem; 125 font-weight: normal; 126} 127 128.wt-header-search { 129 order: 4; 130 flex: 0 0 15rem; 131 position: relative; 132 top: -0.75rem; 133} 134 135.wt-header-search-form { 136} 137 138.wt-header-search-field { 139} 140 141.wt-header-search-button { 142} 143 144.wt-secondary-navigation { 145 order: 2; 146 white-space: nowrap; 147 margin-bottom: 15px; 148} 149 150.wt-user-menu { 151 flex-wrap: nowrap; 152 justify-content: flex-end; 153} 154 155.wt-user-menu .nav-link { 156 display: inline-block; 157 padding: 0.5rem; 158} 159 160.wt-user-menu .nav-item + .nav-item::before { 161 content: "|"; 162} 163 164.wt-user-menu .dropdown-toggle::after { 165 display: none; 166} 167 168.wt-primary-navigation { 169 order: 5; 170 /* Extend to full page width */ 171 flex: 0 0 100vw; 172 max-width: 100vw; 173 /* Recalculate margins for content */ 174 margin: 0 calc(50% - 50vw); 175 padding: 0 calc(50vw - 50%); 176 border-bottom: 2px solid #81a9cb; 177 border-top: 2px solid #81a9cb; 178} 179 180.wt-genealogy-menu { 181 justify-content: center; 182} 183 184.wt-genealogy-menu .nav-item { 185 text-align: center; 186 min-width: 5rem; 187} 188 189.wt-genealogy-menu .nav-link::before { 190 display: block; 191} 192 193.wt-genealogy-menu .dropdown-toggle::after { 194 display: none; 195} 196 197.wt-genealogy-menu .dropdown-menu { 198 border-radius: 0; 199 border: thin solid #aaa; 200} 201 202.wt-genealogy-menu .dropdown-item { 203 /* Space between icons and align with submenu icons */ 204 padding: 0 5px 0 0; 205 line-height: 1.0; 206} 207 208.wt-genealogy-menu .dropdown-item::before { 209 vertical-align: text-top; 210 line-height: 2.4; 211 padding: 0 .25rem; 212} 213 214.menu-tree .nav-link::before { 215 content: url(webtrees/menu/tree.png); 216} 217 218.menu-tree .dropdown-item::before { 219 content: url(webtrees/menu/tree-tree.png); 220} 221 222.menu-chart .nav-link::before { 223 content: url(webtrees/menu/chart.png); 224} 225 226.menu-chart-ancestry::before { 227 content: url(webtrees/menu/chart-ancestors.png); 228} 229 230.menu-chart-compact::before { 231 content: url(webtrees/menu/chart-compact.png); 232} 233 234.menu-chart-descendants::before { 235 content: url(webtrees/menu/chart-descendants.png); 236} 237 238.menu-chart-familybook::before { 239 content: url(webtrees/menu/chart-family-book.png); 240} 241 242.menu-chart-fanchart::before { 243 content: url(webtrees/menu/chart-fanchart.png); 244} 245 246.menu-chart-hourglass::before { 247 content: url(webtrees/menu/chart-hourglass.png); 248} 249 250.menu-chart-lifespan::before { 251 content: url(webtrees/menu/chart-lifespan.png); 252} 253 254.menu-chart-pedigree::before { 255 content: url(webtrees/menu/chart-pedigree.png); 256} 257 258.menu-chart-pedigreemap::before { 259 content: url(webtrees/menu/chart-pedigree-map.png); 260} 261 262.menu-chart-relationship::before { 263 content: url(webtrees/menu/chart-relationship.png); 264} 265 266.menu-chart-statistics::before { 267 content: url(webtrees/menu/chart-statistics.png); 268} 269 270.menu-chart-timeline::before { 271 content: url(webtrees/menu/chart-timeline.png); 272} 273 274.menu-chart-tree::before { 275 content: url(webtrees/menu/chart-tree.png); 276} 277 278.menu-list .nav-link::before { 279 content: url(webtrees/menu/list.png); 280} 281 282.menu-branches::before { 283 content: url(webtrees/menu/branches.png); 284} 285 286.menu-list-fam::before { 287 content: url(webtrees/menu/list-fam.png); 288} 289 290.menu-list-indi::before { 291 content: url(webtrees/menu/list-indi.png); 292} 293 294.menu-list-note::before { 295 content: url(webtrees/menu/list-note.png); 296} 297 298.menu-list-obje::before { 299 content: url(webtrees/menu/list-obje.png); 300} 301 302.menu-list-plac::before { 303 content: url(webtrees/menu/list-plac.png); 304} 305 306.menu-list-repo::before { 307 content: url(webtrees/menu/list-repo.png); 308} 309 310.menu-list-sour::before { 311 content: url(webtrees/menu/list-sour.png); 312} 313 314.menu-calendar .nav-link::before { 315 content: url(webtrees/menu/calendar.png); 316} 317 318.menu-calendar-day::before { 319 content: url(webtrees/menu/calendar-calendar.png); 320} 321 322.menu-calendar-month::before { 323 content: url(webtrees/menu/calendar-calendar.png); 324} 325 326.menu-calendar-year::before { 327 content: url(webtrees/menu/calendar-calendar.png); 328} 329 330.menu-report .nav-link::before { 331 content: url(webtrees/menu/report.png); 332} 333 334.menu-report .dropdown-item::before { 335 content: url(webtrees/menu/report-report.png); 336} 337 338.menu-search .nav-link::before { 339 content: url(webtrees/menu/search.png); 340} 341 342.menu-search .dropdown-item::before { 343 content: url(webtrees/menu/search-search.png); 344} 345 346.menu-help .nav-link::before { 347 content: url(webtrees/menu/help.png); 348} 349 350.menu-clippings .nav-link::before { 351 content: url(webtrees/menu/clippings.png); 352} 353 354.menu-clippings-add::before { 355 content: url(webtrees/menu/clippings-add.png); 356} 357 358.menu-clippings-cart::before { 359 content: url(webtrees/menu/clippings-cart.png); 360} 361 362.menu-clippings-download::before { 363 content: url(webtrees/menu/edit-preferences.png); 364} 365 366.menu-clippings-empty::before { 367 content: url(webtrees/menu/edit-delete.png); 368} 369 370.menu-fam .nav-link::before { 371 content: url(webtrees/menu/fam.png); 372} 373 374.menu-fam-change::before { 375 content: url(webtrees/menu/edit-famchange.png); 376} 377 378.menu-fam-addchil::before { 379 content: url(webtrees/menu/edit-addchil.png); 380} 381 382.menu-fam-orderchil::before { 383 content: url(webtrees/menu/edit-orderchil.png); 384} 385 386.menu-fam-del::before { 387 content: url(webtrees/menu/edit-delete.png); 388} 389 390.menu-fam-addfav::before { 391 content: url(webtrees/menu/edit-add-favorite.png); 392} 393 394.menu-fam-editraw::before { 395 content: url(webtrees/menu/edit-fam.png); 396} 397 398.menu-indi .nav-link::before { 399 content: url(webtrees/menu/indi.png); 400} 401 402.menu-indi-addname::before { 403 content: url(webtrees/menu/edit-indi.png); 404} 405 406.menu-indi-editsex::before { 407 content: url(webtrees/menu/edit-indi.png); 408} 409 410.menu-indi-del::before { 411 content: url(webtrees/menu/edit-delete.png); 412} 413 414.menu-indi-addfav::before { 415 content: url(webtrees/menu/edit-add-favorite.png); 416} 417 418.menu-indi-editraw::before { 419 content: url(webtrees/menu/edit-indi.png); 420} 421 422.menu-obje .nav-link::before { 423 content: url(webtrees/menu/obje.png); 424} 425 426.menu-obje-edit::before { 427 content: url(webtrees/menu/edit-obje.png); 428} 429 430.menu-obje-link::before { 431 content: url(webtrees/menu/edit-link.png); 432} 433 434.menu-obje-del::before { 435 content: url(webtrees/menu/edit-delete.png); 436} 437 438.menu-obje-addfav::before { 439 content: url(webtrees/menu/edit-add-favorite.png); 440} 441 442.menu-obje-editraw::before { 443 content: url(webtrees/menu/edit-obje.png); 444} 445 446.menu-note .nav-link::before { 447 content: url(webtrees/menu/note.png); 448} 449 450.menu-note-edit::before { 451 content: url(webtrees/menu/edit-note.png); 452} 453 454.menu-note-del::before { 455 content: url(webtrees/menu/edit-delete.png); 456} 457 458.menu-note-addfav::before { 459 content: url(webtrees/menu/edit-add-favorite.png); 460} 461 462.menu-note-editraw::before { 463 content: url(webtrees/menu/edit-note.png); 464} 465 466.menu-record .nav-link::before { 467 content: url(webtrees/menu/indi.png); 468} 469 470.menu-record-del::before { 471 content: url(webtrees/menu/edit-delete.png); 472} 473 474.menu-record-editraw::before { 475 content: url(webtrees/menu/edit-record.png); 476} 477 478.menu-repo .nav-link::before { 479 content: url(webtrees/menu/repo.png); 480} 481 482.menu-repo-edit::before { 483 content: url(webtrees/menu/edit-repo.png); 484} 485 486.menu-repo-del::before { 487 content: url(webtrees/menu/edit-delete.png); 488} 489 490.menu-repo-addfav::before { 491 content: url(webtrees/menu/edit-add-favorite.png); 492} 493 494.menu-repo-editraw::before { 495 content: url(webtrees/menu/edit-repo.png); 496} 497 498.menu-sour .nav-link::before { 499 content: url(webtrees/menu/sour.png); 500} 501 502.menu-sour-edit::before { 503 content: url(webtrees/menu/edit-sour.png); 504} 505 506.menu-sour-del::before { 507 content: url(webtrees/menu/edit-delete.png); 508} 509 510.menu-sour-addfav::before { 511 content: url(webtrees/menu/edit-add-favorite.png); 512} 513 514.menu-sour-editraw::before { 515 content: url(webtrees/menu/edit-sour.png); 516} 517 518.menu-story .nav-link::before { 519 content: url(webtrees/menu/story.png); 520} 521 522.wt-main-container { 523 /* Space between the header/footer and the main content. */ 524 padding-top: 1rem; 525 padding-bottom: 1rem; 526} 527 528.wt-main { 529} 530 531.wt-messages { 532} 533 534.wt-page-title { 535 color: #006; 536 font-size: 1.5rem; 537 font-weight: bold; 538 text-align: center; 539} 540 541.wt-page-options { 542} 543 544.wt-page-content { 545} 546 547.wt-page-options .form-group { 548 margin-bottom: 2px; 549} 550 551.wt-page-options-label { 552 color: #fff; 553 background-color: #81a9cb; 554 font-weight: bold; 555 border-left: 2px solid transparent; 556 border-right: 2px solid transparent; 557} 558 559.wt-page-options-value { 560 background-color: #edf7f9; 561 border: solid #81a9cb 1px; 562 padding: 0.25rem 0.75rem; 563} 564 565.wt-page-content { 566 margin-top: 1rem; 567} 568 569.wt-footers { 570} 571 572.wt-footer { 573} 574 575.wt-footer-contact { 576} 577 578.wt-footer-cookies { 579 background: #aaa; 580 color: #fff; 581 transition: height 0.5s; 582} 583 584.wt-footer-page-views { 585} 586 587.wt-footer-powered-by { 588} 589 590.wt-footer-powered-by-webtrees { 591 width: 100px; 592 height: 21px; 593 content: url(images/powered-by-webtrees.png); 594} 595 596/* 597 * The tree/user home pages 598 * 599 * wt-home-page / wt-user-page 600 * +---wt-main-blocks 601 * | +---wt-block, wt-block-AAA 602 * | +---wt-block, wt-block-BBB 603 * | +---wt-block, wt-block-CCC 604 * +---wt-side-blocks 605 * +---wt-block, wt-block-XXX 606 * +---wt-block, wt-block-YYY 607 * +---wt-block, wt-block-ZZZ 608 * 609 * Each block as the structure 610 * wt-block, wt-block-XXX 611 * +---wt-block-header, wt-block-header-XXX 612 * +---wt-block-content, wt-block-content-XXX 613 */ 614 615.wt-block { 616 background-color: #edf7fd; 617 border: solid #81a9cb 1px; 618} 619 620.wt-block-header { 621 background-color: #edf7fd; 622 border-bottom: none; 623 font-weight: bold; 624} 625 626.wt-block-content { 627} 628 629.wt-block-content .list_table { 630 border-spacing: 1px; 631 border: solid #81a9cb 1px; 632 border-right: 0; 633} 634 635.wt-block-content .list_value, 636.wt-block-content .list_value_wrap { 637 border: 0; 638 border-top: solid #81a9cb 1px; 639 border-right: solid #81a9cb 1px; 640} 641 642/* 643 * The individual page. 644 * 645 * wt-route-individual 646 * +---wt-header-wrapper 647 */ 648 649.wt-individual-silhouette { 650 content: url(images/individual-silhouette-unknown.png); 651} 652 653.wt-individual-silhouette-f { 654 content: url(images/individual-silhouette-female.png); 655} 656 657.wt-individual-silhouette-m { 658 content: url(images/individual-silhouette-male.png); 659} 660 661/* 662 * Chart-boxes are used to build the various charts. 663 * Each type of chart will set its own size and hide/show content. 664 * 665 * wt-chart-box 666 * +--- wt-chart-box-thumbnail 667 * +--- wt-chart-box-extra 668 * +--- wt-chart-box-zoom 669 * +--- wt-chart-box-icon 670 * +--- wt-chart-box-dropdown wt-chart-box-zoom-dropdown 671 * +--- wt-chart-box-links 672 * +--- wt-chart-box-icon 673 * +--- wt-chart-box-dropdown wt-chart-box-links-dropdown 674 * +--- wt-chart-box-name 675 * +--- wt-chart-box-lifespan 676 * +--- wt-chart-box-facts 677 * +--- wt-chart-box-fact 678 */ 679.wt-chart-box, 680.wt-chart-box-menu { 681 background: var(--sex-u-bg); 682 border: dashed var(--sex-u-fg) thin; 683} 684 685.wt-chart-box { 686 height: 5rem; 687 padding: 2px; 688 line-height: 1.1; 689} 690 691.wt-chart-box-f, 692.wt-chart-box-f .wt-chart-box-dropdown { 693 background: var(--sex-f-bg); 694 border: solid var(--sex-f-fg) thin; 695} 696 697.wt-chart-box-m, 698.wt-chart-box-m .wt-chart-box-dropdown { 699 background: var(--sex-m-bg); 700 border: solid var(--sex-m-fg) thin; 701} 702 703/* 704 * Calendar 705 * 706 * wt-calendar-page 707 */ 708 709/* 710 * Reports 711 * 712 * wt-reports-page 713 */ 714 715/* 716 * Search 717 * 718 * wt-search-page, wt-general-serach-page/wt-phonetic-search-page/wt-advanced-search-page/wt-search-replace-page 719 */ 720 721a { 722 color: #555; 723 text-decoration: none; 724} 725 726a:hover { 727 color: #f00; 728 text-decoration: none; 729} 730 731:focus { 732 outline-style: none; 733} 734 735.flash-messages { 736 clear: both; 737 text-align: center; 738} 739 740img { 741 border: 0; 742} 743 744legend img { 745 height: 20px; 746 vertical-align: middle; 747 width: 20px; 748} 749 750img.block, 751#mycart img { 752 border: 0; 753 height: 25px; 754 vertical-align: middle; 755} 756 757.topbottombar { 758 background-color: #81a9cb; 759 color: #fff; 760 font-weight: bold; 761 padding: 4px; 762 text-align: center; 763} 764 765#mycart a img { 766 height: 15px; 767} 768 769.button { 770 width: 60px; 771} 772 773.alpha_index { 774 color: #999; 775} 776 777.news_box:target, 778#gedcom_stats:target { 779 background-color: #ffc; 780} 781 782/* families tab person box */ 783table.center { 784 margin-left: auto; 785 margin-right: auto; 786} 787 788.list_table { 789 margin: 0 auto; 790} 791 792.list_label, 793.list_label_wrap { 794 color: #fff; 795 background-color: #81a9cb; 796 font-weight: bold; 797 text-align: center; 798} 799 800.list_value, 801.list_value_wrap { 802 background-color: #edf7f9; 803 border: solid #81a9cb 1px; 804 vertical-align: top; 805 padding: 4px; 806} 807 808.list_label, 809.list_value { 810 white-space: nowrap; 811} 812 813.list_label_wrap, 814.list_value_wrap { 815 white-space: normal; 816} 817 818div.fact_SHARED_NOTE { 819 clear: both; 820} 821 822/* Table of genealogical facts */ 823 824.wt-facts-table caption { 825 caption-side: top; 826} 827 828.wt-facts-table th { 829 background-color: #81a9cb; 830 border: solid #81a9cb 1px; 831 text-align: center; 832 font-weight: normal; 833 min-width: 20%; 834} 835 836.wt-facts-table td { 837 background-color: #edf7fd; 838 border: solid #81a9cb 1px; 839} 840 841.wt-facts-table .wt-gender-M td { 842 background-color: #edf7fd; 843 border-color: #81a9cb; 844} 845 846.wt-facts-table .wt-gender-F td { 847 background-color: #e9daf1; 848 border-color: #ff2080; 849} 850 851.tabs_table { 852 width: 99%; 853} 854 855.name1 { 856 font-weight: bold; 857 font-size: 12px; 858} 859 860.name2 { 861 font-size: 16px; 862} 863 864a:hover .name1, a:hover .name2 { 865 color: #f00; 866 font-weight: bold; 867 font-size: 12px; 868} 869 870a:hover .nameZoom { 871 color: #f00; 872 font-size: 16px; 873 font-weight: bold; 874} 875 876.details0, 877.details1 { 878 font-size: 11px; 879} 880 881.details2 { 882 font-size: 12px; 883} 884 885.nameZoom { 886 color: #555; 887 font-size: 16px; 888 font-weight: bold; 889} 890 891.details_label { 892 font-weight: bold; 893} 894 895.name_head { 896 color: #555; 897 font-size: 16px; 898 font-weight: bold; 899 line-height: 2; 900 padding: 0 5px; 901} 902 903.date { 904 color: #337; 905} 906 907.label { 908 font-weight: bold; 909} 910 911.error { 912 color: #d00; 913 font-weight: bold; 914} 915 916.largeError { 917 color: #d00; 918 font-size: large; 919 font-weight: bold; 920} 921 922.warning { 923 color: #f00; 924 font-weight: bold; 925} 926 927.indent { 928 padding-left: 20px; 929} 930 931.image { 932 height: 150px; 933 padding: 5px; 934 margin: 2px; 935} 936 937.gender_image { 938 margin: 0 3px; 939 border: 0; 940 vertical-align: middle; 941} 942 943.thumbnail { 944 height: auto; 945 padding: 3px; 946} 947 948.icon { 949 border: 0; 950 padding: 0 5px; 951} 952 953.sublinks_cell { 954 background-color: #edf7fd; 955 font-size: 12px; 956} 957 958.submenu .icon { 959 vertical-align: middle; 960 width: 20px; 961 height: 20px; 962} 963 964.subheaders { 965 font-weight: bold; 966 font-size: 15px; 967 margin-top: 15px; 968 vertical-align: bottom; 969} 970 971#family-table .subheaders:first-child { 972 width: 285px; 973} 974 975.parentdeath { 976 border: thin solid #888; 977 padding: 1px; 978} 979 980.source_citations { 981 display: none; 982} 983 984.selected-option { 985 background-color: #edf7fd; 986} 987 988.border1 { 989 border: solid #000 1px; 990} 991 992.menuitem { 993 text-decoration: none; 994 font-size: 11px; 995 padding: 1px; 996} 997 998.menuitem_hover { 999 text-decoration: none; 1000 font-size: 11px; 1001 padding: 1px; 1002} 1003 1004.menuitem .icon, .menuitem_hover .icon { 1005 width: 50px; 1006 height: 50px; 1007} 1008 1009.submenu { 1010 text-decoration: none; 1011 font-size: 11px; 1012 background-color: #edf7fd; 1013 border: solid #81a9cb 1px; 1014 visibility: hidden; 1015 position: absolute; 1016 padding: 5px; 1017} 1018 1019.submenuitem { 1020 vertical-align: middle; 1021 font-size: 11px; 1022 height: 20px; 1023 text-decoration: none; 1024 background-color: #edf7fd; 1025 padding: 1px; 1026 white-space: nowrap; 1027} 1028 1029.submenuitem_hover { 1030 vertical-align: middle; 1031 height: 20px; 1032 font-size: 11px; 1033 background-color: #e6f0fa; 1034 white-space: nowrap; 1035 padding: 1px; 1036} 1037 1038.submenuitem a, 1039.submenuitem_hover a { 1040 display: inline-block; 1041 vertical-align: middle; 1042} 1043 1044.journal_box { 1045 padding: 3pt; 1046 border: thin solid #aaa; 1047 overflow: visible; 1048} 1049 1050.news_box { 1051 background-color: #edf7fd; 1052 border-top: solid #81a9cb 1px; 1053} 1054 1055.news_title { 1056 font-weight: bold; 1057} 1058 1059.news_date { 1060 margin-bottom: 12px; 1061} 1062 1063.current_day { 1064 font-weight: bold; 1065 font-size: 16px; 1066} 1067 1068.cal_day { 1069 float: left; 1070 font-weight: bold; 1071} 1072 1073.rtl_cal_day { 1074 direction: rtl; 1075 float: right; 1076 color: #00f; 1077 font-weight: bold; 1078} 1079 1080.helpcontent { 1081 margin-left: 10px; 1082 margin-right: 10px; 1083} 1084 1085.helpcontent dt { 1086 clear: both; 1087} 1088 1089#user-page h1 { 1090 margin: 0.25em auto 0.6em; 1091} 1092 1093.tvertline { 1094 vertical-align: bottom; 1095} 1096 1097#childbox { 1098 padding: 5px; 1099 position: absolute; 1100 display: none; 1101 text-align: start; 1102 white-space: nowrap; 1103 top: 20px; 1104 left: 0; 1105} 1106 1107.layout3 #childbox { 1108 top: auto; 1109 bottom: 20px; 1110} 1111 1112#childbox a.name1 { 1113 display: block; 1114 margin-left: 5px; 1115} 1116 1117.person0 { 1118 background-color: #aaf; 1119 border: outset #aaf 1px; 1120 vertical-align: top; 1121} 1122 1123.person1 { 1124 background-color: #afa; 1125 border: outset #afa 1px; 1126 vertical-align: top; 1127} 1128 1129.person2 { 1130 background-color: #faa; 1131 border: outset #faa 1px; 1132 vertical-align: top; 1133} 1134 1135.person3 { 1136 background-color: #55f; 1137 border: outset #55f 1px; 1138 vertical-align: top; 1139} 1140 1141.person4 { 1142 background-color: #f55; 1143 border: outset #f55 1px; 1144 vertical-align: top; 1145} 1146 1147.person5 { 1148 background-color: #5f5; 1149 border: outset #5f5 1px; 1150 vertical-align: top; 1151} 1152 1153.listlog { 1154 line-height: 20pt; 1155} 1156 1157.starredname { 1158 text-decoration: underline; 1159} 1160 1161.search_hit { 1162 background-color: #ff0; 1163} 1164 1165.search_item { 1166 font-weight: 600; 1167} 1168 1169.descriptionbox { 1170 color: #fff; 1171 font-size: 12px; 1172 background-color: #81a9cb; 1173 border: solid #81a9cb 1px; 1174 vertical-align: top; 1175 padding: 3px; 1176} 1177 1178.optionbox { 1179 background-color: #d1d9ef; 1180 font-size: 1rem; 1181 border: solid #81a9cb 1px; 1182 vertical-align: top; 1183 white-space: nowrap; 1184 padding: 3px; 1185} 1186 1187.vmiddle { 1188 vertical-align: middle; 1189} 1190 1191.red { 1192 color: #f00; 1193} 1194 1195.wt-relation-fact, 1196.wt-historic-fact { 1197 opacity: 0.8; 1198} 1199 1200.font9 { 1201 font-size: 9px; 1202} 1203 1204.font11 { 1205 font-size: 11px; 1206} 1207 1208.messagebox { 1209 background-color: #c2ceef; 1210 border: solid #81a9cb 1px; 1211} 1212 1213/* ---Pending edits--- */ 1214.new { 1215 outline: solid blue 1px; 1216} 1217 1218.old { 1219 outline: solid red 1px; 1220} 1221 1222.tag_cloud { 1223 text-align: center; 1224} 1225 1226.tag_cloud a { 1227 white-space: nowrap; 1228} 1229 1230.nowrap { 1231 white-space: nowrap; 1232} 1233 1234.wrap { 1235 white-space: normal; 1236} 1237 1238.statistics-page { 1239 text-align: center; 1240} 1241 1242.gchart { 1243 border: solid #81a9cb 1px; 1244} 1245 1246/* ---Find special characters--- */ 1247.largechars { 1248 font-family: monospace; 1249 font-size: 200%; 1250} 1251 1252#facts_content dd { 1253 float: left; 1254 width: 70%; 1255} 1256 1257td.descriptionbox a { 1258 color: #fff; 1259} 1260 1261/* this keeps the tag color the same when it is a link as when not */ 1262 1263.place { 1264 padding-top: 5px; 1265} 1266 1267#pending h2 { 1268 text-align: center; 1269 margin-bottom: 20px; 1270} 1271 1272#pending h3 { 1273 text-align: center; 1274 margin-top: 20px; 1275} 1276 1277#pending a { 1278 font-weight: 700; 1279 color: #555; 1280} 1281 1282#pending a:hover { 1283 color: #f00; 1284} 1285 1286#pending .list_value { 1287 padding: 3px; 1288 text-align: center; 1289 vertical-align: middle; 1290 white-space: nowrap; 1291} 1292 1293#pending .indent { 1294 padding: 0; 1295} 1296 1297/* --- reportengine.php --- */ 1298#reportengine-page table { 1299 margin: 20px auto; 1300} 1301 1302#reportengine-page .report-type { 1303 overflow: hidden; 1304 margin: auto; 1305 width: 180px; 1306} 1307 1308#reportengine-page .report-type div { 1309 float: left; 1310 margin: 0 20px; 1311} 1312 1313#reportengine-page .report-type p { 1314 margin: 0; 1315 text-align: center; 1316} 1317 1318/* styles for popup menus */ 1319.itr { 1320 position: absolute; 1321 line-height: 1.5; 1322} 1323 1324.popup { 1325 position: absolute; 1326 top: 20px; 1327 right: 0; 1328 left: auto; 1329 visibility: hidden; 1330 opacity: 0; 1331 transition: visibility 0s ease .25s, opacity .25s ease; 1332 z-index: 9999; 1333 box-shadow: 5px 5px 5px 0 rgba(0, 0, 0, .4); 1334} 1335 1336.popup ul { 1337 white-space: nowrap; 1338 list-style: none; 1339 margin: 0; 1340 padding: 0 10px; 1341 font-size: smaller; 1342} 1343 1344.popup > ul { 1345 padding: 2px 10px; 1346} 1347 1348.popup li .NAME { 1349 padding: 0 5px; 1350} 1351 1352.itr:hover .popup { 1353 visibility: visible; 1354 opacity: 1; 1355 transition-delay: 0s; 1356} 1357 1358/* styles for FindFacts pop-up */ 1359#layDefinedTags, 1360#tabDefinedTagsShow { 1361 width: 450px; 1362} 1363 1364#tabDefinedTags { 1365 width: 430px; 1366} 1367 1368#layDefinedTags { 1369 margin-left: auto; 1370 margin-right: auto; 1371 height: 285px; 1372 overflow: auto; 1373} 1374 1375#tabDefinedTags { 1376 border-collapse: collapse; 1377} 1378 1379#tabDefinedTags th, 1380#tabDefinedTags td { 1381 border: solid 1px #000; 1382 margin: 0; 1383 padding: 3px; 1384} 1385 1386#tabDefinedTags tbody th { 1387 text-align: left; 1388 font-weight: bold; 1389} 1390 1391#tabDefinedTags tr.sel { 1392 background-color: #d1d9ef; 1393 color: #888; 1394} 1395 1396#tabDefinedTags tr.unsel { 1397 background-color: #fff; 1398 color: #888; 1399} 1400 1401#tabDefinedTagsShow { 1402 margin-left: auto; 1403 margin-right: auto; 1404} 1405 1406#tabDefinedTagsShow td { 1407 width: 50%; 1408 text-align: center; 1409} 1410 1411#tabFilterAndCustom { 1412 margin-left: auto; 1413 margin-right: auto; 1414} 1415 1416#tabAction { 1417 margin-left: auto; 1418 margin-right: auto; 1419} 1420 1421#tabAction td { 1422 width: 50%; 1423 text-align: center; 1424} 1425 1426/* ======== List styles ====== */ 1427.surname-list, 1428.givn-list { 1429 margin: 5px auto; 1430} 1431 1432.source-list table, 1433.note-list table, 1434.repo-list table, 1435.media-list table, 1436.indi-list table, 1437.fam-list table { 1438 width: 100%; 1439} 1440 1441.source-list td, 1442.note-list td, 1443.repo-list td, 1444.media-list td, 1445.indi-list td, 1446.fam-list td, 1447.surname-list td, 1448.givn-list td { 1449 padding: 2px 5px; 1450} 1451 1452.surname-list td { 1453 vertical-align: top; 1454} 1455 1456.indi-list .stats, 1457.fam-list .stats { 1458 margin: 0 auto; 1459 width: auto; 1460} 1461 1462.source-list th, 1463.note-list th, 1464.repo-list th, 1465.media-list th, 1466.indi-list th, 1467.fam-list th, 1468.wt-table-changes th, 1469.wt-table-events th, 1470.wt-table-tasks th, 1471.wt-table-yahrzeits th, 1472.surname-list th, 1473.givn-list th { 1474 cursor: pointer; 1475 font-weight: 600; 1476 padding: 2px 4px; 1477 white-space: nowrap; 1478} 1479 1480.source-list th:last-child, 1481.note-list th:last-child, 1482.repo-list th:last-child { 1483 margin: 0 -2px 1px 1px; 1484 padding: 3px 0 4px; 1485 width: 24px; 1486} 1487 1488.givn-list th { 1489 cursor: pointer; 1490 white-space: nowrap; 1491 padding: 2px; 1492 text-align: center; 1493} 1494 1495#source-details h2, 1496#sourcelist-page h2, 1497#note-details h2, 1498#notelist-page h2, 1499#repo-details h2, 1500#repolist-page h2, 1501#media-details h2, 1502#statistics-page h2 { 1503 margin-bottom: 20px; 1504 text-align: center; 1505} 1506 1507#source-edit, 1508#note-edit, 1509#repo-edit, 1510#media-edit { 1511 overflow-x: auto; 1512} 1513 1514.media-list td img { 1515 display: block; 1516 height: 40px; 1517 width: auto; 1518 margin: 3px auto; 1519} 1520 1521.filtersH, 1522.filtersF { 1523 margin: 4px; 1524} 1525 1526.filtersH img { 1527 margin-bottom: 2px; 1528} 1529 1530.list-charts { 1531 text-align: center; 1532} 1533 1534#search-result-tabs h3 { 1535 text-align: center; 1536} 1537 1538#searchAccordion-indi, 1539#searchAccordion-fam, 1540#searchAccordion-source, 1541#searchAccordion-note { 1542 margin: auto; 1543 width: 99%; 1544} 1545 1546#place-hierarchy h2, 1547#place-hierarchy h4 { 1548 text-align: center; 1549} 1550 1551#main_select, 1552#available_select, 1553#right_select { 1554 min-width: 150px; 1555} 1556 1557/* === Who is online block === */ 1558.logged_in_list { 1559 margin: 5px 0 0; 1560 padding: 0; 1561 line-height: 20px; 1562} 1563 1564/* ==== Theme select block === */ 1565.theme_form ul { 1566 margin: -10px auto; 1567} 1568 1569.theme_form li { 1570 visibility: hidden; 1571} 1572 1573.theme_form li ul li { 1574 display: inline-block; 1575 padding: 10px; 1576 visibility: visible; 1577} 1578 1579/* ==== FAQ table styles ===== */ 1580table.faq { 1581 background-color: #e0e0e0; 1582 margin: 5px 0 50px 5px; 1583 width: 98%; 1584} 1585 1586table.faq tr:nth-child(odd) td { 1587 background-color: #e7eef3; 1588} 1589 1590div.faq_title { 1591 background-color: #e0e0e0; 1592 margin: 1em 0; 1593 padding: .25em; 1594 font-weight: bold; 1595 width: 98%; 1596} 1597 1598div.faq_body { 1599 clear: both; 1600 padding: 0 1em; 1601} 1602 1603.faq_top { 1604 float: right; 1605} 1606 1607/* === Positioning edit, copy, delete links === */ 1608/* General use */ 1609.editfacts { 1610 clear: left; 1611 padding-top: 15px; 1612} 1613 1614/* ======== Indi header ====== */ 1615#indi_header { 1616 overflow: hidden; 1617 border-radius: 3px; 1618 border: 1px solid #b2c7d7; 1619 margin: 0 0 5px; 1620 padding: 10px 0; 1621} 1622 1623#indi_header h3 { 1624 font-size: 90%; 1625 font-weight: bold; 1626 margin: 0; 1627 padding: 0 10px 0 30px; 1628 text-align: left; 1629 overflow: hidden; 1630 position: relative; 1631} 1632 1633#indi_header .name_one { 1634 font-size: 1.5em; 1635} 1636 1637#indi_header h3 .details1 { 1638 font-size: 1.0em; 1639} 1640 1641#indi_header h3 .header_age { 1642 padding: 5px 0 5px 5px; 1643 float: right; 1644 font-weight: normal; 1645 font-size: 65%; 1646} 1647 1648#indi_header h3 a { 1649 display: inline; 1650} 1651 1652#indi_header a { 1653 color: #337; 1654 font-size: 0.75em; 1655 font-weight: normal; 1656} 1657 1658#indi_header a:hover { 1659 color: #f00; 1660} 1661 1662#indi_mainimage { 1663 float: left; 1664 padding: 0 10px; 1665} 1666 1667#header_accordion1 { 1668 padding: 0 10px 0 0; 1669 overflow: hidden; 1670} 1671 1672#header_accordion1 .indi_name_details { 1673 margin: 0; 1674 overflow: hidden; 1675 padding: 5px; 1676} 1677 1678.indi_name_details .name1 { 1679 font-weight: normal; 1680 padding-top: 5px; 1681 font-size: inherit; 1682} 1683 1684#indi_header a.warning { 1685 color: #f00; 1686 font-size: 1em; 1687} 1688 1689#indi_note { 1690 margin: 0 0 5px; 1691} 1692 1693.indi_table { 1694 clear: left; 1695} 1696 1697#sex { 1698 float: right; 1699} 1700 1701#dates { 1702 float: right; 1703} 1704 1705#individual-names .wt-icon-edit, 1706#individual-names .wt-icon-delete { 1707 float: right; 1708} 1709 1710#indi_note .fact_NOTE { 1711 float: left; 1712 margin: 0 5px 0 0; 1713} 1714 1715#indi_note .fact_SOUR { 1716 margin: 3px 0; 1717} 1718 1719#indi_note .fact_SOUR a { 1720 font-size: 100%; 1721} 1722 1723#indi_note .fact_NOTE, 1724#indi_note .fact_SOUR { 1725 clear: both; 1726} 1727 1728/* markdown formatting */ 1729 1730.markdown { 1731 /* Tables and pre-formatted text can break the layout. */ 1732 overflow-x: auto; 1733} 1734 1735.markdown p { 1736 margin: 0 0 0.5em; 1737 white-space: pre-wrap; 1738} 1739 1740.markdown table { 1741 border-collapse: collapse; 1742 margin-bottom: 5px; 1743} 1744 1745.markdown th { 1746 font-weight: bold; 1747} 1748 1749.markdown td, 1750.markdown th { 1751 border: solid thin #000; 1752 padding: 3px; 1753} 1754 1755.odometer { 1756 font-family: courier, monospace; 1757 font-weight: bold; 1758 background: #000; 1759 color: #fff; 1760} 1761 1762/* ======== Indi tabs ======== */ 1763/* Facts & Events tab */ 1764#personal_facts_content .fact_NOTE, 1765#personal_facts_content .fact_SOUR, 1766#family-table .fact_NOTE, 1767#family-table .fact_SOUR { 1768 margin: 5px 3px 5px 0; 1769 clear: both; 1770} 1771 1772.media-display-image { 1773 float: left; 1774} 1775 1776.media-display-title { 1777 float: left; 1778 font-style: italic; 1779 margin: 10px; 1780} 1781 1782/* === jQuery.datatable styling general over-rides === */ 1783.odd { 1784 background-color: #e7eef3; 1785} 1786 1787.even { 1788 background-color: #e6e6e6; 1789} 1790 1791.css_right { 1792 float: left; 1793} 1794 1795.fg-button { 1796 padding: 2px 6px; 1797} 1798 1799/* Sidebar - Family navigator */ 1800.wt-family-navigator-dropdown { 1801 background: #edf7fd; 1802} 1803 1804.wt-family-navigator-dropdown-heading { 1805 font-weight: bold; 1806 font-size: inherit; 1807 color: inherit; 1808} 1809 1810/* Sidebar - Descendants */ 1811#sb_content_descendancy { 1812 margin-top: 5px; 1813} 1814 1815#sb_desc_content { 1816 margin-left: 3px; 1817 font-size: 0.8em; 1818} 1819 1820#sb_desc_content ul { 1821 padding: 0; 1822 margin: 0; 1823} 1824 1825.sb_desc_indi_li { 1826 list-style-type: none; 1827} 1828 1829.desc_tree_div { 1830 display: none; 1831} 1832 1833.desc_tree_div ul { 1834 padding: 0; 1835 margin-left: 10px; 1836 margin-top: 0; 1837 margin-right: 0; 1838} 1839 1840/* Individuals and Families */ 1841#sidebar-content-individuals, 1842#sidebar-content-families { 1843 margin-top: 5px; 1844} 1845 1846.sb_indi_surname_li, 1847.sb_fam_surname_li { 1848 list-style-image: url(webtrees/images/plus.png); 1849} 1850 1851.name_tree_div ul { 1852 padding: 0; 1853 margin: 0; 1854} 1855 1856.name_tree_div li { 1857 list-style: none; 1858 margin: 0; 1859 padding: 0; 1860} 1861 1862/* Clippings */ 1863#sb_clippings_content ul { 1864 padding: 0; 1865 margin: 0; 1866} 1867 1868#sb_clippings_content li { 1869 list-style: none; 1870 margin: 0; 1871 padding: 0; 1872 white-space: nowrap; 1873} 1874 1875/* Extra info */ 1876#sb_content_extra_info { 1877 font-size: 80%; 1878 font-weight: bold; 1879 margin-top: 1px; 1880 overflow: hidden; 1881 padding: 5px; 1882} 1883 1884#sb_content_extra_info .editfacts { 1885 float: right; 1886 margin-top: -30px; 1887} 1888 1889#sb_content_extra_info a { 1890 display: block; 1891} 1892 1893#sb_content_extra_info span { 1894 font-weight: normal; 1895} 1896 1897#sb_content_extra_info span a { 1898 display: inline; 1899} 1900 1901#sb_content_extra_info #hitcounter { 1902 border-top: 1px solid #b2c7d7; 1903 font-weight: bold; 1904 padding-top: 5px; 1905} 1906 1907/* http://www.jacklmoore.com/colorbox */ 1908#colorbox, 1909#cboxOverlay, 1910#cboxWrapper { 1911 position: absolute; 1912 top: 0; 1913 left: 0; 1914 z-index: 9999; 1915 overflow: hidden; 1916} 1917 1918#cboxWrapper { 1919 max-width: none; 1920} 1921 1922#cboxOverlay { 1923 position: fixed; 1924 width: 100%; 1925 height: 100%; 1926 background: #fff; 1927} 1928 1929#cboxContent { 1930 background: #fff; 1931 overflow: hidden; 1932 position: relative; 1933 padding: 0.5rem; 1934 border: 0.25rem solid #ccc; 1935} 1936 1937#cboxLoadingOverlay, 1938#cboxLoadingGraphic { 1939 position: absolute; 1940 top: 0; 1941 left: 0; 1942 width: 100%; 1943 height: 100%; 1944} 1945 1946.cboxPhoto { 1947 float: left; 1948 margin: auto; 1949 border: 0; 1950 display: block; 1951 max-width: none; 1952} 1953 1954#colorbox, 1955#cboxContent, 1956#cboxLoadedContent { 1957 box-sizing: content-box; 1958} 1959 1960#cboxError { 1961 padding: 50px; 1962 border: 1px solid #ccc; 1963} 1964 1965#cboxLoadedContent { 1966 margin-bottom: 28px; 1967} 1968 1969#cboxTitle { 1970 background: #fff; 1971 position: absolute; 1972 bottom: 0.25rem; 1973 left: 0; 1974 margin: 0 3rem; 1975 text-align: center; 1976} 1977 1978#cboxLoadingGraphic { 1979 background: url(images/loading-32x32.gif) no-repeat center center; 1980} 1981 1982#cboxPrevious, #cboxNext, #cboxSlideshow, #cboxClose { 1983 background: none; 1984 border: 0; 1985 cursor: pointer; 1986 font-family: "Font Awesome\ 5 Free", sans-serif; 1987 font-weight: 900; 1988 overflow: visible; 1989 padding: 0; 1990 position: absolute; 1991} 1992 1993#cboxSlideshow { 1994 bottom: 0.25rem; 1995 right: 0.25rem; 1996} 1997 1998#cboxPrevious { 1999 bottom: 0.25rem; 2000 left: 0.25rem; 2001} 2002 2003#cboxNext { 2004 bottom: 0.25rem; 2005 left: 1.5rem; 2006} 2007 2008#cboxClose { 2009 top: 0.25rem; 2010 right: 0.25rem; 2011} 2012 2013/* Stories module */ 2014.story_title { 2015 padding-top: 12px; 2016 font-size: 13px; 2017 height: 32px; 2018 font-weight: bold; 2019} 2020 2021.story_body { 2022 padding: 20px; 2023 white-space: normal; 2024} 2025 2026.story_edit { 2027 padding: 12px; 2028} 2029 2030/* ====== Charts Styles ======== */ 2031#people label { 2032 display: block; 2033} 2034 2035/* Ancestry chart */ 2036.wt-chart-ancestors-list { 2037 background: transparent url(images/vline.png) left top repeat-y; 2038 margin: 0 0 0 15px; 2039 padding: 0; 2040 display: block; 2041} 2042 2043.wt-chart-ancestors-list-item { 2044 margin: 5px 0; 2045} 2046 2047.chart_common li { 2048 list-style: outside none none; 2049} 2050 2051.generations { 2052 background: transparent url(images/vline.png) repeat-y scroll left top; 2053 display: block; 2054 margin: 0 0 0 15px; 2055 padding: 0; 2056} 2057 2058.chart_common table { 2059 padding: 0; 2060 border-spacing: 0; 2061 border-collapse: collapse; 2062 margin: 5px 0; 2063} 2064 2065.chart_common td { 2066 border: 0; 2067 padding: 0; 2068} 2069 2070.chart_common span.details1 div[class^=fact_] { 2071 display: inline-block; 2072} 2073 2074.chart_common span.details1 .date { 2075 color: inherit; 2076} 2077 2078/*-- Family book --*/ 2079#familybook_chart { 2080 margin-left: 10px; 2081} 2082 2083#familybook_chart table { 2084 border-collapse: collapse; 2085 empty-cells: show; 2086} 2087 2088#familybook_chart td { 2089 margin: 0; 2090 padding: 0; 2091} 2092 2093#familybook_chart h2 { 2094 text-align: center; 2095} 2096 2097#familybook_chart .line3, 2098#familybook_chart .pvline, 2099#familybook_chart .spacer { 2100 width: 3px; 2101} 2102 2103#familybook_chart .line4 { 2104 width: 7px; 2105 vertical-align: middle; 2106} 2107 2108[ID^="vline"] { 2109 width: 3px; 2110} 2111 2112#familybook_chart h3 { 2113 color: #006; 2114 font-size: 16px; 2115 text-align: center; 2116} 2117 2118/*-- Fan chart ---- */ 2119.fan_chart_menu { 2120 background: #fff; 2121 position: absolute; 2122 display: none; 2123 z-index: 100; 2124} 2125 2126#fan_chart ul { 2127 list-style-type: none; 2128 margin: 0; 2129} 2130 2131/* Lifespans chart */ 2132.wt-lifespans-subtitle { 2133 text-align: center; 2134} 2135 2136.wt-lifespans-scale { 2137 white-space: nowrap; 2138} 2139 2140.wt-lifespans-decade { 2141 width: 70px; 2142 height: 60px; 2143 display: inline-block; 2144 background-image: url(images/lifespan-decade.png); 2145 background-position-y: bottom; 2146 background-repeat: no-repeat; 2147 background-size: 70px 37px; 2148} 2149 2150.wt-lifespans-individuals { 2151 background: #fafafa; 2152} 2153 2154.wt-lifespans-individual { 2155 2156} 2157 2158.wt-lifespans-summary { 2159 background: #ffffff; 2160 border: thin solid #000; 2161 z-index: 1; 2162} 2163 2164.wt-lifespans-summary-link { 2165 font-weight: bold; 2166} 2167 2168/*-- Pedigree ---- */ 2169#pedigree_chart { 2170 position: relative; 2171 margin: 20px auto; 2172} 2173 2174#pedigree_canvas { 2175 color: #81a9cb; 2176 z-index: -1000; 2177} 2178 2179#pedigree-page .shadow { 2180 position: absolute; 2181 white-space: nowrap; 2182} 2183 2184#pedigree-page .layout0 .shadow > div, 2185#pedigree-page .layout1 .shadow > div { 2186 display: inline-block; 2187 vertical-align: middle; 2188} 2189 2190#pedigree-page .spacer { 2191 background-image: url(images/spacer.png); 2192 height: 20px; 2193 width: 1px; 2194} 2195 2196#childarrow, 2197.ancestorarrow { 2198 text-align: center; 2199} 2200 2201#pedigree-page #childarrow { 2202 position: relative; 2203} 2204 2205#pedigree-page #childbox { 2206 border: 1px solid; 2207 background-color: #fff; 2208} 2209 2210#pedigree-page table.list_table { 2211 margin: 0 auto; 2212 width: 500px; 2213} 2214 2215.pedigree_chart_table { 2216 border: 0; 2217 border-collapse: collapse; 2218 padding: 0; 2219 width: 100%; 2220} 2221 2222/*-- timeline --*/ 2223#timeline_chart { 2224 position: relative; 2225 top: 0; 2226 left: 0; 2227} 2228 2229#field_table { 2230 width: 30%; 2231 min-width: 500px; 2232} 2233 2234/* 2235 * Any element that is loaded dynamically has the class wt-ajax-load. 2236 * We can provide a "loading" placeholder for empty elements with this class. 2237 */ 2238.wt-ajax-load:empty { 2239 height: 32px; 2240 background: url(images/loading-32x32.gif) no-repeat 50% 50%; 2241} 2242 2243/* 2244 * Default icons are provided by FontAwesome. 2245 * Some icons get mirrored on RTL pages. Typiclly arrows 2246 */ 2247[dir=rtl] .wt-flip-rtl { 2248 transform: scale(-1, 1); 2249} 2250 2251.wt-icon-anniversary { 2252 content: url(images/anniversary.png); 2253} 2254 2255.wt-icon-arrow-down { 2256 content: url(webtrees/icons/arrow-down.png); 2257} 2258 2259a > .wt-icon-arrow-down:hover { 2260 content: url(webtrees/icons/arrow-down-hover.png); 2261} 2262 2263.wt-icon-arrow-left { 2264 content: url(webtrees/icons/arrow-left.png); 2265} 2266 2267a > .wt-icon-arrow-left:hover { 2268 content: url(webtrees/icons/arrow-left-hover.png); 2269} 2270 2271.wt-icon-arrow-right { 2272 content: url(webtrees/icons/arrow-right.png); 2273} 2274 2275a > .wt-icon-arrow-right:hover { 2276 content: url(webtrees/icons/arrow-right-hover.png); 2277} 2278 2279.wt-icon-arrow-up { 2280 content: url(webtrees/icons/arrow-up.png); 2281} 2282 2283a > .wt-icon-arrow-up:hover { 2284 content: url(webtrees/icons/arrow-up-hover.png); 2285} 2286 2287.wt-icon-collapse { 2288} 2289 2290.wt-icon-coordinates { 2291 content: url(images/coordinates.png) 2292} 2293 2294.wt-icon-expand{ 2295} 2296 2297.wt-icon-reorder { 2298 content: url(images/reorder.png); 2299} 2300 2301.wt-icon-sex-f { 2302 content: url(images/sex-female.png); 2303} 2304 2305.wt-icon-sex-m { 2306 content: url(images/sex-male.png); 2307} 2308 2309.wt-icon-sex-u { 2310 content: url(images/sex-unknown.png); 2311} 2312 2313.wt-icon-sex-x { 2314 content: url(images/sex-unknown.png); 2315} 2316 2317.wt-icon-warning { 2318 content: url(images/warning.png); 2319} 2320 2321.wt-icon-zoom-in { 2322 content: url(webtrees/images/zoomin.png); 2323} 2324 2325.wt-icon-zoom-out { 2326 content: url(webtrees/images/zoomout.png); 2327} 2328 2329/* 2330 * .wt-icon-bing-maps 2331 * .wt-icon-calendar 2332 * .wt-icon-copy 2333 * .wt-icon-delete 2334 * .wt-icon-edit 2335 * .wt-icon-email 2336 * .wt-icon-family 2337 * .wt-icon-help 2338 * .wt-icon-individual 2339 * .wt-icon-google-maps 2340 * .wt-icon-keyboard 2341 * .wt-icon-media 2342 * .wt-icon-note 2343 * .wt-icon-openstreetmap 2344 * .wt-icon-preferences 2345 * .wt-icon-repository 2346 * .wt-icon-source 2347 * .wt-icon-submitter 2348 */ 2349.wt-icon-bing-maps::before { 2350 width: 16px; 2351 height: 16px; 2352 content: url(webtrees/icons/bing-maps.png); 2353} 2354 2355.wt-icon-calendar::before { 2356 width: 19px; 2357 height: 15px; 2358 content: url(webtrees/icons/calendar.png) 2359} 2360 2361.wt-icon-copy::before { 2362 width: 16px; 2363 height: 16px; 2364 content: url(webtrees/icons/copy.png) 2365} 2366 2367.wt-icon-delete::before { 2368 width: 16px; 2369 height: 16px; 2370 content: url(webtrees/icons/delete.png); 2371} 2372 2373.wt-icon-edit::before { 2374 width: 16px; 2375 height: 16px; 2376 content: url(webtrees/icons/edit.png); 2377} 2378 2379.wt-icon-family::before { 2380 width: 14px; 2381 height: 15px; 2382 content: url(webtrees/icons/family.png); 2383} 2384 2385.wt-icon-help::before { 2386 width: 16px; 2387 height: 16px; 2388 content: url(webtrees/icons/help.png); 2389} 2390 2391.wt-icon-google-maps::before { 2392 width: 16px; 2393 height: 16px; 2394 content: url(webtrees/icons/google-maps.png); 2395} 2396 2397.wt-icon-individual::before { 2398 width: 11px; 2399 height: 15px; 2400 content: url(webtrees/icons/individual.png); 2401} 2402 2403.wt-icon-keyboard::before { 2404 width: 30px; 2405 height: 15px; 2406 content: url(webtrees/icons/keyboard.png); 2407} 2408 2409.wt-icon-media::before { 2410 width: 18px; 2411 height: 16px; 2412 content: url(webtrees/icons/media.png); 2413} 2414 2415.wt-icon-note::before { 2416 width: 20px; 2417 height: 20px; 2418 content: url(webtrees/icons/note.png); 2419} 2420 2421.wt-icon-openstreetmap::before { 2422 width: 16px; 2423 height: 16px; 2424 content: url(webtrees/icons/openstreetmap.png); 2425} 2426 2427.wt-icon-preferences::before { 2428 width: 25px; 2429 height: 25px; 2430 content: url(webtrees/icons/preferences.png); 2431} 2432 2433.wt-icon-repository::before { 2434 width: 15px; 2435 height: 15px; 2436 content: url(webtrees/icons/repository.png); 2437} 2438 2439.wt-icon-source::before { 2440 width: 18px; 2441 height: 16px; 2442 content: url(webtrees/icons/source.png); 2443} 2444 2445.wt-icon-submitter::before { 2446 width: 11px; 2447 height: 15px; 2448 content: url(webtrees/icons/individual.png); 2449} 2450 2451[class^="icon-"], 2452[class*=" icon-"] { 2453 display: inline-block; 2454 vertical-align: text-bottom; 2455 background-repeat: no-repeat; 2456 background-size: cover; 2457} 2458 2459.icon-add { 2460 width: 14px; 2461 height: 15px; 2462 background-image: url(images/add.png); 2463} 2464 2465.icon-cfamily { 2466 width: 20px; 2467 height: 20px; 2468 background-image: url(webtrees/images/family.png); 2469} 2470 2471.icon-childless { 2472 width: 25px; 2473 height: 25px; 2474 background-image: url(webtrees/images/childless.png); 2475} 2476 2477.icon-children { 2478 width: 16px; 2479 height: 16px; 2480 background-image: url(webtrees/images/children.png); 2481} 2482 2483.icon-clippings { 2484 width: 22px; 2485 height: 22px; 2486 background-image: url(webtrees/images/clippings.png); 2487} 2488 2489.icon-edit_indi { 2490 width: 20px; 2491 height: 20px; 2492 background-image: url(webtrees/images/edit_indi.png); 2493} 2494 2495.icon-fam-list { 2496 width: 20px; 2497 height: 20px; 2498 background-image: url(webtrees/images/family.png); 2499} 2500 2501.icon-indi-list { 2502 width: 20px; 2503 height: 20px; 2504 background-image: url(webtrees/images/indis.png); 2505} 2506 2507.icon-loading-small { 2508 width: 16px; 2509 height: 16px; 2510 background-image: url(webtrees/images/indicator.gif); 2511} 2512 2513.icon-media { 2514 width: 20px; 2515 height: 20px; 2516 background-image: url(webtrees/images/media.png); 2517} 2518 2519.icon-media-list { 2520 width: 20px; 2521 height: 20px; 2522 background-image: url(webtrees/images/media.png); 2523} 2524 2525.icon-media-next { 2526 width: 20px; 2527 height: 20px; 2528 background-image: url(webtrees/images/rdarrow.png); 2529} 2530 2531.icon-media-play { 2532 width: 20px; 2533 height: 20px; 2534 background-image: url(webtrees/images/rarrow.png); 2535} 2536 2537.icon-media-stop { 2538 width: 20px; 2539 height: 20px; 2540 background-image: url(webtrees/images/stop.png); 2541} 2542 2543.icon-minus { 2544 width: 11px; 2545 height: 11px; 2546 background-image: url(webtrees/images/minus.png); 2547} 2548 2549.icon-mypage { 2550 width: 24px; 2551 height: 24px; 2552 background-image: url(webtrees/images/mypage.png); 2553} 2554 2555.icon-note { 2556 width: 20px; 2557 height: 20px; 2558 background-image: url(webtrees/icons/note.png); 2559} 2560 2561.icon-plus { 2562 width: 11px; 2563 height: 11px; 2564 background-image: url(webtrees/images/plus.png); 2565} 2566 2567.icon-remove { 2568 width: 20px; 2569 height: 20px; 2570 background-image: url(webtrees/images/remove.png); 2571} 2572 2573.icon-resn-confidential { 2574 width: 16px; 2575 height: 16px; 2576 background-image: url(webtrees/images/resn_confidential.png); 2577} 2578 2579.icon-resn-locked { 2580 width: 16px; 2581 height: 16px; 2582 background-image: url(webtrees/images/resn_locked.png); 2583} 2584 2585.icon-resn-none { 2586 width: 16px; 2587 height: 16px; 2588 background-image: url(webtrees/images/resn_none.png); 2589} 2590 2591.icon-resn-privacy { 2592 width: 16px; 2593 height: 16px; 2594 background-image: url(webtrees/images/resn_privacy.png); 2595} 2596 2597.icon-rings { 2598 width: 9px; 2599 height: 9px; 2600 background-image: url(webtrees/images/rings.png); 2601} 2602 2603.icon-selected { 2604 width: 12px; 2605 height: 12px; 2606 background-image: url(webtrees/images/selected.png); 2607} 2608 2609.icon-source { 2610 width: 20px; 2611 height: 20px; 2612 background-image: url(webtrees/images/source.png); 2613} 2614 2615/* Silhouettes on charts */ 2616.icon-silhouette-F { 2617 width: 37px; 2618 height: 50px; 2619 background-image: url(webtrees/images/silhouette_female_small.png); 2620} 2621 2622.icon-silhouette-M { 2623 width: 37px; 2624 height: 50px; 2625 background-image: url(webtrees/images/silhouette_male_small.png); 2626} 2627 2628.icon-silhouette-U { 2629 width: 37px; 2630 height: 50px; 2631 background-image: url(webtrees/images/silhouette_unknown_small.png); 2632} 2633 2634.icon-indis { 2635 width: 20px; 2636 height: 20px; 2637 background-image: url(webtrees/images/indis.png); 2638} 2639 2640.icon-patriarch { 2641 width: 20px; 2642 height: 20px; 2643 background-image: url(webtrees/images/patriarch.png); 2644} 2645 2646.icon-pedigree { 2647 width: 20px; 2648 height: 20px; 2649 background-image: url(webtrees/images/pedigree.png); 2650} 2651 2652.icon-place { 2653 width: 20px; 2654 height: 20px; 2655 background-image: url(webtrees/images/place.png); 2656} 2657 2658.icon-repo-list { 2659 width: 20px; 2660 height: 20px; 2661 background-image: url(webtrees/images/repository.png); 2662} 2663 2664.icon-repository { 2665 width: 20px; 2666 height: 20px; 2667 background-image: url(webtrees/images/repository.png); 2668} 2669 2670.icon-search { 2671 width: 17px; 2672 height: 17px; 2673 background-image: url(webtrees/images/search.png); 2674} 2675 2676.icon-sfamily { 2677 width: 20px; 2678 height: 20px; 2679 background-image: url(webtrees/images/family.png); 2680} 2681 2682.icon-source-list { 2683 width: 20px; 2684 height: 20px; 2685 background-image: url(webtrees/images/source.png); 2686} 2687 2688.icon-user_add { 2689 width: 20px; 2690 height: 20px; 2691 background-image: url(webtrees/images/user_add.png); 2692} 2693 2694/* Census assistant */ 2695.wt-census-assistant-form-control:focus { 2696 min-width: 12rem; 2697} 2698 2699/* 2700 * Drag and drop sortable lists 2701 */ 2702.wt-sortable-list { 2703} 2704 2705.wt-sortable-item { 2706 cursor: move; 2707} 2708 2709/* Some blocks show a reduced version on the right-hand side. */ 2710.wt-side-blocks .wt-side-block-optional { 2711 display: none !important; 2712} 2713 2714/* my page chart enhancements */ 2715.wt-block-content-charts { 2716 flex-flow: column-reverse; 2717 overflow: auto; 2718} 2719 2720.wt-block-content-todays-events-block { 2721 padding: .25rem; 2722} 2723 2724/* Some charts are wider than the page. */ 2725.wt-chart { 2726 overflow-x: auto; 2727 overflow-y: hidden; 2728} 2729 2730/* Fit thumbnail into parent on charts */ 2731.select2-selection.select2-selection--single { 2732 min-height: 36px; 2733 height: auto; 2734 padding: 2px 0; 2735} 2736 2737.select2-container .select2-selection--single .select2-selection__rendered { 2738 padding-left: 2px; 2739} 2740 2741.select2-selection--single .NAME { 2742 padding-left: 4px; 2743} 2744 2745/* 2746 * These selectors control how the short horizontal lines are positioned in the Charts 2747 * Optimized for Win10 and FF, Chrome and Edge browsers 2748 * Ancestors 2749 * Descendants 2750 * amily book 2751 * Hourglass chart 2752 * 2753 */ 2754 2755/* Ascentors */ 2756.wt-chart-ancestors .linea1 { 2757 margin-bottom: 4px; 2758} 2759 2760.wt-chart-ancestors .linea2 { 2761 margin-bottom: 7px; 2762} 2763 2764.wt-chart-ancestors .linea3 { 2765 margin-bottom: 4px; 2766} 2767 2768.wt-chart-ancestors .linea4 { 2769 margin-bottom: 7px; 2770} 2771 2772.wt-chart-ancestors .linea5 { 2773 vertical-align: top; 2774} 2775 2776/* Descendants */ 2777.wt-chart-descendants .lined1 { 2778 margin-bottom: 4px; 2779} 2780 2781.wt-chart-descendants .lined2 { 2782 margin-bottom: 7px; 2783} 2784 2785.wt-chart-descendants .lined3 { 2786 margin-bottom: 4px; 2787} 2788 2789.wt-chart-descendants .lined4 { 2790 margin-bottom: 7px; 2791} 2792 2793.wt-chart-descendants .linea5 { 2794 vertical-align: top; 2795} 2796 2797/* Family book */ 2798.linef1 { 2799 margin-bottom: 3px; 2800} 2801 2802.linef2 { 2803 margin-bottom: 3px; 2804} 2805 2806.linef3 { 2807 margin-bottom: 7px; 2808} 2809 2810/* Hourglass */ 2811.lineh1 { 2812 margin-bottom: 4px; 2813} 2814 2815.lineh2 { 2816 margin-bottom: 4px; 2817} 2818 2819.lineh3 { 2820 margin-bottom: 7px; 2821} 2822 2823/* 2824 * Pedigree chart 2825 * 2826 * wt-chart, wt-chart-pedigree 2827 */ 2828 2829#pedigree_chart { 2830 position: relative; 2831 margin: 20px auto; 2832} 2833 2834#pedigree_canvas { 2835 z-index: -1000; 2836} 2837 2838#childbox-pedigree { 2839 border: 1px solid; 2840 background-color: #fff; 2841} 2842 2843#pedigree-page #childbox-pedigree { 2844 border: 1px solid; 2845 background-color: #fff; 2846} 2847 2848#childbox-pedigree { 2849 padding: 5px; 2850 position: absolute; 2851 display: none; 2852 text-align: start; 2853 white-space: nowrap; 2854 left: auto; 2855 z-index: 9999; 2856} 2857 2858.wt-chart-pedigree, .wt-chart-hourglass { 2859 overflow-y: auto; 2860} 2861 2862.wt-chart-pedigree .spacer { 2863 background-image: url(images/spacer.png); 2864 height: 20px; 2865 width: 1px; 2866} 2867 2868#pedigree-page .shadow { 2869 box-shadow: 0 0 0 !important; /* override vendor css shadow */ 2870} 2871 2872#childarrow, 2873.ancestorarrow { 2874 text-align: center; 2875 display: inline-block; 2876 vertical-align: middle; 2877} 2878 2879.layout3 #childbox-pedigree { 2880 top: auto; 2881} 2882 2883#childbox-pedigree a.name1 { 2884 display: block; 2885 margin-left: 5px; 2886} 2887 2888/* 2889 * Place hierarchy 2890 * 2891 * wt-place-hierarchy-page 2892 */ 2893 2894#place-hierarchy ul { 2895 list-style-type: none; 2896} 2897 2898.d-table-cell { 2899 padding-right: 5px; 2900} 2901 2902/* 2903 * Search 2904 * 2905 * wt-search-page, wt-general-serach-page/wt-phonetic-search-page/wt-advanced-search-page/wt-search-replace-page 2906 */ 2907 2908/* Some menus (e.g. languages) can be longer than a page */ 2909.dropdown-menu { 2910 max-height: 30rem; 2911 overflow-x: hidden; 2912} 2913 2914/* Clipping cart */ 2915.clipping-cart h2 { 2916 margin: 20px; 2917 text-align: center; 2918} 2919 2920.clipping-cart .wt-page-options { 2921 max-width: 25rem; 2922} 2923 2924.clipping-cart .topbottombar, .clipping-cart .optionbox, .add-to .topbottombar { 2925 font-size: 1rem; 2926} 2927 2928.clipping-cart .add-to { 2929 text-align: left; 2930} 2931 2932/* Forms */ 2933.col-form-label { 2934 font-weight: bold; 2935} 2936 2937/* Popups */ 2938.popup .nav-link { 2939 display: inline; 2940 vertical-align: top; 2941 padding: 5px; 2942} 2943 2944