/** * webtrees: online genealogy * Copyright (C) 2018 webtrees development team * This program is free software: you can redistribute it and/or modify * it under the terms of the GNU General Public License as published by * the Free Software Foundation, either version 3 of the License, or * (at your option) any later version. * This program is distributed in the hope that it will be useful, * but WITHOUT ANY WARRANTY; without even the implied warranty of * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the * GNU General Public License for more details. * You should have received a copy of the GNU General Public License * along with this program. If not, see . */ /* The colors theme is based on the clouds theme */ /* Colors for chart boxes, etc. */ :root { } /* Override Bootstrap formatting */ .select2-container--default .select2-results__option--highlighted[aria-selected] { background-color: #eee; color: #000; } .table-given-name { overflow-x: hidden; } .btn-link { padding: 0 .25rem; color: #333; } .card-header .btn-link { font-size: 0; line-height: 0; border: 0; } .card-header h4 { font-size: 1.2rem; } .btn.focus, .btn:focus { box-shadow: none; } .btn-link:hover, .btn-link:focus { color: #f00; text-decoration: none; } .pagination, .page-link, .page-link:hover, .page-link:focus { border-color: #e6e6e6; color: #555; } .page-item.active .page-link { background-color: #e6e6e6; color: #555; border-color: #ccc; } .form-control:focus{ border-color:#ccc; box-shadow:0 0 0 .2rem rgba(128,128,128,.25); } .container-fluid { padding-left: 5px; padding-right: 5px; } table { border-collapse: separate; } /* fit primary and secondary menus on mobile devices */ @media (max-width: 500px) { .wt-primary-menu .nav-item { padding: 0 0.45rem!important; } .wt-secondary-menu .nav-link { padding: 0.25rem!important; } } /* * Pages have the following high-level structure: * * wt-global wt-theme- wt-route- * +---wt-header-wrapper * +---wt-header-container * | +---wt-header-content * | +---wt-accessibility-links * | +---wt-site-logo * | +---wt-site-title * | +---wt-header-search * | | +---wt-header-search-form * | | +---wt-header-search-field * | | +---wt-header-search-button * | +---wt-secondary-navigation * | | +---wt-secondary-menu * | +---wt-primary-navigation * | +---wt-primary-menu * +---wt-main-container * | +---wt-main-content * | +---wt-messages * | +---wt-page-title * | +---wt-page-options wt-page-options-xxxxx * | +---wt-page-content * +---wt-footers * +---wt-footer wt-footer-contact * +---wt-footer wt-footer-cookies * +---wt-footer wt-footer-page-views * +---wt-footer wt-footer-powered-by */ .wt-global { /* Prevent redraws when dynamic content requires a scrollbar. */ overflow-y: scroll; /* Keep the page as tall as the window, so the footer can remain at the bottom. */ display: flex; min-height: 100vh; flex-direction: column; /* Any wide content will have its own horizontal scrollbar */ overflow-x: hidden; background: #fff; /* Override clouds */ color: #333; } .wt-header-wrapper { background: #acf none; } .wt-header-wrapper .dropdown-item.active { background-color: inherit; color: inherit; font-weight: bold; } .wt-header-container { } .wt-header-content { } .wt-accessibility-links { } .wt-site-logo { } .wt-site-title { order: 1; flex: 1 1 0; font-size: 1.5rem; padding: 0.75rem 0.75rem 0; } .wt-header-search { order: 3; flex: 0 0 15rem; padding-bottom: 0.5rem; } .wt-header-search-form { } .wt-header-search-field { } .wt-header-search-button { } .wt-secondary-navigation { order: 2; flex: 0 0 0; white-space: nowrap; } .wt-secondary-menu { } .wt-secondary-menu .nav-link { display: inline-block; padding: 0.5rem; color: inherit; /* Inherit from wt-header-container */ } .wt-secondary-menu .nav-item + .nav-item::before { content: "|"; } .wt-secondary-menu .dropdown-toggle:after { display: none; } .wt-secondary-menu .menu-color .dropdown-menu { max-height: 60rem; } .wt-primary-navigation { order: 4; flex: 0 0 100%; } .wt-primary-menu { /* Extend to full page width */ flex: 0 1 100vw; /* Recalculate margins for content */ margin: 0 calc(50% - 50vw); padding: 0 calc(50vw - 50%); } .wt-primary-menu .dropdown-menu { max-height: 60rem; } .wt-primary-menu .nav-item { padding: 0 0.75rem; } .wt-primary-menu .nav-link { /* All menu icons are 40px x 40px */ height: calc(40px + 1rem); width: 40px; } .wt-primary-menu .nav-item::before { /* The size of the menu icons */ width: 40px; height: 40px; } .menu-tree .nav-link::before { content: url(colors/menu/tree.png); } .menu-tree .dropdown-item:not(:first-child)::before { content: url(colors/menu/tree-tree.png); } .menu-chart .nav-link::before { content: url(colors/menu/chart.png); } .menu-chart-ancestry::before { content: url(colors/menu/chart-ancestors.png); } .menu-chart-compact::before { content: url(colors/menu/chart-compact.png); } .menu-chart-descendants::before { content: url(colors/menu/chart-descendants.png); } .menu-chart-familybook::before { content: url(colors/menu/chart-family-book.png); } .menu-chart-fanchart::before { content: url(colors/menu/chart-fanchart.png); } .menu-chart-hourglass::before { content: url(colors/menu/chart-hourglass.png); } .menu-chart-lifespan::before { content: url(colors/menu/chart-lifespan.png); } .menu-chart-pedigree::before { content: url(colors/menu/chart-pedigree.png); } .menu-chart-pedigreemap::before { content: url(colors/menu/chart-pedigree-map.png); } .menu-chart-relationship::before { content: url(colors/menu/chart-relationship.png); } .menu-chart-statistics::before { content: url(colors/menu/chart-statistics.png); } .menu-chart-timeline::before { content: url(colors/menu/chart-timeline.png); } .menu-chart-tree::before { content: url(colors/menu/chart-tree.png); } .menu-list .nav-link::before { content: url(colors/menu/list.png); } .menu-branches::before { content: url(colors/menu/branches.png); } .menu-list-fam::before { content: url(colors/menu/list-fam.png); } .menu-list-indi::before { content: url(colors/menu/list-indi.png); } .menu-list-note::before { content: url(colors/menu/list-note.png); } .menu-list-obje::before { content: url(colors/menu/list-obje.png); } .menu-list-plac::before { content: url(colors/menu/list-plac.png); } .menu-list-repo::before { content: url(colors/menu/list-repo.png); } .menu-list-sour::before { content: url(colors/menu/list-sour.png); } .menu-calendar .nav-link::before { content: url(colors/menu/calendar.png); } .menu-calendar-day::before { content: url(colors/menu/calendar-calendar.png); } .menu-calendar-month::before { content: url(colors/menu/calendar-calendar.png); } .menu-calendar-year::before { content: url(colors/menu/calendar-calendar.png); } .menu-report .nav-link::before { content: url(colors/menu/report.png); } .menu-report .dropdown-item:not(:first-child)::before { content: url(colors/menu/report-report.png); } .menu-search .nav-link::before { content: url(colors/menu/search.png); } .menu-search .dropdown-item:not(:first-child)::before { content: url(colors/menu/search-search.png); } .menu-help .nav-link::before { content: url(colors/menu/help.png); } .menu-clippings .nav-link::before { content: url(colors/menu/clippings.png); } .menu-clippings-add::before { content: url(colors/menu/clippings-add.png); } .menu-clippings-cart::before { content: url(colors/menu/clippings-cart.png); } .menu-clippings-download::before { content: url(colors/menu/edit-gedcom.png); } .menu-clippings-empty::before { content: url(colors/menu/edit-delete.png); } .menu-fam .nav-link::before { content: url(colors/menu/fam.png); } .menu-fam-change::before { content: url(colors/menu/edit-fam.png); } .menu-fam-addchil::before { content: url(colors/menu/edit-fam.png); } .menu-fam-orderchil::before { content: url(colors/menu/edit-fam.png); } .menu-fam-del::before { content: url(colors/menu/edit-delete.png); } .menu-fam-addfav::before { content: url(colors/menu/edit-add-favorite.png); } .menu-fam-editraw::before { content: url(colors/menu/edit-gedcom.png); } .menu-indi .nav-link::before { content: url(colors/menu/indi.png); } .menu-indi-addname::before { content: url(colors/menu/edit-indi.png); } .menu-indi-editsex::before { content: url(colors/menu/edit-indi.png); } .menu-indi-del::before { content: url(colors/menu/edit-delete.png); } .menu-indi-addfav::before { content: url(colors/menu/edit-add-favorite.png); } .menu-indi-editraw::before { content: url(colors/menu/edit-gedcom.png); } .menu-obje .nav-link::before { content: url(colors/menu/obje.png); } .menu-obje-edit::before { content: url(colors/menu/edit-obje.png); } .menu-obje-link::before { content: url(colors/menu/edit-link.png); } .menu-obje-del::before { content: url(colors/menu/edit-delete.png); } .menu-obje-addfav::before { content: url(colors/menu/edit-add-favorite.png); } .menu-obje-editraw::before { content: url(colors/menu/edit-gedcom.png); } .menu-note .nav-link::before { content: url(colors/menu/note.png); } .menu-note-edit::before { content: url(colors/menu/edit-note.png); } .menu-note-del::before { content: url(colors/menu/edit-delete.png); } .menu-note-addfav::before { content: url(colors/menu/edit-add-favorite.png); } .menu-note-editraw::before { content: url(colors/menu/edit-gedcom.png); } .menu-record .nav-link::before { content: url(colors/menu/indi.png); } .menu-record-del::before { content: url(colors/menu/edit-delete.png); } .menu-record-editraw::before { content: url(colors/menu/edit-gedcom.png); } .menu-repo .nav-link::before { content: url(colors/menu/repo.png); } .menu-repo-edit::before { content: url(colors/menu/edit-repo.png); } .menu-repo-del::before { content: url(colors/menu/edit-delete.png); } .menu-repo-addfav::before { content: url(colors/menu/edit-add-favorite.png); } .menu-repo-editraw::before { content: url(colors/menu/edit-gedcom.png); } .menu-sour .nav-link::before { content: url(colors/menu/sour.png); } .menu-sour-edit::before { content: url(colors/menu/edit-sour.png); } .menu-sour-del::before { content: url(colors/menu/edit-delete.png); } .menu-sour-addfav::before { content: url(colors/menu/edit-add-favorite.png); } .menu-sour-editraw::before { content: url(colors/menu/edit-gedcom.png); } .menu-story .nav-link::before { content: url(colors/menu/story.png); } .wt-main-container { } .wt-main { } .wt-messages { } .wt-page-title { text-align: center; } .wt-page-options-value { color: #333; } .wt-page-content { margin-top: 1rem; } .wt-footers { } .wt-footer { } .wt-footer-contact { } .wt-footer-cookies { background: #aaa; color: #fff; height: 3em; line-height: 2.5em; transition: height 0.5s; } .wt-footer-page-views { } .wt-footer-powered-by { content: url(colors/images/powered-by-webtrees.png); } /* * The home/my pages * * wt-home-page / wt-user-page * +---wt-main-blocks * | +---wt-block, wt-block-AAA * | +---wt-block, wt-block-BBB * | +---wt-block, wt-block-CCC * +---wt-side-blocks * +---wt-block, wt-block-XXX * +---wt-block, wt-block-YYY * +---wt-block, wt-block-ZZZ * * Each block as the structure * wt-block, wt-block-XXX * +---wt-block-header, wt-block-header-XXX * +---wt-block-content, wt-block-content-XXX */ .wt-block { } .wt-block-header { } .wt-block-header::before { content: url(colors/images/block-header-disk.png); } .wt-block-content { } /* * Pending changes page * * wt-pending-changes-page */ /* * Edit genealogy data page * * wt-edit-page, wt-edit-XXXX-page */ /* * Configure home/my page blocks page * * wt-edit-blocks-page */ /* * Login page * * wt-login-page */ /* * Ancestors chart * * wt-chart, wt-ancestors-chart * +---wt-ancestors-chart-list * +---wt-ancestors-chart-list-item */ .wt-ancestors-chart-list { } /* * Compact chart * * wt-chart, wt-compact-chart */ .wt-ancestors-chart-list-item { } /* * Descendants chart * * wt-chart, wt-descendants-chart * +---wt-descendants-chart-list * +---wt-descendants-chart-list-item */ .wt-descendants-chart-list { } .wt-descendants-chart-list-item { } /* * Family book chart * * wt-chart, wt-family-book-chart */ /* * Fan chart * * wt-chart, wt-fan-chart */ /* * Hourglass chart * * wt-chart, wt-hourglass-chart */ /* * Hourglass chart * * wt-chart, wt-interactive-tree */ /* * Lifespans chart * * wt-chart, wt-lifespans-chart */ /* * Pedigree chart * * wt-chart, wt-pedigree-chart */ /* * Pedigree map * * wt-chart, wt-pedigree-map */ /* * Relationships chart * * wt-chart, wt-relationships-chart */ /* * Statistics chart * * wt-chart, wt-statistics-chart */ /* * Timeline chart * * wt-chart, wt-timeline-chart */ /* * Family list and individual list * * wt-page-options * +---wt-initials-list * +---wt-initial-list-item * +---wt-initial * +---wt-initial, active * wt-page-content * +---wt-list, wt-{family,individual}-list */ /* * Media object list * * wt-list, wt-media-list */ /* * Note object list * * wt-list, wt-note-list */ /* * Source list * * wt-list, wt-source-list */ /* * Repository list * * wt-list, wt-repository-list */ /* * Branches list * * wt-branches-page */ /* * Place hierarchy * * wt-place-hierarchy-page */ /* * Calendar * * wt-calendar-page */ /* * Reports * * wt-reports-page */ /* * Search * * wt-search-page, wt-general-serach-page/wt-phonetic-search-page/wt-advanced-search-page/wt-search-replace-page */ /* ios on click workaround */ .iconz { cursor: pointer; } a { color: #333; text-decoration: none; } a:hover { color: #f00; text-decoration: none; } :focus { outline-style: none; } .flash-messages { clear: both; text-align: center; } img { border: 0; } legend img { height: 20px; vertical-align: middle; width: 20px; } img.block, #mycart img { border: 0; height: 25px; vertical-align: middle; } .topbottombar { color: #fff; font-size: 12px; font-weight: bold; padding: 4px; text-align: center; } .button { width: 60px; } .btn-primary.focus, .btn-primary:focus { box-shadow:none; border: 0; } .alpha_index { color: #999; } hr { margin-top: 5px; } .person_box, .action_header { background-color: #ddf; border: 1px solid #ccc; } .person_boxF, .action_headerF { background-color: #fdd; border: 1px solid #ccc; } .person_boxNN { background-color: #fff; border: 1px solid #ccc; padding: 3px; } /* families tab person box */ #relatives_content .person_box > .person_box, #relatives_content .person_boxF > .person_boxF, #relatives_content .person_boxNN > .person_boxNN { border: 0; min-height: 50px; } .center { text-align: center; } table.center { margin-left: auto; margin-right: auto; } .list_table { margin: 0 auto; } .list_label, .list_label_wrap { color: #fff; background-color: #81a9cb; border: 1px solid #ddd; font-weight: bold; text-align: center; } .list_value, .list_value_wrap { background-color: #edf7f9; border: solid #ddd 1px; vertical-align: top; padding: 4px; } .list_label, .list_value { white-space: nowrap; } .list_label_wrap, .list_value_wrap { white-space: normal; } div.fact_SHARED_NOTE { clear: both; } /* Table of genealogical facts */ .wt-facts-table { border-collapse: separate; } .wt-facts-table caption { caption-side: top; } .wt-facts-table th { border: 1px solid #ccc; border-radius: 3px; text-align: center; min-width: 20%; } .wt-facts-table td { border: solid #999 1px; border-radius: 3px; } .wt-facts-table .wt-gender-M td { background-color: #ddf; } .wt-facts-table .wt-gender-F td { background-color: #fdd; } .tabs_table { width: 99%; } .name1 { } .name2 { } a:hover .name1, a:hover .name2 { color: #f00; font-weight: bold; font-size: 12px; } a:hover .nameZoom { color: #f00; font-size: 16px; font-weight: bold; } .details2 { font-size: 12px; } .nameZoom { color: #333; font-size: 16px; font-weight: bold; } .details_label { font-weight: bold; } .name_head { color: #333; font-size: 16px; font-weight: bold; line-height: 2; padding: 0 5px; } .date { color: #333; } .label { font-weight: bold; } .error { font-weight: bold; } .largeError { color: #d00; font-size: large; font-weight: bold; } .warning { color: #f00; font-weight: bold; } .indent { padding-left: 7px; } .image { height: 150px; padding: 5px; margin: 2px; } .gender_image { margin: 0 3px; border: 0; vertical-align: middle; } .thumbnail { height: auto; padding: 3px; } .icon { border: 0; padding: 0 5px; } .sublinks_cell { background-color: #9be; font-size: 12px; } .submenu .icon { vertical-align: middle; width: 20px; height: 20px; } .subheaders { font-weight: bold; font-size: 15px; margin-top: 15px; vertical-align: bottom; } #family-table .subheaders:first-child { width: 285px; } .parentdeath { border: thin solid #888; padding: 1px; } .source_citations { display: none; } .selected-option { background-color: #edf7fd; } .border1 { border: solid #000 1px; } .menuitem { text-decoration: none; font-size: 11px; padding: 1px; } .menuitem_hover { text-decoration: none; font-size: 11px; padding: 1px; } .menuitem .icon, .menuitem_hover .icon { width: 50px; height: 50px; } .submenu { text-decoration: none; font-size: 11px; background-color: #fff; border: solid #ccc 1px; visibility: hidden; position: absolute; padding: 5px; } .submenuitem { vertical-align: middle; font-size: 11px; height: 20px; text-decoration: none; background-color: #fff; padding: 1px; white-space: nowrap; } .submenuitem_hover { vertical-align: middle; height: 20px; font-size: 11px; background-color: #fff; border: 1px solid #ccc; white-space: nowrap; padding: 1px; } .submenuitem a, .submenuitem_hover a { display: inline-block; vertical-align: middle; } .journal_box { padding: 3pt; border: thin solid #aaa; overflow: visible; } .news_box { border-top: solid #ccc 1px; } .news_title { font-weight: bold; } .news_date { margin-bottom: 12px; } .current_day { font-weight: bold; font-size: 16px; } .cal_day { float: left; font-weight: bold; } .rtl_cal_day { direction: rtl; float: right; color: #00f; font-weight: bold; } .helpcontent { margin-left: 10px; margin-right: 10px; } .helpcontent dt { clear: both; } #user-page h1 { margin: 0.25em auto 0.6em; } .tvertline { vertical-align: bottom; } #childbox { padding: 5px; position: absolute; display: none; text-align: start; white-space: nowrap; top: 20px; left: 0; } .layout3 #childbox { top: auto; bottom: 20px; } #childbox a.name1 { display: block; margin-left: 5px; } .person0 { background-color: #ddf; border: outset #999 1px; vertical-align: top; } .person1 { background-color: #afa; border: outset #afa 1px; vertical-align: top; } .person2 { background-color: #faa; border: outset #faa 1px; vertical-align: top; } .person3 { background-color: #aad; border: outset #55f 1px; vertical-align: top; } .person4 { background-color: #f55; border: outset #f55 1px; vertical-align: top; } .person5 { background-color: #5f5; border: outset #5f5 1px; vertical-align: top; } .listlog { line-height: 20pt; } .starredname { text-decoration: underline; } .search_hit { background-color: #ff0; } .search_item { font-weight: 600; } .descriptionbox { font-size: 1rem; color: #333; border: 1px solid #999; vertical-align: top; padding: 3px; } .optionbox { font-size: 1rem; color: #333; border: 1px solid #999; vertical-align: top; white-space: nowrap; padding: 3px; } .optionbox .list_value { background-color: #fff; border: 1px solid #999; border-radius: 3px; } .vmiddle { vertical-align: middle; } .red { color: #f00; } .wt-relation-fact, .wt-historic-fact { opacity: 0.8; } .messagebox { background-color: #c2ceef; border: solid #ccc 1px; } /* ---Pending edits--- */ .new { outline: solid blue 1px; } .old { outline: solid red 1px; } .tag_cloud { text-align: center; } .tag_cloud a { white-space: nowrap; } .nowrap { white-space: nowrap; } .wrap { white-space: normal; } .statistics-page { text-align: center; } .center2 { text-align: center; } .gchart { border: solid #999 1px; } /* ---Find special characters--- */ .largechars { font-family: monospace; font-size: 200%; } #facts_content dd { float: left; width: 70%; } .clearfloat { clear: both; } /* this keeps the tag color the same when it is a link as when not */ .place { padding-top: 5px; } #pending h2 { text-align: center; margin-bottom: 20px; } #pending h3 { text-align: center; margin-top: 20px; } #pending .list_value { padding: 3px; text-align: center; vertical-align: middle; white-space: nowrap; } #pending .indent { padding: 0; } /* ======== Person box ======= */ /* Box styles are 0 compact view 1 normal view - small box 2 normal view - large box */ .box-style0 { cursor: url(colors/images/zoomin.png), n-resize; } .box-style0-expanded { cursor: url(colors/images/zoomout.png), n-resize; } .person_box_template .namedef i[class^="icon-sex"] { margin-left: 3px; } .person_box_template .icons { } .person_box_template .inout { clear: both; display: none; } .person_box_template img, .person_box_template a.gallery { float: left; height: 50px; margin: 0 3px 0 0; max-width: 60px; width: auto; } .person_box_template i[class^="icon-silhouette"] { float: left; } /* --- reportengine.php --- */ #reportengine-page table { margin: 20px auto; } #reportengine-page .report-type { overflow: hidden; margin: auto; width: 180px; } #reportengine-page .report-type div { float: left; margin: 0 20px; } #reportengine-page .report-type p { margin: 0; text-align: center; } /* styles for popup menus */ .itr { position: absolute; line-height: 1.5; } .popup { position: absolute; top: 21px; right: 0; left: auto; visibility: hidden; opacity: 0; transition: visibility 0s ease .25s,opacity .25s ease; z-index: 9999; box-shadow: 5px 5px 5px 0 rgba(0,0,0,.4); } .popup ul { white-space: nowrap; list-style: none; margin: 0; padding: 0 10px; } .popup > ul { padding: 2px 10px; } .popup li .NAME { padding: 0 5px; } .itr:hover .popup { visibility: visible; opacity: 1; transition-delay: 0s; } /* styles for FindFacts pop-up */ #layDefinedTags, #tabDefinedTagsShow { width: 450px; } #tabDefinedTags { width: 430px; } #layDefinedTags { margin-left: auto; margin-right: auto; height: 285px; overflow: auto; } #tabDefinedTags { border-collapse: collapse; } #tabDefinedTags th, #tabDefinedTags td { border: solid 1px #000; margin: 0; padding: 3px; } #tabDefinedTags tbody th { text-align: left; font-weight: bold; } #tabDefinedTags tr.sel { background-color: #d1d9ef; color: #888; } #tabDefinedTags tr.unsel { background-color: #fff; color: #888; } #tabDefinedTagsShow { margin-left: auto; margin-right: auto; } #tabDefinedTagsShow td { width: 50%; text-align: center; } #tabFilterAndCustom { margin-left: auto; margin-right: auto; } #tabAction { margin-left: auto; margin-right: auto; } #tabAction td { width: 50%; text-align: center; } /* ======== List styles ====== */ .surname-list, .givn-list { margin: 5px auto; } .source-list table, .note-list table, .repo-list table, .media-list table, .indi-list table, .fam-list table { width: 100%; } .source-list td, .note-list td, .repo-list td, .media-list td, .indi-list td, .fam-list td, .recent_changes_block td, .upcoming_events_block td, .surname-list td, .givn-list td { padding: 2px 5px; } .surname-list td { vertical-align: top; } .indi-list .stats, .fam-list .stats { margin: 0 auto; width: auto; } .source-list th, .note-list th, .repo-list th, .media-list th, .indi-list th, .fam-list th, .wt-table-changes th, .wt-table-events th, .wt-table-tasks th, .wt-table-yahrzeits th, .surname-list th, .givn-list th { cursor: pointer; font-weight: 600; padding: 2px 4px; white-space: nowrap; } .source-list th:last-child, .note-list th:last-child, .repo-list th:last-child { margin: 0 -2px 1px 1px; padding: 3px 0 4px; width: 24px; } .givn-list th { cursor: pointer; white-space: nowrap; padding: 2px; text-align: center; } #source-details h2, #sourcelist-page h2, #note-details h2, #notelist-page h2, #repo-details h2, #repolist-page h2, #media-details h2, #statistics-page h2 { margin-bottom: 20px; text-align: center; } #source-edit, #note-edit, #repo-edit, #media-edit { overflow-x: auto; } .media-list td img { display: block; height: 40px; width: auto; margin: 3px auto; } .filtersH, .filtersF { margin: 4px; } .filtersH img { margin-bottom: 2px; } .list-charts { text-align: center; } #search-result-tabs h3 { text-align: center; } #searchAccordion-indi, #searchAccordion-fam, #searchAccordion-source, #searchAccordion-note { margin: auto; width: 99%; } #place-hierarchy h2, #place-hierarchy h4 { text-align: center; } #main_select, #available_select, #right_select { min-width: 150px; } /* ==== Favourites block ===== */ .blockcontent .person_box_template .details2 { min-height: 40px; } .blockcontent [class*='box-style2'] { margin: 5px 0; } .add_fav_head { font-weight: 900; margin: 5px 0; } .add_fav_head i { margin: 0 5px 1px; } .add_fav_ref label { display: inline-block; min-width: 100px; } .add_fav_ref input { margin: 0 5px; } /* === Who is online block === */ .logged_in_list { margin: 5px 0 0; padding: 0; line-height: 20px; } /* ==== Theme select block === */ .theme_form ul { margin: -10px auto; } .theme_form li { visibility: hidden; } .theme_form li ul li { display: inline-block; padding: 10px; visibility: visible; } /* ==== FAQ table styles ===== */ table.faq { background-color: #e0e0e0; margin: 5px 0 50px 5px; width: 98%; } table.faq tr:nth-child(odd) td { background-color: #e7eef3; } div.faq_title { background-color: #e0e0e0; margin: 1em 0; padding: .25em; font-weight: bold; width: 98%; } div.faq_body { clear: both; padding: 0 1em; } .faq_top { float: right; } /* === Positioning edit, copy, delete links === */ /* General use */ .editfacts { clear: left; padding-top: 15px; } /* ======== Indi header ====== */ #indi_header { overflow: hidden; margin: 0 0 5px; } #indi_header h3 { color: #555; font-size: 90%; font-weight: bold; margin: 0; padding: 0 10px 0 30px; text-align: left; overflow: hidden; position: relative; } #indi_header .name_one { font-size: 1.5em; } #indi_header h3 .details1 { font-size: 1.0em; } #indi_header h3.person_box, #indi_header h3.person_boxF, #indi_header h3.person_boxNN { border: 1px solid #999; } #indi_header h3 .header_age { padding: 5px 0 5px 5px; float: right; font-weight: normal; font-size: 65%; } #indi_header h3 a { display: inline; } #indi_header a { color: #337; font-size: 0.75em; font-weight: normal; } #indi_header a:hover { color: #f00; } #indi_mainimage { float: left; padding: 0 2px; } #header_accordion1 { padding: 0; overflow: hidden; } #header_accordion1 .indi_name_details { margin: 0; overflow: hidden; padding: 5px; } .indi_name_details .name1 { font-weight: normal; padding-top: 5px; font-size: inherit; } #indi_header a.warning { color: #f00; font-size: 1em; } #indi_note { margin: 0 0 5px; } .indi_table { clear: left; } #sex { float: right; } #dates { float: right; } #individual-names .wt-icon-edit, #individual-names .wt-icon-delete { float: right; } #indi_note .fact_NOTE { float: left; margin: 0 5px 0 0; } #indi_note .fact_SOUR { margin: 3px 0; } #indi_note .fact_SOUR a { font-size: 100%; } #indi_note .fact_NOTE, #indi_note .fact_SOUR { clear: both; } /* ===== markdown formatting ===== */ .markdown { /* Tables and pre-formatted text can break the layout. */ overflow-x: auto; } .markdown p { margin: 0 0 0.5em; white-space: pre-wrap; } .markdown table { border-collapse: collapse; margin-bottom: 5px; } .markdown th { font-weight: bold; } .markdown td, .markdown th { border: solid thin #000; padding: 3px; } .odometer { font-family: courier, monospace; font-weight: bold; background: #000; color: #fff; } /* ======= General sprite ==== */ .male_gender, .female_gender, .unknown_gender { display: block; background: url(colors/images/general_sprite.png) no-repeat left 0; } .female_gender { background-position: -45px 3px; width: 24px; height: 30px; } .male_gender { background-position: -72px 3px; width: 24px; height: 30px; } .unknown_gender { background-position: -100px 4px; width: 24px; height: 30px; } /* ======== Indi tabs ======== */ /* Facts & Events tab */ #personal_facts_content .fact_NOTE, #personal_facts_content .fact_SOUR, #family-table .fact_NOTE, #family-table .fact_SOUR { margin: 5px 3px 5px 0; clear: both; } .media-display-image { float: left; } .media-display-title { float: left; font-style: italic; margin: 10px; } /* === jQuery.datatable styling general over-rides === */ .odd { background-color: lightgray; } .even { background-color: #fafafa; } .css_right { float: left; } .fg-button { padding: 2px 6px; } .dataTables_paginate { float: left; margin-bottom: 3px; } .dataTables_processing { float: left; } .dataTables_filter { float: right; font-weight: normal; } .dataTables_info { float: left; font-weight: normal; padding: 4px; } .dataTables_length { float: right; font-weight: normal; } .dataTables_length select, .dataTables_filter input { font-size: 11px; padding: 1px; } .dt-clear { clear: both; } #loading { text-align: center; } .DataTables_sort_wrapper { position: relative; margin: 0 20px; white-space: normal; } .DataTables_sort_wrapper span { left: 0; margin-left: -20px; margin-top: -8px; position: absolute; top: 50%; } .dataTables_wrapper { margin-bottom: 10px; } /* ======= Sidebar setup ===== */ #main { min-width: 600px; width: 100%; display: table; table-layout: fixed; } #indi_left { display: table-cell; } #tabs { background-color: #fff; width: 100%; overflow: visible; padding-top: 0.2em; } /* sidebar */ #sidebar { width: 20%; display: table-cell; vertical-align: top; } /* Sidebar - Family navigator */ .wt-family-navigator-dropdown-heading { font-weight: bold; font-size: inherit; color: inherit; } /* Sidebar - Descendants */ #sb_content_descendancy { margin-top: 2px; } #sb_desc_content { margin-left: 3px; font-size: 0.8em; } #sb_desc_content ul { padding: 0; margin: 0; } .sb_desc_indi_li { list-style-type: none; } .desc_tree_div { display: none; } .desc_tree_div ul { padding: 0; margin-left: 10px; margin-top: 0; margin-right: 0; } /* Individuals and Families */ #sidebar-content-individuals, #sidebar-content-families { margin-top: 2px; } .sb_indi_surname_li, .sb_fam_surname_li { list-style-image: url(colors/images/plus.png); } .name_tree_div ul { padding: 0; margin: 0; } .name_tree_div li { list-style: none; margin: 0; padding: 0; } /* Clippings */ #sb_clippings_content ul { padding: 0; margin: 0; } #sb_clippings_content li { list-style: none; margin: 0; padding: 0; white-space: nowrap; } /* Extra info */ #sb_content_extra_info { font-size: 80%; font-weight: bold; margin-top: 1px; overflow: hidden; padding: 5px; } #sb_content_extra_info .editfacts { float: right; margin-top: -30px; } #sb_content_extra_info a { display: block; } #sb_content_extra_info span { font-weight: normal; } #sb_content_extra_info span a { display: inline; } #sb_content_extra_info #hitcounter { border-top: 1px solid #b2c7d7; font-weight: bold; padding-top: 5px; } /* http://www.jacklmoore.com/colorbox */ #colorbox, #cboxOverlay, #cboxWrapper { position: absolute; top: 0; left: 0; z-index: 9999; overflow: hidden; } #cboxWrapper { max-width: none; } #cboxOverlay { position: fixed; width: 100%; height: 100%; background: #fff; } #cboxContent { background: #fff; overflow: hidden; position: relative; padding: 0.5rem; border: 0.25rem solid #ccc; } #cboxLoadingOverlay, #cboxLoadingGraphic { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .cboxPhoto { float: left; margin: auto; border: 0; display: block; max-width: none; } #colorbox, #cboxContent, #cboxLoadedContent { box-sizing: content-box; } #cboxError { padding: 50px; border: 1px solid #ccc; } #cboxLoadedContent { margin-bottom: 28px; } #cboxTitle { background: #fff; position: absolute; bottom: 0.25rem; left: 0; margin: 0 3rem; text-align: center; } #cboxLoadingGraphic { background: url(images/loading-32x32.gif) no-repeat center center; } #cboxPrevious, #cboxNext, #cboxSlideshow, #cboxClose { background: none; border: 0; cursor: pointer; font-family: "Font Awesome\ 5 Free", sans-serif; font-weight: 900; overflow: visible; padding: 0; position: absolute; } #cboxSlideshow { bottom: 0.25rem; right: 0.25rem; } #cboxPrevious { bottom: 0.25rem; left: 0.25rem; } #cboxNext { bottom: 0.25rem; left: 1.5rem; } #cboxClose { top: 0.25rem; right: 0.25rem; } /* Stories module */ .story_title { padding-top: 12px; font-size: 13px; height: 32px; font-weight: bold; } .story_body { padding: 20px; white-space: normal; } .story_edit { padding: 12px; } /* ====== Charts Styles ======== */ #people label { display:block; } /* Ancestry chart */ .wt-ancestors-chart-list { background: transparent url(images/vline.png) left top repeat-y; margin: 0 0 0 15px; padding: 0; display: block; } .wt-ancestors-chart-list-item { margin: 5px 0; } .chart_common li { list-style: outside none none; } .generations { background: transparent url(images/vline.png) repeat-y scroll left top; display: block; margin: 0 0 0 15px; padding: 0; } [dir="rtl"] .generations { margin: 0 15px 0 0; background-position: right top; } .chart_common table { padding: 0; border-spacing: 0; border-collapse: collapse; margin: 5px 0; } .chart_common td { border: 0; padding: 0; } .chart_common span.details1 div[class^=fact_] { display: inline-block; } .chart_common span.details1 .date { color: inherit; } /*-- Family book --*/ #familybook_chart { margin-left: 10px; } #familybook_chart table { border-collapse: collapse; empty-cells: show; } #familybook_chart td { margin: 0; padding: 0; } #familybook_chart h2 { text-align: center; } #familybook_chart .line3, #familybook_chart .pvline, #familybook_chart .spacer { width: 3px; } #familybook_chart .line4 { width: 7px; vertical-align: middle; } [ID^="vline"] { width: 3px; } #familybook_chart h3 { color: #333; font-size: 16px; text-align: center; } /*-- Fan chart ---- */ .fan_chart_menu { position: absolute; display: none; z-index: 100; } #fan_chart ul { list-style-type: none; margin: 0; } /* Lifespans chart */ .wt-lifespans-subtitle { text-align: center; } .wt-lifespans-scale { white-space: nowrap; } .wt-lifespans-decade { width: 70px; height: 60px; display: inline-block; background-image: url(images/lifespan-decade.png); background-position-y: bottom; background-repeat: no-repeat; background-size: 70px 37px; } .wt-lifespans-individuals { background: #fafafa; } .wt-lifespans-individual { } .wt-lifespans-summary { background: #ffffff; border: thin solid #000; z-index: 1; } .wt-lifespans-summary-link { font-weight: bold; } /*-- Pedigree ---- */ #pedigree_chart { position: relative; margin: 20px auto; } #pedigree_canvas { color: #81a9cb; z-index: -1000; } #pedigree-page .shadow { position: absolute; white-space: nowrap; } #pedigree-page .layout0 .shadow > div, #pedigree-page .layout1 .shadow > div { display: inline-block; vertical-align: middle; } #pedigree-page .spacer { background-image: url(images/spacer.png); height: 20px; width: 1px; } #childarrow, .ancestorarrow { text-align: center; } #pedigree-page #childarrow { position: relative; } #pedigree-page #childbox { border: 1px solid; background-color: #fff; } #pedigree-page table.list_table { margin: 0 auto; width: 500px; } .pedigree_chart_table { border: 0; border-collapse: collapse; padding: 0; width: 100%; } /*-- timeline --*/ #timeline_chart { position: relative; top: 0; left: 0; } #field_table { width: 30%; min-width: 500px; border: 1px solid #ddd; } /* ====== Common Icons ========= */ [class^="icon-"], [class*=" icon-"] { display: inline-block; vertical-align: middle; background-repeat: no-repeat; } .icon-add { width: 14px; height: 15px; background-image: url(images/add.png); } .icon-cfamily { width: 32px; height: 32px; background-image: url(colors/images/cfamily.png); } .icon-childless { width: 25px; height: 25px; background-image: url(colors/images/childless.png); } .icon-children { width: 16px; height: 16px; background-image: url(colors/images/children.png); } .icon-clippings { width: 32px; height: 32px; background-image: url(colors/images/clippings.png); } .icon-edit_indi { width: 22px; height: 22px; background-image: url(colors/images/edit_indi.png); } .icon-fam-list { width: 32px; height: 32px; background-image: url(colors/images/sfamily.png); } .icon-indi-list { width: 32px; height: 32px; background-image: url(colors/images/indis.png); } .icon-loading-small { width: 16px; height: 16px; background-image: url(colors/images/indicator.gif); } .icon-media { width: 32px; height: 32px; background-image: url(colors/images/media.png); } .icon-media-list { width: 32px; height: 32px; background-image: url(colors/images/media.png); } .icon-media-next { width: 20px; height: 20px; background-image: url(colors/images/rdarrow.png); } .icon-media-play { width: 20px; height: 20px; background-image: url(colors/images/rarrow.png); } .icon-media-stop { width: 20px; height: 20px; background-image: url(colors/images/stop.png); } .icon-minus { width: 11px; height: 11px; background-image: url(colors/images/minus.png); } .icon-mypage { width: 22px; height: 25px; background-image: url(colors/images/mypage.png); } .icon-note { width: 33px; height: 35px; background-image: url(colors/icons/note.png); } .icon-plus { width: 11px; height: 11px; background-image: url(colors/images/plus.png); } .icon-reminder { width: 15px; height: 12px; background-image: url(colors/images/reminder.png); } .icon-remove { width: 16px; height: 16px; background-image: url(colors/images/delete.png); } .icon-resn-confidential { width: 16px; height: 16px; background-image: url(colors/images/resn_confidential.png); } .icon-resn-locked { width: 16px; height: 16px; background-image: url(colors/images/resn_locked.png); } .icon-resn-none { width: 16px; height: 16px; background-image: url(colors/images/resn_none.png); } .icon-resn-privacy { width: 16px; height: 16px; background-image: url(colors/images/resn_privacy.png); } .icon-rings { width: 9px; height: 9px; background-image: url(colors/images/rings.png); } .icon-selected { width: 12px; height: 12px; background-image: url(colors/images/selected.png); } .icon-source { width: 32px; height: 32px; background-image: url(colors/images/source.png); } .icon-warning { width: 17px; height: 17px; background-image: url(colors/images/warning.png); } .icon-zoomin { width: 25px; height: 25px; background-image: url(colors/images/zoomin.png); } .icon-zoomout { width: 25px; height: 25px; background-image: url(colors/images/zoomout.png); } /* Silhouettes on charts */ .icon-silhouette-F { width: 37px; height: 45px; background-image: url(colors/images/silhouette_female_small.png); } .icon-silhouette-M { width: 37px; height: 45px; background-image: url(colors/images/silhouette_male_small.png); } .icon-silhouette-U { width: 37px; height: 45px; background-image: url(colors/images/silhouette_unknown_small.png); } .wt-silhoutte { width: 200px; height: 260px; } .wt-silhoutte::before { content: url(colors/images/silhouette_unknown.png); } .wt-silhoutte-F::before { content: url(colors/images/silhouette_female.png); } .wt-silhouette-M::before { content: url(colors/images/silhouette_male.png); } /* * Any element that is loaded dynamically has the class wt-ajax-load. * We can provide a "loading" placeholder for empty elements with this class. */ .wt-ajax-load:empty { height: 32px; background: url(images/loading-32x32.gif) no-repeat 50% 50%; } /* Default icons are provided by FontAwesome. */ .wt-icon-sex-f { content: url(images/sex-F.png); } .wt-icon-sex-m { content: url(images/sex-M.png); } .wt-icon-sex-u { content: url(images/sex-U.png); } .wt-icon-sex-x { content: url(images/sex-U.png); } /* * .wt-icon-arrow-down * .wt-icon-arrow-end (right on LTR, left on RTL) * .wt-icon-arrow-start (left on LTR, right on RTL) * .wt-icon-arrow-up * .wt-icon-bing-maps * .wt-icon-calendar * .wt-icon-copy * .wt-icon-delete * .wt-icon-edit * .wt-icon-email * .wt-icon-family * .wt-icon-help * .wt-icon-individual * .wt-icon-google-maps * .wt-icon-keyboard * .wt-icon-media * .wt-icon-note * .wt-icon-openstreetmap * .wt-icon-preferences * .wt-icon-repository * .wt-icon-source * .wt-icon-submitter */ .wt-icon-arrow-down::before { width: 20px; height: 20px; content: url(colors/icons/arrow-down.png); } a > .wt-icon-arrow-down:hover::before { width: 20px; height: 20px; content: url(colors/icons/arrow-down-hover.png); } .wt-icon-arrow-end::before { width: 20px; height: 20px; content: url(colors/icons/arrow-right.png); } a > .wt-icon-arrow-end:hover::before { width: 20px; height: 20px; content: url(colors/icons/arrow-right-hover.png); } .wt-icon-arrow-start::before { width: 20px; height: 20px; content: url(colors/icons/arrow-left.png); } a > .wt-icon-arrow-start:hover::before { width: 20px; height: 20px; content: url(colors/icons/arrow-left-hover.png); } .wt-icon-arrow-up::before { width: 20px; height: 20px; content: url(colors/icons/arrow-up.png); } a > .wt-icon-arrow-up:hover::before { width: 20px; height: 20px; content: url(colors/icons/arrow-up-hover.png); } .wt-icon-bing-maps::before { width: 16px; height: 16px; content: url(colors/icons/bing-maps.png); } .wt-icon-calendar::before { width: 19px; height: 15px; content: url(colors/icons/calendar.png) } .wt-icon-coordinates::before { width: 16px; height: 16px; content: url(colors/icons/coordinates.png) } .wt-icon-copy::before { width: 16px; height: 16px; content: url(colors/icons/copy.png) } .wt-icon-delete::before { width: 16px; height: 16px; content: url(colors/icons/delete.png); } .wt-icon-edit::before { width: 16px; height: 16px; content: url(colors/icons/edit.png); } .wt-icon-family::before { width: 14px; height: 15px; content: url(colors/icons/family.png); } .wt-icon-help::before { width: 16px; height: 16px; content: url(colors/icons/help.png); } .wt-icon-google-maps::before { width: 16px; height: 16px; content: url(colors/icons/google-maps.png); } .wt-icon-individual::before { width: 11px; height: 15px; content: url(colors/icons/individual.png); } .wt-icon-keyboard::before { width: 30px; height: 15px; content: url(colors/icons/keyboard.png); } .wt-icon-media::before { width: 18px; height: 16px; content: url(colors/icons/media.png); } .wt-icon-note::before { width: 20px; height: 20px; content: url(colors/icons/note.png); } .wt-icon-openstreetmap::before { width: 16px; height: 16px; content: url(colors/icons/openstreetmap.png); } .wt-icon-preferences::before { width: 25px; height: 25px; content: url(colors/icons/preferences.png); } .wt-icon-repository::before { width: 15px; height: 15px; content: url(colors/icons/repository.png); } .wt-icon-source::before { width: 18px; height: 16px; content: url(colors/icons/source.png); } .wt-icon-submitter::before { width: 11px; height: 15px; content: url(colors/icons/individual.png); } i[class*="wt-icon-media"] { opacity: 0.5; } .icon-indis { width: 25px; height: 25px; background-image: url(colors/images/mypage.png); } .icon-patriarch { width: 20px; height: 20px; background-image: url(colors/images/patriarch.png); } .icon-pedigree { width: 25px; height: 25px; background-image: url(colors/images/pedigree.png); } .icon-place { width: 20px; height: 20px; background-image: url(colors/images/place.png); } .icon-repo-list { width: 20px; height: 20px; background-image: url(colors/images/repository.png); } .icon-repository { width: 20px; height: 20px; background-image: url(colors/images/repository.png); } .icon-search { width: 17px; height: 17px; background-image: url(colors/images/search.png); } .icon-sfamily { width: 22px; height: 22px; background-image: url(colors/images/sfamily.png); } .icon-source-list { width: 20px; height: 20px; background-image: url(colors/images/source.png); } .icon-user_add { width: 25px; height: 25px; background-image: url(colors/images/user_add.png); } /* * Icons for file types * * Icons made by Zlatko Najdenovski * https://www.flaticon.com/packs/file-formats-3" * Creative Commons BY 3.0 */ .wt-mime { } .wt-mime-application-pdf { } .wt-mime-audio { } .wt-mime-text { } .wt-mime-text-html { } .wt-mime-video { }