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