1/** 2 * webtrees: online genealogy 3 * Copyright (C) 2020 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 19/* Colors for chart boxes, etc. */ 20:root { 21 --sex-f-fg: #aaaaaa; 22 --sex-m-fg: #aaaaaa; 23 --sex-u-fg: #aaaaaa; 24 --sex-f-bg: #ffdddd; 25 --sex-m-bg: #ddddff; 26 --sex-u-bg: #ffffff; 27 --chart-line: solid gray thin; 28 --chart-line-radius: 1rem; 29} 30 31/* Override Bootstrap formatting */ 32 33.table-given-name { 34 overflow-x: hidden; 35} 36 37.btn-link { 38 padding: 0 .25rem; 39} 40 41.container-fluid { 42 padding-left: 5px; 43 padding-right: 5px; 44} 45 46table { 47 border-collapse: separate; 48} 49 50.dropdown-menu { /* Fix dropdown on Place Lists/Place Hierarchy */ 51 z-index: 1010; 52} 53 54/* 55 * Pages have the following high-level structure: 56 * 57 * wt-global wt-theme-<THEME> wt-route-<ROUTE> 58 * +---wt-header-wrapper 59 * | +---wt-header-container 60 * | +---wt-header-content 61 * | +---wt-accessibility-links 62 * | +---wt-site-logo 63 * | +---wt-site-title 64 * | +---wt-header-search 65 * | | +---wt-header-search-form 66 * | | +---wt-header-search-field 67 * | | +---wt-header-search-button 68 * | +---wt-secondary-navigation 69 * | | +---wt-user-menu 70 * | +---wt-primary-navigation 71 * | +---wt-genealogy-menu 72 * +---wt-main-wrapper 73 * | +---wt-main-container 74 * | +---wt-main-content 75 * | +---wt-messages 76 * | +---wt-page-title 77 * | +---wt-page-options wt-page-options-xxxxx 78 * | +---wt-page-content 79 * +---wt-footers 80 * +---wt-footer wt-footer-xxxxx 81 */ 82 83.wt-global { 84 background: #c8e7ff url(clouds/images/background.png) repeat-x fixed top left; 85 color: #006; 86} 87 88.wt-header-wrapper { 89 background: #acf url(clouds/images/clouds.png) repeat-x; 90 border-bottom: thin solid #79c; 91} 92 93.wt-header-wrapper .dropdown-item.active { 94 background-color: inherit; 95 color: inherit; 96 font-weight: bold; 97} 98 99.wt-header-container { 100 margin-top: 0.5rem; 101} 102 103.wt-header-content { 104} 105 106.wt-accessibility-links { 107} 108 109.wt-site-logo { 110 display: none; 111} 112 113.wt-site-title { 114 order: 1; 115 flex: 1 1 auto; 116 width: auto; 117 font-size: 1.5rem; 118} 119 120.wt-header-search { 121 order: 3; 122 flex: 0 0 15rem; 123} 124 125.wt-header-search-form { 126} 127 128.wt-header-search-field { 129} 130 131.wt-header-search-button { 132} 133 134.wt-secondary-navigation { 135 order: 2; 136 flex: 0 0 auto; 137 width: auto; 138 white-space: nowrap; 139} 140 141.wt-user-menu { 142 flex-wrap: nowrap; 143} 144 145.wt-user-menu .nav-link { 146 display: inline-block; 147 padding: 0.5rem; 148} 149 150.wt-user-menu .nav-item + .nav-item::before { 151 content: "|"; 152} 153 154.wt-user-menu .dropdown-toggle:after { 155 display: none; 156} 157 158.wt-user-menu .dropdown-item { 159 padding-left: 1rem; 160 padding-right: 1rem; 161} 162 163.wt-primary-navigation { 164 order: 3; 165 flex: 1 0 auto; 166} 167 168.wt-genealogy-menu { 169 display: flex; flex-wrap: wrap; 170} 171 172.wt-genealogy-menu .nav-item { 173 padding: 0 0.75rem; 174} 175 176.wt-genealogy-menu .nav-link { 177 /* All menu icons are 22px x 22px */ 178 height: calc(22px + 1rem); 179 width: 22px; 180 /* Hide text */ 181 padding: 0.5rem 0; 182 overflow: hidden; 183} 184 185.wt-genealogy-menu .dropdown-item { 186 /* Space between icons and align with submenu icons */ 187 padding: 0 5px 0 0; 188} 189 190.wt-genealogy-menu .dropdown-item::before { 191 /* All submenu icons are 22px x 22px */ 192 height: 22px; 193 width: 22px; 194 /* Align icons and text */ 195 vertical-align: text-top; 196 /* Space between icon and text */ 197 padding: 0 .25rem; 198 line-height: 1.8; 199} 200 201.wt-genealogy-menu .nav-item::before { 202 /* The size of the menu icons */ 203 width: 22px; 204 height: 22px; 205} 206 207.wt-genealogy-menu .dropdown-item::before { 208 /* The size of the submneu icons */ 209 width: 22px; 210 height: 22px; 211} 212 213.wt-genealogy-menu .dropdown-item:first-child { 214 font-weight: bold; 215 text-align: center; 216 border-bottom: solid thin #ddd; 217} 218 219.menu-tree .nav-link::before { 220 content: url(clouds/menu/tree.png); 221} 222 223.menu-tree .dropdown-item:not(:first-child)::before { 224 content: url(clouds/menu/tree-tree.png); 225} 226 227.menu-chart .nav-link::before { 228 content: url(clouds/menu/chart.png); 229} 230 231.menu-chart-ancestry::before { 232 content: url(clouds/menu/chart-ancestors.png); 233} 234 235.menu-chart-compact::before { 236 content: url(clouds/menu/chart-compact.png); 237} 238 239.menu-chart-descendants::before { 240 content: url(clouds/menu/chart-descendants.png); 241} 242 243.menu-chart-familybook::before { 244 content: url(clouds/menu/chart-family-book.png); 245} 246 247.menu-chart-fanchart::before { 248 content: url(clouds/menu/chart-fanchart.png); 249} 250 251.menu-chart-hourglass::before { 252 content: url(clouds/menu/chart-hourglass.png); 253} 254 255.menu-chart-lifespan::before { 256 content: url(clouds/menu/chart-lifespan.png); 257} 258 259.menu-chart-pedigree::before { 260 content: url(clouds/menu/chart-pedigree.png); 261} 262 263.menu-chart-pedigreemap::before { 264 content: url(clouds/menu/chart-pedigree-map.png); 265} 266 267.menu-chart-relationship::before { 268 content: url(clouds/menu/chart-relationship.png); 269} 270 271.menu-chart-statistics::before { 272 content: url(clouds/menu/chart-statistics.png); 273} 274 275.menu-chart-timeline::before { 276 content: url(clouds/menu/chart-timeline.png); 277} 278 279.menu-chart-tree::before { 280 content: url(clouds/menu/chart-tree.png); 281} 282 283.menu-list .nav-link::before { 284 content: url(clouds/menu/list.png); 285} 286 287.menu-branches::before { 288 content: url(clouds/menu/branches.png); 289} 290 291.menu-list-fam::before { 292 content: url(clouds/menu/list-fam.png); 293} 294 295.menu-list-indi::before { 296 content: url(clouds/menu/list-indi.png); 297} 298 299.menu-list-note::before { 300 content: url(clouds/menu/list-note.png); 301} 302 303.menu-list-obje::before { 304 content: url(clouds/menu/list-obje.png); 305} 306 307.menu-list-plac::before { 308 content: url(clouds/menu/list-plac.png); 309} 310 311.menu-list-repo::before { 312 content: url(clouds/menu/list-repo.png); 313} 314 315.menu-list-sour::before { 316 content: url(clouds/menu/list-sour.png); 317} 318 319.menu-list-subm::before { 320 content: url(clouds/menu/list-indi.png); 321} 322 323.menu-calendar .nav-link::before { 324 content: url(clouds/menu/calendar.png); 325} 326 327.menu-calendar-day::before { 328 content: url(clouds/menu/calendar.png); 329} 330 331.menu-calendar-month::before { 332 content: url(clouds/menu/calendar.png); 333} 334 335.menu-calendar-year::before { 336 content: url(clouds/menu/calendar.png); 337} 338 339.menu-report .nav-link::before { 340 content: url(clouds/menu/report.png); 341} 342 343.menu-report .dropdown-item:not(:first-child)::before { 344 content: url(clouds/menu/report.png); 345} 346 347.menu-search .nav-link::before { 348 content: url(clouds/menu/search.png); 349} 350 351.menu-search .dropdown-item:not(:first-child)::before { 352 content: url(clouds/menu/search.png); 353} 354 355.menu-faq .nav-link::before { 356 content: url(clouds/menu/faq.png); 357} 358 359.menu-clippings .nav-link::before { 360 content: url(clouds/menu/clippings.png); 361} 362 363.menu-clippings-add::before { 364 content: url(clouds/menu/clippings-cart.png); 365} 366 367.menu-clippings-cart::before { 368 content: url(clouds/menu/clippings-cart.png); 369} 370 371.menu-clippings-download::before { 372 content: url(clouds/menu/edit-gedcom.png); 373} 374 375.menu-clippings-empty::before { 376 content: url(clouds/menu/edit-delete.png); 377} 378 379.menu-clippings-remove::before { 380 content: url(clouds/menu/edit-delete.png); 381} 382 383.menu-story .nav-link::before { 384 content: url(clouds/menu/story.png); 385} 386 387.wt-main-container { 388 /* Space between the header/footer and the main content. */ 389 padding-top: 1rem; 390 padding-bottom: 1rem; 391} 392 393.wt-main { 394} 395 396.wt-messages { 397} 398 399.wt-page-title { 400 text-align: center; 401} 402 403.wt-page-options { 404} 405 406.wt-page-options .form-group { 407 margin-bottom: 2px; 408} 409 410.wt-page-options-label { 411 color: #039; 412 background-color: #95b8e0; 413} 414 415.wt-page-options-value { 416 color: #006; 417 background-color: #ecf5ff; 418 border: thin solid #ccc; 419 padding: 0.25rem 0.75rem; 420} 421 422.wt-page-content { 423 margin-top: 1rem; 424} 425 426.wt-footers { 427} 428 429.wt-footer { 430} 431 432.wt-footer-contact { 433} 434 435.wt-footer-cookies { 436 background: #666; 437 color: #fff; 438 transition: height 0.5s; 439} 440 441.wt-footer-page-views { 442} 443 444.wt-footer-powered-by { 445} 446 447.wt-footer-powered-by-webtrees { 448 width: 100px; 449 height: 21px; 450 content: url(images/powered-by-webtrees.png); 451} 452 453/* 454 * The tree/user home pages 455 * 456 * wt-home-page / wt-user-page 457 * +---wt-main-blocks 458 * | +---wt-block, wt-block-AAA 459 * | +---wt-block, wt-block-BBB 460 * | +---wt-block, wt-block-CCC 461 * +---wt-side-blocks 462 * +---wt-block, wt-block-XXX 463 * +---wt-block, wt-block-YYY 464 * +---wt-block, wt-block-ZZZ 465 * 466 * Each block as the structure 467 * wt-block, wt-block-XXX 468 * +---wt-block-header, wt-block-header-XXX 469 * +---wt-block-content, wt-block-content-XXX 470 */ 471 472.wt-block { 473 color: #000; 474 margin-bottom: 5px; 475 padding: 1px; 476 vertical-align: top; 477} 478 479.wt-block-header { 480 background: url(clouds/images/block-header-background.png); 481 background-size: auto 100%; 482 padding: 0.25rem 0.75rem; 483} 484 485.wt-block-header::before { 486 content: url(clouds/images/block-header-disk.png); 487 margin: 0.5rem; 488} 489 490.wt-block-content { 491} 492 493.blockcontent { 494 border: solid #999 1px; 495 margin: 0 2px 10px 0; 496 overflow: auto; 497 padding: 5px; 498} 499 500.blockcontent .list_table { 501 border-spacing: 1px; 502 border: solid #999 1px; 503 border-right: 0; 504} 505 506.blockcontent .list_value, 507.blockcontent .list_value_wrap { 508 border: 0; 509 border-top: solid #999 1px; 510 border-right: solid #999 1px; 511} 512 513/* 514 * The individual page. 515 * 516 * wt-route-individual 517 * +---wt-header-wrapper 518 */ 519 520.wt-individual-silhouette { 521 content: url(images/individual-silhouette-unknown.png); 522} 523 524.wt-individual-silhouette-f { 525 content: url(images/individual-silhouette-female.png); 526} 527 528.wt-individual-silhouette-m { 529 content: url(images/individual-silhouette-male.png); 530} 531 532/* 533 * Chart-boxes are used to build the various charts. 534 * Each type of chart will set its own size and hide/show content. 535 * 536 * wt-chart-box 537 * +--- wt-chart-box-thumbnail 538 * +--- wt-chart-box-extra 539 * +--- wt-chart-box-zoom 540 * +--- wt-chart-box-icon 541 * +--- wt-chart-box-dropdown wt-chart-box-zoom-dropdown 542 * +--- wt-chart-box-links 543 * +--- wt-chart-box-icon 544 * +--- wt-chart-box-dropdown wt-chart-box-links-dropdown 545 * +--- wt-chart-box-name 546 * +--- wt-chart-box-lifespan 547 * +--- wt-chart-box-facts 548 * +--- wt-chart-box-fact 549 */ 550.wt-chart-box, 551.wt-chart-box-menu { 552 background: var(--sex-u-bg); 553 border: dashed var(--sex-u-fg) thin; 554} 555 556.wt-chart-box { 557 height: 5rem; 558 padding: 2px; 559 line-height: 1.1; 560} 561 562.wt-chart-box-f, 563.wt-chart-box-f .wt-chart-box-dropdown { 564 background: var(--sex-f-bg); 565 border: solid var(--sex-f-fg) thin; 566} 567 568.wt-chart-box-m, 569.wt-chart-box-m .wt-chart-box-dropdown { 570 background: var(--sex-m-bg); 571 border: solid var(--sex-m-fg) thin; 572} 573 574/* ====== Round Corners ======== */ 575input, 576fieldset, 577.border1, 578.block, 579.list_label, 580.list_label_wrap, 581.list_value, 582.list_value_wrap, 583.messagebox, 584.optionbox, 585.wt-chart-box, 586.person0, 587.person1, 588.person2, 589.person3, 590.person4, 591.person5, 592.wt-genealogy-menu ul, 593.user-menu li ul, 594footer, 595#indi_main_blocks, 596#tabs{ 597 border-radius: 3px; 598} 599 600a { 601 color: #039; 602 text-decoration: none; 603} 604 605a:hover { 606 color: #f00; 607 text-decoration: none; 608} 609 610:focus { 611 outline-style: none; 612} 613 614.flash-messages { 615 clear: both; 616 text-align: center; 617} 618 619img { 620 border: 0; 621} 622 623legend img { 624 height: 20px; 625 vertical-align: middle; 626 width: 20px; 627} 628 629img.block { 630 border: 0; 631 height: 25px; 632 vertical-align: middle; 633} 634 635.topbottombar { 636 font-size: 12px; 637 font-weight: bold; 638 padding: 4px; 639 text-align: center; 640} 641 642.button { 643 width: 60px; 644} 645 646button:focus { 647 outline: 0; 648} 649 650.alpha_index { 651 color: #999; 652} 653 654hr { 655 margin-top: 5px; 656 border-color: #006; 657} 658 659.list_table { 660 margin: 0 auto; 661} 662 663.list_label, 664.list_label_wrap { 665 color: #fff; 666 border: 1px solid #999; 667 font-weight: bold; 668 text-align: center; 669} 670 671.list_value, 672.list_value_wrap { 673 background-color: #edf7f9; 674 border: solid #999 1px; 675 vertical-align: top; 676} 677 678.list_label, 679.list_value { 680 white-space: nowrap; 681 padding: 4px; 682} 683 684.list_label_wrap, 685.list_value_wrap { 686 white-space: normal; 687} 688 689div.fact_SHARED_NOTE { 690 clear: both; 691} 692 693/* Table of genealogical facts */ 694.wt-facts-table { 695 border-collapse: separate; 696} 697 698.wt-facts-table caption { 699 caption-side: top; 700} 701 702.wt-facts-table th { 703 background-color: #95b8e0; 704 color: #039; 705 border: 1px solid #acf; 706 border-radius: 3px; 707 font-weight: normal; 708 text-align: center; 709 min-width: 20%; 710} 711 712.wt-facts-table td { 713 background: #fff; 714 border: solid #999 1px; 715 border-radius: 3px; 716} 717 718.wt-facts-table .wt-gender-M td { 719 background-color: #ddf; 720} 721 722.wt-facts-table .wt-gender-F td { 723 background-color: #fdd; 724} 725 726.name1 { 727 font-weight: bold; 728 font-size: 12px; 729} 730 731.name2 { 732 font-size: 16px; 733 } 734 735a:hover .name1, a:hover .name2 { 736 color: #f00; 737 font-weight: bold; 738 font-size: 12px; 739} 740 741.details_label { 742 font-weight: bold; 743} 744 745.date { 746 color: #039; 747} 748 749.label { 750 font-weight: bold; 751} 752 753.error { 754 color: #d00; 755 font-weight: bold; 756} 757 758.largeError { 759 color: #d00; 760 font-size: large; 761 font-weight: bold; 762} 763 764.warning { 765 color: #f00; 766 font-weight: bold; 767} 768 769.indent { 770 padding-left: 7px; 771} 772 773.thumbnail { 774 height: auto; 775 padding: 3px; 776} 777 778.icon { 779 border: 0; 780 padding: 0 5px; 781} 782 783.subheaders { 784 color: #006; 785 font-weight: bold; 786 font-size: 15px; 787 margin-top: 15px; 788 vertical-align: bottom; 789} 790 791.parentdeath { 792 border: thin solid #888; 793 padding: 1px; 794} 795 796.selected-option { 797 background-color: #cef; 798} 799 800.border1 { 801 border: solid #000 1px; 802} 803 804.journal_box { 805 padding: 3pt; 806 border: thin solid #aaa; 807 overflow: visible; 808} 809 810.news_box { 811 border-top: solid #ccc 1px; 812} 813 814.news_title { 815 color: #000; 816 font-weight: bold; 817} 818 819.news_date { 820 color: #000; 821 margin-bottom: 12px; 822} 823 824.current_day { 825 font-weight: bold; 826 font-size: 16px; 827} 828 829.cal_day { 830 float: left; 831 font-weight: bold; 832} 833 834#user-page h1 { 835 margin: 0.25em auto 0.6em; 836} 837 838.tvertline { 839 vertical-align: bottom; 840} 841 842#childbox { 843 padding: 5px; 844 position: absolute; 845 display: none; 846 text-align: start; 847 white-space: nowrap; 848 top: 20px; 849 left: 0; 850} 851 852.layout3 #childbox { 853 top: auto; 854 bottom: 20px; 855} 856 857#childbox a.name1 { 858 display: block; 859 margin-left: 5px; 860} 861 862.person0 { 863 background-color: #ddf; 864 border: outset #999 1px; 865 vertical-align: top; 866} 867 868.person1 { 869 background-color: #afa; 870 border: outset #afa 1px; 871 vertical-align: top; 872} 873 874.person2 { 875 background-color: #faa; 876 border: outset #faa 1px; 877 vertical-align: top; 878} 879 880.person3 { 881 background-color: #aad; 882 border: outset #55f 1px; 883 vertical-align: top; 884} 885 886.person4 { 887 background-color: #f55; 888 border: outset #f55 1px; 889 vertical-align: top; 890} 891 892.person5 { 893 background-color: #5f5; 894 border: outset #5f5 1px; 895 vertical-align: top; 896} 897 898.starredname { 899 text-decoration: underline; 900} 901 902.search_hit { 903 background-color: #ff0; 904} 905 906.descriptionbox { 907 font-size: 12px; 908 border: 1px solid #ccc; 909 vertical-align: top; 910 padding: 3px; 911} 912 913.optionbox { 914 font-size: 1rem; 915 background-color: #ecf5ff; 916 color: #006; 917 border: solid #ccc 1px; 918 vertical-align: top; 919 white-space: nowrap; 920 padding: 3px; 921} 922 923.red { 924 color: #f00; 925} 926 927.wt-relation-fact, 928.wt-historic-fact { 929 opacity: 0.8; 930} 931 932.messagebox { 933 background-color: #c2ceef; 934 border: solid #ccc 1px; 935} 936 937/* ---Pending edits--- */ 938.wt-new { 939 outline: solid blue 1px; 940} 941 942.wt-old { 943 outline: solid red 1px; 944} 945 946.tag_cloud { 947 text-align: center; 948} 949 950.tag_cloud a { 951 white-space: nowrap; 952} 953 954.nowrap { 955 white-space: nowrap; 956} 957 958.wrap { 959 white-space: normal; 960} 961 962.statistics-page { 963 text-align: center; 964} 965 966.gchart { 967 border: solid #999 1px; 968} 969 970#facts_content dd { 971 float: left; 972 width: 70%; 973} 974 975/* this keeps the tag color the same when it is a link as when not */ 976 977.place { 978 padding-top: 5px; 979} 980 981.filtersH, 982.filtersF { 983 margin: 4px; 984} 985 986.filtersH img { 987 margin-bottom: 2px; 988} 989 990.list-charts { 991 text-align: center; 992} 993 994#place-hierarchy h2, 995#place-hierarchy h4 { 996 text-align: center; 997} 998 999.user_welcome_block table, 1000.gedcom_block_block table { 1001 margin: auto; 1002} 1003 1004.user_welcome_block td, 1005.gedcom_block_block td { 1006 width: 33%; 1007 text-align: center; 1008 vertical-align: top; 1009} 1010 1011/* ==== FAQ table styles ===== */ 1012table.faq { 1013 background-color: #eee; 1014 margin: 5px 0 50px 5px; 1015 width: 98%; 1016} 1017 1018table.faq tr:nth-child(odd) td { 1019 background-color: #eee; 1020} 1021 1022div.faq_title { 1023 background-color: #eee; 1024 margin: 1em 0; 1025 padding: .25em; 1026 font-weight: bold; 1027 width: 98%; 1028} 1029 1030div.faq_body { 1031 clear: both; 1032 padding: 0 1em; 1033} 1034 1035.faq_top { 1036 float: right; 1037} 1038 1039/* === Positioning edit, copy, delete links === */ 1040/* General use */ 1041.editfacts { 1042 clear: left; 1043 padding-top: 15px; 1044} 1045 1046#indi_note { 1047 margin: 0 0 5px; 1048} 1049 1050.indi_table { 1051 clear: left; 1052} 1053 1054#sex { 1055 float: right; 1056} 1057 1058#dates { 1059 color: #333; 1060 float: right; 1061} 1062 1063#individual-names .wt-icon-edit, 1064#individual-names .wt-icon-delete { 1065 float: right; 1066} 1067 1068#indi_note .fact_NOTE { 1069 float: left; 1070 margin: 0 5px 0 0; 1071} 1072 1073#indi_note .fact_SOUR { 1074 margin: 3px 0; 1075} 1076 1077#indi_note .fact_SOUR a { 1078 font-size: 100%; 1079} 1080 1081#indi_note .fact_NOTE, 1082#indi_note .fact_SOUR { 1083 clear: both; 1084} 1085 1086/* markdown formatting */ 1087 1088.markdown { 1089 /* Tables and pre-formatted text can break the layout. */ 1090 overflow-x: auto; 1091} 1092 1093.markdown p { 1094 margin: 0 0 0.5em; 1095 white-space: pre-wrap; 1096} 1097 1098.markdown table { 1099 border-collapse: collapse; 1100 margin-bottom: 5px; 1101} 1102 1103.markdown th { 1104 font-weight: bold; 1105} 1106 1107.markdown td, 1108.markdown th { 1109 border: solid thin #000; 1110 padding: 3px; 1111} 1112 1113.odometer { 1114 font-family: courier, monospace; 1115 font-weight: bold; 1116 background: #000; 1117 color: #fff; 1118} 1119 1120.upcoming_events_block button, 1121.todays_events_block button { 1122 margin: 0 20px; 1123} 1124 1125/* Sidebar - Family navigator */ 1126.wt-family-navigator-dropdown-heading { 1127 font-weight: bold; 1128 font-size: inherit; 1129 color: inherit; 1130} 1131 1132/* Sidebar - Descendants */ 1133#sb_content_descendancy { 1134 margin-top: 0; 1135} 1136 1137#sb_desc_content { 1138 margin-left: 3px; 1139 font-size: 0.8em; 1140} 1141 1142#sb_desc_content ul { 1143 padding: 0; 1144 margin: 0; 1145} 1146 1147.sb_desc_indi_li { 1148 list-style-type: none; 1149 margin-left: 5px; 1150} 1151 1152/* Individuals and Families */ 1153#sidebar-content-individuals, 1154#sidebar-content-families { 1155 margin-top: 0; 1156} 1157 1158.sb_indi_surname_li, 1159.sb_fam_surname_li { 1160 list-style-image: url(icons/plus.png); 1161} 1162 1163.name_tree_div ul { 1164 padding: 0; 1165 margin: 0; 1166} 1167 1168.name_tree_div li { 1169 list-style: none; 1170 margin: 0; 1171 padding: 0; 1172} 1173 1174/* Clippings */ 1175#sb_clippings_content ul { 1176 padding: 0; 1177 margin: 0; 1178} 1179 1180#sb_clippings_content li { 1181 list-style: none; 1182 margin: 0; 1183 padding: 0; 1184 white-space: nowrap; 1185} 1186 1187/* Stories module */ 1188.story_title { 1189 padding-top: 12px; 1190 font-size: 13px; 1191 height: 32px; 1192 font-weight: bold; 1193} 1194 1195.story_body { 1196 padding: 20px; 1197 white-space: normal; 1198} 1199 1200.story_edit { 1201 padding: 12px; 1202} 1203 1204/*-- Fan chart ---- */ 1205.fan_chart_menu { 1206 background: #fff; 1207 position: absolute; 1208 display: none; 1209 z-index: 100; 1210} 1211 1212#fan_chart ul { 1213 list-style-type: none; 1214 margin: 0; 1215} 1216 1217/* Lifespans chart */ 1218.wt-lifespans-subtitle { 1219 text-align: center; 1220} 1221 1222.wt-lifespans-scale { 1223 white-space: nowrap; 1224} 1225 1226.wt-lifespans-decade { 1227 width: 70px; 1228 height: 60px; 1229 display: inline-block; 1230 background-image: url(images/lifespan-decade.png); 1231 background-position-y: bottom; 1232 background-repeat: no-repeat; 1233 background-size: 70px 37px; 1234} 1235 1236.wt-lifespans-individuals { 1237 background: #fafafa; 1238} 1239 1240.wt-lifespans-individual { 1241 1242} 1243 1244.wt-lifespans-summary { 1245 background: #ffffff; 1246 border: thin solid #000; 1247 z-index: 1; 1248} 1249 1250.wt-lifespans-summary-link { 1251 font-weight: bold; 1252} 1253 1254/*-- timeline --*/ 1255#timeline_chart { 1256 position: relative; 1257 top: 0; 1258 left: 0; 1259} 1260 1261[class^="icon-"], 1262[class*=" icon-"] { 1263 display: inline-block; 1264 vertical-align: middle; 1265 background-repeat: no-repeat; 1266 background-size: cover; 1267} 1268 1269.icon-cfamily { 1270 content: url(clouds/images/cfamily.png); 1271} 1272 1273.icon-childless { 1274 content: url(images/childless.png); 1275} 1276 1277.icon-children { 1278 content: url(images/children.png); 1279} 1280 1281.icon-edit_indi { 1282 content: url(clouds/images/edit_indi.png); 1283} 1284 1285.icon-fam-list { 1286 content: url(clouds/images/sfamily.png); 1287} 1288 1289.icon-indi-list { 1290 content: url(clouds/images/indis.png); 1291} 1292 1293.icon-loading-small { 1294 content: url(images/indicator.gif); 1295} 1296 1297.icon-minus { 1298 content: url(icons/minus.png); 1299} 1300 1301.icon-mypage { 1302 content: url(clouds/images/mypage.png); 1303} 1304 1305.icon-plus { 1306 content: url(icons/plus.png); 1307} 1308 1309.icon-resn-confidential { 1310 content: url(images/resn_confidential.png); 1311} 1312 1313.icon-resn-locked { 1314 content: url(images/resn_locked.png); 1315} 1316 1317.icon-resn-none { 1318 content: url(images/resn_none.png); 1319} 1320 1321.icon-resn-privacy { 1322 content: url(images/resn_privacy.png); 1323} 1324 1325.icon-rings { 1326 content: url(images/rings.png); 1327} 1328 1329.icon-selected { 1330 content: url(clouds/images/selected.png); 1331} 1332 1333/* Silhouettes on charts */ 1334.icon-silhouette-F { 1335 content: url(clouds/images/silhouette_female_small.png); 1336} 1337 1338.icon-silhouette-M { 1339 content: url(clouds/images/silhouette_male_small.png); 1340} 1341 1342.icon-silhouette-U { 1343 content: url(clouds/images/silhouette_unknown_small.png); 1344} 1345 1346/* Tbl hdrs and Light Text */ 1347.descriptionbox, 1348.topbottombar, 1349.topbottombar a, 1350.list_label, 1351.list_label a { 1352 background-color: #95b8e0; 1353 color: #039; 1354} 1355 1356/* Base Color */ 1357.blockcontent, 1358.list_value, 1359.list_value_wrap, 1360.news_box { 1361 background: inherit; 1362} 1363 1364footer .error { 1365 color: #d00; 1366 font-weight: bold; 1367} 1368 1369.user_links { 1370 white-space: nowrap; 1371} 1372 1373/* 1374 * Any element that is loaded dynamically has the class wt-ajax-load. 1375 * We can provide a "loading" placeholder for empty elements with this class. 1376 */ 1377.wt-ajax-load:empty { 1378 height: 32px; 1379 background: url(images/loading-32x32.gif) no-repeat 50% 50%; 1380} 1381 1382/* 1383 * Default icons are provided by FontAwesome. 1384 */ 1385.wt-icon-anniversary { 1386 content: url(icons/anniversary.png); 1387} 1388 1389.wt-icon-arrow-down { 1390 content: url(clouds/icons/arrow-down.png); 1391} 1392 1393a > .wt-icon-arrow-down:hover { 1394 content: url(clouds/icons/arrow-down-hover.png); 1395} 1396 1397.wt-icon-arrow-left { 1398 content: url(clouds/icons/arrow-left.png); 1399} 1400 1401a > .wt-icon-arrow-left:hover { 1402 content: url(clouds/icons/arrow-left-hover.png); 1403} 1404 1405.wt-icon-arrow-right { 1406 content: url(clouds/icons/arrow-right.png); 1407} 1408 1409a > .wt-icon-arrow-right:hover { 1410 content: url(clouds/icons/arrow-right-hover.png); 1411} 1412 1413.wt-icon-arrow-up { 1414 content: url(clouds/icons/arrow-up.png); 1415} 1416 1417a > .wt-icon-arrow-up:hover { 1418 content: url(clouds/icons/arrow-up-hover.png); 1419} 1420 1421.wt-icon-bing-maps { 1422 content: url(icons/bing-maps.png); 1423} 1424 1425.wt-icon-calendar { 1426 content: url(icons/calendar.png) 1427} 1428 1429.wt-icon-collapse { 1430} 1431 1432.wt-icon-coordinates { 1433 content: url(icons/coordinates.png) 1434} 1435 1436.wt-icon-copy { 1437 content: url(icons/copy.png) 1438} 1439 1440.wt-icon-delete { 1441 content: url(icons/delete.png); 1442} 1443 1444.wt-icon-edit { 1445 content: url(icons/edit.png); 1446} 1447 1448.wt-icon-expand { 1449} 1450 1451.wt-icon-family { 1452 content: url(icons/family.png); 1453} 1454 1455.wt-icon-google-maps { 1456 content: url(icons/google-maps.png); 1457} 1458 1459.wt-icon-help { 1460 content: url(clouds/icons/help.png); 1461} 1462 1463.wt-icon-individual { 1464 content: url(icons/individual.png); 1465} 1466 1467.wt-icon-keyboard { 1468 content: url(icons/keyboard.png); 1469} 1470 1471.wt-icon-media { 1472 content: url(icons/media.png); 1473} 1474 1475.wt-icon-note { 1476 content: url(icons/note.png); 1477} 1478 1479.wt-icon-openstreetmap { 1480 content: url(icons/openstreetmap.png); 1481} 1482 1483.wt-icon-preferences { 1484 content: url(clouds/icons/preferences.png); 1485} 1486 1487.wt-icon-reorder { 1488 content: url(icons/reorder.png); 1489} 1490 1491.wt-icon-repository { 1492 content: url(icons/repository.png); 1493} 1494 1495.wt-icon-sex { 1496 height: 1em; 1497} 1498 1499.wt-icon-sex-f { 1500 content: url(icons/sex-female.png); 1501} 1502 1503.wt-icon-sex-m { 1504 content: url(icons/sex-male.png); 1505} 1506 1507.wt-icon-sex-u { 1508 content: url(icons/sex-unknown.png); 1509} 1510 1511.wt-icon-sex-x { 1512 content: url(icons/sex-unknown.png); 1513} 1514 1515.wt-icon-source { 1516 content: url(icons/source.png); 1517} 1518 1519.wt-icon-submitter { 1520 content: url(icons/individual.png); 1521} 1522 1523.wt-icon-warning { 1524 content: url(icons/warning.png); 1525} 1526 1527.wt-icon-zoom-in { 1528 content: url(clouds/icons/zoom-in.png); 1529} 1530 1531.wt-icon-zoom-out { 1532 content: url(clouds/icons/zoom-out.png); 1533} 1534 1535/* Miscellaneous images */ 1536.icon-indis { 1537 content: url(clouds/images/indis.png); 1538} 1539 1540.icon-patriarch { 1541 content: url(clouds/images/patriarch.png); 1542} 1543 1544.icon-pedigree { 1545 content: url(clouds/images/pedigree.png); 1546} 1547 1548.icon-sfamily { 1549 content: url(clouds/images/sfamily.png); 1550} 1551 1552.icon-user_add { 1553 content: url(clouds/images/user_add.png); 1554} 1555 1556/* Census assistant */ 1557.wt-census-assistant-form-control:focus { 1558 min-width: 12rem; 1559} 1560 1561/* Some blocks show a reduced version on the right-hand side. */ 1562.wt-side-blocks .wt-side-block-optional { 1563 display: none !important; 1564} 1565 1566/* my page chart enhancements */ 1567.wt-block-content-charts { 1568 overflow: auto; 1569} 1570 1571/* Some charts are wider than the page. */ 1572.wt-chart { 1573 overflow-x: auto; 1574 overflow-y: hidden; 1575} 1576 1577/* Fit thumbnail into parent on charts */ 1578.select2-selection.select2-selection--single { 1579 min-height: 36px; 1580 height: auto; 1581 padding: 2px 0; 1582} 1583 1584.select2-container .select2-selection--single .select2-selection__rendered { 1585 padding-left: 2px; 1586} 1587 1588.select2-selection--single .NAME { 1589 padding-left: 4px; 1590} 1591 1592/* Some menus (e.g. languages) can be longer than a page */ 1593.dropdown-menu { 1594 max-height: 30rem; 1595 overflow-x: hidden; 1596} 1597 1598/* Forms */ 1599.col-form-label { 1600 font-weight: bold; 1601} 1602