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