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