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