html, body { 
	height: 100%; 
	margin: 0; 
	padding: 0; 
}
body { 
	padding: 0 20px 0 20px; 
	background-color: rgb(247,247,247);
}

#lang {
	position: absolute;
	right: 20px;
	padding: 2px 6px 6px 16px;
	background-color: white;
	box-shadow: 0 0 10px rgba(0,0,0,0.2);
}

h1 {
	margin: 0;
	padding: 30px 0 0 0;
	font: bold 32px Arial;
	color: rgb(38,38,38);
	text-align: center;
}

h2 {
	margin: 30px 0 20px 0;
	padding: 0;
	font: italic 28px Georgia, Serif;
	letter-spacing: -1px;
	color: rgb(128,128,128);
	text-shadow: 1px 1px 0px rgb(255,255,255);
}

h1+h2 {
	margin-top: -2px;
	text-align: center;
}

#scale_coord, #scale_depth {
	display: inline-block;
	padding: 0 7px 0 4px;
	font: normal 28px/32px Courier;
	font-weight: 600;
	color: rgb(38,38,38);
	background-color: rgb(220,220,220);
	text-shadow: none;
}

sup { color: rgb(160,160,160); }

#metro { 
	position: relative; 
	width: 100%; 
	min-width: 700px;
	height: 100%; 
	min-height: 700px; 
	overflow: hidden; 
	background-color: white;
	box-shadow: 0 0 10px rgba(0,0,0,0.2);
	-webkit-touch-callout: none;
	-webkit-tap-highlight-color: rgba(0,0,0,0);
}

#metro ul li { 
	position: absolute;
	z-index: 1;
	margin: -6px 0 0 -6px;
	padding: 0 0 0 16px;
	list-style: none;
	font: normal 9px/12px Tahoma, Arial; 
	color: black; 
	/*text-shadow: 0 0 2px white;*/
	white-space: nowrap;
	background-color: rgba(255,255,255,0.33);
	background-repeat: no-repeat;
	background-position: -100px 0, 0 0;
	background-origin: border-box;
	border-radius: 6px;
	-ms-transform-origin: 		6px 6px;
	-webkit-transform-origin:	6px 6px;
	-moz-transform-origin:		6px 6px;
	-o-transform-origin:		6px 6px;
	transform-origin:			6px 6px;
	}
#metro ul li:hover {
	text-decoration: underline;
	background-position: 0 0;
	cursor: pointer;
}

.noCaptions#metro ul li { 
	width: 0; 
	overflow: hidden; 
	background-color: transparent; 
}

#metro ul span {
	position: absolute;
	z-index: 0;
	padding: 0;
	margin: 0;
	margin-top: -3px;
	height: 6px;
	-ms-transform-origin: 0 50%;
	-webkit-transform-origin: 0 50%;
	-moz-transform-origin: 0 50%;
	-o-transform-origin: 0 50%;
	transform-origin: 0 50%;
}
#metro ul span:hover {
	outline: 3px solid #a0c5e8;
	cursor: pointer;
}

#metro ul li, #metro ul span {
	-ms-transition-duration: 0.5s;
	-webkit-transition-duration: 0.5s;
	-moz-transition-duration: 0.5s;
	-o-transition-duration: 0.5s;
	transition-duration: 0.5s;	
	
	-ms-transition-timing-function: ease;
	-webkit-transition-timing-function: ease;
	-moz-transition-timing-function: ease;
	-o-transition-timing-function: ease;
	transition-timing-function: ease;	
}
#metro ul li {
	-ms-transition-property: left, top;
	-webkit-transition-property: left, top;
	-moz-transition-property: left, top;
	-o-transition-property: left, top;
	transition-property: left, top;
}
#metro ul span {
	-ms-transition-property: -ms-transform, left, top, width;
	-webkit-transition-property: -webkit-transform, left, top, width;
	-moz-transition-property: -moz-transform, left, top, width;
	-o-transition-property: -o-transform, left, top, width;
	transition-property: transform, left, top, width; /*, height, padding, margin, line-height, background-size; */
}

.noAnimation#metro ul li, .noAnimation#metro ul span {
	-ms-transition-duration: 0s;
	-webkit-transition-duration: 0s;
	-moz-transition-duration: 0s;
	-o-transition-duration: 0s;
	transition-duration: 0s;	
}

#L0 li { background-image: URL('hover.png'), URL('L0.png'); }
#L0 span { background-color: #894e35; }

#L1 li { background-image: URL('hover.png'), URL('L1.png'); }
#L1 span { background-color: #ed1b35; }

#L2 li { background-image: URL('hover.png'), URL('L2.png'); }
#L2 span { background-color: #44b85d; }

#L3 li { background-image: URL('hover.png'), URL('L3.png'); }
#L3 span { background-color: #0078bf; }

#L4 li { background-image: URL('hover.png'), URL('L4.png'); }
#L4 span { background-color: #19c1f3; }

#L5 li { background-image: URL('hover.png'), URL('L5.png'); }
#L5 span { background-color: #f58232; }

#L6 li { background-image: URL('hover.png'), URL('L6.png'); }
#L6 span { background-color: #8e479c; }

#L7 li { background-image: URL('hover.png'), URL('L7.png'); }
#L7 span { background-color: #ffcb31; }

#L8 li { background-image: URL('hover.png'), URL('L8.png'); }
#L8 span { background-color: #a1a2a3; }

#L9 li { background-image: URL('hover.png'), URL('L9.png'); }
#L9 span { background-color: #b3d445; }

#L10 li { background-image: URL('hover.png'), URL('L10.png'); }
#L10 span { background-color: #6ac9c8; }

#L11 li { background-image: URL('hover.png'), URL('L11.png'); }
#L11 span { background-color: #acbfe1; }

#L12 li { background-image: URL('hover.png'), URL('L12.png'); }
#L12 span { 
    border-top: solid 2px #ffa8af;
    border-bottom: solid 2px #ffa8af;
	height: 2px !important;
}

#L13 li { background-image: URL('hover.png'), URL('L13.png'); }
#L13 span { 
	background: url(L13-line.png) center center repeat-x; 
    border-top: solid 2px #FFD702;
    border-bottom: solid 2px #82C0C0;
}

#L14 li { background-image: URL('hover.png'), URL('L14.png'); }
#L14 span { background-color: #de64a1; }

#L15 li { background-image: URL('hover.png'), URL('L15.png'); }
#L15 span { background-color: #3cb183; }

#M li { background-image: URL('hover.png'), URL('M.png'); }
#M span { background-color: #abbfe1; }

#d1 li { background-image: URL('hover.png'), URL('d1.png'); }
#d1 span { 
    border-top: solid 2px #faa400;
    border-bottom: solid 2px #faa400;
	height: 2px !important;
}

#d2 li { background-image: URL('hover.png'), URL('d2.png'); }
#d2 span { 
    border-top: solid 2px #ea4184;
    border-bottom: solid 2px #ea4184;
	height: 2px !important;
}

#d3 li { background-image: URL('hover.png'), URL('d3.png'); }
#d3 span { 
    border-top: solid 2px #ea5b04;
    border-bottom: solid 2px #ea5b04;
	height: 2px !important;
}

#d4 li { background-image: URL('hover.png'), URL('d4.png'); }
#d4 span { 
    border-top: solid 2px #3cb183;
    border-bottom: solid 2px #3cb183;
	height: 2px !important;
}

#interchanges span { 
	border-top: solid 1px #262626; 
	border-bottom: solid 1px #262626; 
	height: 6px;
	margin-top: -3px;
}

#ground-interchanges span { 
	background: URL('ground-interchange.png') left center repeat-x;
	height: 6px;
	margin-top: -3px;
}

#mesh span { 
	background-color: #c0c0c0;
	height: 1px !important;
	margin-top: 0 !important; 
}

#mesh span:hover {
	outline: none !important;
	cursor: auto !important;
}

#metro a.button {
	display: block;
	position: absolute;
	z-index: 9999;
	background-color: rgba(224,224,224,0.8);
	border: solid 1px rgba(216,216,216,0.8);
	font: normal 26px Arial;
	color: #909090;
	text-align: center;
	text-decoration: none;
	box-shadow: 0 0 3px rgba(0,0,0,0.2);
	text-shadow: 1px 1px 1px rgba(255,255,255,0.5);
}
#metro a.button:hover {
	background-color: rgba(240,240,240,0.8);
	border-color: rgba(232,232,232,0.8);
	box-shadow: 0 0 3px rgba(0,0,0,0.15);
}

#metro a.button span  {
	display: inline-block;
	width: 100%;
	height: 100%;
}

#metro a#up {
	width: 80px;
	height: 40px;
	top: 0;
	left: 50%;
	margin: 20px 0 0 -40px;
	line-height: 40px;
	border-radius: 15px 15px 0 0;
}

#metro a#down {
	width: 80px;
	height: 40px;
	bottom: 0;
	left: 50%;
	margin: 0 0 20px -40px;
	line-height: 40px;
	border-radius: 0 0 15px 15px;
}

#metro a#left {
	width: 40px;
	height: 80px;
	top: 50%;
	left: 0;
	margin: -40px 0 0 20px;
	line-height: 80px;
	border-radius: 15px 0 0 15px;
}

#metro a#right {
	width: 40px;
	height: 80px;
	top: 50%;
	right: 0;
	margin: -40px 20px 0 0;
	line-height: 80px;
	border-radius: 0 15px 15px 0;
}

#metro a#plus {
	width: 40px;
	height: 40px;
	top: 20px;
	left: 20px;
	line-height: 40px;
	border-radius: 5px;
}

#metro a#minus {
	width: 40px;
	height: 40px;
	top: 80px;
	left: 20px;
	line-height: 40px;
	border-radius: 5px;
}

#metro a#flat {
	width: 40px;
	height: 40px;
	top: 140px;
	left: 20px;
	line-height: 36px;
	border-radius: 5px;
	font-size: 30px;
}
#metro a#flat span span {
	display: block; 
	position: absolute; 
	left: 50%;
	top: 50%;
	transform: translate(-50%,-50%);
	line-height: 36px;
}

#metro #switches {
	display: block;
	position: absolute;
	z-index: 9998;	
	right: 0;
	top: 20px;
	width: 45%;
	text-align: right;
}

#metro #switches a.link, #metro #switches > span, #lang a, #lang span, .lang a, .lang span {
	display: inline-block;
	margin: 0 16px 0 0;
	padding: 2px 2px 4px 2px;
	font: normal 16px/1.2 Georgia, Serif;
	color: rgb(128,128,128);
	text-decoration: none;
	border-bottom: dashed 1px rgb(128,128,128);
	background-color: rgba(255,255,255,0.5);
}
#metro #switches span {
	vertical-align: middle;
}
#metro #switches > span > * {
	margin-right: 0;
}
#metro #switches > span {
	border-bottom: none;
}
#metro #switches #scroll {
	margin-left: 10px;
}
#lang a, #lang span, .lang a, .lang span {
	margin-right: 10px;
	padding-bottom: 1px;
	background: none;
}
#lang span, .lang span {
	color: #a0a0a0;
	border-bottom: none;
}
#metro #switches a.link:hover, #lang a:hover, .lang a:hover {
	color: red;
	border-bottom-color: red;
}

#metro #select-year {
	display: block;
	position: absolute;
	z-index: 9998;	
	top: 20px;
	width: 50%;
}

#metro #select-year h2 {
	display: inline-block;
	margin: 0 -80px 0 96px;
	background-color: rgba(255,255,255,0.5);
}

#metro #select-year select {
	display: inline-block;
	margin: 0 0 0 96px;
	font: normal 28px/40px Georgia, Serif;
	color: rgb(128,128,128);
}

#metro a:focus { outline: none; }

#text {
	width: 100%;
	padding: 0 0 20px 0;
	overflow: hidden;
	white-space: nowrap;
}

.column {
	display: inline-block;
	vertical-align: top;
	width: 30%;
	padding: 1% 3% 0 0;
	white-space: normal;
}

.column p, .column li {
	margin: 14px 0 0 0;
	padding: 0;
	font: normal 16px Georgia, Serif;
	line-height: 1.25;
	color: rgb(38,38,38);
}

.column li {
	margin-top: 10px;
}

.column p.smi > img {
	float: left;
	height: 40px;
	margin-right: 10px;
}

.column p.smi > span {
	display: block;
	margin-left: 50px;
}

.column p.smi > span > b {
	font-size: 14px;
}

.column p.smi > span > i {
	font-style: normal;
	color: rgb(160,160,160);
}

.column p.smi > span > a {
	text-decoration: none;
	border-bottom: none;
	color: #0054b9;
}
.column p.smi > span > a:hover {
	color: red;
}

.column ol {
	margin: 0;
	padding: 0;
	counter-reset: list 0;
}

.column li {
	padding-left: 25px;
	text-indent: -25px;
	list-style-type: none;
	color: rgb(160,160,160);
}

.column li:before {
	counter-increment: list;
	content: "[" counter(list) "] ";
}

.column a, #footer a {
	color: rgb(160,160,160);
	text-decoration: none;
	border-bottom: solid 1px rgb(223,223,223);
}
.column a:hover, #footer a:hover {
	color: red;
	text-decoration: none;
	border-bottom-color: rgb(255,190,168);
}

.yashare-auto-init a {
	border: none;
}

#footer {
	width: 100%;
	height: 60px;
	margin: 20px 0 0 0;
	padding: 20px 0 0 0;
	border-top: solid 1px rgb(192,192,192);
	font: normal 14px Georgia, Serif;
	color: rgb(38,38,38);
}

#footer div {
	display: inline-block;
	margin-right: 40px;
}

#footer a.author {
	color: rgb(38,38,38);
	text-decoration: none;
	border-bottom: solid 1px rgb(183,183,183);
}
#footer a.author:hover {
	color: red;
	text-decoration: none;
	border-bottom-color: rgb(255,190,168);
}

#ads-bottom {
	margin-top: 30px;
}

.ad-banner#ad-metro-top {
	display: block;
	z-index: 9999;
	width: 338px; /* 452px */
	position: absolute;
	top: 80px;
	right: 20px;
}

.ad-banner#ad-metro-bottom {
	display: block;
	z-index: 9999;
	width: 338px; /* 452px */
	position: absolute;
	bottom: 20px;
	right: 20px;
}

.ad-banner-close {
	display: block;
	width: 24px;
	height: 24px;
	position: absolute;
	top: -21px;
	left: -21px;
	background: url(icon-close-24.png) no-repeat;
	cursor: pointer;
}

/*
#ad-banner#metro-bottom > .ad-banner-close {
	left: auto;
	right: -21px;
}
*/


/* Мобильная версия: */


#metro #switches a#menu, #metro #switches .lang {
	display: none;
}

@media screen and (max-width: 1024px) {
	
	body {
		padding: 0;
	}

	#metro ul li {
		font-size: 2.1vmin;
	}
	
	.tooltip {
		padding: 1vmin !important;
		border-radius: 1vmin !important;
		font-size: 2.1vmin !important;
	}
	
	h1 {
		padding: 4vmin 0;
		font-size: 6vmin;
		letter-spacing: -3px;
	}
	
	h2 {
		margin: 6vmin 0 4vmin 0;
		font-size: 6vmin;
	}
	
	h1 + h2 {
		display: none;
	}
	
	#lang, #up, #down, #left, #right {
		display: none !important;
	}
	
	#metro a.button {
		width:		 8vmin !important;
		height:		 8vmin !important;
		font-size:	 8vmin !important;
		line-height: 8vmin !important;
		border-radius: 1.5vmin !important;
		z-index: 9998;
	}
	
	#metro a#plus {
		left: 3vmin;
		top: 3vmin;
	}
	
	#metro a#minus {
		left: 3vmin;
		top: 14vmin;
	}
	
	#metro a#flat {
		left: 3vmin;
		top: 25vmin;
		font-size: 6vmin !important;
		border-radius: 50% !important;
	}
	
	#metro #select-year {
		top: 3vmin;
		z-index: 9997;
	}
	
	#metro #select-year h2 {
		margin: 0 0 0 16vmin;
	}
	
	#metro #select-year select {
		height: 8vmin;
		margin: 0 0 0 3vmin;
		font-size: 5vmin;
		line-height: 1.4;
		border-width: 2px;
		border-radius: 1.5vmin;
	}
	
	.toggle {
		width: 8vmin !important;
		height: 4vmin !important;
		margin-left: 1vmin;
		border-radius: 2vmin !important;
	}
	
	.toggle.on:after {
		left: 4vmin !important;
	}
	
	.toggle.off:after, .toggle.on:after {
		width: 4vmin !important;
		height: 4vmin !important;
		border-radius: 2vmin !important;
	}
	
	/* -------- Меню: -------- */
	
	#metro #switches a#menu {
		display: block;
		right: 3vmin;
		top: 3vmin;
	}
	
	#metro #switches a#menu:after {
		content: "\2261";
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
	}
	
	#metro #switches.opened a#menu:after {
		content: "\2715";
		font-size: 6vmin;
	}
	
	#metro #switches .lang {
		display: block;
	}
	
	#metro #switches .lang > *:first-child {
		margin-right: 1vmin;
	}
	
	#metro #switches a {
		vertical-align: middle;
	}

	#metro #switches {
		height: 0;
		top: 0;
		padding: 14vmin 3vmin 0 3vmin;
		width: 40%;
		overflow: hidden;
	}
	
	#metro #switches.opened {
		height: auto;
		padding-bottom: 4vmin;
		background-color: white;
		box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
	}
	
	#metro #switches > span {
		display: block;
	}
	
	#metro #switches > a.link, #metro #switches > span, #metro #switches > .lang a, #metro #switches > .lang span {
		margin-right: 0;
		padding: 2vmin 0 0 0;
		font-size: 3.8vmin;
	}
	
	.night #metro #switches.opened {
		background-color: black;
		box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
	}
	
	.night #metro #switches > span, .night #metro #switches a.link, .night #metro #switches .lang > a {
		background-color: transparent !important;
	}
	
	/* ----------------------- */
	
	.column {
		display: block;
		box-sizing: border-box;
		width: 100%;
		padding-left: 3vmin;
		padding-right: 3vmin;
	}
	
	.column p, .column li {
		margin-top: 2vmin;
		font-size: 3.8vmin;
		line-height: 1.4;
	}
	
	.column li {
		padding-left: 5vmin;
		text-indent: -4.5vmin;
	}
	
	.column p.smi > span {
		margin-left: 8vmin;
	}
	
	.column p.smi > img {
		height: 6vmin;
		margin-right: 2vmin;
	}

	.column p.smi > span > b {
		font-size: 3.8vmin;
	}
	
	img:has( + a[href*="facebook.com"]) {
		width: 6vmin !important;
		margin-bottom: -1.5vmin !important;
	}
	
	#share42 {
		height: 6vmin !important;
		padding: 1vmin !important;
		border-radius: 1vmin !important;
	}
	
	#share42 > span {
		margin: 0 1vmin 1vmin 0 !important;
		height: 6vmin !important;
		width: 6vmin !important;
	}
	
	#share42 > span > a {
		width: 6vmin !important;
		height: 6vmin !important;
		background-size: cover !important;
	}
	
	#share42 > span:nth-child(2) > a {
		background-position: -6vmin 0 !important;
	}
	#share42 > span:nth-child(3) > a {
		background-position: -12vmin 0 !important;
	}
	#share42 > span:nth-child(4) > a {
		background-position: -18vmin 0 !important;
	}
	#share42 > span:nth-child(5) > a {
		background-position: -24vmin 0 !important;
	}
	#share42 > span:nth-child(6) > a {
		background-position: -30vmin 0 !important;
	}
	
	.share42-counter {
		padding: 0 2vmin 0 1vmin;
		font-size: 2vmin;
		line-height: 6vmin;
	}
}