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