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