xref: /webtrees/resources/css/minimal.css (revision a51456341d2020736a75d90c5bf22e4fc5e947c2)
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 minimal 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@import "_tab-relatives.css";
42
43/* Colors for chart boxes, etc. */
44:root {
45  --sex-f-fg: #888888;
46  --sex-m-fg: #888888;
47  --sex-u-fg: #888888;
48  --sex-f-bg: #ffffff;
49  --sex-m-bg: #ffffff;
50  --sex-u-bg: #ffffff;
51	--chart-line: solid gray thin;
52}
53
54/* Override Bootstrap formatting */
55.btn-link {
56	padding-left: 0.25rem;
57	padding-right: 0.25rem;
58}
59
60.table-given-name {
61    overflow-x: hidden;
62}
63
64.container-fluid {
65    padding-left: 5px;
66    padding-right: 5px;
67}
68
69table {
70	border-collapse: separate;
71}
72
73/*
74 * Pages have the following high-level structure:
75 *
76 * wt-global wt-theme-<THEME> wt-route-<ROUTE>
77 * +---wt-header-wrapper
78 * |   +---wt-header-container
79 * |       +---wt-header-content
80 * |           +---wt-accessibility-links
81 * |           +---wt-site-logo
82 * |           +---wt-site-title
83 * |           +---wt-header-search
84 * |           |   +---wt-header-search-form
85 * |           |       +---wt-header-search-field
86 * |           |       +---wt-header-search-button
87 * |           +---wt-secondary-navigation
88 * |           |   +---wt-user-menu
89 * |           +---wt-primary-navigation
90 * |               +---wt-genealogy-menu
91 * +---wt-main-wrapper
92 * |   +---wt-main-container
93 * |       +---wt-main-content
94 * |           +---wt-messages
95 * |           +---wt-page-title
96 * |           +---wt-page-options wt-page-options-xxxxx
97 * |           +---wt-page-content
98 * +---wt-footers
99 *     +---wt-footer wt-footer-contact
100 *     +---wt-footer wt-footer-cookies
101 *     +---wt-footer wt-footer-page-views
102 *     +---wt-footer wt-footer-powered-by
103 */
104
105.wt-global {
106	/* Avoid extremes of black and white.  It is better for users with dyslexia. */
107	color: #0a0a0a;
108	background-color: #f9f9f9;
109}
110
111.wt-header-wrapper {
112}
113
114.wt-header-container {
115	margin-top: 1rem;
116}
117
118.wt-header-content {
119}
120
121.wt-accessibility-links {
122}
123
124.wt-site-logo {
125	display: none;
126}
127
128.wt-site-title {
129	order: 1;
130	flex: 1 1 0;
131	font-size: 1.75rem;
132}
133
134.wt-header-search {
135	order: 3;
136	flex: 0 0 15rem;
137}
138
139.wt-header-search-form {
140}
141
142.wt-header-search-field {
143}
144
145.wt-header-search-button {
146}
147
148.wt-secondary-navigation {
149	order: 2;
150	flex: 0 0 0;
151	white-space: nowrap;
152}
153
154.wt-user-menu {
155	flex-wrap: nowrap;
156}
157
158.wt-user-menu .nav-link {
159	padding: 0.5rem;
160}
161
162.wt-primary-navigation {
163	order: 4;
164	/* Extend to full page width */
165	flex: 0 1 100vw;
166	max-width: 100vw;
167	/* Recalculate margins for content */
168	margin: 0 calc(50% - 50vw);
169	padding: 0 calc(50vw - 50%);
170	border-bottom: 2px solid #aaa;
171}
172
173.wt-genealogy-menu {
174	justify-content: center;
175}
176
177.wt-genealogy-menu .nav-link {
178	padding: 0.5rem;
179}
180
181.wt-main-container {
182	/* Space between the header/footer and the main content. */
183	padding-top: 1rem;
184	padding-bottom: 1rem;
185}
186
187.wt-main {
188}
189
190.wt-messages {
191}
192
193.wt-page-title {
194	text-align: center;
195}
196
197.wt-page-content {
198	margin-top: 1rem;
199}
200
201.wt-footers {
202}
203
204.wt-footer {
205}
206
207.wt-footer-contact {
208}
209
210.wt-footer-cookies {
211	background: #aaa;
212	color: #fff;
213	transition: height 0.5s;
214}
215
216.wt-footer-page-views {
217}
218
219.wt-footer-powered-by {
220}
221
222.wt-footer-powered-by-webtrees {
223}
224
225/*
226 * The tree/user home pages
227 *
228 * wt-home-page / wt-user-page
229 * +---wt-main-blocks
230 * |   +---wt-block, wt-block-AAA
231 * |   +---wt-block, wt-block-BBB
232 * |   +---wt-block, wt-block-CCC
233 * +---wt-side-blocks
234 *     +---wt-block, wt-block-XXX
235 *     +---wt-block, wt-block-YYY
236 *     +---wt-block, wt-block-ZZZ
237 *
238 * Each block as the structure
239 * wt-block, wt-block-XXX
240 * +---wt-block-header, wt-block-header-XXX
241 * +---wt-block-content, wt-block-content-XXX
242 */
243
244.wt-block {
245	border: solid #000 1px;
246}
247
248.wt-block-header {
249	background-color: #fff;
250}
251
252.wt-block-content {
253}
254
255.wt-block-content .list_table {
256	border-spacing: 1px;
257	border: solid #000 1px;
258	border-right: 0;
259}
260
261.wt-block-content .list_value,
262.wt-block-content .list_value_wrap {
263	border: 0;
264	border-top: solid #000 1px;
265	border-right: solid #000 1px;
266}
267
268/*
269 * The individual page.
270 *
271 * wt-route-individual
272 * +---wt-header-wrapper
273 */
274
275.wt-individual-silhouette {
276	content: url(images/individual-silhouette-unknown.png);
277}
278
279.wt-individual-silhouette-f {
280	content: url(images/individual-silhouette-female.png);
281}
282
283.wt-individual-silhouette-m {
284	content: url(images/individual-silhouette-male.png);
285}
286
287/*
288 * Chart-boxes are used to build the various charts.
289 * Each type of chart will set its own size and hide/show content.
290 *
291 * wt-chart-box
292 * +--- wt-chart-box-thumbnail
293 * +--- wt-chart-box-extra
294 *      +--- wt-chart-box-zoom
295 *           +--- wt-chart-box-icon
296 *           +--- wt-chart-box-dropdown wt-chart-box-zoom-dropdown
297 *      +--- wt-chart-box-links
298 *           +--- wt-chart-box-icon
299 *           +--- wt-chart-box-dropdown wt-chart-box-links-dropdown
300 * +--- wt-chart-box-name
301 * +--- wt-chart-box-lifespan
302 * +--- wt-chart-box-facts
303 *     +--- wt-chart-box-fact
304 */
305.wt-chart-box,
306.wt-chart-box-menu {
307	background: var(--sex-u-bg);
308	border: dashed var(--sex-u-fg) thin;
309}
310
311.wt-chart-box {
312	height: 5rem;
313	padding: 2px;
314	line-height: 1.1;
315}
316
317.wt-chart-box-f,
318.wt-chart-box-f .wt-chart-box-dropdown {
319	background: var(--sex-f-bg);
320	border: solid var(--sex-f-fg) thin;
321}
322
323.wt-chart-box-m,
324.wt-chart-box-m .wt-chart-box-dropdown {
325	background: var(--sex-m-bg);
326	border: solid var(--sex-m-fg) thin;
327}
328
329/*
330 * Calendar
331 *
332 * wt-calendar-page
333 */
334
335/*
336 * Reports
337 *
338 * wt-reports-page
339 */
340
341/*
342 * Search
343 *
344 * wt-search-page, wt-general-serach-page/wt-phonetic-search-page/wt-advanced-search-page/wt-search-replace-page
345 */
346
347/* ios on click workaround */
348/* ---Pending edits--- */
349.new {
350	outline: solid thin blue;
351}
352.old {
353	outline: solid thin red;
354}
355
356.list_value,
357.list_value_wrap {
358	border: solid #000 1px;
359	vertical-align: top;
360	padding: 4px;
361}
362
363/* ---Find special characters--- */
364
365.gedcom_favorites_block,
366.user_favorites_block {
367	overflow: visible !important;
368}
369
370.list_table {
371	margin: 0 auto;
372}
373
374#reportengine-page .report-type {
375	overflow: hidden;
376	margin: auto;
377	width: 180px;
378}
379
380#reportengine-page .report-type div {
381	float: left;
382	margin: 0 20px;
383}
384
385#reportengine-page .report-type p {
386	margin: 0;
387	text-align: center;
388}
389
390/* styles for popup menus */
391.itr {
392	position: absolute;
393	line-height: 1.5;
394}
395
396.popup {
397	position: absolute;
398	top: 20px;
399	right: 0;
400	left: auto;
401	visibility: hidden;
402	opacity: 0;
403	transition: visibility 0s ease .25s,opacity .25s ease;
404	z-index: 9999;
405	box-shadow: 5px 5px 5px 0 rgba(0,0,0,.4);
406}
407
408.popup ul {
409	white-space: nowrap;
410	list-style: none;
411	margin: 0;
412	padding: 0 10px;
413	font-size: smaller;
414}
415
416.popup > ul {
417	padding: 2px 10px;
418}
419
420.popup li .NAME {
421	padding: 0 5px;
422}
423
424.itr:hover .popup {
425	visibility: visible;
426	opacity: 1;
427	transition-delay: 0s;
428}
429
430/* styles for FindFacts pop-up */
431#layDefinedTags,
432#tabDefinedTagsShow {
433	width: 450px;
434}
435
436#tabDefinedTags {
437	width: 430px;
438}
439
440#layDefinedTags {
441	margin-left: auto;
442	margin-right: auto;
443	height: 285px;
444	overflow: auto;
445}
446
447#tabDefinedTags {
448	border-collapse: collapse;
449}
450
451#tabDefinedTags th,
452#tabDefinedTags td {
453	border: solid 1px #000;
454	margin: 0;
455	padding: 3px;
456}
457
458#tabDefinedTags tbody th {
459	text-align: left;
460	font-weight: bold;
461}
462
463#tabDefinedTags tr.sel {
464	background-color: #cde;
465	color: #888;
466}
467
468#tabDefinedTags tr.unsel {
469	background-color: #fff;
470	color: #888;
471}
472
473#tabDefinedTagsShow {
474	margin-left: auto;
475	margin-right: auto;
476}
477
478#tabDefinedTagsShow td {
479	width: 50%;
480	text-align: center;
481}
482
483#tabFilterAndCustom {
484	margin-left: auto;
485	margin-right: auto;
486}
487
488#tabAction {
489	margin-left: auto;
490	margin-right: auto;
491}
492
493#tabAction td {
494	width: 50%;
495	text-align: center;
496}
497
498/* ======== List styles ====== */
499.source-list,
500.note-list,
501.repo-list,
502.media-list,
503.indi-list,
504.fam-list {
505	margin: 5px auto;
506	width: 98%;
507}
508
509.recent_changes_block,
510.upcoming_events_block,
511.todays_events_block,
512.todo_block {
513	width: 98%;
514}
515
516.surname-list,
517.givn-list {
518	margin: 5px auto;
519}
520
521.source-list table,
522.note-list table,
523.repo-list table,
524.media-list table,
525.indi-list table,
526.fam-list table {
527	width: 100%;
528}
529
530.source-list td,
531.note-list td,
532.repo-list td,
533.media-list td,
534.indi-list td,
535.fam-list td,
536.recent_changes_block td,
537.upcoming_events_block td,
538.surname-list td,
539.givn-list td {
540	padding: 2px 5px;
541}
542
543.indi-list td,
544.fam-list td {
545	color: #555;
546}
547
548.surname-list td {
549	vertical-align: top;
550}
551
552.indi-list .stats,
553.fam-list .stats {
554	margin: 0 auto;
555	width: auto;
556}
557
558.source-list th,
559.note-list th,
560.repo-list th,
561.media-list th,
562.indi-list th,
563.fam-list th,
564.wt-table-changes th,
565.wt-table-events th,
566.wt-table-tasks th,
567.wt-table-yahrzeits th,
568.surname-list th,
569.givn-list th {
570	cursor: pointer;
571	font-weight: 600;
572	padding: 2px 4px;
573	white-space: nowrap;
574}
575
576.source-list th:last-child,
577.note-list th:last-child,
578.repo-list th:last-child {
579	margin: 0 -2px 1px 1px;
580	padding: 3px 0 4px;
581	width: 24px;
582}
583
584.givn-list th {
585	cursor: pointer;
586	white-space: nowrap;
587	padding: 2px;
588	text-align: center;
589}
590
591#source-details h2,
592#sourcelist-page h2,
593#note-details h2,
594#notelist-page h2,
595#repo-details h2,
596#repolist-page h2,
597#media-details h2,
598#statistics-page h2 {
599	margin-bottom: 20px;
600	text-align: center;
601}
602
603#source-tabs,
604#note-tabs,
605#repo-tabs,
606#media-tabs {
607	visibility: hidden;
608}
609
610#statistics_chart {
611	visibility: hidden;
612}
613
614#source-edit,
615#note-edit,
616#repo-edit,
617#media-edit {
618	overflow-x: auto;
619}
620
621.media-list td img {
622	display: block;
623	height: 40px;
624	width: auto;
625	margin: 3px auto;
626}
627
628.filtersH,
629.filtersF {
630	margin: 4px;
631}
632
633.filtersH img {
634	margin-bottom: 2px;
635}
636
637.list-charts {
638	text-align: center;
639}
640
641#search-result-tabs,
642#places-tabs {
643	margin: auto;
644	width: 98%;
645	visibility: hidden;
646}
647
648#search-result-tabs h3 {
649	text-align: center;
650}
651
652#searchAccordion-indi,
653#searchAccordion-fam,
654#searchAccordion-source,
655#searchAccordion-note {
656	margin: auto;
657	width: 99%;
658}
659
660#place-hierarchy h2,
661#place-hierarchy h4 {
662	text-align: center;
663}
664
665/* ======== Block styles ===== */
666#index_main_blocks {
667	clear: none;
668	width: 60%;
669	float: left;
670}
671
672#index_small_blocks {
673	clear: none;
674	width: 40%;
675	float: right;
676}
677
678#index_full_blocks {
679	clear: none;
680	width: 100%;
681}
682
683.block {
684	background-color: #fff;
685	color: #555;
686	border: solid #ccc 1px;
687	padding: 3px;
688	vertical-align: top;
689}
690
691.blockcontent {
692	margin: 5px;
693	overflow: auto;
694}
695
696.blockcontent .list_table {
697	border-spacing: 0;
698	border: solid #555 1px;
699	border-right: 0;
700}
701
702.blockcontent .list_value,
703.blockcontent .list_value_wrap {
704	border: 0;
705	border-top: solid #555 1px;
706	border-right: solid #555 1px;
707}
708
709.blockheader {
710	font-weight: bold;
711}
712
713/* end Block styles */
714
715#main_select,
716#available_select,
717#right_select {
718	min-width: 150px;
719}
720
721.user_welcome_block table,
722.gedcom_block_block table {
723	margin: auto;
724}
725
726.user_welcome_block td,
727.gedcom_block_block td {
728	width: 33%;
729	text-align: center;
730	vertical-align: top;
731}
732
733.user_welcome_block i,
734.gedcom_block_block i {
735	background-image: none;
736	height: 0;
737	width: 0;
738}
739
740/* ==== Favourites block ===== */
741.add_fav_head {
742	font-weight: 900;
743	margin: 5px 0;
744}
745
746.add_fav_head i {
747	margin: 0 5px 1px;
748}
749
750.add_fav_ref label {
751	display: inline-block;
752	min-width: 100px;
753}
754
755.add_fav_ref input {
756	margin: 0 5px;
757}
758
759/* === Who is online block === */
760.logged_in_list {
761	margin: 5px 0 0;
762	padding: 0;
763	line-height: 20px;
764}
765
766/* Table of genealogical facts */
767
768.wt-facts-table caption {
769	caption-side: top;
770}
771
772.wt-facts-table th {
773	border: 1px solid #000;
774	font-weight: normal;
775	min-width: 20%;
776}
777
778.wt-facts-table td {
779	border: solid #000 1px;
780}
781
782a {
783	color: #333;
784	text-decoration: none;
785}
786
787a:hover {
788	color: #333;
789	text-decoration: underline;
790}
791
792a:hover {
793    text-decoration: underline!important;
794}
795
796.nameZoom {
797    font-size: 16px;
798    font-weight: bold;
799}
800
801/* ==== Theme select block === */
802.theme_form ul {
803	margin: -10px auto;
804}
805
806.theme_form li {
807	visibility: hidden;
808}
809
810.theme_form li ul li {
811	display: inline-block;
812	padding: 10px;
813	visibility: visible;
814}
815
816/* ==== FAQ table styles ===== */
817table.faq {
818	background-color: #ddd;
819	margin: 5px 0 50px 5px;
820	width: 98%;
821}
822
823table.faq tr:nth-child(odd) td {
824	background-color: #fff;
825}
826
827div.faq_title {
828	background-color: #ddd;
829	margin: 1em 0;
830	padding: .25em;
831	font-weight: bold;
832	width: 98%;
833}
834
835div.faq_body {
836	clear: both;
837	padding: 0 1em;
838}
839
840.faq_top {
841	float: right;
842}
843
844/* === Positioning edit, copy, delete links === */
845/* General use */
846.editfacts {
847	clear: left;
848	padding-top: 15px;
849}
850
851/* ======== Indi header ====== */
852#indi_header {
853	overflow: hidden;
854	margin: 0 4px 5px;
855	width: 98%;
856}
857
858#indi_header h3 {
859	color: #555;
860	font-size: 90%;
861	font-weight: bold;
862	margin: 0;
863	padding: 0 10px 0 30px;
864	text-align: left;
865	overflow: hidden;
866	position: relative;
867}
868
869#indi_header .name_one {
870	font-size: 1.5em;
871}
872
873#indi_header h3 .details1 {
874	font-size: 1.0em;
875	border: 1px solid #888;
876}
877
878#indi_header h3 .header_age {
879	padding: 5px 0 5px 5px;
880	color: #666;
881	float: right;
882	font-weight: normal;
883	font-size: 65%;
884}
885
886#indi_header h3 a {
887	display: inline;
888}
889
890#indi_header a {
891	font-weight: normal;
892}
893
894#indi_header a:hover {
895	color: #333;
896}
897
898#indi_mainimage {
899	float: right;
900}
901
902#header_accordion1 {
903	padding: 0 10px 0 0;
904	overflow: hidden;
905}
906
907#header_accordion1 .indi_name_details {
908	background: none #fff;
909	border: 0;
910	margin: 0;
911	overflow: hidden;
912	padding: 5px;
913}
914
915.indi_name_details .name1 {
916	font-weight: normal;
917	padding-top: 5px;
918	font-size: inherit;
919}
920
921#indi_header a.warning {
922	color: #f00;
923	font-size: 1em;
924}
925
926#indi_note {
927	margin: 0 0 5px;
928}
929
930.indi_table {
931	clear: left;
932}
933
934#sex {
935	float: right;
936}
937
938#dates {
939	color: #666;
940	float: right;
941}
942
943.label {
944	font-weight: bold;
945}
946
947#individual-names .wt-icon-edit,
948#individual-names .wt-icon-delete {
949	float: right;
950}
951
952#indi_note .fact_NOTE {
953	float: left;
954	margin: 0 5px 0 0;
955}
956
957#indi_note .fact_SOUR {
958	margin: 3px 0;
959}
960
961#indi_note .fact_SOUR a {
962	font-size: 100%;
963}
964
965#indi_note .fact_NOTE,
966#indi_note .fact_SOUR {
967	clear: both;
968}
969
970/* markdown formatting */
971
972.markdown {
973	/* Tables and pre-formatted text can break the layout. */
974	overflow-x: auto;
975}
976
977.markdown p {
978	margin: 0 0 0.5em;
979	white-space: pre-wrap;
980}
981
982.markdown table {
983	border-collapse: collapse;
984	font-size: 10px;
985	margin-bottom: 5px;
986}
987
988.markdown th {
989	font-weight: bold;
990}
991
992.markdown td,
993.markdown th {
994	border: solid thin #000;
995	padding: 3px;
996}
997
998.odometer {
999	font-family: courier, monospace;
1000	font-weight: bold;
1001	background: #000;
1002	color: #fff;
1003}
1004
1005/* ======== Indi tabs ======== */
1006/* Facts & Events tab */
1007#personal_facts_content .fact_NOTE,
1008#personal_facts_content .fact_SOUR,
1009#family-table .fact_NOTE,
1010#family-table .fact_SOUR {
1011	margin: 5px 3px 5px 0;
1012	clear: both;
1013}
1014
1015.media-display-image {
1016	float: left;
1017}
1018
1019.media-display-title {
1020	float: left;
1021	font-style: italic;
1022	margin: 10px;
1023}
1024
1025/* === jQuery.datatable styling general over-rides === */
1026.odd {
1027	background-color: #dcdcdc;
1028}
1029
1030.even {
1031	background-color: #fff;
1032}
1033
1034.css_right {
1035	float: left;
1036}
1037
1038.fg-button {
1039	padding: 2px 6px;
1040}
1041
1042.fg-toolbar {
1043	background-color: #fff;
1044	border-color: #aaa;
1045}
1046
1047.upcoming_events_block button,
1048.todays_events_block button {
1049	margin: 0 20px;
1050}
1051
1052/* Sidebar - Family navigator */
1053
1054/* Sidebar - Descendants */
1055#sb_content_descendancy {
1056	margin-top: 5px;
1057}
1058
1059#sb_desc_content {
1060	margin-left: 3px;
1061	font-size: 0.8em;
1062}
1063
1064#sb_desc_content ul {
1065	padding: 0;
1066	margin: 0;
1067}
1068
1069.sb_desc_indi_li {
1070	list-style-type: none;
1071}
1072
1073.desc_tree_div {
1074	display: none;
1075}
1076
1077.desc_tree_div ul {
1078	padding: 0;
1079	margin-left: 10px;
1080	margin-top: 0;
1081	margin-right: 0;
1082}
1083
1084/* Individuals and Families */
1085#sidebar-content-individuals,
1086#sidebar-content-families {
1087	margin-top: 5px;
1088}
1089
1090.sb_indi_surname_li,
1091.sb_fam_surname_li {
1092	list-style-image: url(minimal/images/plus.png);
1093}
1094
1095.name_tree_div ul {
1096	padding: 0;
1097	margin: 0;
1098}
1099
1100.name_tree_div li {
1101	list-style: none;
1102	margin: 0;
1103	padding: 0;
1104}
1105
1106/* Clippings */
1107#sb_clippings_content ul {
1108	padding: 0;
1109	margin: 0;
1110}
1111
1112#sb_clippings_content li {
1113	list-style: none;
1114	margin: 0;
1115	padding: 0;
1116	white-space: nowrap;
1117}
1118
1119/* Extra info */
1120#sb_content_extra_info {
1121	font-size: 80%;
1122	font-weight: bold;
1123	margin-top: 1px;
1124	overflow: hidden;
1125	padding: 5px;
1126}
1127
1128#sb_content_extra_info .editfacts {
1129	float: right;
1130	margin-top: -10px;
1131}
1132
1133#sb_content_extra_info a {
1134	display: block;
1135}
1136
1137#sb_content_extra_info span {
1138	font-weight: normal;
1139}
1140
1141#sb_content_extra_info span a {
1142	display: inline;
1143}
1144
1145#sb_content_extra_info #hitcounter {
1146	border-top: 1px solid #b2c7d7;
1147	font-weight: bold;
1148	padding-top: 5px;
1149}
1150
1151/* ===== Edit interface pop-ups ===== */
1152#edit_interface-page h4 {
1153	color: #555;
1154	margin: 5px;
1155}
1156
1157#edit_interface-page .optionbox span {
1158	margin: 0 5px;
1159}
1160
1161#edit_interface-page #LATI,
1162#edit_interface-page #LONG,
1163#edit_interface-page #SPFX,
1164#edit_interface-page #NSFX,
1165#edit_interface-page #NPFX {
1166	line-height: 18px;
1167	margin: 0 5px;
1168	width: 88px;
1169}
1170
1171#edit_interface-page #GIVN,
1172#edit_interface-page #SURN,
1173#edit_interface-page #_MARNM {
1174	line-height: 18px;
1175	margin: 0 5px;
1176	width: 180px;
1177}
1178
1179#edit_interface-page input[type="text"],
1180#edit_interface-page #NAME_display {
1181	line-height: 18px;
1182	margin: 0 5px;
1183	vertical-align: top;
1184	width: 240px;
1185}
1186
1187#edit_interface-page input[type="text"][id*="PAGE"],
1188#edit_interface-page input[type="text"][id*="_UID"] {
1189	width: 350px;
1190}
1191
1192#edit_interface-page input[type="text"][id*="SOUR"],
1193#edit_interface-page input[type="text"][id*="REPO"],
1194#edit_interface-page input[type="text"][id*="OBJE"],
1195#edit_interface-page input[type="text"][id*="FAMC"],
1196#edit_interface-page input[type="text"][id*="ASSO"],
1197#edit_interface-page input[type="text"][id^="AGE"],
1198#edit_interface-page input[type="text"][id*="SHARED_NOTE"] {
1199	width: 250px;
1200}
1201
1202#edit_interface-page input[type="text"][id$="DATE"] {
1203	width: 160px;
1204}
1205
1206#edit_interface-page input[type="text"][id*="OBJE_FILE"] {
1207	width: 200px;
1208}
1209
1210#edit_interface-page input[type="text"][id*="SOUR_TITL"] {
1211	width: 250px;
1212}
1213
1214#edit_interface-page input[id*="TEXT"] {
1215	height: 140px;
1216	width: 440px;
1217}
1218
1219#edit_interface-page textarea {
1220	margin: 0 5px;
1221	width: 440px;
1222}
1223
1224#edit_interface-page textarea[id*="NOTE"] {
1225	height: 240px;
1226}
1227
1228#edit_interface-page textarea[id*="TEXT"],
1229#edit_interface-page textarea[id*="PUBL"] {
1230	height: 140px;
1231}
1232
1233#edit_interface-page textarea[id^="newgedrec"] {
1234	line-height: 18px;
1235	width: 605px;
1236}
1237
1238#edit_interface-page textarea#gedcom {
1239	height: 364px;
1240}
1241
1242#edit_interface-page textarea[id*="ADDR"],
1243#edit_interface-page input[id*="ADDR"] {
1244	height: 80px;
1245	width: 300px;
1246}
1247
1248#edit_interface-page,
1249#addmedia-page {
1250	margin-bottom: 50px;
1251}
1252
1253/* ===== Addmedia pop-ups ===== */
1254#addmedia-page input[type="text"] {
1255	line-height: 18px;
1256	margin: 0 5px;
1257	width: 350px;
1258}
1259
1260#addmedia-page .optionbox select {
1261	margin: 0 5px;
1262}
1263
1264#addmedia-page .optionbox p.sub {
1265	margin: 0 5px;
1266	font-size: 11px;
1267}
1268
1269#addmedia-page input[type="text"][id*="PAGE"],
1270#addmedia-page input[type="text"][id*="_UID"] {
1271	width: 350px;
1272}
1273
1274#addmedia-page input[type="text"][id*="SOUR"],
1275#addmedia-page input[type="text"][id*="REPO"],
1276#addmedia-page input[type="text"][id*="OBJE"],
1277#addmedia-page input[type="text"][id*="FAMC"],
1278#addmedia-page input[type="text"][id*="ASSO"],
1279#addmedia-page input[type="text"][id^="AGE"],
1280#addmedia-page input[type="text"][id*="SHARED_NOTE"] {
1281	width: 70px;
1282}
1283
1284#addmedia-page input[id*="TEXT"] {
1285	height: 140px;
1286	width: 440px;
1287}
1288
1289#addmedia-page textarea {
1290	margin: 0 5px;
1291	width: 440px;
1292}
1293
1294#addmedia-page textarea[id*="NOTE"] {
1295	height: 240px;
1296}
1297
1298#addmedia-page textarea[id*="TEXT"],
1299#addmedia-page textarea[id*="PUBL"] {
1300	height: 140px;
1301}
1302
1303/* http://www.jacklmoore.com/colorbox */
1304#colorbox,
1305#cboxOverlay,
1306#cboxWrapper {
1307	position: absolute;
1308	top: 0;
1309	left: 0;
1310	z-index: 9999;
1311	overflow: hidden;
1312}
1313
1314#cboxWrapper {
1315	max-width: none;
1316}
1317
1318#cboxOverlay {
1319	position: fixed;
1320	width: 100%;
1321	height: 100%;
1322	background: #fff;
1323}
1324
1325#cboxContent {
1326	background: #fff;
1327	overflow: hidden;
1328	position: relative;
1329	padding: 0.5rem;
1330	border: 0.25rem solid #ccc;
1331}
1332
1333#cboxLoadingOverlay,
1334#cboxLoadingGraphic {
1335	position: absolute;
1336	top: 0;
1337	left: 0;
1338	width: 100%;
1339	height: 100%;
1340}
1341
1342.cboxPhoto {
1343	float: left;
1344	margin: auto;
1345	border: 0;
1346	display: block;
1347	max-width: none;
1348}
1349
1350#colorbox,
1351#cboxContent,
1352#cboxLoadedContent {
1353	box-sizing: content-box;
1354}
1355
1356#cboxError {
1357	padding: 50px;
1358	border: 1px solid #ccc;
1359}
1360
1361#cboxLoadedContent {
1362	margin-bottom: 28px;
1363}
1364
1365#cboxTitle {
1366	background: #fff;
1367	position: absolute;
1368	bottom: 0.25rem;
1369	left: 0;
1370	margin: 0 3rem;
1371	text-align: center;
1372}
1373
1374#cboxLoadingGraphic {
1375	background: url(images/loading-32x32.gif) no-repeat center center;
1376}
1377
1378#cboxPrevious, #cboxNext, #cboxSlideshow, #cboxClose {
1379	background: none;
1380	border: 0;
1381	cursor: pointer;
1382	font-family: "Font Awesome\ 5 Free", sans-serif;
1383	font-weight: 900;
1384	overflow: visible;
1385	padding: 0;
1386	position: absolute;
1387}
1388
1389#cboxSlideshow {
1390	bottom: 0.25rem;
1391	right: 0.25rem;
1392}
1393
1394#cboxPrevious {
1395	bottom: 0.25rem;
1396	left: 0.25rem;
1397}
1398
1399#cboxNext {
1400	bottom: 0.25rem;
1401	left: 1.5rem;
1402}
1403
1404#cboxClose {
1405	top: 0.25rem;
1406	right: 0.25rem;
1407}
1408
1409/* Stories module */
1410.story_title {
1411	padding-top: 12px;
1412	font-size: 13px;
1413	height: 32px;
1414	font-weight: bold;
1415}
1416
1417.story_body {
1418	padding: 20px;
1419	white-space: normal;
1420}
1421
1422.story_edit {
1423	padding: 12px;
1424}
1425
1426/* Stories module */
1427.story_title {
1428	padding-top: 12px;
1429	font-size: 13px;
1430	height: 32px;
1431	font-weight: bold;
1432}
1433
1434.story_body {
1435	padding: 20px;
1436	white-space: normal;
1437}
1438
1439.story_edit {
1440	padding: 12px;
1441}
1442
1443/* ====== Charts Styles ======== */
1444
1445#people label {
1446	display: block;
1447}
1448
1449/* Ancestry chart */
1450.wt-chart-ancestors-list {
1451	background: transparent url(images/vline.png) left top repeat-y;
1452	margin: 0 0 0 15px;
1453	padding: 0;
1454	display: block;
1455}
1456
1457.wt-chart-ancestors-list-item {
1458	margin: 5px 0;
1459}
1460
1461.chart_common li {
1462	list-style: outside none none;
1463}
1464
1465.generations {
1466	background: transparent url(images/vline.png) repeat-y scroll left top;
1467	display: block;
1468	margin: 0 0 0 15px;
1469	padding: 0;
1470}
1471
1472.chart_common table {
1473	padding: 0;
1474	border-spacing: 0;
1475	border-collapse: collapse;
1476	margin: 5px 0;
1477}
1478
1479.chart_common td {
1480	border: 0;
1481	padding: 0;
1482}
1483
1484.chart_common span.details1 div[class^=fact_] {
1485	display: inline-block;
1486}
1487
1488.chart_common span.details1 .date {
1489	color: inherit;
1490}
1491
1492/*-- Family book  --*/
1493#familybook_chart {
1494	margin-left: 10px;
1495}
1496
1497#familybook_chart table {
1498	border-collapse: collapse;
1499	empty-cells: show;
1500}
1501
1502#familybook_chart td {
1503	margin: 0;
1504	padding: 0;
1505}
1506
1507#familybook_chart h2 {
1508	text-align: center;
1509}
1510
1511#familybook_chart .line3,
1512#familybook_chart .pvline,
1513#familybook_chart .spacer {
1514	width: 3px;
1515}
1516
1517#familybook_chart .line4 {
1518	width: 7px;
1519	vertical-align: middle;
1520}
1521
1522[ID^="vline"] {
1523	width: 3px;
1524}
1525
1526#familybook_chart h3 {
1527	color: #006;
1528	font-size: 16px;
1529	text-align: center;
1530}
1531
1532/*-- Fan chart ---- */
1533.fan_chart_menu {
1534	position: absolute;
1535	display: none;
1536	z-index: 100;
1537}
1538
1539#fan_chart ul {
1540	list-style-type: none;
1541	margin: 0;
1542}
1543
1544/*-- Hourglass ---- */
1545#hourglass_chart img.line4 {
1546	vertical-align: middle;
1547}
1548
1549#hourglass_chart table,
1550.charts_block table {
1551	border-collapse: collapse;
1552}
1553
1554#hourglass_chart td,
1555.charts_block td {
1556	padding: 0;
1557	empty-cells: show;
1558}
1559
1560/* Lifespans chart */
1561.wt-lifespans-subtitle {
1562	text-align: center;
1563}
1564
1565.wt-lifespans-scale {
1566	white-space: nowrap;
1567}
1568
1569.wt-lifespans-decade {
1570	width: 70px;
1571	height: 60px;
1572	display: inline-block;
1573	background-image: url(images/lifespan-decade.png);
1574	background-position-y: bottom;
1575	background-repeat: no-repeat;
1576	background-size: 70px 37px;
1577}
1578
1579.wt-lifespans-individuals {
1580	background: #fafafa;
1581}
1582
1583.wt-lifespans-individual {
1584
1585}
1586
1587.wt-lifespans-summary {
1588	background: #ffffff;
1589	border: thin solid #000;
1590	z-index: 1;
1591}
1592
1593.wt-lifespans-summary-link {
1594	font-weight: bold;
1595}
1596
1597/*-- Pedigree ---- */
1598#pedigree_canvas {
1599	color:   #555;
1600}
1601
1602
1603.tvertline {
1604	vertical-align: bottom;
1605}
1606
1607.optionbox, .descriptionbox {
1608	border: solid #000 1px;
1609	vertical-align: top;
1610	padding: 3px;
1611}
1612
1613#childbox {
1614	padding: 5px;
1615	position: absolute;
1616	display: none;
1617	text-align: start;
1618	white-space: nowrap;
1619	top: 20px;
1620	left: 0;
1621}
1622
1623.layout3 #childbox {
1624	top: auto;
1625	bottom: 20px;
1626}
1627
1628#childbox a.name1 {
1629	display: block;
1630	margin-left: 5px;
1631}
1632
1633.person0, .person1, .person2, .person3, .person4, .person5 {
1634	border:outset #555 1px;
1635	vertical-align:top;
1636}
1637.person0{
1638	background-color:#eee;
1639}
1640
1641.person1{
1642	background-color:#bfbfbf;
1643}
1644
1645.person2{
1646	background-color:#999;
1647}
1648
1649.person3{
1650	background-color:#dfdfdf;
1651}
1652
1653.person4{
1654	background-color:#eee;
1655}
1656
1657.person5{
1658	background-color:#fefefe;
1659}
1660
1661/*-- Pedigree ---- */
1662#pedigree_chart {
1663	position: relative;
1664	margin: 20px auto;
1665}
1666
1667#pedigree_canvas {
1668	color:   #555;
1669	z-index: -1000;
1670}
1671
1672#pedigree-page .shadow {
1673	position: absolute;
1674	white-space: nowrap;
1675}
1676
1677#pedigree-page .layout0 .shadow > div,
1678#pedigree-page .layout1 .shadow > div {
1679	display: inline-block;
1680	vertical-align: middle;
1681}
1682
1683#pedigree-page .spacer {
1684	background-image: url(images/spacer.png);
1685	height: 20px;
1686	width: 1px;
1687}
1688
1689#childarrow,
1690.ancestorarrow {
1691	text-align: center;
1692}
1693
1694#pedigree-page #childarrow {
1695	position: relative;
1696}
1697
1698#pedigree-page #childbox {
1699	border: 1px solid;
1700	background-color: #fff;
1701}
1702
1703#pedigree-page table.list_table {
1704	margin: 0 auto;
1705	width: 500px;
1706}
1707
1708.pedigree_chart_table {
1709	border: 0;
1710	border-collapse: collapse;
1711	padding: 0;
1712	width: 100%;
1713}
1714
1715/*-- timeline  --*/
1716#timeline_chart {
1717	position: relative;
1718	top: 0;
1719	left: 0;
1720}
1721
1722/*
1723 * Any element that is loaded dynamically has the class wt-ajax-load.
1724 * We can provide a "loading" placeholder for empty elements with this class.
1725 */
1726.wt-ajax-load:empty {
1727	height: 32px;
1728	background: url(images/loading-32x32.gif) no-repeat 50% 50%;
1729}
1730
1731/*
1732 * Default icons are provided by FontAwesome.
1733 * Some icons get mirrored on RTL pages.  Typiclly arrows
1734 */
1735[dir=rtl] .wt-flip-rtl {
1736	transform: scale(-1, 1);
1737}
1738
1739.wt-icon-anniversary {
1740}
1741
1742.wt-icon-arrow-down {
1743}
1744
1745a > .wt-icon-arrow-down:hover {
1746}
1747
1748.wt-icon-arrow-left {
1749}
1750
1751a > .wt-icon-arrow-left:hover {
1752}
1753
1754.wt-icon-arrow-right {
1755}
1756
1757a > .wt-icon-arrow-right:hover {
1758}
1759
1760.wt-icon-arrow-up {
1761}
1762
1763a > .wt-icon-arrow-up:hover {
1764}
1765
1766.wt-icon-coordinates {
1767}
1768
1769.wt-icon-reorder {
1770}
1771
1772.wt-icon-sex-f {
1773	color: var(--sex-m-fg);
1774}
1775
1776.wt-icon-sex-m {
1777	color: var(--sex-m-fg);
1778}
1779
1780.wt-icon-sex-u {
1781	color: var(--sex-u-fg);
1782}
1783
1784.wt-icon-sex-x {
1785	color: var(--sex-u-fg);
1786}
1787
1788.wt-icon-warning {
1789}
1790
1791.wt-icon-zoom-in {
1792}
1793
1794.wt-icon-zoom-out {
1795}
1796
1797/*
1798 * .wt-icon-bing-maps
1799 * .wt-icon-calendar
1800 * .wt-icon-copy
1801 * .wt-icon-delete
1802 * .wt-icon-edit
1803 * .wt-icon-email
1804 * .wt-icon-family
1805 * .wt-icon-help
1806 * .wt-icon-individual
1807 * .wt-icon-google-maps
1808 * .wt-icon-keyboard
1809 * .wt-icon-media
1810 * .wt-icon-note
1811 * .wt-icon-openstreetmap
1812 * .wt-icon-preferences
1813 * .wt-icon-repository
1814 * .wt-icon-source
1815 * .wt-icon-submitter
1816 */
1817[class^="icon-"],
1818[class*=" icon-"] {
1819	display: inline-block;
1820	vertical-align: middle;
1821	background-repeat: no-repeat;
1822	background-size: cover;
1823}
1824
1825.icon-add {
1826	width: 14px;
1827	height: 15px;
1828	background-image: url(images/add.png);
1829}
1830
1831.icon-cfamily {
1832}
1833
1834.icon-childless {
1835	width: 25px;
1836	height: 25px;
1837	background-image: url(minimal/images/childless.png);
1838}
1839
1840.icon-children {
1841	width: 16px;
1842	height: 16px;
1843	background-image: url(minimal/images/children.png);
1844}
1845
1846.icon-clippings {
1847	width: 22px;
1848	height: 22px;
1849	background-image: url(minimal/images/clippings.png);
1850}
1851
1852.icon-edit_indi {
1853	width: 20px;
1854	height: 20px;
1855	background-image: url(minimal/images/edit_sm.png);
1856}
1857
1858.icon-fam-list {
1859	width: 20px;
1860	height: 20px;
1861	background-image: url(minimal/icons/family.png);
1862}
1863
1864.icon-indi-list {
1865	width: 20px;
1866	height: 20px;
1867	background-image: url(minimal/images/indis.png);
1868}
1869
1870.icon-loading-small {
1871	width: 16px;
1872	height: 16px;
1873	background-image: url(minimal/images/indicator.gif);
1874}
1875
1876.icon-loading-large {
1877	width: 32px;
1878	height: 32px;
1879	background-image: url(images/loading-32x32.gif);
1880}
1881
1882.icon-media {
1883	width: 20px;
1884	height: 20px;
1885	background-image: url(minimal/images/media.png);
1886}
1887
1888.icon-media-list {
1889	width: 20px;
1890	height: 20px;
1891	background-image: url(minimal/images/media.png);
1892}
1893
1894.icon-media-next {
1895	width: 20px;
1896	height: 20px;
1897	background-image: url(minimal/images/rdarrow.png);
1898}
1899
1900.icon-media-play {
1901	width: 20px;
1902	height: 20px;
1903	background-image: url(minimal/images/rarrow.png);
1904}
1905
1906.icon-media-stop {
1907	width: 16px;
1908	height: 17px;
1909	background-image: url(minimal/images/stop.png);
1910}
1911
1912.icon-minus {
1913	width: 11px;
1914	height: 11px;
1915	background-image: url(minimal/images/minus.png);
1916}
1917
1918.icon-mypage {
1919	width: 24px;
1920	height: 24px;
1921	background-image: url(minimal/images/mypage.png);
1922}
1923
1924.icon-note {
1925	width: 20px;
1926	height: 20px;
1927	background-image: url(minimal/icons/note.png);
1928}
1929
1930.icon-plus {
1931	width: 11px;
1932	height: 11px;
1933	background-image: url(minimal/images/plus.png);
1934}
1935
1936.icon-remove {
1937	width: 14px;
1938	height: 15px;
1939	background-image: url(minimal/images/remove.png);
1940}
1941
1942.icon-resn-confidential {
1943	width: 16px;
1944	height: 16px;
1945	background-image: none;
1946}
1947
1948.icon-resn-locked {
1949	background-image: none;
1950}
1951
1952.icon-resn-none {
1953	background-image: none;
1954}
1955
1956.icon-resn-privacy {
1957	background-image: none;
1958}
1959
1960.icon-rings {
1961	width: 9px;
1962	height: 9px;
1963	background-image: url(minimal/images/rings.png);
1964}
1965
1966.icon-selected {
1967	width: 12px;
1968	height: 12px;
1969	background-image: url(minimal/images/selected.png);
1970}
1971
1972.icon-sfamily {
1973	width: 24px;
1974	height: 24px;
1975	background-image: url(minimal/images/sfamily.png);
1976}
1977
1978.icon-source {
1979	width: 20px;
1980	height: 20px;
1981	background-image: url(minimal/images/source.png);
1982}
1983
1984/* Silhouettes on charts */
1985.icon-silhouette-F {
1986	width: 37px;
1987	height: 50px;
1988	background-image: url(minimal/images/silhouette_female_small.png);
1989}
1990
1991.icon-silhouette-M {
1992	width: 37px;
1993	height: 50px;
1994	background-image: url(minimal/images/silhouette_male_small.png);
1995}
1996
1997.icon-silhouette-U {
1998	width: 37px;
1999	height: 50px;
2000	background-image: url(minimal/images/silhouette_unknown_small.png);
2001}
2002
2003.icon-indis {
2004	width: 24px;
2005	height: 24px;
2006	background-image: url(minimal/images/indis.png);
2007}
2008
2009.icon-pedigree {
2010	width: 24px;
2011	height: 24px;
2012	background-image: url(minimal/images/pedigree.png);
2013}
2014
2015.icon-search {
2016	width: 24px;
2017	height: 24px;
2018	background-image: url(minimal/images/search.png);
2019}
2020
2021/* Census assistant */
2022.wt-census-assistant-form-control:focus {
2023	min-width: 12rem;
2024}
2025
2026/*
2027 * Drag and drop sortable lists
2028 */
2029.wt-sortable-list {
2030}
2031
2032.wt-sortable-item {
2033	cursor: move;
2034}
2035
2036/* Some blocks show a reduced version on the right-hand side. */
2037.wt-side-blocks .wt-side-block-optional {
2038	display: none !important;
2039}
2040
2041/* my page chart enhancements */
2042.wt-block-content-charts {
2043	flex-flow: column-reverse;
2044	overflow: auto;
2045}
2046
2047.wt-block-content-todays-events-block {
2048	padding: .25rem;
2049}
2050
2051/* Some charts are wider than the page. */
2052.wt-chart {
2053	overflow-x: auto;
2054	overflow-y: hidden;
2055}
2056
2057/* Fit thumbnail into parent on charts */
2058.select2-selection.select2-selection--single {
2059	min-height: 36px;
2060	height: auto;
2061	padding: 2px 0;
2062}
2063
2064.select2-container .select2-selection--single .select2-selection__rendered {
2065	padding-left: 2px;
2066}
2067
2068.select2-selection--single .NAME {
2069	padding-left: 4px;
2070}
2071
2072/*
2073 *  These selectors control how the short horizontal lines are positioned in the Charts
2074 *  Optimized for Win10 and FF, Chrome and Edge browsers
2075 *  	Ancestors
2076 *  	Descendants
2077 *  	amily book
2078 *  	Hourglass chart
2079 *
2080 */
2081
2082/* Ascentors */
2083.wt-chart-ancestors .linea1 {
2084	margin-bottom: 4px;
2085}
2086
2087.wt-chart-ancestors .linea2 {
2088	margin-bottom: 7px;
2089}
2090
2091.wt-chart-ancestors .linea3 {
2092	margin-bottom: 4px;
2093}
2094
2095.wt-chart-ancestors .linea4 {
2096	margin-bottom: 7px;
2097}
2098
2099.wt-chart-ancestors .linea5 {
2100	vertical-align: top;
2101}
2102
2103/* Descendants */
2104.wt-chart-descendants .lined1 {
2105	margin-bottom: 4px;
2106}
2107
2108.wt-chart-descendants .lined2 {
2109	margin-bottom: 7px;
2110}
2111
2112.wt-chart-descendants .lined3 {
2113	margin-bottom: 4px;
2114}
2115
2116.wt-chart-descendants .lined4 {
2117	margin-bottom: 7px;
2118}
2119
2120.wt-chart-descendants .linea5 {
2121	vertical-align: top;
2122}
2123
2124/* Family book */
2125.linef1 {
2126	margin-bottom: 3px;
2127}
2128
2129.linef2 {
2130	margin-bottom: 3px;
2131}
2132
2133.linef3 {
2134	margin-bottom: 7px;
2135}
2136
2137/* Hourglass */
2138.lineh1 {
2139	margin-bottom: 4px;
2140}
2141
2142.lineh2 {
2143	margin-bottom: 4px;
2144}
2145
2146.lineh3 {
2147	margin-bottom: 7px;
2148}
2149
2150/*
2151 * Pedigree chart
2152 *
2153 * wt-chart, wt-chart-pedigree
2154 */
2155
2156#pedigree_chart {
2157	position: relative;
2158	margin: 20px auto;
2159}
2160
2161#pedigree_canvas {
2162	z-index: -1000;
2163}
2164
2165#childbox-pedigree {
2166	border: 1px solid;
2167	background-color: #fff;
2168}
2169
2170#pedigree-page #childbox-pedigree {
2171	border: 1px solid;
2172	background-color: #fff;
2173}
2174
2175#childbox-pedigree {
2176	padding: 5px;
2177	position: absolute;
2178	display: none;
2179	text-align: start;
2180	white-space: nowrap;
2181	left: auto;
2182	z-index: 9999;
2183}
2184
2185.wt-chart-pedigree, .wt-chart-hourglass {
2186	overflow-y: auto;
2187}
2188
2189.wt-chart-pedigree .spacer {
2190	background-image: url(images/spacer.png);
2191	height: 20px;
2192	width: 1px;
2193}
2194
2195#pedigree-page .shadow {
2196	box-shadow: 0 0 0 !important; /* override vendor css shadow  */
2197}
2198
2199#childarrow,
2200.ancestorarrow {
2201	text-align: center;
2202	display: inline-block;
2203	vertical-align: middle;
2204}
2205
2206.layout3 #childbox-pedigree {
2207	top: auto;
2208}
2209
2210#childbox-pedigree a.name1 {
2211	display: block;
2212	margin-left: 5px;
2213}
2214
2215/*
2216 * Place hierarchy
2217 *
2218 * wt-place-hierarchy-page
2219 */
2220
2221#place-hierarchy ul {
2222	list-style-type: none;
2223}
2224
2225.d-table-cell {
2226	padding-right: 5px;
2227}
2228
2229/*
2230 * Search
2231 *
2232 * wt-search-page, wt-general-serach-page/wt-phonetic-search-page/wt-advanced-search-page/wt-search-replace-page
2233 */
2234
2235/* Some menus (e.g. languages) can be longer than a page */
2236.dropdown-menu {
2237	max-height: 30rem;
2238	overflow-x: hidden;
2239}
2240
2241/* Clipping cart */
2242.clipping-cart h2 {
2243	margin: 20px;
2244	text-align: center;
2245}
2246
2247.clipping-cart .wt-page-options {
2248	max-width: 25rem;
2249}
2250
2251.clipping-cart .topbottombar, .clipping-cart .optionbox, .add-to .topbottombar {
2252	font-size: 1rem;
2253}
2254
2255.clipping-cart .add-to {
2256	text-align: left;
2257}
2258
2259/* Forms */
2260.col-form-label {
2261	font-weight: bold;
2262}
2263
2264/* Popups */
2265.popup .nav-link {
2266	display: inline;
2267	vertical-align: top;
2268	padding: 5px;
2269}
2270
2271