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