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