@charset "utf-8";
/* CSS Document */
@import url('//fonts.googleapis.com/css?family=Lato:400,700');
#splash {
	background: #fff url('images/splash_bg.jpg') no-repeat center center fixed;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	font-family: 'Lato', sans-serif;
}
div#instructions {
    position: fixed;
    top: 20px;
    right: 20px;
    width: 200px;
    text-align: center;
    background: #fff;
    border: 5px solid #036dd8;
    border-radius: 9px;
	box-sizing: border-box;
    padding: 0 12px;
	z-index: 10;
}
#mainMap {
	text-align: center;
	width: 1242px;
}
li.active a, a:hover, a:active {
	color: #e5e5e5;
}
.centered {
	position: absolute;
	top: 50%;
	left: 50%;
	-ms-transform: translate(-50%, -50%);
	-webkit-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
}
.centered-y {
	position: absolute;
	width: 100%;
	top: 50%;
	-ms-transform: translateY(-50%);
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
}
.distribution-map {
	position: relative;
	box-sizing: border-box;
	margin: 0 auto;
}
.distribution-map > img {
	position: relative;
	margin: 0;
	padding: 0;
}
.distribution-map .map-point {
	cursor: pointer;
	outline: medium none;
	z-index: 0;
	position: absolute;
	width: 320px;
	height: 220px;
	border-radius: 12px;
	border: 0;
	transform: translate(-50%, -50%);
	transition: opacity 0.25s ease-in-out 0.25s, width 0.25s ease-in-out 0.25s, height 0.25s ease-in-out 0.25s, z-index 0.25s ease-in-out 0.25s;
	background: transparent;
	/*background: rgba(60,70,100,.7);*/
	overflow: hidden;
}
.distribution-map .map-point .content {
 filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
	opacity: 0;
	-webkit-transition: opacity 0.25s ease-in-out;
	transition: opacity 0.25s ease-in-out;
	width: 100%;
	height: 100%;
	left: 50%;
	-ms-transform: translateX(-50%);
	-webkit-transform: translateX(-50%);
	/*transform: translateX(-50%);*/
	transform: translateX(0);
	overflow: overlay;
}
.distribution-map .map-point:hover {
	margin: 0;
	padding: 0;
	width: 320px !important;
	height: 219px !important;
	color: #e5e5e5;
	z-index: 1;
	-webkit-transition: opacity 0.35s ease-in-out, width 0.35s ease-in-out, height 0.35s ease-in-out;
	transition: opacity 0.35s ease-in-out, width 0.35s ease-in-out, height 0.35s ease-in-out;
}
.distribution-map .map-point:hover .content {
 filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false);
	opacity: 1;
	-moz-transition: opacity 0.25s ease-in-out 0.25s, height 0 ease-in-out 0.25s, overflow 0 ease-in-out 0.25s;
	-o-transition: opacity 0.25s ease-in-out 0.25s, height 0 ease-in-out 0.25s, overflow 0 ease-in-out 0.25s;
	-webkit-transition: opacity 0.25s ease-in-out, height 0 ease-in-out, overflow 0 ease-in-out;
	-webkit-transition-delay: 0.25s, 0.25s, 0.25s;
	-webkit-transition: opacity 0.25s ease-in-out 0.25s, height 0 ease-in-out 0.25s, overflow 0 ease-in-out 0.25s;
	transition: opacity 0.25s ease-in-out 0.25s, height 0 ease-in-out 0.25s, overflow 0 ease-in-out 0.25s;
	overflow: hidden;
}
.distribution-map .map-point:active .content a:hover, .distribution-map .map-point:active .content a:active, .distribution-map .map-point:focus .content a:hover, .distribution-map .map-point:focus .content a:active {
	color: #afe1fa;
}