@charset "UTF-8";

body{
	background:#f2f2f2;
}
#map {
	max-width:708px;
}
path { 
	transition: fill .4s ease; 
}
.region{
	fill:#c7d5db;
}
.button .bg {
	width: 140px;
	height: 38px;
}
.button .pin,
.button .txt {
	fill: #ffffff;
	font-size:13.5px;
	font-family:Roboto-Bold, Roboto;
	font-weight:700;
}
#japan:hover,
#americas:hover,
#emea:hover,
#apac:hover {
	cursor:pointer;
}
#region-japan #japan .region,
#japan:hover .region{
	fill:#A01200;
}
#region-americas #americas .region,
#americas:hover .region{
	fill:#5C8095;
}
#region-emea #emea .region,
#emea:hover .region{
	fill:#34936E;
}
#region-apac #apac .region,
#apac:hover .region{
	fill:#D8761E;
}

#japan .button .bg {fill:#A01200;}
#region-japan #japan .button .bg,
#japan:hover .button .bg {fill:#710000;}
#americas .button .bg {fill:#5C8095;}
#region-americas #americas .button .bg,
#americas:hover .button .bg {fill:#27424c;}
#emea .button .bg {fill:#34936E;}
#region-emea #emea .button .bg,
#emea:hover .button .bg {fill:#10543f;}
#apac .button .bg {fill:#d8761e;}
#region-apac #apac .button .bg,
#apac:hover .button .bg {fill:#9b431f;}
@media only screen and (max-width: 767px) {
	#americas g.button {transform: translate(0,249px); }
	#emea g.button {transform: translate(-158px,308.4px); }
	#apac g.button {transform: translate(-146px,198px); }
	#japan g.button {transform: translate(-42px,321px); }
}
.view-select-a-country .region-group a{
	font-family: "Roboto", Sans-Serif;
	width: 33.33% !important;
	float: left;
	font-size: 1.5rem;
	margin-bottom: 10px;
	height: 20px;
	transition: .2s;
}
.view-select-a-country .region-group a:hover{
	opacity: 0.8;
}

.view-select-a-country .region-group a img{
	margin-right: 2%;
}
.view-select-a-country .region-group#region-group-americas,
.view-select-a-country .region-group#region-group-apac,
.view-select-a-country .region-group#region-group-emea{
	display:none;
}

.add-padding{
	padding: 25px 10px 15px 30px;
}
	
.regin-country{
	position:absolute;
	width:100%;
	height: 100%;
	display:block;
	top: 0;
	left: 0;
}
.regin-country svg{
	position:absolute;
}
.regin-country svg#svg01{
	width:38%;
	left:56%;
}
.regin-country svg#svg02{
	width:62%;
	left:0;
}