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