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-genealogy-menu .nav-item { 80 padding: 0 0.45rem!important; 81 } 82 .wt-user-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-user-menu 103 * | +---wt-primary-navigation 104 * | +---wt-genealogy-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-user-menu { 175 flex-wrap: nowrap; 176} 177 178.wt-user-menu .nav-link { 179 display: inline-block; 180 padding: 0.5rem; 181 color: inherit; /* Inherit from wt-header-container */ 182} 183 184.wt-user-menu .nav-item + .nav-item::before { 185 content: "|"; 186} 187 188.wt-user-menu .dropdown-toggle:after { 189 display: none; 190} 191 192.wt-user-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-genealogy-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-genealogy-menu .dropdown-menu { 210 max-height: 60rem; 211} 212 213.wt-genealogy-menu .nav-item { 214 padding: 0 0.75rem; 215} 216 217.wt-genealogy-menu .nav-link { 218 /* All menu icons are 40px x 40px */ 219 height: calc(40px + 1rem); 220 width: 40px; 221} 222 223.wt-genealogy-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/* === Who is online block === */ 1506.logged_in_list { 1507 margin: 5px 0 0; 1508 padding: 0; 1509 line-height: 20px; 1510} 1511 1512/* ==== Theme select block === */ 1513.theme_form ul { 1514 margin: -10px auto; 1515} 1516 1517.theme_form li { 1518 visibility: hidden; 1519} 1520 1521.theme_form li ul li { 1522 display: inline-block; 1523 padding: 10px; 1524 visibility: visible; 1525} 1526 1527/* ==== FAQ table styles ===== */ 1528table.faq { 1529 background-color: #e0e0e0; 1530 margin: 5px 0 50px 5px; 1531 width: 98%; 1532} 1533 1534table.faq tr:nth-child(odd) td { 1535 background-color: #e7eef3; 1536} 1537 1538div.faq_title { 1539 background-color: #e0e0e0; 1540 margin: 1em 0; 1541 padding: .25em; 1542 font-weight: bold; 1543 width: 98%; 1544} 1545 1546div.faq_body { 1547 clear: both; 1548 padding: 0 1em; 1549} 1550 1551.faq_top { 1552 float: right; 1553} 1554 1555/* === Positioning edit, copy, delete links === */ 1556/* General use */ 1557.editfacts { 1558 clear: left; 1559 padding-top: 15px; 1560} 1561 1562/* ======== Indi header ====== */ 1563#indi_header { 1564 overflow: hidden; 1565 margin: 0 0 5px; 1566} 1567 1568#indi_header h3 { 1569 color: #555; 1570 font-size: 90%; 1571 font-weight: bold; 1572 margin: 0; 1573 padding: 0 10px 0 30px; 1574 text-align: left; 1575 overflow: hidden; 1576 position: relative; 1577} 1578 1579#indi_header .name_one { 1580 font-size: 1.5em; 1581} 1582 1583#indi_header h3 .details1 { 1584 font-size: 1.0em; 1585} 1586 1587#indi_header h3 .header_age { 1588 padding: 5px 0 5px 5px; 1589 float: right; 1590 font-weight: normal; 1591 font-size: 65%; 1592} 1593 1594#indi_header h3 a { 1595 display: inline; 1596} 1597 1598#indi_header a { 1599 color: #337; 1600 font-size: 0.75em; 1601 font-weight: normal; 1602} 1603 1604#indi_header a:hover { 1605 color: #f00; 1606} 1607 1608#indi_mainimage { 1609 float: left; 1610 padding: 0 2px; 1611} 1612 1613#header_accordion1 { 1614 padding: 0; 1615 overflow: hidden; 1616} 1617 1618#header_accordion1 .indi_name_details { 1619 margin: 0; 1620 overflow: hidden; 1621 padding: 5px; 1622} 1623 1624.indi_name_details .name1 { 1625 font-weight: normal; 1626 padding-top: 5px; 1627 font-size: inherit; 1628} 1629 1630#indi_header a.warning { 1631 color: #f00; 1632 font-size: 1em; 1633} 1634 1635#indi_note { 1636 margin: 0 0 5px; 1637} 1638 1639.indi_table { 1640 clear: left; 1641} 1642 1643#sex { 1644 float: right; 1645} 1646 1647#dates { 1648 float: right; 1649} 1650 1651#individual-names .wt-icon-edit, 1652#individual-names .wt-icon-delete { 1653 float: right; 1654} 1655 1656#indi_note .fact_NOTE { 1657 float: left; 1658 margin: 0 5px 0 0; 1659} 1660 1661#indi_note .fact_SOUR { 1662 margin: 3px 0; 1663} 1664 1665#indi_note .fact_SOUR a { 1666 font-size: 100%; 1667} 1668 1669#indi_note .fact_NOTE, 1670#indi_note .fact_SOUR { 1671 clear: both; 1672} 1673 1674/* markdown formatting */ 1675 1676.markdown { 1677 /* Tables and pre-formatted text can break the layout. */ 1678 overflow-x: auto; 1679} 1680 1681.markdown p { 1682 margin: 0 0 0.5em; 1683 white-space: pre-wrap; 1684} 1685 1686.markdown table { 1687 border-collapse: collapse; 1688 margin-bottom: 5px; 1689} 1690 1691.markdown th { 1692 font-weight: bold; 1693} 1694 1695.markdown td, 1696.markdown th { 1697 border: solid thin #000; 1698 padding: 3px; 1699} 1700 1701.odometer { 1702 font-family: courier, monospace; 1703 font-weight: bold; 1704 background: #000; 1705 color: #fff; 1706} 1707 1708/* ======== Indi tabs ======== */ 1709/* Facts & Events tab */ 1710#personal_facts_content .fact_NOTE, 1711#personal_facts_content .fact_SOUR, 1712#family-table .fact_NOTE, 1713#family-table .fact_SOUR { 1714 margin: 5px 3px 5px 0; 1715 clear: both; 1716} 1717 1718.media-display-image { 1719 float: left; 1720} 1721 1722.media-display-title { 1723 float: left; 1724 font-style: italic; 1725 margin: 10px; 1726} 1727 1728/* === jQuery.datatable styling general over-rides === */ 1729.odd { 1730 background-color: lightgray; 1731} 1732 1733.even { 1734 background-color: #fafafa; 1735} 1736 1737.css_right { 1738 float: left; 1739} 1740 1741.fg-button { 1742 padding: 2px 6px; 1743} 1744 1745/* Sidebar - Family navigator */ 1746.wt-family-navigator-dropdown-heading { 1747 font-weight: bold; 1748 font-size: inherit; 1749 color: inherit; 1750} 1751 1752/* Sidebar - Descendants */ 1753#sb_content_descendancy { 1754 margin-top: 2px; 1755} 1756 1757#sb_desc_content { 1758 margin-left: 3px; 1759 font-size: 0.8em; 1760} 1761 1762#sb_desc_content ul { 1763 padding: 0; 1764 margin: 0; 1765} 1766 1767.sb_desc_indi_li { 1768 list-style-type: none; 1769} 1770 1771.desc_tree_div { 1772 display: none; 1773} 1774 1775.desc_tree_div ul { 1776 padding: 0; 1777 margin-left: 10px; 1778 margin-top: 0; 1779 margin-right: 0; 1780} 1781 1782/* Individuals and Families */ 1783#sidebar-content-individuals, 1784#sidebar-content-families { 1785 margin-top: 2px; 1786} 1787 1788.sb_indi_surname_li, 1789.sb_fam_surname_li { 1790 list-style-image: url(colors/images/plus.png); 1791} 1792 1793.name_tree_div ul { 1794 padding: 0; 1795 margin: 0; 1796} 1797 1798.name_tree_div li { 1799 list-style: none; 1800 margin: 0; 1801 padding: 0; 1802} 1803 1804/* Clippings */ 1805#sb_clippings_content ul { 1806 padding: 0; 1807 margin: 0; 1808} 1809 1810#sb_clippings_content li { 1811 list-style: none; 1812 margin: 0; 1813 padding: 0; 1814 white-space: nowrap; 1815} 1816 1817/* Extra info */ 1818#sb_content_extra_info { 1819 font-size: 80%; 1820 font-weight: bold; 1821 margin-top: 1px; 1822 overflow: hidden; 1823 padding: 5px; 1824} 1825 1826#sb_content_extra_info .editfacts { 1827 float: right; 1828 margin-top: -30px; 1829} 1830 1831#sb_content_extra_info a { 1832 display: block; 1833} 1834 1835#sb_content_extra_info span { 1836 font-weight: normal; 1837} 1838 1839#sb_content_extra_info span a { 1840 display: inline; 1841} 1842 1843#sb_content_extra_info #hitcounter { 1844 border-top: 1px solid #b2c7d7; 1845 font-weight: bold; 1846 padding-top: 5px; 1847} 1848 1849/* http://www.jacklmoore.com/colorbox */ 1850#colorbox, 1851#cboxOverlay, 1852#cboxWrapper { 1853 position: absolute; 1854 top: 0; 1855 left: 0; 1856 z-index: 9999; 1857 overflow: hidden; 1858} 1859 1860#cboxWrapper { 1861 max-width: none; 1862} 1863 1864#cboxOverlay { 1865 position: fixed; 1866 width: 100%; 1867 height: 100%; 1868 background: #fff; 1869} 1870 1871#cboxContent { 1872 background: #fff; 1873 overflow: hidden; 1874 position: relative; 1875 padding: 0.5rem; 1876 border: 0.25rem solid #ccc; 1877} 1878 1879#cboxLoadingOverlay, 1880#cboxLoadingGraphic { 1881 position: absolute; 1882 top: 0; 1883 left: 0; 1884 width: 100%; 1885 height: 100%; 1886} 1887 1888.cboxPhoto { 1889 float: left; 1890 margin: auto; 1891 border: 0; 1892 display: block; 1893 max-width: none; 1894} 1895 1896#colorbox, 1897#cboxContent, 1898#cboxLoadedContent { 1899 box-sizing: content-box; 1900} 1901 1902#cboxError { 1903 padding: 50px; 1904 border: 1px solid #ccc; 1905} 1906 1907#cboxLoadedContent { 1908 margin-bottom: 28px; 1909} 1910 1911#cboxTitle { 1912 background: #fff; 1913 position: absolute; 1914 bottom: 0.25rem; 1915 left: 0; 1916 margin: 0 3rem; 1917 text-align: center; 1918} 1919 1920#cboxLoadingGraphic { 1921 background: url(images/loading-32x32.gif) no-repeat center center; 1922} 1923 1924#cboxPrevious, #cboxNext, #cboxSlideshow, #cboxClose { 1925 background: none; 1926 border: 0; 1927 cursor: pointer; 1928 font-family: "Font Awesome\ 5 Free", sans-serif; 1929 font-weight: 900; 1930 overflow: visible; 1931 padding: 0; 1932 position: absolute; 1933} 1934 1935#cboxSlideshow { 1936 bottom: 0.25rem; 1937 right: 0.25rem; 1938} 1939 1940#cboxPrevious { 1941 bottom: 0.25rem; 1942 left: 0.25rem; 1943} 1944 1945#cboxNext { 1946 bottom: 0.25rem; 1947 left: 1.5rem; 1948} 1949 1950#cboxClose { 1951 top: 0.25rem; 1952 right: 0.25rem; 1953} 1954 1955/* Stories module */ 1956.story_title { 1957 padding-top: 12px; 1958 font-size: 13px; 1959 height: 32px; 1960 font-weight: bold; 1961} 1962 1963.story_body { 1964 padding: 20px; 1965 white-space: normal; 1966} 1967 1968.story_edit { 1969 padding: 12px; 1970} 1971 1972/* ====== Charts Styles ======== */ 1973#people label { 1974 display: block; 1975} 1976 1977/* Ancestry chart */ 1978.wt-chart-ancestors-list { 1979 background: transparent url(images/vline.png) left top repeat-y; 1980 margin: 0 0 0 15px; 1981 padding: 0; 1982 display: block; 1983} 1984 1985.wt-chart-ancestors-list-item { 1986 margin: 5px 0; 1987} 1988 1989.chart_common li { 1990 list-style: outside none none; 1991} 1992 1993.generations { 1994 background: transparent url(images/vline.png) repeat-y scroll left top; 1995 display: block; 1996 margin: 0 0 0 15px; 1997 padding: 0; 1998} 1999 2000.chart_common table { 2001 padding: 0; 2002 border-spacing: 0; 2003 border-collapse: collapse; 2004 margin: 5px 0; 2005} 2006 2007.chart_common td { 2008 border: 0; 2009 padding: 0; 2010} 2011 2012.chart_common span.details1 div[class^=fact_] { 2013 display: inline-block; 2014} 2015 2016.chart_common span.details1 .date { 2017 color: inherit; 2018} 2019 2020/*-- Family book --*/ 2021#familybook_chart { 2022 margin-left: 10px; 2023} 2024 2025#familybook_chart table { 2026 border-collapse: collapse; 2027 empty-cells: show; 2028} 2029 2030#familybook_chart td { 2031 margin: 0; 2032 padding: 0; 2033} 2034 2035#familybook_chart h2 { 2036 text-align: center; 2037} 2038 2039#familybook_chart .line3, 2040#familybook_chart .pvline, 2041#familybook_chart .spacer { 2042 width: 3px; 2043} 2044 2045#familybook_chart .line4 { 2046 width: 7px; 2047 vertical-align: middle; 2048} 2049 2050[ID^="vline"] { 2051 width: 3px; 2052} 2053 2054#familybook_chart h3 { 2055 color: #333; 2056 font-size: 16px; 2057 text-align: center; 2058} 2059 2060/*-- Fan chart ---- */ 2061.fan_chart_menu { 2062 position: absolute; 2063 display: none; 2064 z-index: 100; 2065} 2066 2067#fan_chart ul { 2068 list-style-type: none; 2069 margin: 0; 2070} 2071 2072/* Lifespans chart */ 2073.wt-lifespans-subtitle { 2074 text-align: center; 2075} 2076 2077.wt-lifespans-scale { 2078 white-space: nowrap; 2079} 2080 2081.wt-lifespans-decade { 2082 width: 70px; 2083 height: 60px; 2084 display: inline-block; 2085 background-image: url(images/lifespan-decade.png); 2086 background-position-y: bottom; 2087 background-repeat: no-repeat; 2088 background-size: 70px 37px; 2089} 2090 2091.wt-lifespans-individuals { 2092 background: #fafafa; 2093} 2094 2095.wt-lifespans-individual { 2096 2097} 2098 2099.wt-lifespans-summary { 2100 background: #ffffff; 2101 border: thin solid #000; 2102 z-index: 1; 2103} 2104 2105.wt-lifespans-summary-link { 2106 font-weight: bold; 2107} 2108 2109/*-- Pedigree ---- */ 2110#pedigree_chart { 2111 position: relative; 2112 margin: 20px auto; 2113} 2114 2115#pedigree_canvas { 2116 color: #81a9cb; 2117 z-index: -1000; 2118} 2119 2120#pedigree-page .shadow { 2121 position: absolute; 2122 white-space: nowrap; 2123} 2124 2125#pedigree-page .layout0 .shadow > div, 2126#pedigree-page .layout1 .shadow > div { 2127 display: inline-block; 2128 vertical-align: middle; 2129} 2130 2131#pedigree-page .spacer { 2132 background-image: url(images/spacer.png); 2133 height: 20px; 2134 width: 1px; 2135} 2136 2137#childarrow, 2138.ancestorarrow { 2139 text-align: center; 2140} 2141 2142#pedigree-page #childarrow { 2143 position: relative; 2144} 2145 2146#pedigree-page #childbox { 2147 border: 1px solid; 2148 background-color: #fff; 2149} 2150 2151#pedigree-page table.list_table { 2152 margin: 0 auto; 2153 width: 500px; 2154} 2155 2156.pedigree_chart_table { 2157 border: 0; 2158 border-collapse: collapse; 2159 padding: 0; 2160 width: 100%; 2161} 2162 2163/*-- timeline --*/ 2164#timeline_chart { 2165 position: relative; 2166 top: 0; 2167 left: 0; 2168} 2169 2170#field_table { 2171 width: 30%; 2172 min-width: 500px; 2173 border: 1px solid #ddd; 2174} 2175 2176[class^="icon-"], 2177[class*=" icon-"] { 2178 display: inline-block; 2179 vertical-align: middle; 2180 background-repeat: no-repeat; 2181} 2182 2183.icon-add { 2184 width: 14px; 2185 height: 15px; 2186 background-image: url(images/add.png); 2187} 2188 2189.icon-cfamily { 2190 width: 32px; 2191 height: 32px; 2192 background-image: url(colors/images/cfamily.png); 2193} 2194 2195.icon-childless { 2196 width: 25px; 2197 height: 25px; 2198 background-image: url(colors/images/childless.png); 2199} 2200 2201.icon-children { 2202 width: 16px; 2203 height: 16px; 2204 background-image: url(colors/images/children.png); 2205} 2206 2207.icon-clippings { 2208 width: 32px; 2209 height: 32px; 2210 background-image: url(colors/images/clippings.png); 2211} 2212 2213.icon-edit_indi { 2214 width: 22px; 2215 height: 22px; 2216 background-image: url(colors/images/edit_indi.png); 2217} 2218 2219.icon-fam-list { 2220 width: 32px; 2221 height: 32px; 2222 background-image: url(colors/images/sfamily.png); 2223} 2224 2225.icon-indi-list { 2226 width: 32px; 2227 height: 32px; 2228 background-image: url(colors/images/indis.png); 2229} 2230 2231.icon-loading-small { 2232 width: 16px; 2233 height: 16px; 2234 background-image: url(colors/images/indicator.gif); 2235} 2236 2237.icon-media { 2238 width: 32px; 2239 height: 32px; 2240 background-image: url(colors/images/media.png); 2241} 2242 2243.icon-media-list { 2244 width: 32px; 2245 height: 32px; 2246 background-image: url(colors/images/media.png); 2247} 2248 2249.icon-media-next { 2250 width: 20px; 2251 height: 20px; 2252 background-image: url(colors/images/rdarrow.png); 2253} 2254 2255.icon-media-play { 2256 width: 20px; 2257 height: 20px; 2258 background-image: url(colors/images/rarrow.png); 2259} 2260 2261.icon-media-stop { 2262 width: 20px; 2263 height: 20px; 2264 background-image: url(colors/images/stop.png); 2265} 2266 2267.icon-minus { 2268 width: 11px; 2269 height: 11px; 2270 background-image: url(colors/images/minus.png); 2271} 2272 2273.icon-mypage { 2274 width: 22px; 2275 height: 25px; 2276 background-image: url(colors/images/mypage.png); 2277} 2278 2279.icon-note { 2280 width: 33px; 2281 height: 35px; 2282 background-image: url(colors/icons/note.png); 2283} 2284 2285.icon-plus { 2286 width: 11px; 2287 height: 11px; 2288 background-image: url(colors/images/plus.png); 2289} 2290 2291.icon-remove { 2292 width: 16px; 2293 height: 16px; 2294 background-image: url(colors/images/delete.png); 2295} 2296 2297.icon-resn-confidential { 2298 width: 16px; 2299 height: 16px; 2300 background-image: url(colors/images/resn_confidential.png); 2301} 2302 2303.icon-resn-locked { 2304 width: 16px; 2305 height: 16px; 2306 background-image: url(colors/images/resn_locked.png); 2307} 2308 2309.icon-resn-none { 2310 width: 16px; 2311 height: 16px; 2312 background-image: url(colors/images/resn_none.png); 2313} 2314 2315.icon-resn-privacy { 2316 width: 16px; 2317 height: 16px; 2318 background-image: url(colors/images/resn_privacy.png); 2319} 2320 2321.icon-rings { 2322 width: 9px; 2323 height: 9px; 2324 background-image: url(colors/images/rings.png); 2325} 2326 2327.icon-selected { 2328 width: 12px; 2329 height: 12px; 2330 background-image: url(colors/images/selected.png); 2331} 2332 2333 2334.icon-source { 2335 width: 32px; 2336 height: 32px; 2337 background-image: url(colors/images/source.png); 2338} 2339 2340/* Silhouettes on charts */ 2341.icon-silhouette-F { 2342 width: 37px; 2343 height: 45px; 2344 background-image: url(colors/images/silhouette_female_small.png); 2345} 2346 2347.icon-silhouette-M { 2348 width: 37px; 2349 height: 45px; 2350 background-image: url(colors/images/silhouette_male_small.png); 2351} 2352 2353.icon-silhouette-U { 2354 width: 37px; 2355 height: 45px; 2356 background-image: url(colors/images/silhouette_unknown_small.png); 2357} 2358 2359/* 2360 * Any element that is loaded dynamically has the class wt-ajax-load. 2361 * We can provide a "loading" placeholder for empty elements with this class. 2362 */ 2363.wt-ajax-load:empty { 2364} 2365 2366/* 2367 * Default icons are provided by FontAwesome. 2368 * Some icons get mirrored on RTL pages. Typiclly arrows 2369 */ 2370[dir=rtl] .wt-flip-rtl { 2371} 2372 2373.wt-icon-anniversary { 2374} 2375 2376.wt-icon-arrow-down { 2377 content: url(colors/icons/arrow-down.png); 2378} 2379 2380a > .wt-icon-arrow-down:hover { 2381 content: url(colors/icons/arrow-down-hover.png); 2382} 2383 2384.wt-icon-arrow-left { 2385 content: url(colors/icons/arrow-left.png); 2386} 2387 2388a > .wt-icon-arrow-left:hover { 2389 content: url(colors/icons/arrow-left-hover.png); 2390} 2391 2392.wt-icon-arrow-right { 2393 content: url(colors/icons/arrow-right.png); 2394} 2395 2396a > .wt-icon-arrow-right:hover { 2397 content: url(colors/icons/arrow-right-hover.png); 2398} 2399 2400.wt-icon-arrow-up { 2401 content: url(colors/icons/arrow-up.png); 2402} 2403 2404a > .wt-icon-arrow-up:hover { 2405 content: url(colors/icons/arrow-up-hover.png); 2406} 2407 2408.wt-icon-coordinates { 2409} 2410 2411.wt-icon-reorder { 2412} 2413 2414.wt-icon-sex-f { 2415} 2416 2417.wt-icon-sex-m { 2418} 2419 2420.wt-icon-sex-u { 2421} 2422 2423.wt-icon-sex-x { 2424} 2425 2426.wt-icon-warning { 2427} 2428 2429.wt-icon-zoom-in { 2430 content: url(colors/images/zoomin.png); 2431} 2432 2433.wt-icon-zoom-out { 2434 content: url(colors/images/zoomout.png); 2435} 2436 2437/* 2438 * .wt-icon-bing-maps 2439 * .wt-icon-calendar 2440 * .wt-icon-copy 2441 * .wt-icon-delete 2442 * .wt-icon-edit 2443 * .wt-icon-email 2444 * .wt-icon-family 2445 * .wt-icon-help 2446 * .wt-icon-individual 2447 * .wt-icon-google-maps 2448 * .wt-icon-keyboard 2449 * .wt-icon-media 2450 * .wt-icon-note 2451 * .wt-icon-openstreetmap 2452 * .wt-icon-preferences 2453 * .wt-icon-repository 2454 * .wt-icon-source 2455 * .wt-icon-submitter 2456 */ 2457.wt-icon-bing-maps::before { 2458 width: 16px; 2459 height: 16px; 2460 content: url(colors/icons/bing-maps.png); 2461} 2462 2463.wt-icon-calendar::before { 2464 width: 19px; 2465 height: 15px; 2466 content: url(colors/icons/calendar.png) 2467} 2468 2469.wt-icon-copy::before { 2470 width: 16px; 2471 height: 16px; 2472 content: url(colors/icons/copy.png) 2473} 2474 2475.wt-icon-delete::before { 2476 width: 16px; 2477 height: 16px; 2478 content: url(colors/icons/delete.png); 2479} 2480 2481.wt-icon-edit::before { 2482 width: 16px; 2483 height: 16px; 2484 content: url(colors/icons/edit.png); 2485} 2486 2487.wt-icon-family::before { 2488 width: 14px; 2489 height: 15px; 2490 content: url(colors/icons/family.png); 2491} 2492 2493.wt-icon-help::before { 2494 width: 16px; 2495 height: 16px; 2496 content: url(colors/icons/help.png); 2497} 2498 2499.wt-icon-google-maps::before { 2500 width: 16px; 2501 height: 16px; 2502 content: url(colors/icons/google-maps.png); 2503} 2504 2505.wt-icon-individual::before { 2506 width: 11px; 2507 height: 15px; 2508 content: url(colors/icons/individual.png); 2509} 2510 2511.wt-icon-keyboard::before { 2512 width: 30px; 2513 height: 15px; 2514 content: url(colors/icons/keyboard.png); 2515} 2516 2517.wt-icon-media::before { 2518 width: 18px; 2519 height: 16px; 2520 content: url(colors/icons/media.png); 2521} 2522 2523.wt-icon-note::before { 2524 width: 20px; 2525 height: 20px; 2526 content: url(colors/icons/note.png); 2527} 2528 2529.wt-icon-openstreetmap::before { 2530 width: 16px; 2531 height: 16px; 2532 content: url(colors/icons/openstreetmap.png); 2533} 2534 2535.wt-icon-preferences::before { 2536 width: 25px; 2537 height: 25px; 2538 content: url(colors/icons/preferences.png); 2539} 2540 2541.wt-icon-repository::before { 2542 width: 15px; 2543 height: 15px; 2544 content: url(colors/icons/repository.png); 2545} 2546 2547.wt-icon-source::before { 2548 width: 18px; 2549 height: 16px; 2550 content: url(colors/icons/source.png); 2551} 2552 2553.wt-icon-submitter::before { 2554 width: 11px; 2555 height: 15px; 2556 content: url(colors/icons/individual.png); 2557} 2558 2559i[class*="wt-icon-media"] { 2560 opacity: 0.5; 2561} 2562 2563.icon-indis { 2564 width: 25px; 2565 height: 25px; 2566 background-image: url(colors/images/mypage.png); 2567} 2568 2569.icon-patriarch { 2570 width: 20px; 2571 height: 20px; 2572 background-image: url(colors/images/patriarch.png); 2573} 2574 2575.icon-pedigree { 2576 width: 25px; 2577 height: 25px; 2578 background-image: url(colors/images/pedigree.png); 2579} 2580 2581.icon-place { 2582 width: 20px; 2583 height: 20px; 2584 background-image: url(colors/images/place.png); 2585} 2586 2587.icon-repo-list { 2588 width: 20px; 2589 height: 20px; 2590 background-image: url(colors/images/repository.png); 2591} 2592 2593.icon-repository { 2594 width: 20px; 2595 height: 20px; 2596 background-image: url(colors/images/repository.png); 2597} 2598 2599.icon-search { 2600 width: 17px; 2601 height: 17px; 2602 background-image: url(colors/images/search.png); 2603} 2604 2605.icon-sfamily { 2606 width: 22px; 2607 height: 22px; 2608 background-image: url(colors/images/sfamily.png); 2609} 2610 2611.icon-source-list { 2612 width: 20px; 2613 height: 20px; 2614 background-image: url(colors/images/source.png); 2615} 2616 2617.icon-user_add { 2618 width: 25px; 2619 height: 25px; 2620 background-image: url(colors/images/user_add.png); 2621} 2622 2623/* Census assistant */ 2624.wt-census-assistant-form-control:focus { 2625} 2626 2627/* 2628 * Drag and drop sortable lists 2629 */ 2630.wt-sortable-list { 2631} 2632 2633.wt-sortable-item { 2634} 2635 2636/* Some blocks show a reduced version on the right-hand side. */ 2637.wt-side-blocks .wt-side-block-optional { 2638 display: none !important; 2639} 2640 2641/* my page chart enhancements */ 2642.wt-block-content-charts { 2643 flex-flow: column-reverse; 2644 overflow: auto; 2645} 2646 2647.wt-block-content-todays-events-block { 2648 padding: .25rem; 2649} 2650 2651/* Some charts are wider than the page. */ 2652.wt-chart { 2653 overflow-x: auto; 2654 overflow-y: hidden; 2655} 2656 2657/* Fit thumbnail into parent on charts */ 2658.select2-selection.select2-selection--single { 2659 min-height: 36px; 2660 height: auto; 2661 padding: 2px 0; 2662} 2663 2664.select2-container .select2-selection--single .select2-selection__rendered { 2665 padding-left: 2px; 2666} 2667 2668.select2-selection--single .NAME { 2669 padding-left: 4px; 2670} 2671 2672/* 2673 * These selectors control how the short horizontal lines are positioned in the Charts 2674 * Optimized for Win10 and FF, Chrome and Edge browsers 2675 * Ancestors 2676 * Descendants 2677 * amily book 2678 * Hourglass chart 2679 * 2680 */ 2681 2682/* Ascentors */ 2683.wt-chart-ancestors .linea1 { 2684 margin-bottom: 4px; 2685} 2686 2687.wt-chart-ancestors .linea2 { 2688 margin-bottom: 7px; 2689} 2690 2691.wt-chart-ancestors .linea3 { 2692 margin-bottom: 4px; 2693} 2694 2695.wt-chart-ancestors .linea4 { 2696 margin-bottom: 7px; 2697} 2698 2699.wt-chart-ancestors .linea5 { 2700 vertical-align: top; 2701} 2702 2703/* Descendants */ 2704.wt-chart-descendants .lined1 { 2705 margin-bottom: 4px; 2706} 2707 2708.wt-chart-descendants .lined2 { 2709 margin-bottom: 7px; 2710} 2711 2712.wt-chart-descendants .lined3 { 2713 margin-bottom: 4px; 2714} 2715 2716.wt-chart-descendants .lined4 { 2717 margin-bottom: 7px; 2718} 2719 2720.wt-chart-descendants .linea5 { 2721 vertical-align: top; 2722} 2723 2724/* Family book */ 2725.linef1 { 2726 margin-bottom: 3px; 2727} 2728 2729.linef2 { 2730 margin-bottom: 3px; 2731} 2732 2733.linef3 { 2734 margin-bottom: 7px; 2735} 2736 2737/* Hourglass */ 2738.lineh1 { 2739 margin-bottom: 4px; 2740} 2741 2742.lineh2 { 2743 margin-bottom: 4px; 2744} 2745 2746.lineh3 { 2747 margin-bottom: 7px; 2748} 2749 2750/* 2751 * Pedigree chart 2752 * 2753 * wt-chart, wt-chart-pedigree 2754 */ 2755 2756#pedigree_chart { 2757 position: relative; 2758 margin: 20px auto; 2759} 2760 2761#pedigree_canvas { 2762 z-index: -1000; 2763} 2764 2765#childbox-pedigree { 2766 border: 1px solid; 2767 background-color: #fff; 2768} 2769 2770#pedigree-page #childbox-pedigree { 2771 border: 1px solid; 2772 background-color: #fff; 2773} 2774 2775#childbox-pedigree { 2776 padding: 5px; 2777 position: absolute; 2778 display: none; 2779 text-align: start; 2780 white-space: nowrap; 2781 left: auto; 2782 z-index: 9999; 2783} 2784 2785.wt-chart-pedigree, .wt-chart-hourglass { 2786 overflow-y: auto; 2787} 2788 2789.wt-chart-pedigree .spacer { 2790 background-image: url(images/spacer.png); 2791 height: 20px; 2792 width: 1px; 2793} 2794 2795#pedigree-page .shadow { 2796 box-shadow: 0 0 0 !important; /* override vendor css shadow */ 2797} 2798 2799#childarrow, 2800.ancestorarrow { 2801 text-align: center; 2802 display: inline-block; 2803 vertical-align: middle; 2804} 2805 2806.layout3 #childbox-pedigree { 2807 top: auto; 2808} 2809 2810#childbox-pedigree a.name1 { 2811 display: block; 2812 margin-left: 5px; 2813} 2814 2815/* 2816 * Place hierarchy 2817 * 2818 * wt-place-hierarchy-page 2819 */ 2820 2821#place-hierarchy ul { 2822 list-style-type: none; 2823} 2824 2825.d-table-cell { 2826 padding-right: 5px; 2827} 2828 2829/* 2830 * Search 2831 * 2832 * wt-search-page, wt-general-serach-page/wt-phonetic-search-page/wt-advanced-search-page/wt-search-replace-page 2833 */ 2834 2835/* Some menus (e.g. languages) can be longer than a page */ 2836.dropdown-menu { 2837 max-height: 30rem; 2838 overflow-x: hidden; 2839} 2840 2841/* Clipping cart */ 2842.clipping-cart h2 { 2843 margin: 20px; 2844 text-align: center; 2845} 2846 2847.clipping-cart .wt-page-options { 2848 max-width: 25rem; 2849} 2850 2851.clipping-cart .topbottombar, .clipping-cart .optionbox, .add-to .topbottombar { 2852 font-size: 1rem; 2853} 2854 2855.clipping-cart .add-to { 2856 text-align: left; 2857} 2858 2859/* Forms */ 2860.col-form-label { 2861 font-weight: bold; 2862} 2863 2864/* Popups */ 2865.popup .nav-link { 2866 display: inline; 2867 vertical-align: top; 2868 padding: 5px; 2869} 2870 2871