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