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