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