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