@font-face
{
	font-family: 'Roboto';
	font-style: normal;
	font-weight: 400;
	src: local('Roboto Regular'), local('Roboto-Regular'), url('fonts/roboto.woff') format('woff');
}

*
{
	margin: 0;
	padding: 0;
}

html, body, #scroller, #scroller div
{
	width: 100%;
	height: 100%;
	background: #cccccc;
}

body
{
	font: 13px 'Tahoma', 'Arial', 'Roboto', sans-serif;
	touch-action: none;
}

#scroller
{
	display: block;
	overflow: auto;
	touch-action: pan-x pan-y;
}

#scroller > div
{
	display: table;
}

#scroller > div > div
{
	display: table-cell;
	vertical-align: middle;
	text-align: center;
}

#scroller img
{
	display: inline-block;
	vertical-align: bottom;
}

#toolbar
{
	display: block;
	position: absolute;
	left: 15px;
	right: 15px;
	top: 15px;
}

#toolbar > div
{
	display: table;
	width: 100%;
}

#toolbar > div > div
{
	display: table-cell;
	white-space: nowrap;
}

#toolbar > div > div > :empty
{
	display: none;
}

#error
{
	position: absolute;
	left: 15px;
	right: 15px;
	top: 45px;
	text-align: center;
}

#error span
{
	background: rgba(255, 210, 210, 0.8) url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKCAYAAACNMs+9AAAAV0lEQVR4AZ3KsQmEQBQA0RcY26J2tp0YCFZgJZcpCF8QFryPojgwyTBgow/ixqJOC/Fg8SPOVnJvFv+0gNyb1TXr19FMvNFEnK3kbqTLMTtS4JgH4so67b+PhN5w+nvJAAAAAElFTkSuQmCC') 7px center no-repeat;
	padding: 7px 7px 7px 22px;
}

#error span:empty
{
	display: none;
}

#times
{
	display: block;
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	padding: 15px 0;
	list-style: none;
	text-align: center;
}

#loader
{
	display: block;
	position: absolute;
	top: -24px;
	left: 50%;
	height: 24px;
	width: 24px;
	margin: 0 0 0 -12px;
	background: rgba(255, 255, 255, 0.8) url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxNnB4IiBoZWlnaHQ9IjE2cHgiIHZpZXdCb3g9IjAgMCAxMjggMTI4Ij48Zz48Y2lyY2xlIGN4PSIxNiIgY3k9IjY0IiByPSIxNiIgZmlsbD0iIzAwMDAwMCIgZmlsbC1vcGFjaXR5PSIxIi8+PGNpcmNsZSBjeD0iMTYiIGN5PSI2NCIgcj0iMTYiIGZpbGw9IiM1NTU1NTUiIGZpbGwtb3BhY2l0eT0iMC42NyIgdHJhbnNmb3JtPSJyb3RhdGUoLTQ1LDY0LDY0KSIvPjxjaXJjbGUgY3g9IjE2IiBjeT0iNjQiIHI9IjE2IiBmaWxsPSIjOTQ5NDk0IiBmaWxsLW9wYWNpdHk9IjAuNDIiIHRyYW5zZm9ybT0icm90YXRlKC05MCw2NCw2NCkiLz48Y2lyY2xlIGN4PSIxNiIgY3k9IjY0IiByPSIxNiIgZmlsbD0iI2NjY2NjYyIgZmlsbC1vcGFjaXR5PSIwLjIiIHRyYW5zZm9ybT0icm90YXRlKC0xMzUsNjQsNjQpIi8+PGNpcmNsZSBjeD0iMTYiIGN5PSI2NCIgcj0iMTYiIGZpbGw9IiNlMWUxZTEiIGZpbGwtb3BhY2l0eT0iMC4xMiIgdHJhbnNmb3JtPSJyb3RhdGUoLTE4MCw2NCw2NCkiLz48Y2lyY2xlIGN4PSIxNiIgY3k9IjY0IiByPSIxNiIgZmlsbD0iI2UxZTFlMSIgZmlsbC1vcGFjaXR5PSIwLjEyIiB0cmFuc2Zvcm09InJvdGF0ZSgtMjI1LDY0LDY0KSIvPjxjaXJjbGUgY3g9IjE2IiBjeT0iNjQiIHI9IjE2IiBmaWxsPSIjZTFlMWUxIiBmaWxsLW9wYWNpdHk9IjAuMTIiIHRyYW5zZm9ybT0icm90YXRlKC0yNzAsNjQsNjQpIi8+PGNpcmNsZSBjeD0iMTYiIGN5PSI2NCIgcj0iMTYiIGZpbGw9IiNlMWUxZTEiIGZpbGwtb3BhY2l0eT0iMC4xMiIgdHJhbnNmb3JtPSJyb3RhdGUoLTMxNSw2NCw2NCkiLz48YW5pbWF0ZVRyYW5zZm9ybSBhdHRyaWJ1dGVOYW1lPSJ0cmFuc2Zvcm0iIHR5cGU9InJvdGF0ZSIgdmFsdWVzPSIwIDY0IDY0OzQ1IDY0IDY0OzkwIDY0IDY0OzEzNSA2NCA2NDsxODAgNjQgNjQ7MjI1IDY0IDY0OzI3MCA2NCA2NDszMTUgNjQgNjQiIGNhbGNNb2RlPSJkaXNjcmV0ZSIgZHVyPSI3MjBtcyIgcmVwZWF0Q291bnQ9ImluZGVmaW5pdGUiPjwvYW5pbWF0ZVRyYW5zZm9ybT48L2c+PC9zdmc+') center center no-repeat;
	border-radius: 12px;
	opacity: 0;
	-webkit-transition: all 0.4s ease;
	transition: all 0.4s ease;
}

.loading #loader, .starting #loader, .leaving #loader
{
	top: 45px;
	opacity: 1;
}

.loading #loader
{
	-webkit-transition-delay: 0.2s;
	transition-delay: 0.2s;
}

.leaving #loader
{
	-webkit-transition-delay: 0s !important;
	transition-delay: 0s !important;
}

@supports (top: max(0px, 1px)) /* Chrome 79+, Firefox 75+ */
{
	:root
	{
		--img-width: 654px;
		--img-height: 479px;
		--edge-hmargin: 15px;
		--edge-vmargin: 15px;
	}

	@media only screen and (min-width: 470px) { :root { --edge-hmargin: 30px; } }
	@media only screen and (min-height: 500px) { :root { --edge-vmargin: 30px; } }

	#toolbar, #error
	{
		left: max(var(--edge-hmargin), calc(50% - (var(--img-width) + 100px) / 2 + 15px));
		right: max(var(--edge-hmargin), calc(50% - (var(--img-width) + 100px) / 2 + 15px));
	}

	#toolbar
	{
		top: max(var(--edge-vmargin), calc(50% - (var(--img-height) + 100px) / 2 + 15px));
	}

	#error
	{
		top: max(calc(30px + var(--edge-vmargin)), calc(50% - (var(--img-height) + 100px) / 2 + 45px));
	}

	#loader
	{
		top: max(-24px, calc(50% - (var(--img-height) + 100px) / 2 - 24px));
	}

	.loading #loader, .starting #loader, .leaving #loader
	{
		top: max(calc(30px + var(--edge-vmargin)), calc(50% - (var(--img-height) + 100px) / 2 + 45px));
	}

	#times
	{
		bottom: max(calc(var(--edge-vmargin) - 15px), calc(50% - (var(--img-height) + 100px) / 2));
	}

	#ua-heart
	{
		background: url(images/uaheart.png) no-repeat;
		width: 70px;
		height: 70px;
		position: absolute;
		background-size: contain;
		bottom: max(calc(var(--edge-vmargin) - 15px - 12px), calc(50% - (var(--img-height) + 100px) / 2 - 12px));
		right: max(var(--edge-hmargin), calc(50% - (var(--img-width) + 100px) / 2 + 15px));
	}
}

.no-select, #times, #toolbar, #scroller
{
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

.button, .hint
{
	display: inline-block;
	background: rgba(255, 255, 255, 0.8);
	border: 0;
	border-radius: 12px;
	margin: 0 6px;
	padding: 4px 6px;
	min-width: 13px;
	text-align: center;
	line-height: 13px;
	color: black;
	text-decoration: none;
}

.button
{
	cursor: pointer;
}

.hint
{
	cursor: default;
}

.hint.action-about
{
	cursor: pointer;
}

.button.active, a.button.autoactive:active
{
	background-color: rgba(255, 255, 0, 0.8) !important;
}

.button.disabled
{
	color: #808080;
	opacity: 0.5;
}

a.button
{
	outline: none;
	-webkit-tap-highlight-color: rgba(0, 0, 0, 0) !important;
}

#times.shift-active-up > a[data-time].active
{
	transform: translate(0, -50px);
}

#btn-update
{
	position: relative;
	padding-left: 25px;
	background: rgba(255, 255, 255, 0.8);
}

@keyframes rotate180 { to { transform: rotate(180deg); } }

#btn-update::before
{
	position: absolute;
	display: block;
	content: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGhlaWdodD0iMTNweCIgd2lkdGg9IjEzcHgiIHZpZXdCb3g9IjE4IDE4IDkyIDkyIj48cGF0aCBkPSJNMTA5LjI1IDU1LjVoLTM2bDEyLTEyYTI5LjU0IDI5LjU0IDAgMCAwLTQ5LjUzIDEySDE4Ljc1QTQ2LjA0IDQ2LjA0IDAgMCAxIDk2LjkgMzEuODRsMTIuMzUtMTIuMzR2MzZ6bS05MC41IDE3aDM2bC0xMiAxMmEyOS41NCAyOS41NCAwIDAgMCA0OS41My0xMmgxNi45N0E0Ni4wNCA0Ni4wNCAwIDAgMSAzMS4xIDk2LjE2TDE4Ljc0IDEwOC41di0zNnoiLz48L3N2Zz4=');
	top: 4px;
	left: 7px;
	width: 13px;
	height: 13px;
}

#btn-update.rotating::before, .updating #btn-update::before
{
	animation: rotate180 0.5s linear infinite;
}

#lbl-select-radar
{
	margin: 0px;
	background: rgba(255, 255, 255, 0.8) url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxM3B4IiBoZWlnaHQ9IjEwcHgiPjxwb2x5bGluZSBwb2ludHM9IjgsMyA0LDggMCwzIi8+PC9zdmc+') right center no-repeat;
	padding-right: 16px;
}

#toolbar > div > :last-child > *
{
	margin-left: 0;
}

#toolbar > div > :last-child > :last-child
{
	margin-right: 0;
}

@media only screen and (max-width: 309px) { #toolbar .lbl-timezone { display: none; } }

#times > a
{
	vertical-align: middle;
}

@media only screen and (max-width: 719px) { #times > a { margin: 0 5px; } }
@media only screen and (max-width: 695px) { #times > a { margin: 0 4px; } }
@media only screen and (max-width: 671px) { #times > a { margin: 0 3px; } }
@media only screen and (max-width: 647px) { #times > a { margin: 0 2px; } }
@media only screen and (max-width: 623px) { #times > a:not(.active) { font-size: 11px; } }
@media only screen and (max-width: 569px) { #times > a:not(.active) { padding: 2px 4px; } }
@media only screen and (max-width: 519px) { #times > a:not(.active) { font-size: 9px; } }
@media only screen and (max-width: 469px) { #times > a:not(.active) { font-size: 7px; } }
@media only screen and (max-width: 419px) { #times > a:not(.active) { padding: 0px 2px; } }

@media only screen and (max-width: 119px) { #times a:nth-last-child(4) { display: none; } }
@media only screen and (max-width: 149px) { #times a:nth-last-child(5) { display: none; } }
@media only screen and (max-width: 179px) { #times a:nth-last-child(6) { display: none; } }
@media only screen and (max-width: 209px) { #times a:nth-last-child(7) { display: none; } }
@media only screen and (max-width: 239px) { #times a:nth-last-child(8) { display: none; } }
@media only screen and (max-width: 269px) { #times a:nth-last-child(9) { display: none; } }
@media only screen and (max-width: 299px) { #times a:nth-last-child(10) { display: none; } }
@media only screen and (max-width: 329px) { #times a:nth-last-child(11) { display: none; } }
@media only screen and (max-width: 359px) { #times a:nth-last-child(12) { display: none; } }

#shadow
{
	background-color: rgba(0,0,0,0.7);
	position: fixed;
	-webkit-transition: all 0.4s ease;
	transition: all 0.4s ease;
	opacity: 0;
	top: 50%;
	left: 50%;
	width: 0;
	height: 0;
}

.starting #shadow, .leaving #shadow, .in-about #shadow
{
	opacity: 1;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.starting #shadow, .leaving #shadow
{
	background-color: #3d3d3d;
}

#about
{
	display: none;
	z-index: 1000;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	line-height: 17px;
}

.in-about #about
{
	display: table;
}

#about .container
{
	display: table-cell;
	vertical-align: middle;
	text-align: center;
}

#about .dialog
{
	display: inline-block;
	text-align: left;
	vertical-align: baseline;
	max-width: 270px;
	width: 100%;
	background: rgba(255, 255, 255, 1.0);
	border: 0;
	border-radius: 5px;
}

#about .header
{
	display: table;
	width: 100%;
	height: 50px;
}

#about .header > div
{
	display: table-cell;
	vertical-align: middle;
	height: 50px;
}

#about .header .title
{
	background: url('data:image/png;base64,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') 10px center no-repeat;
	padding-left: 49px;
	line-height: 1.0;
}

#about h1
{
	font-size: 120%;
	font-weight: bold;
}

#about .header .close
{
	width: 50px;
	cursor: pointer;
	text-align: center;
	font-size: 200%;
}

#about .header ~ *
{
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	width: 100%;
	border-top: 1px solid #E4E4E4;
	padding: 8px;
}

#about .dialog > :empty
{
	display: none;
}

#about .options
{
	display: table;
}

#about .options > div
{
	display: table-cell;
	white-space: nowrap;
	vertical-align: middle;
}

#about ul
{
	margin: 4px 0;
}

#about li
{
	margin-left: 20px;
}

#about ul.table-like > li
{
	margin-left: 0;
	list-style: none;
}

#about ul.table-like > li > span
{
	display: inline-block;
	width: 100px;
}

#about a, #about a:visited, #about a:active
{
	color: #003388;
	text-decoration: none;
}

#about a:hover, #about a:focus
{
	color: #fc4100;
}

.hidden
{
	display: none;
}
