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