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