.hotmap .min{background-color:#139b00;}
.hotmap .max{background-color:#9c0000;}

.tblmap{display: block;
    position: relative;
    padding-top: 35%;	
    max-height: 100px;
    max-width: 1400px;
    margin: 0 auto;
    overflow: hidden;
    background-color: #d8dbe2;
    background-image: repeating-radial-gradient(circle at 100% 100%, rgba(27,27,30, 0.1), rgba(88,164,176, 0.15) 1px, rgba(216,219,226, 0.2) 2px, rgba(88,164,176, 0.15) 3px, rgba(27,27,30, 0.1) 4px), radial-gradient(circle at 100% 100%, #1b1b1e, #3d5663, #607d8b, #91989c, #ffffff);
	}
.tblmap:before{
	position: absolute;
    filter: blur(3px);
	z-index: 1;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    content: "";
	opacity:0.2;
    background-image: url(/images/fon/rus.png);
	background-size:contain;
	background-position:right center;
	background-repeat:no-repeat;
	}	

.tblmap .svgmapcoords{position:absolute; z-index:10; top:45px; right:5px; color:#ccc; background:rgba(0,0,0,0.3); padding:3px;
	font-size:1.1em;
	font-weight:300;
	text-shadow:0 0 2px #000;
	border-radius:5px;
	}
.tblmap .svgmapbutton{position:absolute; z-index:15; top:5px; right:0; max-width:300px;}
.tblmap .svgmapbutton a{display:inline-block; padding:5px;  margin:3px;
	border: 2px solid #367fff;
    background-color: inherit;
    border-radius: 0px;
    text-shadow: 0px 0 1px #000;
    text-decoration: none;
    font-weight: normal;
    height: 90%;
	font-size:0.8em;
    color: #fff;
    text-decoration: none;
    text-transform: uppercase;
    overflow: hidden;
	border-radius: 7px;
	border-color: #ffffff57;	
	transition: all 0.3s;
	}
.tblmap .svgmapbutton .svgmapb1:hover{border-color: #4dc247; box-shadow: 0px 0px 10px #4dc247, inset 0px 0px 15px #4dc247;}	
.tblmap .svgmapbutton .svgmapb2:hover{border-color: #00aced; box-shadow: 0px 0px 10px #00aced, inset 0px 0px 15px #00aced;}	
.tblmap .svgmapbutton .svgmapb3:hover{border-color: #bc2a8d; box-shadow: 0px 0px 10px #bc2a8d, inset 0px 0px 15px #bc2a8d;}	

.tblmap .svgmapcolors{position:absolute; z-index:10; bottom:10px; right:0;}
.tblmap .svgmapcolors span{
	color:#fff; background:rgba(0,0,0,0.1); padding:3px;
	font-size:0.8em;
	font-weight:300;
	text-shadow:0 0 2px #000;
	margin:0 2px;
	}
.tblmap .svgmapcolors span.svgmapcolors_min{border-left:20px solid #9c0000;}
.tblmap .svgmapcolors span.svgmapcolors_max{border-left:20px solid #139b00;}


.divmap{
	display:block;
	position:absolute;
	top:0; right:10%; bottom:0;
	z-index:1;	
	}

.svgmap{display:block; fill:red; width:100%; height:100%;
    transform: scale(1);

	



/*
margin-top: -18%; margin-bottom: -10%;
transform: rotate(5deg) rotateX(60deg) rotateY(-1deg) translateX(10%) skewX(5deg) skewY(0deg);
transform: rotate(5deg) rotateX(50deg) rotateY(10deg) translateX(9%) skewX(-24deg) skewY(-28deg) scale(1.25)
*/
}

.svgmap path{transition: all 0.3s; stroke-width: 0.264583; fill: #90a4ae; stroke: #fff; opacity:0.7;}
.svgmap path:hover{fill:#cfd8dc; opacity:1; stroke: #000;}

.svgmapline{fill:none; opacity:0.6; cursor:pointer;}
.svgmapline:hover{opacity:1;}
.svgmap .cline{stroke-width: 5px; fill:none; opacity:0.8;}
.svgmap .cline:hover{stroke-width: 7px; opacity:1;}
.svgmap .dline{stroke-width: 4px; fill:none; opacity:0;}
.svgmap .dlinepoint{opacity:0}
.svgmap .dlinepoint circle {position:relative; stroke:#ccc; fill:#fff; stroke-width:3px; r:5; filter: drop-shadow(0 0 3px #fff); transition: all 0.3s; }
.svgmap .dlinepoint circle:hover{stroke:#0288d1;}
.svgmap .daxis{font-size:13px; fill:#001934; font-weight:bold; text-anchor:middle; color:red;}


.bgdiv{position:relative; background-image:url(images/mkala2.jpg); background-repeat:no-repeat; background-size:cover; width:100%; 
	padding-top: 11.25em;
    padding-bottom: 20%;
    height: auto;
	background-position: 50%;
	margin-bottom:30px;
	
	
	}
	
.bgdiv:before{
	position: absolute;
    filter: blur(3px);
	z-index: 1;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    content: "";
    background: linear-gradient(0deg,rgba(52,42,147,.8),rgba(52,42,147,.8));
	background: linear-gradient(0deg,rgba(34,98,180,.95),rgba(21,51,75,.8));	
	}
	
.tblmapList{
	display:block;
	position: absolute; z-index:10;
    padding: 0px;
    background-color: rgba(0,0,0,.0);
    top: 0;
    bottom: 0;
    left: 0;
    width: 50%;
	max-width:400px;
	}

.tblmapList ul{
	list-style: none;
    overflow: hidden;
    overflow-y: auto;
    margin: 0;
    padding: 0;
    height: 100%;
    box-sizing: border-box;
	}

.tblmapList ul li{
	position: relative;
    padding: 10px;
    min-height: 20px;
	font-size:1em;
	user-select: none;
    line-height: 1.2em;
    border-bottom: 1px solid rgba(0,0,0,.1);
    background-color: #90a4ae;
	color:#fcfcfc;
	text-shadow:0px 0 1px #000;
	cursor:pointer;
	}

.tblmapList ul li.selected{background-color:#607d8b;}

.tblmapList ul li a{
	
	}

/*
.tblmapList ul li:before{
	position: absolute;
    filter: blur(3px);
	opacity:.7;
	z-index: 1;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    content: "";
    background: linear-gradient(0deg,rgba(52,42,147,.8),rgba(52,42,147,.8));
	background: linear-gradient(0deg,rgba(34,98,180,.95),rgba(21,51,75,.8));
	
	}	
*/	

.tblmapList ul li:hover{background-color:#78909c;}


@media screen and (max-width: 640px) {	
	.tblmap{margin-bottom: 300px; 
		overflow:inherit;
		padding-top: 50%;
		}
	.divmap{
		z-index:1;
		overflow:hidden;		
		}
	.tblmap .svgmapcoords {
		right: inherit;
		left:0;
		}
	.rating{width: inherit;}
	.tblmap .svgmapcolors {
		position:absolute; z-index:10; bottom:10px; left:0;
		}
	.tblmapList ul li{margin:5px 0;}
	
	.tblmapList {
		top: 100%;
		width:100%;
		max-width:inherit;
		bottom: -300px;
		left: 0;
		right: 0;
		}


	}