body
{
	background-color: #FFFFFF;
	background-image: url("./graphics/Christmas-Wallpaper.jpg");
	border: 0;
	color: #000000;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12pt;
	font-weight: normal;
	margin: 0;
	padding: 0;
}

button
{
	border: 2px solid #E3E3E3;
	border-radius: 1em;
	border-style: outset;
	cursor: pointer;
	font-weight: bold;
	margin: 0 1em;
	padding: .5em 1em;
}

h1,
h2,
h3
{
	display: block;
	font-weight: bold;
	text-align: center;
}

h1
{
	font-size: 1.5em;
}

h2
{
	font-size: 1.25em;
}

h3
{
	font-size: 1.1em;
}

input,
select,
textarea
{
	background-color: #FFFFFF;
	border-style: inset;
	color: #000000;
	font-size: .875em;
	text-transform: uppercase;
}

input[type=checkbox]:disabled:checked
{
	filter: invert(100%);
	font-weight: bold;
}

button:disabled,
input:disabled,
input[readOnly],
select:disabled,
textarea[readOnly]
{
	cursor: not-allowed;
}

input::placeholder,
select,
textarea::placeholder
{
	text-transform: none;
}

label
{
	display: inline-block;
	height: inherit;
	vertical-align: bottom;
}

td, th
{
	background-color: transparent;
	border: 1px solid black;
	border-collapse: collapse;
	cursor: default;
	padding: .25em;
	cursor: inherit;
	vertical-align: top;
}
th
{
	background-color: #D0D0D0;
}

tr
{
	background-color: transparent;
	border: 0;
}

tr[class*="click"] td
{
	cursor: pointer;
}

.block
{
	display: block;
}

.bold
{
	font-weight: bold;
}

.border
{
	border: 2px solid black;
	margin: 0;
	padding: 0;
}

.bottom
{
	vertical-align: bottom;
}

.break_after_page
{
	break-after: page;
	clear: both;
}

.break_before_page
{
	break-before: page;
	clear: both;
}

.center
{
	text-align: center;
}

.clear
{
	clear: both;
}

.click
{
	cursor: pointer;
}

.col
{
	border: 0;
	display: inline-block;
	margin: 0;
	padding: 0;
	width: calc((100 / var(--c) - .5) * 1%);	/* style="--c:?" */
}

.float_center
{
	display: block;
	margin: auto;
}

.float_right
{
	display: block;
	float: right;
}

.float_left
{
	display: inline-block;
	float: left;
}

.format
{
	border-color: transparent;
	border-bottom: 0;
	border-top: 0;
	height: 0;
	margin: 0;
	padding-bottom: 0;
	padding-top: 0;
}

.hidden
{
	display: none;
}

.icon_social
{
	cursor: pointer;
	display: inline-block;
	height: 1.5em;
	margin: 0 .5em;
	max-height: 1.5em;
	width: auto;
}

.inline
{
	display: inline-block;
}

.italic
{
	font-style: italic;
}

.left
{
	text-align: left;
}

.menu_bar
{
	background: red;
	border-bottom: 2px solid black;
	color: white;
	font-weight: bold;
	min-width: 400px;
	position: fixed;
		left: 0;
		top: 0;
	text-align: left;
	z-index: 99;
}

.menu_ico_left
{
	height: 2em;
	position: absolute;
	left: 1em;
	top: .25em;
	width: auto;
}

.menu_ico_right
{
	height: 2em;
	position: absolute;
	right: 1em;
	top: .25em;
	width: auto;
}

.menu_opt
{
	cursor: pointer;
	padding: 0 1em;
}

.menu_spacer
{
	visibility: hidden;
}

.menu_bar,
.menu_spacer
{
	height: 2em;
	overflow: visible;
	padding: .25em 0;
	white-space: nowrap;
	width: 100%;
}

.no_click
{
	cursor: default;
}

.no_case
{
	text-transform: none;
}

.pos_center
{
	margin-inline: auto;
	position: absolute;
		left: 0;
		right: 0;
		top: 0;
	width: calc(var(--w));
}

.print_label
{
	border: 1px solid black;
	border-radius: 1em;
	display: block;
	font-family: monospace, sans-serif;
	font-size: 16px;
	font-weight: bold;
	height: 2.625in;
	margin: 0;
	padding: .25in;
	width: 3.25in;
}

.print_label_child,
.print_label_delivery,
.print_label_id
{
	border: 0;
	display: block;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.print_label_child
{
	width: 49%;
}

.print_label_child label
{
	width: 3em;
}

.print_label_id
{
	font-size: 32px;
}

.right
{
	text-align: right;
}

.underline
{
	text-decoration: underline;
}

.vert_line
{
	border: 0;
	border-left: 4px solid white;
	display: inline-block;
	height: 100%;
	padding: 0;
	position: absolute;
		top: 0;
	width: 1em;
}

.width
{
	max-width: calc(var(--w));	/* style="--w:?" */
	min-width: calc(var(--w));	/* style="--w:?" */
	overflow: hidden;
	width: calc(var(--w));		/* style="--w:?" */
}

.width_full
{
	height: auto;
	width: 100%;
}

[id^="btn_kpd_"]
{
	background-color: blue;
	color: white;
}

#btn_lang
{
	position: absolute;
		right: calc(calc(100% - 10em)/2);
		bottom: .75em; 
	width: 10em;
}

#div_applicant
{
	display: none;
	margin: 0;
	padding: 0;
	position: relative;
	min-width: 50em;
}

#div_applicant_info
{
	float: left;
	font-size: 10pt;
	margin: 0;
	padding: 1em;
	min-width: 46em;
}

#div_application
{
	background-color: #F8F8F8;
	border: 4px solid #C70039;
	border-radius: 1em;
	font-size: 14px;
	margin: 0 auto;
	padding: 0;
	position: relative;
	width: 44em;
}

#div_children
{
	padding-left: 5%;
}

#div_content
{
	border: 0;
	border-bottom: 4px solid #C70039;
	border-top: 4px solid #C70039;
	padding: 1em;
	position: relative;
	overflow-x: hidden;
}

#div_content_dialog
{
	background-color: #F8F8F8;
	border: 2px solid black;
	border-radius: 2em;
	display: none;
	height: 10em;
	position: absolute;
		left: calc(calc(100% - 38em) / 2);
	text-align: center;
	width: 38em;
	z-index: 99;
}

#div_footer
{
	border: 0;
	font-size: 1.25em;
	font-weight: bold;
	padding: 1em;
	text-align: center;
}

#div_gmap
{
	border: 2px solid black;
	display: none;
	height: calc(80vh - 2em) !important;
/*	margin-left: 10vw !important;	*/
/*	margin-top: 10vh !important;	*/
	position: absolute !important;
		left: 10vw !important;
		top: 10vh !important;
	width: 80vw !important;
	z-index: 99;
}

#div_header
{
	border: 0;
	font-size: 1.5em;
	font-weight: bold;
	padding: 1em;
	position: relative;
	text-align: center;
}

#div_home
{
	border: 0;
	height: 90vh;
	margin: 0 auto;
	max-height: 1080px;
	max-width: 1080px;
	padding: 0;
	position: relative;
	width: 90vw;
}

[id^="div_list_"]
{
	display: block;
	font-size: 10pt;
	margin: 0;
	min-width: calc(79em + 4px);
	overflow: visible;
	padding: 0;
}

#div_list_content,
#div_list_filters,
#div_list_header,
#div_list_options
{
	margin: 0 auto;
	width: 79em;
}

#div_list_content
{
	border-bottom: 1px solid black;
	max-height: 24em;
	overflow: auto;
}

#div_list_options
{
	text-align: center;
}

#div_list_footer,
#div_list_summary
{
	margin: 1em auto 0;
}

[id^="div_page_"]
{
	background-color: #FFFFFF;
	display: none;
	min-width: 48em;
	text-align: center;
}

#div_page_info,
#div_page_kpd
{
	padding: 2em;
}

#div_page_kpd
{
	position: relative;
}

[id^="icon_application_"]
{
	height: 90%;
	width: auto;
}

#icon_application_santa
{
	position: absolute;
		left: .5em;
		top: 5%;
}

#icon_application_tree
{	position: absolute;
		right: .5em;
		top: 5%;
}

#iframe_gmap_embed
{
	border: 1px solid black;
	display: none;
	height: 404px;
	margin: 2em 2em 0;	/* t l&r b */
	padding: 0;
	width: 404px;
}

#inp_gmap,
#inp_gps
{
	text-transform: none;
	width: 20em;
}

#tbl_list_content,
#tbl_list_header,
#tbl_list_summary
{
	border: 0;
	border-collapse: collapse;
	margin: auto;
	table-layout: fixed;
}

#tbl_list_content td
{
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

#tbl_list_content td:hover
{
	overflow: visible;
	white-space: normal;
	word-break: break-all;
}

#tbl_locations,
#tbl_schedule
{
	border: 1px solid black;
	border-collapse: collapse;
	margin: auto;
	max-width: 95%;
	overflow: auto;
	table-layout: fixed;
}

#tbl_locations td,
#tbl_locations th,
#tbl_locations tr,
#tbl_schedule td,
#tbl_schedule th,
#tbl_schedule tr
{
	border: 1px solid black;
	border-collapse: collapse;
	padding: .5em;
	vertical-align: top;
}

#tbl_locations tr,
#tbl_schedule tr
{
	vertical-align: top;
}

[info]:before
{
	/* needed - do not touch */
	content: attr(info);
	opacity: 0;
	position: absolute;
	
	/* customizable */
	background: #F0F0F0;
	border: 2px solid black;
	border-radius: 1em;
	color: #000000;
	cursor: help !important;
	font-family: "Lucida Console", Monaco, monospace;
	font-size: 10pt;
	font-weight: normal;
	margin-top: 1.25em;
	margin-left: 0;
	padding: 1em;
	text-align: left;
	transition: all 0.5s ease;
	white-space: pre;
	width: auto;
	z-index: 99;
}

[info]:hover:before
{
	/* needed - do not touch */
	cursor: help !important;
	opacity: 1;
}

[info]:not([info-persistent]):before
{
	pointer-events: none;
}
